@leanix/components 0.2.80 → 0.2.84
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/leanix-components.umd.js +18 -1
- package/bundles/leanix-components.umd.js.map +1 -1
- package/esm2015/lib/core-ui/annotations/required.js +1 -0
- package/esm2015/lib/core-ui/annotations/required.js.map +1 -1
- package/esm2015/lib/core-ui/pipes/lx-translate.pipe.js.map +1 -1
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.component.js +17 -2
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.component.js.map +1 -1
- package/esm2015/lib/shared/observe.js +1 -0
- package/esm2015/lib/shared/observe.js.map +1 -1
- package/fesm2015/leanix-components.js +18 -1
- package/fesm2015/leanix-components.js.map +1 -1
- package/lib/core-ui/pipes/lx-translate.pipe.d.ts +1 -1
- package/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.component.d.ts +14 -3
- package/package.json +1 -1
@@ -1991,6 +1991,7 @@
|
|
1991
1991
|
*
|
1992
1992
|
* @see https://stackoverflow.com/questions/35528395/make-directive-input-required
|
1993
1993
|
*/
|
1994
|
+
// eslint-disable-next-line @typescript-eslint/ban-types
|
1994
1995
|
function Required(target, propertyKey) {
|
1995
1996
|
Object.defineProperty(target, propertyKey, {
|
1996
1997
|
get: function () {
|
@@ -2888,6 +2889,7 @@
|
|
2888
2889
|
* @Observe('foo') foo$: Observable<string>;
|
2889
2890
|
*/
|
2890
2891
|
function Observe(observedKey) {
|
2892
|
+
// eslint-disable-next-line @typescript-eslint/ban-types
|
2891
2893
|
return function (target, key) {
|
2892
2894
|
var subjects = new WeakMap();
|
2893
2895
|
var getSubject = function (instance) {
|
@@ -3542,6 +3544,11 @@
|
|
3542
3544
|
this.moveToIndex = new i0.EventEmitter();
|
3543
3545
|
this.moveItem = new i0.EventEmitter();
|
3544
3546
|
}
|
3547
|
+
DragAndDropListComponent.prototype.ngOnInit = function () {
|
3548
|
+
if (this.items && !this.itemIdProperty) {
|
3549
|
+
throw new Error('Cannot pass drag and drop items without defining the id property');
|
3550
|
+
}
|
3551
|
+
};
|
3545
3552
|
DragAndDropListComponent.prototype.ngAfterContentInit = function () {
|
3546
3553
|
this.items$ = this._items.changes.pipe(operators.startWith(this._items), operators.map(function (items) { return items.toArray(); }));
|
3547
3554
|
};
|
@@ -3563,10 +3570,13 @@
|
|
3563
3570
|
this.moveToIndex.emit(event.currentIndex);
|
3564
3571
|
this.moveItem.emit({ item: event.item.data, index: event.currentIndex });
|
3565
3572
|
};
|
3573
|
+
DragAndDropListComponent.prototype.trackById = function (_index, item) {
|
3574
|
+
return item[this.itemIdProperty];
|
3575
|
+
};
|
3566
3576
|
return DragAndDropListComponent;
|
3567
3577
|
}());
|
3568
3578
|
DragAndDropListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
|
3569
|
-
DragAndDropListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: DragAndDropListComponent, selector: "lx-drag-and-drop-list", inputs: { label: "label", labelFontWeight: "labelFontWeight" }, outputs: { moveToIndex: "moveToIndex", moveItem: "moveItem" }, queries: [{ propertyName: "_items", predicate: DragAndDropListItemComponent }], ngImport: i0__namespace, template: "<label *ngIf=\"label\" [style.font-weight]=\"labelFontWeight\">{{ label }}</label>\n<ul cdkDropList class=\"list\" [cdkDropListData]=\"items$ | async\" (cdkDropListDropped)=\"drop($event)\">\n <li\n *ngFor=\"let itemComponent of items$ | async\"\n
|
3579
|
+
DragAndDropListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: DragAndDropListComponent, selector: "lx-drag-and-drop-list", inputs: { label: "label", labelFontWeight: "labelFontWeight", items: "items", itemIdProperty: "itemIdProperty" }, outputs: { moveToIndex: "moveToIndex", moveItem: "moveItem" }, queries: [{ propertyName: "itemTemplateRef", first: true, predicate: ["itemTemplate"], descendants: true }, { propertyName: "_items", predicate: DragAndDropListItemComponent }], ngImport: i0__namespace, template: "<label *ngIf=\"label\" [style.font-weight]=\"labelFontWeight\">{{ label }}</label>\n<ul cdkDropList class=\"list\" [cdkDropListData]=\"items$ | async\" (cdkDropListDropped)=\"drop($event)\">\n <ng-container *ngIf=\"items; else contentChildList\">\n <li\n *ngFor=\"let item of items; let index = index; trackBy: trackById\"\n class=\"item\"\n cdkDrag\n cdkDragLockAxis=\"y\"\n [cdkDragData]=\"item[itemIdProperty!]\"\n >\n <ng-container *ngTemplateOutlet=\"itemTemplateRef; context: { $implicit: item, index: index }\"></ng-container>\n </li>\n </ng-container>\n <ng-template #contentChildList>\n <li\n *ngFor=\"let itemComponent of items$ | async\"\n class=\"item\"\n cdkDrag\n cdkDragLockAxis=\"y\"\n [cdkDragData]=\"itemComponent.item\"\n [cdkDragDisabled]=\"!itemComponent.draggable\"\n >\n <lx-drag-and-drop-list-item\n class=\"dragAndDropItem\"\n [item]=\"itemComponent.item\"\n [draggable]=\"itemComponent.draggable\"\n [actions]=\"itemComponent.actions\"\n (action)=\"emitContentChildAction($event)\"\n ></lx-drag-and-drop-list-item>\n </li>\n </ng-template>\n</ul>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}@-webkit-keyframes spinOnceFadeInKeyFrames{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(-180deg)}}@keyframes spinOnceFadeInKeyFrames{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(-180deg)}}@-webkit-keyframes spinOnceFadeOutKeyFrames{0%{opacity:1;transform:rotate(-180deg)}to{opacity:0;transform:rotate(0deg)}}@keyframes spinOnceFadeOutKeyFrames{0%{opacity:1;transform:rotate(-180deg)}to{opacity:0;transform:rotate(0deg)}}@-webkit-keyframes slideUpKeyFrames{0%{transform:translateY(10px);opacity:0}20%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideUpKeyFrames{0%{transform:translateY(10px);opacity:0}20%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@-webkit-keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}:host{display:block}.list{list-style-type:none;width:100%;border:1px solid #99a5bb;display:block;border-radius:3px;padding:0;color:#526179;background:#fff}.item.cdk-drag-disabled{background:#eaedf1;cursor:default}.item:first-child .dragAndDropItem{border-top-left-radius:3px;border-top-right-radius:3px}.item:last-child .dragAndDropItem{border-bottom-left-radius:3px;border-bottom-right-radius:3px;border-bottom:0}.cdk-drag-preview{box-sizing:border-box;border-radius:3px;list-style:none;border:1px solid #99a5bb!important;box-shadow:0 3px 4px rgba(116,116,116,.3)}.cdk-drag-placeholder{opacity:.5}.cdk-drag-placeholder i{opacity:0}.cdk-drag-animating,.list.cdk-drop-list-dragging .item:not(.cdk-drag-placeholder){transition:transform .18s;transition-delay:0s;transition-timing-function:ease}"], components: [{ type: DragAndDropListItemComponent, selector: "lx-drag-and-drop-list-item", inputs: ["item", "draggable", "actions"], outputs: ["action"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i2__namespace.AsyncPipe } });
|
3570
3580
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListComponent, decorators: [{
|
3571
3581
|
type: i0.Component,
|
3572
3582
|
args: [{
|
@@ -3578,6 +3588,10 @@
|
|
3578
3588
|
type: i0.Input
|
3579
3589
|
}], labelFontWeight: [{
|
3580
3590
|
type: i0.Input
|
3591
|
+
}], items: [{
|
3592
|
+
type: i0.Input
|
3593
|
+
}], itemIdProperty: [{
|
3594
|
+
type: i0.Input
|
3581
3595
|
}], moveToIndex: [{
|
3582
3596
|
type: i0.Output
|
3583
3597
|
}], moveItem: [{
|
@@ -3585,6 +3599,9 @@
|
|
3585
3599
|
}], _items: [{
|
3586
3600
|
type: i0.ContentChildren,
|
3587
3601
|
args: [DragAndDropListItemComponent]
|
3602
|
+
}], itemTemplateRef: [{
|
3603
|
+
type: i0.ContentChild,
|
3604
|
+
args: ['itemTemplate']
|
3588
3605
|
}] } });
|
3589
3606
|
|
3590
3607
|
var FormErrorComponent = /** @class */ (function () {
|