- Release release version 4.0.0
- Fix fix: undefined errors in access-from-class demo #247.
- Fix More precise type for AngularSplitModule #204.
- Fix export IOutputData and IOutputAreaSizes interfaces #226.
- Fix Wait for drag-end post-processing before starting next drag #217.
- Fix Fix styles lost when hosting application set to ViewEncapsulation.None #177.
- Chore Fix travis tests #221.
- Chore Configure prettier, husky and lint-staged #243.
- Chore Update docs, sort properties alphabetically, document 'order' property #245.
- Angular version upgrade: Update
package.json
peerDependancies versions to allow Angular 9 #218.
- Angular version upgrade: Add support for Angular 8 #175.
- Bug: Fix
(dragEnd)
event which was emitted outside zone #172.
- Pixel mode: Now your can choose to work with
pixel
orpercent
mode. Inpixel
mode, an area with wildcard size (size="*"
) is mandatory. - minSize & maxSize area: Now you can set minimum and maximum sizes for each areas whatever the current mode (Only exception is the wildcard area size in
pixel
mode, no min/max allowed for it). - lockSize area: Use
<as-split-area [size]="X" [lockSize]="true">
as a shortcut for<as-split-area [size]="X" [minSize]="X" [maxSize]="X">
. - gutterDblClick event: Double click on gutter is now catchable with
(gutterDblClick)
. - gutterDblClickDuration property: Specify duration between 2 clicks to consider a double click
(gutterDblClick)
event. - exportAs: You can access
SplitComponent
as<as-split #split="asSplit">
andSplitAreaDirective
as<as-split-area #area1="asSplitArea">
from template variables easily usingViewChild
decorator. - CSS classes updates: Some
split
,area
andgutter
elements has CSS class names updates, check documentation. - Internal: Remove
EventManagerPlugin
and start/end/click subscribers stuff which was added to avoid some change detection runs but adding too much complexity.. I stopped going against the framework, clearer now and works better with lazy loaded modules!
- Module import: Service now provided inside
AngularSplitModule.forRoot()
method instead of directly in module annotation. Warning: Be sure to import module usingforRoot()
method otherwise it will not works anymore. - Internal: Now use an
EventManagerPlugin
instead of extendingEventManager
and use "as-split-undetected." template event prefix.
- New major version: Check previous betas to know main changes from
1.x
and take a look on website examples.
- New gutter css class: CSS class
is-dragged
added on the gutter while being dragged.
- New API: Add
getVisibleAreaSizes(): Array<number>
function onSplitComponent
class.
- Internal: Use
clientX
/clientY
insteadpageX
/pageY
to calculate distance while mouse moves.
- Performance: Make library template event bindings (
click
,mousedown
,touchstart
) runs outsidezone.js
to avoid unnecessary change detection run. - Performance (API change): Remove
(dragProgress)
event emitter from template and add adragProgress$
observable accessible fromSplitComponent
class. Doing this you can track drag progress without triggering change detection inside component containing<as-split>
, see "Sync example demo" opening devTools console to verify it. - New API: Add
setVisibleAreaSizes(sizes: Array<number>): boolean
function onSplitComponent
class.
- Specific gutter style: Add
<div>
inside<div class="as-split-gutter">
to allow more customization. - Add SplitAreaDirective attribute selector: You can now use
<as-split-area>
or<div as-split-area>
, a classas-split-area
is added to each areas for CSS targeting purpose.
- Style: Modify
<as-split-area>
CSS selector to act only on current split areas children and not on potential sub split areas.
- Performance: Make
@Output()
event emitters (dragStart
,dragProgress
,dragEnd
,gutterClick
,transitionEnd
) works "lazily" to avoid useless change detection runs, especially fordragProgress
which could be costly in big app.
- Styles: Refactor the way styles are manage, no more
renderer.setStyle()
everywhere (except for areasorder
&flex-basis
), now works with added/removed classes (is-horizontal
/is-vertical
,is-disabled
,is-transition
,is-disabled
,is-dragging
), way better. Doing like this,<as-split-gutter>
directive is not needed anymore.
- Bug: Fix Edge first rendering issue with nested split by applying css flex-direction property differently on
<as-split>
#125.
- Critiqual bug: Remove reference to
TouchEvent
which cause error on Firefox & IE/Edge. Introduced in1.0.1
but was there before on mobile browser other than chromium based.
- Bug: Modify the way to emit gutterClick event which was buggy #109.
- Project organization: Now follow
@angular/cli
library management way which is awesome: Library status update 📢. - Dependencies:
angular@^7
andrxjs@^6
with pipe method (rxjs-compat
not needed anymore). - Breaking changes: Prefix
as-
added to component/directive to follow best practises:<as-split>
&<as-split-area>
. - Regression: Revert change about
devicePixelRatio
added in1.0.0-rc.3
because it was causing bad behavior on mobile #85, need to investigate more to resolve #81.
- Bug: Use
devicePixelRatio
to make dragging value effective on HiDPI screen and browsers with zoom !== 100%, thanks to tkglaser and HondaHiroyuki.
- Performances: Put all event listeners inside
ngZone.runOutsideAngular()
to avoid triggering change detection during drag, thanks to klemenoslaj.
- Bug: Call
cdRef.markForCheck()
in several setters insideSplitComponent
to force repaint if modified from TS class (instead of the template).
- Feature: Add RTL support. Previously on 'right to the left' pages, dragging went opposite side, issue here. Now just add
dir="ltr"
on<split>
component and that's fix. - Bug: Fix small bug when updating
[gutterSize]
withuseTransition="true"
, now gutter's size got transition too and it's visually better.
- Bug: When updating
[disabled]
,[direction]
,[width]
,[height]
,.. keep size values got after gutter being dragged instead of reset to user provided values. - Bug: When
[useTransition]="true"
, no more transition at component initialisation.
- gutterSize: Default value from
10
to11
because of a small discrepancy in the shown dots position pointed there. - Custom gutters style: You can now use properties
[gutterColor]="'#ff0000'"
,[gutterImageH]="'url(xxx)'"
and[gutterImageV]="'url(xxx)'"
.
- Feature: Emit
(gutterClick)
event even if[disabled]="true"
to specific usecase. - Bug: Fix bug occuring on split with
direction="vertical"
initialization, container height was wrong becauseHostBinding
wasn't applied yet.
- Renaming:
[visibleTransition]
property renamed to[useTransition]
and work with[visible]
&[size]
. - Renaming:
(visibleTransitionEnd)
event renamed to(transitionEnd)
and now triggered from[visible]
&[size]
property.
- SemVer compatibility: Copy of
0.2.3
to avoid breaking semantic versionning (I screwed up with0.2.5
&0.2.6
which needed angular >=5). Apps using angular 4.x having"angular-split": "^0.2.2"
inside theirpackage.json
shoudn't break anymore.
- Bug: Code rewrite to calculate new
flex-basis
values to avoid unwanted size flickering on areas not linked to dragged gutter. - Comment: Add an explanation comment on
split.component.ts
top.
- Feature: Accept number & boolean params as string to allow template syntax like
<split gutterSize="12" disabled="true">...</split>
or<split-area order="4" size="40" visible="true">...</split-area>
. - Feature: Add a
(gutterClick)
event for usecases like toggling area between 0% & X%. Now all drag events and gutterSize return{gutterNum: number, sizes: Array<number>}
.
- Bug: Fix bug when dragging gutter with previous area with
[visible]="false"
(bug there since the[visible]
feature was added.. :( ). - Component access from JS/TS class: You can now access
SplitComponent
andSplitAreaDirective
asViewChild
/ViewChildren
directly from your class to interact with.
Complete refactor, more robust, will be used as new base to add frequently asked features like [minSize]
(pixel or percent) and custom style.
- Allow area size init or drag to zero: Refactor way to calcul area size
flex-basis: calc( X% - Ypx );
(seems easy at first sight but a bit painfull to implement). For example, you can now have 4 areas (with[visible]="true"
), so 3 gutters, with sizes [0,0,0,100]. This was impossible before (size couldn't go down to 5%). - No more css
/deep/
use: Could have used::ng-deep
but I prefer to avoid it too. - Renderer2: Use
Renderer2
instead ofRenderer
which is deprecated.
- UMD module fix: Rollup config file wasn't correct.
- New files organisation: Complete reorganisation of the github repository and files published on npm forked from this library starter.
- New bundles generation: Now you have umd bundles, flat ES module, and ES2015 flat ESM format.
- Add tests: This is what motivated me to change organisation, I will add others one soon
npm test
.
- Update package.json: Moves dependencies to peerDependencies to be compatible with angular 5.x pr59.
- UMD bundle: Add UMD bundle export thanks to BenjaminDobler.
- license: Add an Apache license.
- dependencies: Update
rxjs
version insidepackage.json
.
- ng upgrade: upgrade to angular
^4.0.0
, replace<template>
by<ng-template>
and rebuild dist folder.
- wording: add mention about CSS flexbox layout use, so
angular-split
is not compatible on browser not supporting it (like ios8).
- visibility toggle transition: add transition (optionnal:
<split [visibleTransition]="true">
) when toggling visibility andvisibleTransitionEnd
event ` pr11.
- gutter height on Safari: fix a weird bug about anormal gutter height when direction is 'vertical' on Safari only issue5. Note that
angular-split
isn't working on browser without flexbox support, so not working on ios older than 9.
- visibility toggle: fix a bug I introduced in 0.1.17 while merging pr10.
- visibility toggle: add possibility to show/hide areas using
<split-area [visible]="boolean">
without removing them from the DOM, useful for specific case like with router. Thanks to jitsmaster (pr8 / pr10)