@leanix/components 0.2.227 → 0.2.228
Sign up to get free protection for your applications and to get access to all the features.
- package/bundles/leanix-components.umd.js +273 -83
- package/bundles/leanix-components.umd.js.map +1 -1
- package/esm2015/index.js +2 -0
- package/esm2015/index.js.map +1 -1
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/constants.js +5 -0
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/constants.js.map +1 -0
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list-item/drag-and-drop-list-item.component.js +20 -23
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list-item/drag-and-drop-list-item.component.js.map +1 -1
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.component.js +33 -25
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.component.js.map +1 -1
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.module.js +25 -0
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.module.js.map +1 -0
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/keyboard-sortable-item/keyboard-sortable-item.directive.js +133 -0
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/keyboard-sortable-item/keyboard-sortable-item.directive.js.map +1 -0
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/keyboard-sortable-list/keyboard-sortable-list.directive.js +37 -0
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/keyboard-sortable-list/keyboard-sortable-list.directive.js.map +1 -0
- package/esm2015/lib/forms-ui/forms-ui.module.js +12 -20
- package/esm2015/lib/forms-ui/forms-ui.module.js.map +1 -1
- package/fesm2015/leanix-components.js +248 -74
- package/fesm2015/leanix-components.js.map +1 -1
- package/index.d.ts +1 -0
- package/lib/forms-ui/components/drag-and-drop-list/constants.d.ts +4 -0
- package/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list-item/drag-and-drop-list-item.component.d.ts +7 -6
- package/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.component.d.ts +23 -17
- package/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.module.d.ts +14 -0
- package/lib/forms-ui/components/drag-and-drop-list/keyboard-sortable-item/keyboard-sortable-item.directive.d.ts +36 -0
- package/lib/forms-ui/components/drag-and-drop-list/keyboard-sortable-list/keyboard-sortable-list.directive.d.ts +14 -0
- package/lib/forms-ui/forms-ui.module.d.ts +41 -43
- package/package.json +1 -1
@@ -1,8 +1,8 @@
|
|
1
1
|
(function (global, factory) {
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/cdk/portal'), require('@angular/cdk/overlay'), require('lodash/fp'), require('@ngx-translate/core'), require('@angular/platform-browser'), require('rxjs'), require('rxjs/operators'), require('color'), require('date-fns'), require('lodash'), require('marked'), require('@angular/
|
3
|
-
typeof define === 'function' && define.amd ? define('@leanix/components', ['exports', '@angular/common', '@angular/core', '@angular/cdk/portal', '@angular/cdk/overlay', 'lodash/fp', '@ngx-translate/core', '@angular/platform-browser', 'rxjs', 'rxjs/operators', 'color', 'date-fns', 'lodash', 'marked', '@angular/
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.leanix = global.leanix || {}, global.leanix.components = {}), global.ng.common, global.ng.core, global.ng.cdk.portal, global.ng.cdk.overlay, global.fp, global.i1$2, global.ng.platformBrowser, global.rxjs, global.rxjs.operators, global.Color, global.dateFns, global._, global.marked, global.ng.
|
5
|
-
})(this, (function (exports, i2, i0, i3, i1, fp, i1$2, i1$1, i6, operators, Color, dateFns, _, marked, i3$
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/cdk/portal'), require('@angular/cdk/overlay'), require('lodash/fp'), require('@ngx-translate/core'), require('@angular/platform-browser'), require('rxjs'), require('rxjs/operators'), require('color'), require('date-fns'), require('lodash'), require('marked'), require('@angular/forms'), require('ngx-bootstrap/datepicker'), require('ngx-infinite-scroll'), require('@angular/cdk/drag-drop'), require('@angular/cdk/a11y'), require('@angular/cdk/bidi'), require('@angular/animations'), require('@ncstate/sat-popover'), require('@angular/cdk/coercion'), require('@angular/router')) :
|
3
|
+
typeof define === 'function' && define.amd ? define('@leanix/components', ['exports', '@angular/common', '@angular/core', '@angular/cdk/portal', '@angular/cdk/overlay', 'lodash/fp', '@ngx-translate/core', '@angular/platform-browser', 'rxjs', 'rxjs/operators', 'color', 'date-fns', 'lodash', 'marked', '@angular/forms', 'ngx-bootstrap/datepicker', 'ngx-infinite-scroll', '@angular/cdk/drag-drop', '@angular/cdk/a11y', '@angular/cdk/bidi', '@angular/animations', '@ncstate/sat-popover', '@angular/cdk/coercion', '@angular/router'], factory) :
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.leanix = global.leanix || {}, global.leanix.components = {}), global.ng.common, global.ng.core, global.ng.cdk.portal, global.ng.cdk.overlay, global.fp, global.i1$2, global.ng.platformBrowser, global.rxjs, global.rxjs.operators, global.Color, global.dateFns, global._, global.marked, global.ng.forms, global.i1$3, global.i3$1, global.ng.cdk.dragDrop, global.ng.cdk.a11y, global.ng.cdk.bidi, global.ng.animations, global.i1$6, global.ng.cdk.coercion, global.ng.router));
|
5
|
+
})(this, (function (exports, i2, i0, i3, i1, fp, i1$2, i1$1, i6, operators, Color, dateFns, _, marked, i3$2, i1$3, i3$1, i1$4, i2$1, i1$5, animations, i1$6, coercion, i3$3) { 'use strict';
|
6
6
|
|
7
7
|
function _interopNamespace(e) {
|
8
8
|
if (e && e.__esModule) return e;
|
@@ -24,21 +24,21 @@
|
|
24
24
|
|
25
25
|
var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
|
26
26
|
var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
|
27
|
-
var i3__namespace$
|
27
|
+
var i3__namespace$2 = /*#__PURE__*/_interopNamespace(i3);
|
28
28
|
var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
|
29
29
|
var i1__namespace$2 = /*#__PURE__*/_interopNamespace(i1$2);
|
30
30
|
var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1$1);
|
31
31
|
var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
|
32
32
|
var Color__namespace = /*#__PURE__*/_interopNamespace(Color);
|
33
33
|
var ___namespace = /*#__PURE__*/_interopNamespace(_);
|
34
|
-
var i3__namespace$2 = /*#__PURE__*/_interopNamespace(i3$3);
|
35
34
|
var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$2);
|
36
35
|
var i1__namespace$3 = /*#__PURE__*/_interopNamespace(i1$3);
|
37
36
|
var i3__namespace = /*#__PURE__*/_interopNamespace(i3$1);
|
38
|
-
var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
|
39
37
|
var i1__namespace$4 = /*#__PURE__*/_interopNamespace(i1$4);
|
38
|
+
var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
|
40
39
|
var i1__namespace$5 = /*#__PURE__*/_interopNamespace(i1$5);
|
41
|
-
var
|
40
|
+
var i1__namespace$6 = /*#__PURE__*/_interopNamespace(i1$6);
|
41
|
+
var i3__namespace$3 = /*#__PURE__*/_interopNamespace(i3$3);
|
42
42
|
|
43
43
|
var BadgeComponent = /** @class */ (function () {
|
44
44
|
function BadgeComponent() {
|
@@ -3492,14 +3492,12 @@
|
|
3492
3492
|
}] } });
|
3493
3493
|
|
3494
3494
|
var DragAndDropListItemComponent = /** @class */ (function () {
|
3495
|
-
function DragAndDropListItemComponent() {
|
3495
|
+
function DragAndDropListItemComponent(element) {
|
3496
|
+
this.element = element;
|
3496
3497
|
this.NAME = 'DragAndDropListItemComponent';
|
3497
3498
|
this.draggable = true;
|
3498
3499
|
this.action = new i0.EventEmitter();
|
3499
|
-
this.
|
3500
|
-
this.moveUp = new i0.EventEmitter();
|
3501
|
-
this.moveToBottom = new i0.EventEmitter();
|
3502
|
-
this.moveDown = new i0.EventEmitter();
|
3500
|
+
this.customTemplateRef = null;
|
3503
3501
|
}
|
3504
3502
|
Object.defineProperty(DragAndDropListItemComponent.prototype, "draggingDisabled", {
|
3505
3503
|
get: function () {
|
@@ -3508,13 +3506,23 @@
|
|
3508
3506
|
enumerable: false,
|
3509
3507
|
configurable: true
|
3510
3508
|
});
|
3509
|
+
Object.defineProperty(DragAndDropListItemComponent.prototype, "hasCustomTemplate", {
|
3510
|
+
get: function () {
|
3511
|
+
return !!this.customTemplateRef;
|
3512
|
+
},
|
3513
|
+
enumerable: false,
|
3514
|
+
configurable: true
|
3515
|
+
});
|
3511
3516
|
DragAndDropListItemComponent.prototype.trackByAction = function (_index, action) {
|
3512
3517
|
return action.id;
|
3513
3518
|
};
|
3519
|
+
DragAndDropListItemComponent.prototype.focus = function () {
|
3520
|
+
this.element.nativeElement.focus();
|
3521
|
+
};
|
3514
3522
|
return DragAndDropListItemComponent;
|
3515
3523
|
}());
|
3516
|
-
DragAndDropListItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListItemComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
|
3517
|
-
DragAndDropListItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: DragAndDropListItemComponent, selector: "lx-drag-and-drop-list-item", inputs: { item: "item", draggable: "draggable", actions: "actions" }, outputs: { action: "action",
|
3524
|
+
DragAndDropListItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListItemComponent, deps: [{ token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
3525
|
+
DragAndDropListItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: DragAndDropListItemComponent, selector: "lx-drag-and-drop-list-item", inputs: { item: "item", draggable: "draggable", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.draggingDisabled": "this.draggingDisabled", "class.customTemplate": "this.hasCustomTemplate" } }, queries: [{ propertyName: "customTemplateRef", first: true, predicate: ["customTemplate"], descendants: true }], ngImport: i0__namespace, template: "<ng-container *ngIf=\"customTemplateRef; else defaultTemplate\">\n <ng-container *ngTemplateOutlet=\"customTemplateRef\"></ng-container>\n</ng-container>\n<ng-template #defaultTemplate>\n <div class=\"drag-item-wrappper\">\n <i *ngIf=\"draggable\" class=\"far fa-bars drag-handle\"></i>\n <span [attr.title]=\"item\" class=\"itemWrapperForTruncation truncate\">{{ item }}</span>\n </div>\n <div class=\"left-button-container\" align=\"left\">\n <div class=\"action-buttons-wrapper\" *ngIf=\"!!actions\">\n <button\n lx-button\n *ngFor=\"let act of actions; trackBy: trackByAction\"\n (click)=\"action.emit({ actionId: act.id, item: item })\"\n [title]=\"act.label\"\n [square]=\"true\"\n mode=\"ghost\"\n size=\"small\"\n class=\"action-button\"\n [class.show-on-hover-button]=\"act.showOnlyOnHover ? true : false\"\n >\n <i class=\"far {{ act.icon }} actionIcon\"></i>\n </button>\n </div>\n </div>\n</ng-template>\n", styles: [":host:not(.customTemplate){padding:6px 8px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;border-radius:3px}:host:not(.customTemplate):hover .show-on-hover-button{opacity:1}:host.draggingDisabled{background:#eaedf1}.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drag-handle{padding-right:4px}.actionIcon{padding:0 2px}.drag-item-wrappper{display:flex;min-width:0;align-items:baseline}.action-buttons-wrapper,.left-button-container{display:flex;flex-direction:row;flex-wrap:nowrap}.show-on-hover-button{opacity:0}.show-on-hover-button:focus{opacity:1}lx-option i{margin-right:8px}"], components: [{ type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
|
3518
3526
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListItemComponent, decorators: [{
|
3519
3527
|
type: i0.Component,
|
3520
3528
|
args: [{
|
@@ -3523,7 +3531,7 @@
|
|
3523
3531
|
styleUrls: ['drag-and-drop-list-item.component.scss'],
|
3524
3532
|
changeDetection: i0.ChangeDetectionStrategy.OnPush
|
3525
3533
|
}]
|
3526
|
-
}], propDecorators: { item: [{
|
3534
|
+
}], ctorParameters: function () { return [{ type: i0__namespace.ElementRef }]; }, propDecorators: { item: [{
|
3527
3535
|
type: i0.Input
|
3528
3536
|
}], draggable: [{
|
3529
3537
|
type: i0.Input
|
@@ -3531,27 +3539,194 @@
|
|
3531
3539
|
type: i0.Input
|
3532
3540
|
}], action: [{
|
3533
3541
|
type: i0.Output
|
3534
|
-
}],
|
3535
|
-
type: i0.
|
3536
|
-
|
3542
|
+
}], draggingDisabled: [{
|
3543
|
+
type: i0.HostBinding,
|
3544
|
+
args: ['class.draggingDisabled']
|
3545
|
+
}], hasCustomTemplate: [{
|
3546
|
+
type: i0.HostBinding,
|
3547
|
+
args: ['class.customTemplate']
|
3548
|
+
}], customTemplateRef: [{
|
3549
|
+
type: i0.ContentChild,
|
3550
|
+
args: ['customTemplate']
|
3551
|
+
}] } });
|
3552
|
+
|
3553
|
+
/**
|
3554
|
+
* Used in the DragAndDropListComponent and KeyboardSortableListDirective
|
3555
|
+
*/
|
3556
|
+
var DRAG_AND_DROP_LIST_TRANSLATION_NAME = 'DragAndDropListComponent';
|
3557
|
+
|
3558
|
+
var KeyboardSortableItemDirective = /** @class */ (function () {
|
3559
|
+
function KeyboardSortableItemDirective(draggableItem, overlayPositionBuilder, element, overlay) {
|
3560
|
+
this.draggableItem = draggableItem;
|
3561
|
+
this.overlayPositionBuilder = overlayPositionBuilder;
|
3562
|
+
this.element = element;
|
3563
|
+
this.overlay = overlay;
|
3564
|
+
this.isSortingByKeyboardChange = new i0.EventEmitter();
|
3565
|
+
this.itemBeingSortedChange = new i0.EventEmitter();
|
3566
|
+
this.sortItemsWithKeyboard = new i0.EventEmitter();
|
3567
|
+
this.tooltipDirective = new TooltipDirective(this.overlayPositionBuilder, this.element, this.overlay);
|
3568
|
+
this.isBeingSorted = false;
|
3569
|
+
this.preventBlur = false;
|
3570
|
+
this.focusWithKeyboardReplaySubject$ = new i6.ReplaySubject(1);
|
3571
|
+
/**
|
3572
|
+
* Using a ReplaySubject here so that the KeyboardSortableListDirective will also know
|
3573
|
+
* about a focusWithKeyboard event when its copy of the KeyboardSortableItemDirective ContentChildren
|
3574
|
+
* was just initialised after the event fired.
|
3575
|
+
*/
|
3576
|
+
this.focusWithKeyboard = this.focusWithKeyboardReplaySubject$.asObservable();
|
3577
|
+
}
|
3578
|
+
Object.defineProperty(KeyboardSortableItemDirective.prototype, "isSortable", {
|
3579
|
+
get: function () {
|
3580
|
+
return !this.draggableItem.disabled;
|
3581
|
+
},
|
3582
|
+
enumerable: false,
|
3583
|
+
configurable: true
|
3584
|
+
});
|
3585
|
+
KeyboardSortableItemDirective.prototype.ngOnChanges = function () {
|
3586
|
+
this.isBeingSorted = this.itemData === this.itemBeingSorted;
|
3587
|
+
if (this.isBeingSorted) {
|
3588
|
+
// focus always the pressed element
|
3589
|
+
this.element.nativeElement.focus();
|
3590
|
+
}
|
3591
|
+
};
|
3592
|
+
KeyboardSortableItemDirective.prototype.focusViaKeyboard = function () {
|
3593
|
+
this.focusWithKeyboardReplaySubject$.next(this);
|
3594
|
+
};
|
3595
|
+
KeyboardSortableItemDirective.prototype.enterSortingModeEnabledByKeyboard = function ($event) {
|
3596
|
+
if ($event.target === this.element.nativeElement) {
|
3597
|
+
if ($event.code === 'Enter' || $event.code === 'Space') {
|
3598
|
+
$event.preventDefault();
|
3599
|
+
this.tooltipDirective.hide();
|
3600
|
+
this.itemBeingSortedChange.emit(!this.isSortingByKeyboard ? this.itemData : undefined);
|
3601
|
+
this.isSortingByKeyboardChange.emit(!this.isSortingByKeyboard);
|
3602
|
+
}
|
3603
|
+
}
|
3604
|
+
};
|
3605
|
+
KeyboardSortableItemDirective.prototype.leaveSortingModeEnabledByKeyboard = function ($event) {
|
3606
|
+
if ($event.target === this.element.nativeElement) {
|
3607
|
+
this.tooltipDirective.hide();
|
3608
|
+
if (!this.preventBlur) {
|
3609
|
+
this.isSortingByKeyboardChange.emit(false);
|
3610
|
+
this.itemBeingSortedChange.emit(undefined);
|
3611
|
+
}
|
3612
|
+
}
|
3613
|
+
};
|
3614
|
+
KeyboardSortableItemDirective.prototype.sort = function ($event) {
|
3615
|
+
var _this = this;
|
3616
|
+
if ($event.target === this.element.nativeElement) {
|
3617
|
+
this.tooltipDirective.hide();
|
3618
|
+
if (this.isSortingByKeyboard) {
|
3619
|
+
$event.preventDefault();
|
3620
|
+
var previousIndex = this.allItemsData.findIndex(function (item) { return item === _this.itemData; });
|
3621
|
+
var currentIndex = $event.code === 'ArrowUp' ? previousIndex - 1 : previousIndex + 1;
|
3622
|
+
if (currentIndex >= 0 && currentIndex <= this.allItemsData.length - 1) {
|
3623
|
+
this.sortItemsWithKeyboard.emit({ previousIndex: previousIndex, currentIndex: currentIndex });
|
3624
|
+
// When triggering a keyboard event, the DOM would "removeChildren" on the HTML element
|
3625
|
+
// which specially for "ArrowUp" events would trigger a "blur" event since the element
|
3626
|
+
// has been moved aboved the DOM tree and loses the focus state.
|
3627
|
+
this.preventBlur = true;
|
3628
|
+
setTimeout(function () { return (_this.preventBlur = false); }, 0);
|
3629
|
+
}
|
3630
|
+
}
|
3631
|
+
}
|
3632
|
+
};
|
3633
|
+
return KeyboardSortableItemDirective;
|
3634
|
+
}());
|
3635
|
+
KeyboardSortableItemDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: KeyboardSortableItemDirective, deps: [{ token: i1__namespace$4.CdkDrag }, { token: i1__namespace.OverlayPositionBuilder }, { token: i0__namespace.ElementRef }, { token: i1__namespace.Overlay }], target: i0__namespace.ɵɵFactoryTarget.Directive });
|
3636
|
+
KeyboardSortableItemDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.1.4", type: KeyboardSortableItemDirective, selector: "[lxKeyboardSortableItem]", inputs: { allItemsData: ["lxKeyboardSortableItem", "allItemsData"], itemData: ["lxKeyboardItemData", "itemData"], isSortingByKeyboard: "isSortingByKeyboard", itemBeingSorted: ["lxKeyboardItemBeingSorted", "itemBeingSorted"] }, outputs: { isSortingByKeyboardChange: "isSortingByKeyboardChange", itemBeingSortedChange: "lxKeyboardItemBeingSortedChange", sortItemsWithKeyboard: "sortItemsWithKeyboard", focusWithKeyboard: "focusWithKeyboard" }, host: { listeners: { "keyup.tab": "focusViaKeyboard()", "keydown.enter": "enterSortingModeEnabledByKeyboard($event)", "keydown.space": "enterSortingModeEnabledByKeyboard($event)", "blur": "leaveSortingModeEnabledByKeyboard($event)", "keydown.esc": "leaveSortingModeEnabledByKeyboard($event)", "keydown.arrowUp": "sort($event)", "keydown.arrowDown": "sort($event)" }, properties: { "attr.lxTooltip": "this.tooltipDirective", "class.isBeingSortedByKeyboard": "this.isBeingSorted" } }, usesOnChanges: true, ngImport: i0__namespace });
|
3637
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: KeyboardSortableItemDirective, decorators: [{
|
3638
|
+
type: i0.Directive,
|
3639
|
+
args: [{
|
3640
|
+
selector: '[lxKeyboardSortableItem]'
|
3641
|
+
}]
|
3642
|
+
}], ctorParameters: function () { return [{ type: i1__namespace$4.CdkDrag }, { type: i1__namespace.OverlayPositionBuilder }, { type: i0__namespace.ElementRef }, { type: i1__namespace.Overlay }]; }, propDecorators: { allItemsData: [{
|
3643
|
+
type: i0.Input,
|
3644
|
+
args: ['lxKeyboardSortableItem']
|
3645
|
+
}], itemData: [{
|
3646
|
+
type: i0.Input,
|
3647
|
+
args: ['lxKeyboardItemData']
|
3648
|
+
}], isSortingByKeyboard: [{
|
3649
|
+
type: i0.Input
|
3650
|
+
}], itemBeingSorted: [{
|
3651
|
+
type: i0.Input,
|
3652
|
+
args: ['lxKeyboardItemBeingSorted']
|
3653
|
+
}], isSortingByKeyboardChange: [{
|
3537
3654
|
type: i0.Output
|
3538
|
-
}],
|
3655
|
+
}], itemBeingSortedChange: [{
|
3656
|
+
type: i0.Output,
|
3657
|
+
args: ['lxKeyboardItemBeingSortedChange']
|
3658
|
+
}], sortItemsWithKeyboard: [{
|
3539
3659
|
type: i0.Output
|
3540
|
-
}],
|
3660
|
+
}], focusWithKeyboard: [{
|
3541
3661
|
type: i0.Output
|
3542
|
-
}],
|
3662
|
+
}], tooltipDirective: [{
|
3543
3663
|
type: i0.HostBinding,
|
3544
|
-
args: ['
|
3664
|
+
args: ['attr.lxTooltip']
|
3665
|
+
}], isBeingSorted: [{
|
3666
|
+
type: i0.HostBinding,
|
3667
|
+
args: ['class.isBeingSortedByKeyboard']
|
3668
|
+
}], focusViaKeyboard: [{
|
3669
|
+
type: i0.HostListener,
|
3670
|
+
args: ['keyup.tab']
|
3671
|
+
}], enterSortingModeEnabledByKeyboard: [{
|
3672
|
+
type: i0.HostListener,
|
3673
|
+
args: ['keydown.enter', ['$event']]
|
3674
|
+
}, {
|
3675
|
+
type: i0.HostListener,
|
3676
|
+
args: ['keydown.space', ['$event']]
|
3677
|
+
}], leaveSortingModeEnabledByKeyboard: [{
|
3678
|
+
type: i0.HostListener,
|
3679
|
+
args: ['blur', ['$event']]
|
3680
|
+
}, {
|
3681
|
+
type: i0.HostListener,
|
3682
|
+
args: ['keydown.esc', ['$event']]
|
3683
|
+
}], sort: [{
|
3684
|
+
type: i0.HostListener,
|
3685
|
+
args: ['keydown.arrowUp', ['$event']]
|
3686
|
+
}, {
|
3687
|
+
type: i0.HostListener,
|
3688
|
+
args: ['keydown.arrowDown', ['$event']]
|
3689
|
+
}] } });
|
3690
|
+
|
3691
|
+
var KeyboardSortableListDirective = /** @class */ (function () {
|
3692
|
+
function KeyboardSortableListDirective(translateService) {
|
3693
|
+
this.translateService = translateService;
|
3694
|
+
}
|
3695
|
+
KeyboardSortableListDirective.prototype.ngAfterViewInit = function () {
|
3696
|
+
this.setupControlsTooltipToBeShownOnFirstFocusedItem();
|
3697
|
+
};
|
3698
|
+
KeyboardSortableListDirective.prototype.setupControlsTooltipToBeShownOnFirstFocusedItem = function () {
|
3699
|
+
var _this = this;
|
3700
|
+
var firstFocusEventOnADraggableItem$ = this.keyboardSortableItems$.pipe(operators.filter(function (items) { return items && items.length > 0; }), operators.switchMap(function (items) { return i6.merge.apply(void 0, __spreadArray([], __read(items.filter(function (item) { return item.isSortable; }).map(function (item) { return item.focusWithKeyboard; })))); }), operators.take(1));
|
3701
|
+
firstFocusEventOnADraggableItem$.subscribe(function (item) {
|
3702
|
+
item.tooltipDirective.content = _this.translateService.instant(DRAG_AND_DROP_LIST_TRANSLATION_NAME + ".helpTooltip");
|
3703
|
+
item.tooltipDirective.show();
|
3704
|
+
});
|
3705
|
+
};
|
3706
|
+
return KeyboardSortableListDirective;
|
3707
|
+
}());
|
3708
|
+
KeyboardSortableListDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: KeyboardSortableListDirective, deps: [{ token: i1__namespace$2.TranslateService }], target: i0__namespace.ɵɵFactoryTarget.Directive });
|
3709
|
+
KeyboardSortableListDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.1.4", type: KeyboardSortableListDirective, selector: "[lxKeyboardSortableList]", inputs: { keyboardSortableItems: "keyboardSortableItems" }, ngImport: i0__namespace });
|
3710
|
+
__decorate([
|
3711
|
+
Observe('keyboardSortableItems')
|
3712
|
+
], KeyboardSortableListDirective.prototype, "keyboardSortableItems$", void 0);
|
3713
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: KeyboardSortableListDirective, decorators: [{
|
3714
|
+
type: i0.Directive,
|
3715
|
+
args: [{
|
3716
|
+
selector: '[lxKeyboardSortableList]'
|
3717
|
+
}]
|
3718
|
+
}], ctorParameters: function () { return [{ type: i1__namespace$2.TranslateService }]; }, propDecorators: { keyboardSortableItems$: [], keyboardSortableItems: [{
|
3719
|
+
type: i0.Input
|
3545
3720
|
}] } });
|
3546
3721
|
|
3547
3722
|
var DragAndDropListComponent = /** @class */ (function () {
|
3548
3723
|
function DragAndDropListComponent() {
|
3549
|
-
this.NAME =
|
3724
|
+
this.NAME = DRAG_AND_DROP_LIST_TRANSLATION_NAME;
|
3550
3725
|
/**
|
3551
3726
|
* Override the global label font weight of 700
|
3552
3727
|
*/
|
3553
3728
|
this.labelFontWeight = 700;
|
3554
|
-
this.color = '
|
3729
|
+
this.color = 'light';
|
3555
3730
|
this.fontSize = 'normal';
|
3556
3731
|
/**
|
3557
3732
|
* Use the moveToIndex Output in favor of moveItem,
|
@@ -3559,15 +3734,19 @@
|
|
3559
3734
|
*/
|
3560
3735
|
this.moveToIndex = new i0.EventEmitter();
|
3561
3736
|
this.moveItem = new i0.EventEmitter();
|
3562
|
-
|
3737
|
+
/**
|
3738
|
+
* TODO: extract state about keyboard sorting into KeyboardSortableListDirective
|
3739
|
+
*/
|
3740
|
+
this.isSortingByKeyboard = false;
|
3741
|
+
this.keyboardItemBeingSorted = undefined;
|
3742
|
+
this.allItemsData = [];
|
3563
3743
|
}
|
3564
|
-
DragAndDropListComponent.prototype.ngOnInit = function () {
|
3565
|
-
if (this.items && !this.itemIdProperty) {
|
3566
|
-
throw new Error('Cannot pass drag and drop items without defining the id property');
|
3567
|
-
}
|
3568
|
-
};
|
3569
3744
|
DragAndDropListComponent.prototype.ngAfterContentInit = function () {
|
3570
3745
|
this.items$ = this._items.changes.pipe(operators.startWith(this._items), operators.map(function (items) { return items.toArray(); }));
|
3746
|
+
this.allItemsData$ = this.items$.pipe(operators.map(function (itemComponents) { return itemComponents.map(function (itemComponent) { return itemComponent.item; }); }));
|
3747
|
+
};
|
3748
|
+
DragAndDropListComponent.prototype.ngAfterViewInit = function () {
|
3749
|
+
this.keyboardSortableItems$ = this._keyboardSortableItems.changes.pipe(operators.startWith(this._keyboardSortableItems), operators.map(function (items) { return items.toArray(); }));
|
3571
3750
|
};
|
3572
3751
|
DragAndDropListComponent.prototype.emitContentChildAction = function (action) {
|
3573
3752
|
var _a;
|
@@ -3583,22 +3762,25 @@
|
|
3583
3762
|
* You're supposed to update the data in the parent and pass the new items as input.
|
3584
3763
|
*/
|
3585
3764
|
DragAndDropListComponent.prototype.drop = function (event) {
|
3586
|
-
|
3587
|
-
this.moveToIndex.emit(event.currentIndex);
|
3588
|
-
this.moveItem.emit({ item: event.item.data, index: event.currentIndex });
|
3765
|
+
this.sortItems(event.container.data, event.item.data, event.previousIndex, event.currentIndex);
|
3589
3766
|
};
|
3590
|
-
DragAndDropListComponent.prototype.
|
3591
|
-
|
3592
|
-
|
3767
|
+
DragAndDropListComponent.prototype.dropToIndexAfterArrowKey = function (item, previousIndex, currentIndex) {
|
3768
|
+
if (this.isSortingByKeyboard) {
|
3769
|
+
this.sortItems(this._items, item, previousIndex, currentIndex);
|
3770
|
+
}
|
3771
|
+
};
|
3772
|
+
DragAndDropListComponent.prototype.sortItems = function (items, item, previousIndex, currentIndex) {
|
3773
|
+
i1$4.moveItemInArray(items, previousIndex, currentIndex);
|
3774
|
+
this.moveToIndex.emit({ index: currentIndex, previous: previousIndex });
|
3593
3775
|
this.moveItem.emit({ item: item, index: currentIndex });
|
3594
3776
|
};
|
3595
|
-
DragAndDropListComponent.prototype.
|
3596
|
-
return item
|
3777
|
+
DragAndDropListComponent.prototype.trackByItem = function (_index, item) {
|
3778
|
+
return item.item;
|
3597
3779
|
};
|
3598
3780
|
return DragAndDropListComponent;
|
3599
3781
|
}());
|
3600
3782
|
DragAndDropListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
|
3601
|
-
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",
|
3783
|
+
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", color: "color", fontSize: "fontSize" }, outputs: { moveToIndex: "moveToIndex", moveItem: "moveItem" }, host: { properties: { "attr.color": "this.color", "attr.fontSize": "this.fontSize" } }, queries: [{ propertyName: "_items", predicate: DragAndDropListItemComponent }], viewQueries: [{ propertyName: "_keyboardSortableItems", predicate: KeyboardSortableItemDirective, descendants: true }], ngImport: i0__namespace, template: "<label *ngIf=\"label\" [style.font-weight]=\"labelFontWeight\">{{ label }}</label>\n<p class=\"sr-only\">{{ NAME + '.helpTooltip' | translate }}</p>\n<ul\n cdkDropList\n class=\"list\"\n role=\"listbox\"\n lxKeyboardSortableList\n [keyboardSortableItems]=\"keyboardSortableItems$ | async\"\n [cdkDropListData]=\"items$ | async\"\n (cdkDropListDropped)=\"drop($event)\"\n>\n <li\n *ngFor=\"let itemComponent of items$ | async; trackBy: trackByItem\"\n #listItemParent\n class=\"item\"\n cdkDrag\n cdkDragLockAxis=\"y\"\n [cdkDragData]=\"itemComponent.item\"\n [cdkDragDisabled]=\"!itemComponent.draggable\"\n [class.dark]=\"color === 'dark'\"\n [class.big]=\"fontSize === 'big'\"\n [tabIndex]=\"itemComponent.draggable === false ? -1 : 0\"\n [lxKeyboardSortableItem]=\"allItemsData$ | async\"\n [lxKeyboardItemData]=\"itemComponent.item\"\n [(isSortingByKeyboard)]=\"isSortingByKeyboard\"\n [(lxKeyboardItemBeingSorted)]=\"keyboardItemBeingSorted\"\n (sortItemsWithKeyboard)=\"dropToIndexAfterArrowKey(itemComponent.item, $event.previousIndex, $event.currentIndex)\"\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 >\n <ng-template *ngIf=\"itemComponent.customTemplateRef\" #customTemplate>\n <ng-container *ngTemplateOutlet=\"itemComponent.customTemplateRef\"></ng-container>\n </ng-template>\n </lx-drag-and-drop-list-item>\n </li>\n</ul>\n", styles: ["@-webkit-keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}:host{display:block}.list{list-style-type:none;width:100%;display:block;padding:0;color:#526179}.item.cdk-drag-disabled{background:#eaedf1;cursor:default}.item{position:relative;cursor:move;border:1px solid #99a5bb;margin-bottom:4px;border-radius:3px}.item:focus{outline:1px auto #1666ee}.cdk-drag-preview{box-sizing:border-box;border-radius:3px;list-style:none;border:1px solid #99a5bb!important;box-shadow:0 3px 4px hsla(0,0%,45%,.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}:host[color=dark] lx-drag-and-drop-list-item{background-color:#f0f2f5;color:#526179;border-radius:3px}:host[color=dark] .item,:host[color=dark] .list{border:0}:host[color=dark] .item.cdk-drag-disabled lx-drag-and-drop-list-item{background:#fff;color:#99a5bb;border:1px solid #99a5bb}:host[fontSize=big] .item{text-transform:uppercase;font-weight:700}.cdk-drag-preview.dark{border:0!important}.cdk-drag-preview.dark lx-drag-and-drop-list-item{background-color:#f0f2f5;color:#526179;border-radius:3px}.cdk-drag-preview.big{text-transform:uppercase;font-weight:700}.isBeingSortedByKeyboard{box-shadow:0 6px 24px 0 #b2bccc;z-index:1}"], 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: i1__namespace$4.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: KeyboardSortableListDirective, selector: "[lxKeyboardSortableList]", inputs: ["keyboardSortableItems"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.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: KeyboardSortableItemDirective, selector: "[lxKeyboardSortableItem]", inputs: ["lxKeyboardSortableItem", "lxKeyboardItemData", "isSortingByKeyboard", "lxKeyboardItemBeingSorted"], outputs: ["isSortingByKeyboardChange", "lxKeyboardItemBeingSortedChange", "sortItemsWithKeyboard", "focusWithKeyboard"] }, { type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "translate": i1__namespace$2.TranslatePipe, "async": i2__namespace.AsyncPipe } });
|
3602
3784
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListComponent, decorators: [{
|
3603
3785
|
type: i0.Component,
|
3604
3786
|
args: [{
|
@@ -3610,10 +3792,6 @@
|
|
3610
3792
|
type: i0.Input
|
3611
3793
|
}], labelFontWeight: [{
|
3612
3794
|
type: i0.Input
|
3613
|
-
}], items: [{
|
3614
|
-
type: i0.Input
|
3615
|
-
}], itemIdProperty: [{
|
3616
|
-
type: i0.Input
|
3617
3795
|
}], color: [{
|
3618
3796
|
type: i0.Input
|
3619
3797
|
}, {
|
@@ -3631,11 +3809,28 @@
|
|
3631
3809
|
}], _items: [{
|
3632
3810
|
type: i0.ContentChildren,
|
3633
3811
|
args: [DragAndDropListItemComponent]
|
3634
|
-
}],
|
3635
|
-
type: i0.
|
3636
|
-
args: [
|
3812
|
+
}], _keyboardSortableItems: [{
|
3813
|
+
type: i0.ViewChildren,
|
3814
|
+
args: [KeyboardSortableItemDirective]
|
3637
3815
|
}] } });
|
3638
3816
|
|
3817
|
+
var LxDragAndDropListModule = /** @class */ (function () {
|
3818
|
+
function LxDragAndDropListModule() {
|
3819
|
+
}
|
3820
|
+
return LxDragAndDropListModule;
|
3821
|
+
}());
|
3822
|
+
LxDragAndDropListModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxDragAndDropListModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
|
3823
|
+
LxDragAndDropListModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxDragAndDropListModule, declarations: [KeyboardSortableItemDirective, KeyboardSortableListDirective, DragAndDropListComponent, DragAndDropListItemComponent], imports: [i2.CommonModule, i1$4.DragDropModule, LxCoreUiModule, i1__namespace$2.TranslateModule], exports: [DragAndDropListComponent, DragAndDropListItemComponent] });
|
3824
|
+
LxDragAndDropListModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxDragAndDropListModule, imports: [[i2.CommonModule, i1$4.DragDropModule, LxCoreUiModule, i1$2.TranslateModule.forChild()]] });
|
3825
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxDragAndDropListModule, decorators: [{
|
3826
|
+
type: i0.NgModule,
|
3827
|
+
args: [{
|
3828
|
+
declarations: [KeyboardSortableItemDirective, KeyboardSortableListDirective, DragAndDropListComponent, DragAndDropListItemComponent],
|
3829
|
+
imports: [i2.CommonModule, i1$4.DragDropModule, LxCoreUiModule, i1$2.TranslateModule.forChild()],
|
3830
|
+
exports: [DragAndDropListComponent, DragAndDropListItemComponent]
|
3831
|
+
}]
|
3832
|
+
}] });
|
3833
|
+
|
3639
3834
|
var ErrorMessageComponent = /** @class */ (function () {
|
3640
3835
|
function ErrorMessageComponent(cd) {
|
3641
3836
|
this.cd = cd;
|
@@ -5088,7 +5283,7 @@
|
|
5088
5283
|
PickerComponent.prototype.onTouched = function () { };
|
5089
5284
|
return PickerComponent;
|
5090
5285
|
}());
|
5091
|
-
PickerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PickerComponent, deps: [{ token: i1__namespace$
|
5286
|
+
PickerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PickerComponent, deps: [{ token: i1__namespace$5.Directionality }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
5092
5287
|
PickerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: PickerComponent, selector: "lx-picker", inputs: { listBoxAriaLabel: "listBoxAriaLabel", listBoxAriaLabelledBy: "listBoxAriaLabelledBy", openDirection: "openDirection" }, host: { listeners: { "document:keydown": "manageKeyboardEvents($event)" } }, providers: [
|
5093
5288
|
{
|
5094
5289
|
provide: i3$2.NG_VALUE_ACCESSOR,
|
@@ -5111,7 +5306,7 @@
|
|
5111
5306
|
],
|
5112
5307
|
changeDetection: i0.ChangeDetectionStrategy.OnPush
|
5113
5308
|
}]
|
5114
|
-
}], ctorParameters: function () { return [{ type: i1__namespace$
|
5309
|
+
}], ctorParameters: function () { return [{ type: i1__namespace$5.Directionality }, { type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { listBoxAriaLabel: [{
|
5115
5310
|
type: i0.Input
|
5116
5311
|
}], listBoxAriaLabelledBy: [{
|
5117
5312
|
type: i0.Input
|
@@ -5966,8 +6161,6 @@
|
|
5966
6161
|
CurrencyInputComponent,
|
5967
6162
|
CurrencySymbolComponent,
|
5968
6163
|
DateInputComponent,
|
5969
|
-
DragAndDropListComponent,
|
5970
|
-
DragAndDropListItemComponent,
|
5971
6164
|
FilterSelectionPipe,
|
5972
6165
|
FilterTermPipe,
|
5973
6166
|
FormErrorComponent,
|
@@ -6000,18 +6193,16 @@
|
|
6000
6193
|
FormErrorDirective,
|
6001
6194
|
ErrorMessageComponent,
|
6002
6195
|
FormSubmitDirective], imports: [i2.CommonModule,
|
6003
|
-
i3$3.DragDropModule,
|
6004
6196
|
i3$2.FormsModule,
|
6005
6197
|
i3$2.ReactiveFormsModule, i1__namespace$2.TranslateModule, i1$3.DatepickerModule,
|
6006
6198
|
i3$1.InfiniteScrollModule,
|
6007
6199
|
i1.OverlayModule,
|
6008
|
-
LxCoreUiModule
|
6200
|
+
LxCoreUiModule,
|
6201
|
+
LxDragAndDropListModule], exports: [BasicDropdownComponent,
|
6009
6202
|
BasicDropdownItemComponent,
|
6010
6203
|
CurrencyInputComponent,
|
6011
6204
|
CurrencySymbolComponent,
|
6012
6205
|
DateInputComponent,
|
6013
|
-
DragAndDropListComponent,
|
6014
|
-
DragAndDropListItemComponent,
|
6015
6206
|
FilterSelectionPipe,
|
6016
6207
|
FilterTermPipe,
|
6017
6208
|
FormErrorComponent,
|
@@ -6042,18 +6233,19 @@
|
|
6042
6233
|
FormatNumberPipe,
|
6043
6234
|
FormErrorDirective,
|
6044
6235
|
FormSubmitDirective,
|
6045
|
-
ErrorMessageComponent
|
6236
|
+
ErrorMessageComponent,
|
6237
|
+
LxDragAndDropListModule] });
|
6046
6238
|
LxFormsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxFormsModule, imports: [[
|
6047
6239
|
i2.CommonModule,
|
6048
|
-
i3$3.DragDropModule,
|
6049
6240
|
i3$2.FormsModule,
|
6050
6241
|
i3$2.ReactiveFormsModule,
|
6051
6242
|
i1$2.TranslateModule.forChild(),
|
6052
6243
|
i1$3.DatepickerModule,
|
6053
6244
|
i3$1.InfiniteScrollModule,
|
6054
6245
|
i1.OverlayModule,
|
6055
|
-
LxCoreUiModule
|
6056
|
-
|
6246
|
+
LxCoreUiModule,
|
6247
|
+
LxDragAndDropListModule
|
6248
|
+
], LxDragAndDropListModule] });
|
6057
6249
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxFormsModule, decorators: [{
|
6058
6250
|
type: i0.NgModule,
|
6059
6251
|
args: [{
|
@@ -6063,8 +6255,6 @@
|
|
6063
6255
|
CurrencyInputComponent,
|
6064
6256
|
CurrencySymbolComponent,
|
6065
6257
|
DateInputComponent,
|
6066
|
-
DragAndDropListComponent,
|
6067
|
-
DragAndDropListItemComponent,
|
6068
6258
|
FilterSelectionPipe,
|
6069
6259
|
FilterTermPipe,
|
6070
6260
|
FormErrorComponent,
|
@@ -6100,14 +6290,14 @@
|
|
6100
6290
|
],
|
6101
6291
|
imports: [
|
6102
6292
|
i2.CommonModule,
|
6103
|
-
i3$3.DragDropModule,
|
6104
6293
|
i3$2.FormsModule,
|
6105
6294
|
i3$2.ReactiveFormsModule,
|
6106
6295
|
i1$2.TranslateModule.forChild(),
|
6107
6296
|
i1$3.DatepickerModule,
|
6108
6297
|
i3$1.InfiniteScrollModule,
|
6109
6298
|
i1.OverlayModule,
|
6110
|
-
LxCoreUiModule
|
6299
|
+
LxCoreUiModule,
|
6300
|
+
LxDragAndDropListModule
|
6111
6301
|
],
|
6112
6302
|
exports: [
|
6113
6303
|
BasicDropdownComponent,
|
@@ -6115,8 +6305,6 @@
|
|
6115
6305
|
CurrencyInputComponent,
|
6116
6306
|
CurrencySymbolComponent,
|
6117
6307
|
DateInputComponent,
|
6118
|
-
DragAndDropListComponent,
|
6119
|
-
DragAndDropListItemComponent,
|
6120
6308
|
FilterSelectionPipe,
|
6121
6309
|
FilterTermPipe,
|
6122
6310
|
FormErrorComponent,
|
@@ -6147,7 +6335,8 @@
|
|
6147
6335
|
FormatNumberPipe,
|
6148
6336
|
FormErrorDirective,
|
6149
6337
|
FormSubmitDirective,
|
6150
|
-
ErrorMessageComponent
|
6338
|
+
ErrorMessageComponent,
|
6339
|
+
LxDragAndDropListModule
|
6151
6340
|
]
|
6152
6341
|
}]
|
6153
6342
|
}] });
|
@@ -6398,7 +6587,7 @@
|
|
6398
6587
|
return ModalComponent;
|
6399
6588
|
}());
|
6400
6589
|
ModalComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: ModalComponent, deps: [{ token: i1__namespace.Overlay }, { token: i0__namespace.Renderer2 }, { token: MODAL_CLOSE, optional: true }, { token: i2__namespace$1.ConfigurableFocusTrapFactory }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
6401
|
-
ModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: ModalComponent, selector: "lx-modal", inputs: { open: "open", showCloseButton: "showCloseButton", showBackButton: "showBackButton", verticalScroll: "verticalScroll", size: "size", isFocusTrap: "isFocusTrap", canModalBeClosed: "canModalBeClosed" }, outputs: { close: "close", back: "back" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "header", first: true, predicate: ModalHeaderComponent, descendants: true }, { propertyName: "footer", first: true, predicate: ModalFooterComponent, descendants: true }, { propertyName: "explicitContent", first: true, predicate: ModalContentDirective, descendants: true, read: i0.TemplateRef, static: true }], viewQueries: [{ propertyName: "cdkPortal", first: true, predicate: i3.CdkPortal, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<ng-template cdkPortal>\n <div\n *ngIf=\"open\"\n role=\"dialog\"\n class=\"lxmodal\"\n [class.lxmodal--fullscreen]=\"size === 'fullscreen'\"\n [class.lxmodal--dialog]=\"size === 'dialog'\"\n [class.lxmodal--dialog-large]=\"size === 'dialog-large'\"\n [class.lxmodal--withFooter]=\"!!footer\"\n [class.lxmodal--verticalScroll]=\"verticalScroll\"\n @modal\n >\n <div\n *ngIf=\"size === 'fullscreen' && showBackButton\"\n (click)=\"emitBack()\"\n (keyup.enter)=\"emitBack()\"\n tabindex=\"0\"\n role=\"button\"\n class=\"fal fa-long-arrow-left\"\n ></div>\n <button\n *ngIf=\"showCloseButton\"\n (click)=\"closeModal()\"\n [attr.aria-label]=\"NAME + '.close' | translate\"\n class=\"fal fa-times closeButton\"\n ></button>\n <ng-content *ngIf=\"header\" select=\"lx-modal-header\"></ng-content>\n <div class=\"modalContentContainer\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n <ng-content *ngIf=\"footer\" select=\"lx-modal-footer\"></ng-content>\n </div>\n</ng-template>\n<ng-template #implicitContent>\n <ng-content></ng-content>\n</ng-template>\n", styles: ["@-webkit-keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.lxmodal{background:#fff;width:100%}.lxmodal--withFooter.lxmodal--fullscreen .modalContentContainer{bottom:70px;overflow:hidden}.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto}.lxmodal--fullscreen{height:100%;display:flex;flex-direction:column}.lxmodal--fullscreen .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:all .18s;transition-delay:.6s;transition-timing-function:ease;border-radius:50%;color:#b2bccc;width:48px;height:48px;font-size:24px;line-height:48px;right:36px;top:16px;z-index:1}.lxmodal--fullscreen .closeButton:before{cursor:pointer}.lxmodal--fullscreen .closeButton:focus,.lxmodal--fullscreen .closeButton:hover{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .closeButton:focus{outline:0}.lxmodal--fullscreen .fa-long-arrow-left{border:0;background:transparent;position:absolute;text-align:center;transition:all .18s;transition-delay:.6s;transition-timing-function:ease;border-radius:50%;color:#b2bccc;width:48px;height:48px;font-size:24px;line-height:48px;left:36px;top:16px}.lxmodal--fullscreen .fa-long-arrow-left:before{cursor:pointer}.lxmodal--fullscreen .fa-long-arrow-left:focus,.lxmodal--fullscreen .fa-long-arrow-left:hover{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .fa-long-arrow-left:focus{outline:0}.lxmodal--dialog,.lxmodal--dialog-large{display:block;position:relative;border-radius:6px;box-shadow:0 8px 20px 0 rgba(0,0,0,.24)}.lxmodal--dialog-large .modalContentContainer,.lxmodal--dialog .modalContentContainer{padding:16px;position:relative}.lxmodal--dialog-large .closeButton,.lxmodal--dialog .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:all .18s;transition-delay:.6s;transition-timing-function:ease;border-radius:50%;color:#8594ad;height:32px;width:32px;font-size:16px;z-index:999;right:10px;top:10px}.lxmodal--dialog-large .closeButton:before,.lxmodal--dialog .closeButton:before{cursor:pointer}.lxmodal--dialog-large .closeButton:focus,.lxmodal--dialog-large .closeButton:hover,.lxmodal--dialog .closeButton:focus,.lxmodal--dialog .closeButton:hover{color:#526179;background-color:#eaedf1}.lxmodal--dialog-large .closeButton:focus,.lxmodal--dialog .closeButton:focus{outline:0}.lxmodal--dialog-large .modalContentContainer{height:calc(100% - 48px - 64px)}.modalContentContainer{flex:1}"], directives: [{ type: i3__namespace$
|
6590
|
+
ModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: ModalComponent, selector: "lx-modal", inputs: { open: "open", showCloseButton: "showCloseButton", showBackButton: "showBackButton", verticalScroll: "verticalScroll", size: "size", isFocusTrap: "isFocusTrap", canModalBeClosed: "canModalBeClosed" }, outputs: { close: "close", back: "back" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "header", first: true, predicate: ModalHeaderComponent, descendants: true }, { propertyName: "footer", first: true, predicate: ModalFooterComponent, descendants: true }, { propertyName: "explicitContent", first: true, predicate: ModalContentDirective, descendants: true, read: i0.TemplateRef, static: true }], viewQueries: [{ propertyName: "cdkPortal", first: true, predicate: i3.CdkPortal, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<ng-template cdkPortal>\n <div\n *ngIf=\"open\"\n role=\"dialog\"\n class=\"lxmodal\"\n [class.lxmodal--fullscreen]=\"size === 'fullscreen'\"\n [class.lxmodal--dialog]=\"size === 'dialog'\"\n [class.lxmodal--dialog-large]=\"size === 'dialog-large'\"\n [class.lxmodal--withFooter]=\"!!footer\"\n [class.lxmodal--verticalScroll]=\"verticalScroll\"\n @modal\n >\n <div\n *ngIf=\"size === 'fullscreen' && showBackButton\"\n (click)=\"emitBack()\"\n (keyup.enter)=\"emitBack()\"\n tabindex=\"0\"\n role=\"button\"\n class=\"fal fa-long-arrow-left\"\n ></div>\n <button\n *ngIf=\"showCloseButton\"\n (click)=\"closeModal()\"\n [attr.aria-label]=\"NAME + '.close' | translate\"\n class=\"fal fa-times closeButton\"\n ></button>\n <ng-content *ngIf=\"header\" select=\"lx-modal-header\"></ng-content>\n <div class=\"modalContentContainer\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n <ng-content *ngIf=\"footer\" select=\"lx-modal-footer\"></ng-content>\n </div>\n</ng-template>\n<ng-template #implicitContent>\n <ng-content></ng-content>\n</ng-template>\n", styles: ["@-webkit-keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.lxmodal{background:#fff;width:100%}.lxmodal--withFooter.lxmodal--fullscreen .modalContentContainer{bottom:70px;overflow:hidden}.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto}.lxmodal--fullscreen{height:100%;display:flex;flex-direction:column}.lxmodal--fullscreen .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:all .18s;transition-delay:.6s;transition-timing-function:ease;border-radius:50%;color:#b2bccc;width:48px;height:48px;font-size:24px;line-height:48px;right:36px;top:16px;z-index:1}.lxmodal--fullscreen .closeButton:before{cursor:pointer}.lxmodal--fullscreen .closeButton:focus,.lxmodal--fullscreen .closeButton:hover{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .closeButton:focus{outline:0}.lxmodal--fullscreen .fa-long-arrow-left{border:0;background:transparent;position:absolute;text-align:center;transition:all .18s;transition-delay:.6s;transition-timing-function:ease;border-radius:50%;color:#b2bccc;width:48px;height:48px;font-size:24px;line-height:48px;left:36px;top:16px}.lxmodal--fullscreen .fa-long-arrow-left:before{cursor:pointer}.lxmodal--fullscreen .fa-long-arrow-left:focus,.lxmodal--fullscreen .fa-long-arrow-left:hover{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .fa-long-arrow-left:focus{outline:0}.lxmodal--dialog,.lxmodal--dialog-large{display:block;position:relative;border-radius:6px;box-shadow:0 8px 20px 0 rgba(0,0,0,.24)}.lxmodal--dialog-large .modalContentContainer,.lxmodal--dialog .modalContentContainer{padding:16px;position:relative}.lxmodal--dialog-large .closeButton,.lxmodal--dialog .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:all .18s;transition-delay:.6s;transition-timing-function:ease;border-radius:50%;color:#8594ad;height:32px;width:32px;font-size:16px;z-index:999;right:10px;top:10px}.lxmodal--dialog-large .closeButton:before,.lxmodal--dialog .closeButton:before{cursor:pointer}.lxmodal--dialog-large .closeButton:focus,.lxmodal--dialog-large .closeButton:hover,.lxmodal--dialog .closeButton:focus,.lxmodal--dialog .closeButton:hover{color:#526179;background-color:#eaedf1}.lxmodal--dialog-large .closeButton:focus,.lxmodal--dialog .closeButton:focus{outline:0}.lxmodal--dialog-large .modalContentContainer{height:calc(100% - 48px - 64px)}.modalContentContainer{flex:1}"], directives: [{ type: i3__namespace$2.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "translate": i1__namespace$2.TranslatePipe }, animations: [
|
6402
6591
|
animations.trigger('modal', [
|
6403
6592
|
animations.transition(':enter', [animations.style({ opacity: 0 }), animations.animate('0.15s', animations.style({ opacity: 1 }))]),
|
6404
6593
|
animations.transition(':leave', animations.animate('0.15s', animations.style({ opacity: 0 })))
|
@@ -6667,7 +6856,7 @@
|
|
6667
6856
|
return PopoverComponent;
|
6668
6857
|
}());
|
6669
6858
|
PopoverComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PopoverComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
|
6670
|
-
PopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: PopoverComponent, selector: "lx-popover", inputs: { trigger: "trigger", horizontalAlign: "horizontalAlign", verticalAlign: "verticalAlign", noMargin: "noMargin", allowOverflow: "allowOverflow", adaptMarginsForViewportAlignChange: "adaptMarginsForViewportAlignChange" }, outputs: { opened: "opened", closed: "closed" }, queries: [{ propertyName: "explicitContent", first: true, predicate: PopoverContentDirective, descendants: true, read: i0.TemplateRef, static: true }], viewQueries: [{ propertyName: "satPopover", first: true, predicate: i1$
|
6859
|
+
PopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: PopoverComponent, selector: "lx-popover", inputs: { trigger: "trigger", horizontalAlign: "horizontalAlign", verticalAlign: "verticalAlign", noMargin: "noMargin", allowOverflow: "allowOverflow", adaptMarginsForViewportAlignChange: "adaptMarginsForViewportAlignChange" }, outputs: { opened: "opened", closed: "closed" }, queries: [{ propertyName: "explicitContent", first: true, predicate: PopoverContentDirective, descendants: true, read: i0.TemplateRef, static: true }], viewQueries: [{ propertyName: "satPopover", first: true, predicate: i1$6.SatPopover, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<sat-popover\n [anchor]=\"trigger.anchor\"\n [horizontalAlign]=\"horizontalAlign\"\n [verticalAlign]=\"verticalAlign\"\n [restoreFocus]=\"false\"\n [lockAlignment]=\"true\"\n [autoFocus]=\"false\"\n openTransition=\"0ms\"\n closeTransition=\"0ms\"\n (opened)=\"onOpen()\"\n (afterOpen)=\"onAfterOpen()\"\n (closed)=\"onClose()\"\n>\n <div\n class=\"popoverContainer\"\n [ngClass]=\"marginClasses\"\n [class.overflowHidden]=\"!allowOverflow\"\n (mouseenter)=\"trigger.showPopover(true)\"\n (mouseleave)=\"trigger.closePopover(true)\"\n >\n <ng-container *ngIf=\"isOpen\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </ng-container>\n </div>\n</sat-popover>\n<ng-template #implicitContent>\n <ng-content></ng-content>\n</ng-template>\n", styles: ["@-webkit-keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.popoverContainer{position:relative;box-shadow:0 8px 12px 2px rgba(0,0,0,.15);max-width:600px;max-height:80vh;border-radius:3px;background-color:#fff;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;-webkit-animation:subtleScaleUpKeyFrames .2s ease;animation:subtleScaleUpKeyFrames .2s ease}.popoverContainer.overflowHidden{overflow:hidden}.right{margin-left:18px}.left{margin-right:18px}.bottom{margin-top:18px}.top{margin-bottom:18px}"], components: [{ type: i1__namespace$6.SatPopover, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }], directives: [{ type: i2__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
|
6671
6860
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PopoverComponent, decorators: [{
|
6672
6861
|
type: i0.Component,
|
6673
6862
|
args: [{
|
@@ -6693,7 +6882,7 @@
|
|
6693
6882
|
type: i0.Output
|
6694
6883
|
}], satPopover: [{
|
6695
6884
|
type: i0.ViewChild,
|
6696
|
-
args: [i1$
|
6885
|
+
args: [i1$6.SatPopover, { static: true }]
|
6697
6886
|
}], implicitContent: [{
|
6698
6887
|
type: i0.ViewChild,
|
6699
6888
|
args: ['implicitContent', { static: true }]
|
@@ -6730,7 +6919,7 @@
|
|
6730
6919
|
};
|
6731
6920
|
return PopoverClickDirective;
|
6732
6921
|
}());
|
6733
|
-
PopoverClickDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PopoverClickDirective, deps: [{ token: i1__namespace$
|
6922
|
+
PopoverClickDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PopoverClickDirective, deps: [{ token: i1__namespace$6.SatPopoverAnchor }], target: i0__namespace.ɵɵFactoryTarget.Directive });
|
6734
6923
|
PopoverClickDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.1.4", type: PopoverClickDirective, selector: "[lxPopoverClick]", inputs: { lxPopoverPinned: "lxPopoverPinned" }, host: { listeners: { "mouseleave": "closePopover()" } }, exportAs: ["clickAnchor"], ngImport: i0__namespace });
|
6735
6924
|
__decorate([
|
6736
6925
|
Observe('lxPopoverPinned')
|
@@ -6741,7 +6930,7 @@
|
|
6741
6930
|
exportAs: 'clickAnchor',
|
6742
6931
|
selector: '[lxPopoverClick]'
|
6743
6932
|
}]
|
6744
|
-
}], ctorParameters: function () { return [{ type: i1__namespace$
|
6933
|
+
}], ctorParameters: function () { return [{ type: i1__namespace$6.SatPopoverAnchor }]; }, propDecorators: { lxPopoverPinned: [{
|
6745
6934
|
type: i0.Input
|
6746
6935
|
}], pinned$: [], closePopover: [{
|
6747
6936
|
type: i0.HostListener,
|
@@ -6823,7 +7012,7 @@
|
|
6823
7012
|
};
|
6824
7013
|
return PopoverHoverDirective;
|
6825
7014
|
}());
|
6826
|
-
PopoverHoverDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PopoverHoverDirective, deps: [{ token: i1__namespace$
|
7015
|
+
PopoverHoverDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PopoverHoverDirective, deps: [{ token: i1__namespace$6.SatPopoverAnchor }], target: i0__namespace.ɵɵFactoryTarget.Directive });
|
6827
7016
|
PopoverHoverDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.1.4", type: PopoverHoverDirective, selector: "[lxPopoverHover]", inputs: { lxPopoverHover: "lxPopoverHover", skipCloseDelay: "skipCloseDelay" }, host: { listeners: { "mouseenter": "showPopover()", "mouseleave": "closePopover()" } }, exportAs: ["hoverAnchor"], ngImport: i0__namespace });
|
6828
7017
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: PopoverHoverDirective, decorators: [{
|
6829
7018
|
type: i0.Directive,
|
@@ -6831,7 +7020,7 @@
|
|
6831
7020
|
exportAs: 'hoverAnchor',
|
6832
7021
|
selector: '[lxPopoverHover]'
|
6833
7022
|
}]
|
6834
|
-
}], ctorParameters: function () { return [{ type: i1__namespace$
|
7023
|
+
}], ctorParameters: function () { return [{ type: i1__namespace$6.SatPopoverAnchor }]; }, propDecorators: { lxPopoverHover: [{
|
6835
7024
|
type: i0.Input
|
6836
7025
|
}], skipCloseDelay: [{
|
6837
7026
|
type: i0.Input
|
@@ -6849,14 +7038,14 @@
|
|
6849
7038
|
return LxPopoverUiModule;
|
6850
7039
|
}());
|
6851
7040
|
LxPopoverUiModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxPopoverUiModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
|
6852
|
-
LxPopoverUiModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxPopoverUiModule, declarations: [PopoverHoverDirective, PopoverClickDirective, PopoverComponent, PopoverContentDirective], imports: [i2.CommonModule, i1$
|
6853
|
-
LxPopoverUiModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxPopoverUiModule, imports: [[i2.CommonModule, i1$
|
7041
|
+
LxPopoverUiModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxPopoverUiModule, declarations: [PopoverHoverDirective, PopoverClickDirective, PopoverComponent, PopoverContentDirective], imports: [i2.CommonModule, i1$6.SatPopoverModule], exports: [i1$6.SatPopoverModule, PopoverClickDirective, PopoverHoverDirective, PopoverComponent, PopoverContentDirective] });
|
7042
|
+
LxPopoverUiModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxPopoverUiModule, imports: [[i2.CommonModule, i1$6.SatPopoverModule], i1$6.SatPopoverModule] });
|
6854
7043
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxPopoverUiModule, decorators: [{
|
6855
7044
|
type: i0.NgModule,
|
6856
7045
|
args: [{
|
6857
7046
|
declarations: [PopoverHoverDirective, PopoverClickDirective, PopoverComponent, PopoverContentDirective],
|
6858
|
-
imports: [i2.CommonModule, i1$
|
6859
|
-
exports: [i1$
|
7047
|
+
imports: [i2.CommonModule, i1$6.SatPopoverModule],
|
7048
|
+
exports: [i1$6.SatPopoverModule, PopoverClickDirective, PopoverHoverDirective, PopoverComponent, PopoverContentDirective]
|
6860
7049
|
}]
|
6861
7050
|
}] });
|
6862
7051
|
|
@@ -6891,7 +7080,7 @@
|
|
6891
7080
|
return TabComponent;
|
6892
7081
|
}());
|
6893
7082
|
TabComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: TabComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
6894
|
-
TabComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: TabComponent, selector: "lx-tab", inputs: { icon: "icon", label: "label", title: "title", tabLink: "tabLink", counter: "counter", routerLinkActiveOptions: "routerLinkActiveOptions", counterBadgeSize: "counterBadgeSize", noMargin: "noMargin", noLeftMarginForFirstTab: "noLeftMarginForFirstTab", background: "background", disabled: "disabled" }, outputs: { switch: "switch" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentTemplate"], descendants: true, static: true }, { propertyName: "routerLinkActive", first: true, predicate: i3$
|
7083
|
+
TabComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: TabComponent, selector: "lx-tab", inputs: { icon: "icon", label: "label", title: "title", tabLink: "tabLink", counter: "counter", routerLinkActiveOptions: "routerLinkActiveOptions", counterBadgeSize: "counterBadgeSize", noMargin: "noMargin", noLeftMarginForFirstTab: "noLeftMarginForFirstTab", background: "background", disabled: "disabled" }, outputs: { switch: "switch" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentTemplate"], descendants: true, static: true }, { propertyName: "routerLinkActive", first: true, predicate: i3$3.RouterLinkActive, descendants: true }], ngImport: i0__namespace, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge\n *ngIf=\"counter\"\n [size]=\"counterBadgeSize\"\n class=\"lx-margin-left\"\n [content]=\"counter\"\n [color]=\"isActive ? 'darkgray' : 'gray'\"\n ></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{display:inline-block;margin:0 8px;text-align:center;border-bottom:2px solid transparent;transition:border-bottom .5s;cursor:pointer}.tab.active,.tab:hover{border-bottom:2px solid #2a303d;transition:border-bottom .1s;outline:0}.tab.active,.tab.disabled{cursor:default}.tab.disabled{opacity:.3}.tab.active .tabLabel,.tab:hover .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#677a9a;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}"], components: [{ type: BadgeComponent, selector: "lx-badge", inputs: ["content", "size", "color"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$3.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i3__namespace$3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], exportAs: ["routerLinkActive"] }, { type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$2.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
|
6895
7084
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: TabComponent, decorators: [{
|
6896
7085
|
type: i0.Component,
|
6897
7086
|
args: [{
|
@@ -6929,7 +7118,7 @@
|
|
6929
7118
|
args: ['contentTemplate', { static: true }]
|
6930
7119
|
}], routerLinkActive: [{
|
6931
7120
|
type: i0.ViewChild,
|
6932
|
-
args: [i3$
|
7121
|
+
args: [i3$3.RouterLinkActive]
|
6933
7122
|
}] } });
|
6934
7123
|
|
6935
7124
|
var TabGroupComponent = /** @class */ (function () {
|
@@ -6995,7 +7184,7 @@
|
|
6995
7184
|
return TabGroupComponent;
|
6996
7185
|
}());
|
6997
7186
|
TabGroupComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: TabGroupComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
6998
|
-
TabGroupComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: TabGroupComponent, selector: "lx-tab-group", inputs: { isCentered: "isCentered", selectedIndex: "selectedIndex" }, outputs: { indexChange: "indexChange" }, queries: [{ propertyName: "tabsQueryList", predicate: TabComponent }], usesOnChanges: true, ngImport: i0__namespace, template: "<ul class=\"tabs\" role=\"tablist\" [class.centered]=\"isCentered\">\n <ng-content></ng-content>\n</ul>\n\n<ng-template [cdkPortalOutlet]=\"activeTabPortal\"></ng-template>\n", styles: [".tabs{display:inline-block;list-style:none;border-bottom:1px solid #cfd5df;width:100%;margin:0;padding:0}.tabs.centered{text-align:center}"], directives: [{ type: i3__namespace$
|
7187
|
+
TabGroupComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: TabGroupComponent, selector: "lx-tab-group", inputs: { isCentered: "isCentered", selectedIndex: "selectedIndex" }, outputs: { indexChange: "indexChange" }, queries: [{ propertyName: "tabsQueryList", predicate: TabComponent }], usesOnChanges: true, ngImport: i0__namespace, template: "<ul class=\"tabs\" role=\"tablist\" [class.centered]=\"isCentered\">\n <ng-content></ng-content>\n</ul>\n\n<ng-template [cdkPortalOutlet]=\"activeTabPortal\"></ng-template>\n", styles: [".tabs{display:inline-block;list-style:none;border-bottom:1px solid #cfd5df;width:100%;margin:0;padding:0}.tabs.centered{text-align:center}"], directives: [{ type: i3__namespace$2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
|
6999
7188
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: TabGroupComponent, decorators: [{
|
7000
7189
|
type: i0.Component,
|
7001
7190
|
args: [{
|
@@ -7021,13 +7210,13 @@
|
|
7021
7210
|
return LxTabUiModule;
|
7022
7211
|
}());
|
7023
7212
|
LxTabUiModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxTabUiModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
|
7024
|
-
LxTabUiModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxTabUiModule, declarations: [TabGroupComponent, TabComponent], imports: [i3.PortalModule, i2.CommonModule, LxCoreUiModule, i3$
|
7025
|
-
LxTabUiModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxTabUiModule, imports: [[i3.PortalModule, i2.CommonModule, LxCoreUiModule, i3$
|
7213
|
+
LxTabUiModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxTabUiModule, declarations: [TabGroupComponent, TabComponent], imports: [i3.PortalModule, i2.CommonModule, LxCoreUiModule, i3$3.RouterModule], exports: [TabGroupComponent, TabComponent] });
|
7214
|
+
LxTabUiModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxTabUiModule, imports: [[i3.PortalModule, i2.CommonModule, LxCoreUiModule, i3$3.RouterModule]] });
|
7026
7215
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: LxTabUiModule, decorators: [{
|
7027
7216
|
type: i0.NgModule,
|
7028
7217
|
args: [{
|
7029
7218
|
declarations: [TabGroupComponent, TabComponent],
|
7030
|
-
imports: [i3.PortalModule, i2.CommonModule, LxCoreUiModule, i3$
|
7219
|
+
imports: [i3.PortalModule, i2.CommonModule, LxCoreUiModule, i3$3.RouterModule],
|
7031
7220
|
exports: [TabGroupComponent, TabComponent]
|
7032
7221
|
}]
|
7033
7222
|
}] });
|
@@ -7090,6 +7279,7 @@
|
|
7090
7279
|
exports.KeyboardSelectDirective = KeyboardSelectDirective;
|
7091
7280
|
exports.LOCALE_FN = LOCALE_FN;
|
7092
7281
|
exports.LxCoreUiModule = LxCoreUiModule;
|
7282
|
+
exports.LxDragAndDropListModule = LxDragAndDropListModule;
|
7093
7283
|
exports.LxFormsModule = LxFormsModule;
|
7094
7284
|
exports.LxIsUuidPipe = LxIsUuidPipe;
|
7095
7285
|
exports.LxModalModule = LxModalModule;
|