@leanix/components 0.2.244 → 0.2.247
Sign up to get free protection for your applications and to get access to all the features.
- package/esm2020/lib/core-ui/components/badge/badge.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/button/button.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/button-group/button-group.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/card/card.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/collapsible/collapsible.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/colored-label/colored-label.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/ellipsis/ellipsis.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/icon-scale/icon-scale.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/spinner/spinner.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/table/table-header/table-header.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/table/table.component.mjs +3 -3
- package/esm2020/lib/core-ui/components/tiny-spinner/tiny-spinner.component.mjs +3 -3
- package/esm2020/lib/core-ui/core-ui.module.mjs +4 -4
- package/esm2020/lib/core-ui/directives/after-view-init.directive.mjs +3 -3
- package/esm2020/lib/core-ui/directives/autoclose-group.service.mjs +3 -3
- package/esm2020/lib/core-ui/directives/autoclose.directive.mjs +3 -3
- package/esm2020/lib/core-ui/directives/autofocus.directive.mjs +8 -5
- package/esm2020/lib/core-ui/directives/html.directive.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/br.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/contrast-color.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/custom-date.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/highlight-range.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/highlight-term.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/linkify/linkify.pipe.mjs +4 -4
- package/esm2020/lib/core-ui/pipes/linkify/unlinkify.pipe.mjs +4 -4
- package/esm2020/lib/core-ui/pipes/lx-is-uuid.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/lx-time-ago.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/lx-translate.pipe.mjs +4 -4
- package/esm2020/lib/core-ui/pipes/markdown.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/nbsp.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/sort.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/translation-after.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/translation-before.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/translation-between.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/pipes/unescape-curly-braces.pipe.mjs +3 -3
- package/esm2020/lib/core-ui/services/resize-observer.service.mjs +3 -3
- package/esm2020/lib/core-ui/tooltip/tooltip.component.mjs +3 -3
- package/esm2020/lib/core-ui/tooltip/tooltip.directive.mjs +3 -3
- package/esm2020/lib/core-ui/tooltip/tooltip.module.mjs +4 -4
- package/esm2020/lib/forms-ui/components/basic-dropdown/basic-dropdown.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/basic-dropdown-item/basic-dropdown-item.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/cdk-options-dropdown/cdk-options-dropdown.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/cdk-options-sub-dropdown/cdk-options-sub-dropdown.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/currency/currency-input.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/currency/currency-symbol.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/date-input/date-input.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list-item/drag-and-drop-list-item.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.module.mjs +4 -4
- package/esm2020/lib/forms-ui/components/drag-and-drop-list/keyboard-sortable-item/keyboard-sortable-item.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/components/drag-and-drop-list/keyboard-sortable-list/keyboard-sortable-list.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/components/error-message/error-message.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/form-error/form-error.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/icon/icon.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/input/input.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/keyboard-select.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/components/multi-select/multi-select.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/option/option.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/option-group/option-group.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/option-group-dropdown/option-group-dropdown.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/options-dropdown/options-dropdown.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/options-sub-dropdown/options-sub-dropdown.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/picker/picker-trigger.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/components/picker/picker.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/picker-option/picker-option.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/pill-item/pill-item.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/pill-list/pill-list.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/responsive-input/responsive-input.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/single-select/single-select.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/slider-toggle/slider-toggle.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/sorting-dropdown/sorting-dropdown.component.mjs +3 -3
- package/esm2020/lib/forms-ui/components/sorting-dropdown-trigger/sorting-dropdown-trigger.component.mjs +3 -3
- package/esm2020/lib/forms-ui/directives/form-error.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/directives/form-submit.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/directives/keyboard-action-source.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/directives/mark-invalid.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/directives/select-dropdown.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/directives/selectable-item.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/directives/selected-option.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/forms-ui.module.mjs +4 -4
- package/esm2020/lib/forms-ui/models/base-select.directive.mjs +3 -3
- package/esm2020/lib/forms-ui/pipes/filter-selection.pipe.mjs +3 -3
- package/esm2020/lib/forms-ui/pipes/filter-term.pipe.mjs +3 -3
- package/esm2020/lib/forms-ui/pipes/format-number.pipe.mjs +3 -3
- package/esm2020/lib/modal-ui/components/modal/modal.component.mjs +3 -3
- package/esm2020/lib/modal-ui/components/modal-footer/modal-footer.component.mjs +3 -3
- package/esm2020/lib/modal-ui/components/modal-header/modal-header.component.mjs +3 -3
- package/esm2020/lib/modal-ui/directives/modal-content.directive.mjs +3 -3
- package/esm2020/lib/modal-ui/modal.module.mjs +4 -4
- package/esm2020/lib/popover-ui/components/popover/popover.component.mjs +3 -3
- package/esm2020/lib/popover-ui/directives/popover-click.directive.mjs +3 -3
- package/esm2020/lib/popover-ui/directives/popover-content.directive.mjs +3 -3
- package/esm2020/lib/popover-ui/directives/popover-hover.directive.mjs +3 -3
- package/esm2020/lib/popover-ui/popover-ui.module.mjs +4 -4
- package/esm2020/lib/tab-ui/components/tab/tab.component.mjs +3 -3
- package/esm2020/lib/tab-ui/components/tab-group/tab-group.component.mjs +3 -3
- package/esm2020/lib/tab-ui/tab-ui.module.mjs +4 -4
- package/fesm2015/leanix-components.mjs +303 -300
- package/fesm2015/leanix-components.mjs.map +1 -1
- package/fesm2020/leanix-components.mjs +303 -300
- package/fesm2020/leanix-components.mjs.map +1 -1
- package/lib/core-ui/directives/autofocus.directive.d.ts +2 -1
- package/package.json +2 -2
@@ -23,9 +23,9 @@ export class DragAndDropListItemComponent {
|
|
23
23
|
this.element.nativeElement.focus();
|
24
24
|
}
|
25
25
|
}
|
26
|
-
DragAndDropListItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
27
|
-
DragAndDropListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
28
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
26
|
+
DragAndDropListItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DragAndDropListItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
27
|
+
DragAndDropListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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, 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}.left-button-container,.action-buttons-wrapper{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}\n"], components: [{ type: i1.ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
28
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DragAndDropListItemComponent, decorators: [{
|
29
29
|
type: Component,
|
30
30
|
args: [{ selector: 'lx-drag-and-drop-list-item', changeDetection: ChangeDetectionStrategy.OnPush, 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}.left-button-container,.action-buttons-wrapper{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}\n"] }]
|
31
31
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { item: [{
|
@@ -69,9 +69,9 @@ export class DragAndDropListComponent {
|
|
69
69
|
return item.item;
|
70
70
|
}
|
71
71
|
}
|
72
|
-
DragAndDropListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
73
|
-
DragAndDropListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
74
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
72
|
+
DragAndDropListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DragAndDropListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
73
|
+
DragAndDropListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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, 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: ["@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:solid 1px #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:solid 1px #99a5bb!important;box-shadow:0 3px 4px #7474744d}.cdk-drag-placeholder{opacity:.5}.cdk-drag-placeholder i{opacity:0}.cdk-drag-animating{transition:transform .18s;transition-delay:0s;transition-timing-function:ease}.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] .list,:host[color=dark] .item{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 #b2bccc;z-index:1}\n"], components: [{ type: i1.DragAndDropListItemComponent, selector: "lx-drag-and-drop-list-item", inputs: ["item", "draggable", "actions"], outputs: ["action"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i4.KeyboardSortableListDirective, selector: "[lxKeyboardSortableList]", inputs: ["keyboardSortableItems"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i5.KeyboardSortableItemDirective, selector: "[lxKeyboardSortableItem]", inputs: ["lxKeyboardSortableItem", "lxKeyboardItemData", "isSortingByKeyboard", "lxKeyboardItemBeingSorted"], outputs: ["isSortingByKeyboardChange", "lxKeyboardItemBeingSortedChange", "sortItemsWithKeyboard", "focusWithKeyboard"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "translate": i6.TranslatePipe, "async": i2.AsyncPipe } });
|
74
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DragAndDropListComponent, decorators: [{
|
75
75
|
type: Component,
|
76
76
|
args: [{ selector: 'lx-drag-and-drop-list', 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: ["@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:solid 1px #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:solid 1px #99a5bb!important;box-shadow:0 3px 4px #7474744d}.cdk-drag-placeholder{opacity:.5}.cdk-drag-placeholder i{opacity:0}.cdk-drag-animating{transition:transform .18s;transition-delay:0s;transition-timing-function:ease}.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] .list,:host[color=dark] .item{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 #b2bccc;z-index:1}\n"] }]
|
77
77
|
}], propDecorators: { label: [{
|
@@ -11,10 +11,10 @@ import * as i0 from "@angular/core";
|
|
11
11
|
import * as i1 from "@ngx-translate/core";
|
12
12
|
export class LxDragAndDropListModule {
|
13
13
|
}
|
14
|
-
LxDragAndDropListModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
15
|
-
LxDragAndDropListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2
|
16
|
-
LxDragAndDropListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2
|
17
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
14
|
+
LxDragAndDropListModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: LxDragAndDropListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
15
|
+
LxDragAndDropListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: LxDragAndDropListModule, declarations: [KeyboardSortableItemDirective, KeyboardSortableListDirective, DragAndDropListComponent, DragAndDropListItemComponent], imports: [CommonModule, DragDropModule, LxCoreUiModule, i1.TranslateModule], exports: [DragAndDropListComponent, DragAndDropListItemComponent] });
|
16
|
+
LxDragAndDropListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: LxDragAndDropListModule, imports: [[CommonModule, DragDropModule, LxCoreUiModule, TranslateModule.forChild()]] });
|
17
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: LxDragAndDropListModule, decorators: [{
|
18
18
|
type: NgModule,
|
19
19
|
args: [{
|
20
20
|
declarations: [KeyboardSortableItemDirective, KeyboardSortableListDirective, DragAndDropListComponent, DragAndDropListItemComponent],
|
@@ -75,9 +75,9 @@ export class KeyboardSortableItemDirective {
|
|
75
75
|
}
|
76
76
|
}
|
77
77
|
}
|
78
|
-
KeyboardSortableItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
79
|
-
KeyboardSortableItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2
|
80
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
78
|
+
KeyboardSortableItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: KeyboardSortableItemDirective, deps: [{ token: i1.CdkDrag }, { token: i2.OverlayPositionBuilder }, { token: i0.ElementRef }, { token: i2.Overlay }], target: i0.ɵɵFactoryTarget.Directive });
|
79
|
+
KeyboardSortableItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.2", 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 });
|
80
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: KeyboardSortableItemDirective, decorators: [{
|
81
81
|
type: Directive,
|
82
82
|
args: [{
|
83
83
|
selector: '[lxKeyboardSortableItem]'
|
@@ -21,12 +21,12 @@ export class KeyboardSortableListDirective {
|
|
21
21
|
});
|
22
22
|
}
|
23
23
|
}
|
24
|
-
KeyboardSortableListDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
25
|
-
KeyboardSortableListDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2
|
24
|
+
KeyboardSortableListDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: KeyboardSortableListDirective, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Directive });
|
25
|
+
KeyboardSortableListDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.2", type: KeyboardSortableListDirective, selector: "[lxKeyboardSortableList]", inputs: { keyboardSortableItems: "keyboardSortableItems" }, ngImport: i0 });
|
26
26
|
__decorate([
|
27
27
|
Observe('keyboardSortableItems')
|
28
28
|
], KeyboardSortableListDirective.prototype, "keyboardSortableItems$", void 0);
|
29
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
29
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: KeyboardSortableListDirective, decorators: [{
|
30
30
|
type: Directive,
|
31
31
|
args: [{
|
32
32
|
selector: '[lxKeyboardSortableList]'
|
@@ -13,9 +13,9 @@ export class ErrorMessageComponent {
|
|
13
13
|
}
|
14
14
|
}
|
15
15
|
}
|
16
|
-
ErrorMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
17
|
-
ErrorMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
18
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
16
|
+
ErrorMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: ErrorMessageComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
17
|
+
ErrorMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: ErrorMessageComponent, selector: "lx-error-message", inputs: { key: "key" }, ngImport: i0, template: `<div class="error" *ngIf="_key">{{ _key | translate }}</div>`, isInline: true, styles: [".error{color:#f96464;padding:4px}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i2.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
18
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: ErrorMessageComponent, decorators: [{
|
19
19
|
type: Component,
|
20
20
|
args: [{ selector: 'lx-error-message', template: `<div class="error" *ngIf="_key">{{ _key | translate }}</div>`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".error{color:#f96464;padding:4px}\n"] }]
|
21
21
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { key: [{
|
@@ -25,9 +25,9 @@ export class FormErrorComponent {
|
|
25
25
|
return [];
|
26
26
|
}
|
27
27
|
}
|
28
|
-
FormErrorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
29
|
-
FormErrorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
30
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
28
|
+
FormErrorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: FormErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
29
|
+
FormErrorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: FormErrorComponent, selector: "lx-form-error", inputs: { namespace: "namespace", form: "form", controlName: "controlName" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"error\" *ngFor=\"let key of translationKeys\">\n {{ key | translate }}\n</div>\n", styles: [".error{color:#f96464;padding:4px}\n"], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i2.TranslatePipe } });
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: FormErrorComponent, decorators: [{
|
31
31
|
type: Component,
|
32
32
|
args: [{ selector: 'lx-form-error', template: "<div class=\"error\" *ngFor=\"let key of translationKeys\">\n {{ key | translate }}\n</div>\n", styles: [".error{color:#f96464;padding:4px}\n"] }]
|
33
33
|
}], propDecorators: { namespace: [{
|
@@ -22,9 +22,9 @@ export class IconComponent {
|
|
22
22
|
}
|
23
23
|
}
|
24
24
|
}
|
25
|
-
IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
26
|
-
IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
27
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
25
|
+
IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
26
|
+
IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: IconComponent, selector: "lx-icon", inputs: { name: "name", color: "color", fontAwsomeStyle: "fontAwsomeStyle", size: "size", title: "title" }, host: { properties: { "style.height": "this.size" } }, usesOnChanges: true, ngImport: i0, template: "<i [attr.title]=\"title\" [class]=\"iconStyle + ' fa-' + name\" [style.color]=\"color\" [style.fontSize]=\"size\"></i>\n", styles: [":host{display:inline-block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
27
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: IconComponent, decorators: [{
|
28
28
|
type: Component,
|
29
29
|
args: [{ selector: 'lx-icon', changeDetection: ChangeDetectionStrategy.OnPush, template: "<i [attr.title]=\"title\" [class]=\"iconStyle + ' fa-' + name\" [style.color]=\"color\" [style.fontSize]=\"size\"></i>\n", styles: [":host{display:inline-block}\n"] }]
|
30
30
|
}], propDecorators: { name: [{
|
@@ -23,9 +23,9 @@ export class InputComponent {
|
|
23
23
|
this.destory$.next();
|
24
24
|
}
|
25
25
|
}
|
26
|
-
InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
27
|
-
InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
28
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
26
|
+
InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: InputComponent, deps: [{ token: i1.NgControl, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
27
|
+
InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: InputComponent, selector: "input[lx-input]", inputs: { error: "error", disabled: "disabled" }, host: { properties: { "class.error": "this.error", "class.disabled": "this.disabled" } }, ngImport: i0, template: ``, isInline: true, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#677a9a}\n"] });
|
28
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: InputComponent, decorators: [{
|
29
29
|
type: Component,
|
30
30
|
args: [{ selector: 'input[lx-input]', template: ``, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#677a9a}\n"] }]
|
31
31
|
}], ctorParameters: function () { return [{ type: i1.NgControl, decorators: [{
|
@@ -98,9 +98,9 @@ export class KeyboardSelectDirective {
|
|
98
98
|
this.destroyed$.next();
|
99
99
|
}
|
100
100
|
}
|
101
|
-
KeyboardSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
102
|
-
KeyboardSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2
|
103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
101
|
+
KeyboardSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: KeyboardSelectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
102
|
+
KeyboardSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.2", type: KeyboardSelectDirective, inputs: { keyboardSelectAction: "keyboardSelectAction" }, outputs: { selectedItemIndexChange: "selectedItemIndexChange" }, viewQueries: [{ propertyName: "keyboardSelectContainer", first: true, predicate: ["keyboardSelectContainer"], descendants: true, static: true }, { propertyName: "_items", predicate: SelectableItemDirective, descendants: true }], ngImport: i0 });
|
103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: KeyboardSelectDirective, decorators: [{
|
104
104
|
type: Directive
|
105
105
|
}], propDecorators: { keyboardSelectAction: [{
|
106
106
|
type: Input
|
@@ -209,15 +209,15 @@ export class MultiSelectComponent extends BaseSelectDirective {
|
|
209
209
|
this.disabled = isDisabled;
|
210
210
|
}
|
211
211
|
}
|
212
|
-
MultiSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
213
|
-
MultiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
212
|
+
MultiSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: MultiSelectComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
213
|
+
MultiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: MultiSelectComponent, selector: "lx-multi-select", inputs: { markInvalid: "markInvalid", selection: "selection", size: "size", dropdownWidthScale: "dropdownWidthScale" }, outputs: { selectionChange: "selectionChange", blur: "blur" }, providers: [
|
214
214
|
{
|
215
215
|
provide: NG_VALUE_ACCESSOR,
|
216
216
|
useExisting: forwardRef(() => MultiSelectComponent),
|
217
217
|
multi: true
|
218
218
|
}
|
219
219
|
], queries: [{ propertyName: "explicitDropdown", first: true, predicate: SelectDropdownDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "queryInput", first: true, predicate: ResponsiveInputComponent, descendants: true, static: true }, { propertyName: "implicitDropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"dropdownOpen\" class=\"backdrop\" (click)=\"handleBackdropClick($event)\"></div>\n<div\n [lxMarkInvalid]=\"markInvalid\"\n class=\"selectContainer\"\n [class.open]=\"dropdownOpen\"\n [class.top]=\"(dropdownDirection$ | async) === 'TOP'\"\n [class.bottom]=\"(dropdownDirection$ | async) === 'BOTTOM'\"\n [class.focused]=\"isInputFocused\"\n [class.hasSelection]=\"selection && selection.length > 0\"\n [class.smallSize]=\"size === 'small'\"\n [class.disabled]=\"disabled\"\n (click)=\"handleClick($event.target === toggle)\"\n>\n <div class=\"selectedChoicesContainer\">\n <div *ngIf=\"(selection?.length === 0 || !selection) && !queryControl?.value\" class=\"placeholder\" [attr.title]=\"placeholder\">\n {{ placeholder }}\n </div>\n <div class=\"selection\">\n <ng-content select=\".pills\"></ng-content>\n </div>\n <lx-responsive-input\n (focus)=\"isInputFocused = true\"\n (blur)=\"isInputFocused = false; blur.emit()\"\n [formControl]=\"queryControl\"\n (keydown.enter)=\"$event.preventDefault()\"\n ></lx-responsive-input>\n <i #toggle [hidden]=\"disabled\" class=\"fas fa-angle-down\" aria-hidden=\"true\"></i>\n </div>\n <div class=\"optionsContainer\" [style.width]=\"dropdownWidth\" #optionsContainer>\n <ng-container *ngIf=\"dropdownOpen\">\n <ng-container *ngTemplateOutlet=\"dropdownTmpl\"></ng-container>\n </ng-container>\n </div>\n</div>\n\n<ng-template #dropdown>\n <ng-content select=\".dropdownComponent\"></ng-content>\n</ng-template>\n", styles: [".selectContainer{position:relative;height:auto;cursor:text;padding:0;box-sizing:border-box;border:1px solid #99a5bb;box-shadow:inset 0 1px 1px #00000012;border-radius:3px;background:white}.selectContainer.smallSize .selectedChoicesContainer{min-height:22px}.selectContainer.smallSize .selectedChoicesContainer .placeholder{line-height:24px}.selectContainer.smallSize lx-responsive-input{height:22px}.selectContainer.disabled{background-color:#eaedf1;cursor:not-allowed}.selectContainer.disabled lx-responsive-input{display:none}.selectContainer:not(.hasSelection){padding-left:12px}.selectContainer.open{z-index:1049;background:#fff;border:1px solid #e1e5eb}.selectContainer.open.bottom{box-shadow:0 6px 6px #21252933;border-bottom-color:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0}.selectContainer.open.bottom .optionsContainer{border-bottom:solid 1px #e1e5eb;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;box-shadow:0 6px 6px #21252933;top:100%;border-top:0;margin-top:0}.selectContainer.open.top{box-shadow:0 -4px 6px #21252933;border-top-left-radius:0;border-top-right-radius:0}.selectContainer.open.top .optionsContainer{border-bottom:solid 1px #e1e5eb;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;box-shadow:0 -4px 6px #21252933;margin-bottom:0;border-bottom:0;top:none;bottom:100%}.selectContainer:not(.open).focused{outline:0;border:1px solid #5599ff}.selectContainer .selectedChoicesContainer{padding-right:25px;min-height:29px}.selectContainer .selectedChoicesContainer .placeholder{position:absolute;left:12px;right:25px;top:0;bottom:0;line-height:29px;color:#8594ad;overflow:hidden;word-break:break-all;white-space:nowrap;text-overflow:ellipsis;padding-left:4px}.selectContainer .selectedChoicesContainer>.fa-angle-down{position:absolute;right:10px;top:50%;transform:translateY(-50%);cursor:pointer}.selectContainer .selection{display:inline;cursor:default}.selectContainer .optionsContainer{position:absolute;left:-1px;right:-1px;padding:0;background:white;z-index:1}lx-responsive-input{height:29px;padding-left:4px}.backdrop{z-index:1048;position:fixed;top:0;bottom:0;left:0;right:0}\n"], components: [{ type: i1.ResponsiveInputComponent, selector: "lx-responsive-input", outputs: ["focus", "blur"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MarkInvalidDirective, selector: "[lxMarkInvalid]", inputs: ["lxMarkInvalid"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i2.AsyncPipe } });
|
220
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
220
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: MultiSelectComponent, decorators: [{
|
221
221
|
type: Component,
|
222
222
|
args: [{ selector: 'lx-multi-select', providers: [
|
223
223
|
{
|
@@ -48,9 +48,9 @@ export class OptionComponent {
|
|
48
48
|
this.highlight.emit(this.isHighlighted);
|
49
49
|
}
|
50
50
|
}
|
51
|
-
OptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
52
|
-
OptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
53
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
51
|
+
OptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionComponent, deps: [{ token: forwardRef(() => OptionGroupComponent), optional: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
52
|
+
OptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: OptionComponent, selector: "lx-option", inputs: { selected: "selected", isHighlighted: "isHighlighted", disabled: "disabled", value: "value", hasSelectedState: "hasSelectedState" }, outputs: { select: "select", highlight: "highlight", selectedClick: "selectedClick" }, host: { listeners: { "click": "selectOption($event)" } }, ngImport: i0, template: "<li\n class=\"option\"\n [class.selectedState]=\"hasSelectedState && !hasSubdropdown\"\n [class.highlighted]=\"isHighlighted\"\n [class.selected]=\"selected\"\n [class.disabled]=\"disabled\"\n [class.hasSubdropdown]=\"hasSubdropdown\"\n>\n <i *ngIf=\"hasSelectedState && selected\" class=\"far fa-check\"></i>\n <ng-content></ng-content>\n <i *ngIf=\"hasSubdropdown\" class=\"far fa-chevron-right\"></i>\n</li>\n", styles: [":host{display:block}.option{line-height:23px;padding:4px 12px;cursor:pointer;color:#2a303d}.option:hover{background-color:#e1e5eb}.option.selectedState{padding-left:28px}.option.selected{cursor:default;color:var(--lx-primarybutton-backgroundcolor)}.option.highlighted{background:#eaedf1}.option.disabled{opacity:.6}.option.hasSubdropdown{padding-right:28px}.fa-check{line-height:23px;position:absolute;left:8px}.fa-chevron-right{line-height:23px;position:absolute;right:8px;font-size:8px}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
53
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionComponent, decorators: [{
|
54
54
|
type: Component,
|
55
55
|
args: [{ selector: 'lx-option', template: "<li\n class=\"option\"\n [class.selectedState]=\"hasSelectedState && !hasSubdropdown\"\n [class.highlighted]=\"isHighlighted\"\n [class.selected]=\"selected\"\n [class.disabled]=\"disabled\"\n [class.hasSubdropdown]=\"hasSubdropdown\"\n>\n <i *ngIf=\"hasSelectedState && selected\" class=\"far fa-check\"></i>\n <ng-content></ng-content>\n <i *ngIf=\"hasSubdropdown\" class=\"far fa-chevron-right\"></i>\n</li>\n", styles: [":host{display:block}.option{line-height:23px;padding:4px 12px;cursor:pointer;color:#2a303d}.option:hover{background-color:#e1e5eb}.option.selectedState{padding-left:28px}.option.selected{cursor:default;color:var(--lx-primarybutton-backgroundcolor)}.option.highlighted{background:#eaedf1}.option.disabled{opacity:.6}.option.hasSubdropdown{padding-right:28px}.fa-check{line-height:23px;position:absolute;left:8px}.fa-chevron-right{line-height:23px;position:absolute;right:8px;font-size:8px}\n"] }]
|
56
56
|
}], ctorParameters: function () { return [{ type: i2.OptionGroupComponent, decorators: [{
|
@@ -14,9 +14,9 @@ export class OptionGroupComponent {
|
|
14
14
|
this.select.emit(value);
|
15
15
|
}
|
16
16
|
}
|
17
|
-
OptionGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
18
|
-
OptionGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
19
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
17
|
+
OptionGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
18
|
+
OptionGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: OptionGroupComponent, selector: "lx-option-group", inputs: { hasSelectedState: "hasSelectedState", label: "label" }, outputs: { select: "select" }, ngImport: i0, template: "<li>\n <span *ngIf=\"label\" class=\"groupLabel\" [class.selectedState]=\"hasSelectedState\">{{ label }}</span>\n <ul>\n <ng-content></ng-content>\n </ul>\n</li>\n", styles: [":host{display:block}:host:not(:first-child){border-top:solid 1px #eaedf1}ul{list-style:none;margin:0;padding-left:0}.groupLabel{display:block;line-height:23px;padding:4px 12px;color:#99a5bb;letter-spacing:.5px;font-weight:700;text-transform:uppercase}.groupLabel.selectedState{padding-left:28px}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
19
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionGroupComponent, decorators: [{
|
20
20
|
type: Component,
|
21
21
|
args: [{ selector: 'lx-option-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li>\n <span *ngIf=\"label\" class=\"groupLabel\" [class.selectedState]=\"hasSelectedState\">{{ label }}</span>\n <ul>\n <ng-content></ng-content>\n </ul>\n</li>\n", styles: [":host{display:block}:host:not(:first-child){border-top:solid 1px #eaedf1}ul{list-style:none;margin:0;padding-left:0}.groupLabel{display:block;line-height:23px;padding:4px 12px;color:#99a5bb;letter-spacing:.5px;font-weight:700;text-transform:uppercase}.groupLabel.selectedState{padding-left:28px}\n"] }]
|
22
22
|
}], propDecorators: { hasSelectedState: [{
|
package/esm2020/lib/forms-ui/components/option-group-dropdown/option-group-dropdown.component.mjs
CHANGED
@@ -63,9 +63,9 @@ export class OptionGroupDropdownComponent extends KeyboardSelectDirective {
|
|
63
63
|
return option.value;
|
64
64
|
}
|
65
65
|
}
|
66
|
-
OptionGroupDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
67
|
-
OptionGroupDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
68
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
66
|
+
OptionGroupDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionGroupDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
67
|
+
OptionGroupDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: OptionGroupDropdownComponent, selector: "lx-option-group-dropdown", inputs: { optionGroups: "optionGroups", newOptionLabel: "newOptionLabel", highlightTerm: "highlightTerm", showCreateNewOption: "showCreateNewOption", labelKey: "labelKey", loading: "loading", trackByProperty: "trackByProperty", showNoResultsIfGroupIsEmpty: "showNoResultsIfGroupIsEmpty" }, outputs: { onItemSelected: "onItemSelected", containerScrolled: "containerScrolled", createNewOption: "createNewOption" }, queries: [{ propertyName: "optionTemplateRef", first: true, predicate: ["optionTemplate"], descendants: true }, { propertyName: "noResultsOptionTemplateRef", first: true, predicate: ["noResultsOptionTemplateRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n #keyboardSelectContainer\n class=\"scrollingPanel lxThinScrollbar\"\n infinite-scroll\n [scrollWindow]=\"false\"\n [fromRoot]=\"true\"\n (scrolled)=\"containerScrolled.emit()\"\n>\n <ul class=\"options\">\n <li\n *ngIf=\"showCreateNewOption && newOptionLabel && isNewItem\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n (click)=\"onCreateNewOption()\"\n (select)=\"onCreateNewOption()\"\n [class.highlighted]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n class=\"option\"\n >\n <span class=\"newEntryContent\">\n {{ newOptionLabel }}\n </span>\n <lx-badge class=\"lx-margin-left\" size=\"small\" [content]=\"'common.new' | translate | uppercase\"></lx-badge>\n </li>\n <ng-container *ngFor=\"let optionGroup of optionGroups; let groupIndex = index; trackBy: trackByLabel\">\n <li>\n <div class=\"groupLabel\" *ngIf=\"optionGroup.label\">\n <span>{{ optionGroup.label | uppercase }}</span>\n </div>\n <ul>\n <ng-container *ngIf=\"showNoResultsIfGroupIsEmpty && optionGroup.options.length === 0; else options\">\n <li class=\"noResult\">\n <ng-container *ngIf=\"noResultsOptionTemplateRef; else defaultText\">\n <ng-container\n *ngTemplateOutlet=\"noResultsOptionTemplateRef; context: { group: optionGroup, groupIndex: groupIndex }\"\n ></ng-container>\n </ng-container>\n <ng-template #defaultText>\n <span>{{ NAME + '.noResults' | translate }}</span>\n </ng-template>\n </li>\n </ng-container>\n <ng-template #options>\n <li\n *ngFor=\"let option of optionGroup.options; let index = index; trackBy: trackByValue\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n class=\"option\"\n (click)=\"selectOption(option)\"\n (select)=\"selectOption(option)\"\n [class.highlighted]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n >\n <ng-container *ngIf=\"optionTemplateRef; else basicDropdownOption\">\n <ng-container\n *ngTemplateOutlet=\"optionTemplateRef; context: { $implicit: option, index: index, groupIndex: groupIndex }\"\n ></ng-container>\n </ng-container>\n <ng-template #basicDropdownOption>\n <lx-basic-dropdown-item\n [label]=\"option.label\"\n labelFontWeight=\"normal\"\n [highlightTerm]=\"highlightTerm\"\n ></lx-basic-dropdown-item>\n </ng-template>\n </li>\n </ng-template>\n </ul>\n </li>\n </ng-container>\n <lx-spinner *ngIf=\"loading\" [fadeBackground]=\"true\"></lx-spinner>\n </ul>\n</div>\n", styles: [":host{display:block}.scrollingPanel{overflow-y:auto;max-height:400px}.groupLabel{line-height:23px;padding:4px 12px;color:#99a5bb;letter-spacing:.5px;font-weight:700;text-transform:uppercase;cursor:default}ul{list-style:none;margin:0;padding:0}ul:not(:last-child){border-bottom:solid 1px #eaedf1}.noResult{display:block;padding:4px 12px}.option{cursor:pointer;display:block;padding:4px 12px}.option:hover{background-color:#e1e5eb!important}.option.highlighted{background:#eaedf1}\n"], components: [{ type: i1.BadgeComponent, selector: "lx-badge", inputs: ["content", "size", "color"] }, { type: i2.BasicDropdownItemComponent, selector: "lx-basic-dropdown-item", inputs: ["label", "description", "highlightTerm", "labelFontWeight", "descriptionFontStyle"] }, { type: i3.SpinnerComponent, selector: "lx-spinner", inputs: ["fadeBackground"] }], directives: [{ type: i4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i5.AsyncPipe, "uppercase": i5.UpperCasePipe, "translate": i7.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
68
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionGroupDropdownComponent, decorators: [{
|
69
69
|
type: Component,
|
70
70
|
args: [{ selector: 'lx-option-group-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n #keyboardSelectContainer\n class=\"scrollingPanel lxThinScrollbar\"\n infinite-scroll\n [scrollWindow]=\"false\"\n [fromRoot]=\"true\"\n (scrolled)=\"containerScrolled.emit()\"\n>\n <ul class=\"options\">\n <li\n *ngIf=\"showCreateNewOption && newOptionLabel && isNewItem\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n (click)=\"onCreateNewOption()\"\n (select)=\"onCreateNewOption()\"\n [class.highlighted]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n class=\"option\"\n >\n <span class=\"newEntryContent\">\n {{ newOptionLabel }}\n </span>\n <lx-badge class=\"lx-margin-left\" size=\"small\" [content]=\"'common.new' | translate | uppercase\"></lx-badge>\n </li>\n <ng-container *ngFor=\"let optionGroup of optionGroups; let groupIndex = index; trackBy: trackByLabel\">\n <li>\n <div class=\"groupLabel\" *ngIf=\"optionGroup.label\">\n <span>{{ optionGroup.label | uppercase }}</span>\n </div>\n <ul>\n <ng-container *ngIf=\"showNoResultsIfGroupIsEmpty && optionGroup.options.length === 0; else options\">\n <li class=\"noResult\">\n <ng-container *ngIf=\"noResultsOptionTemplateRef; else defaultText\">\n <ng-container\n *ngTemplateOutlet=\"noResultsOptionTemplateRef; context: { group: optionGroup, groupIndex: groupIndex }\"\n ></ng-container>\n </ng-container>\n <ng-template #defaultText>\n <span>{{ NAME + '.noResults' | translate }}</span>\n </ng-template>\n </li>\n </ng-container>\n <ng-template #options>\n <li\n *ngFor=\"let option of optionGroup.options; let index = index; trackBy: trackByValue\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n class=\"option\"\n (click)=\"selectOption(option)\"\n (select)=\"selectOption(option)\"\n [class.highlighted]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n >\n <ng-container *ngIf=\"optionTemplateRef; else basicDropdownOption\">\n <ng-container\n *ngTemplateOutlet=\"optionTemplateRef; context: { $implicit: option, index: index, groupIndex: groupIndex }\"\n ></ng-container>\n </ng-container>\n <ng-template #basicDropdownOption>\n <lx-basic-dropdown-item\n [label]=\"option.label\"\n labelFontWeight=\"normal\"\n [highlightTerm]=\"highlightTerm\"\n ></lx-basic-dropdown-item>\n </ng-template>\n </li>\n </ng-template>\n </ul>\n </li>\n </ng-container>\n <lx-spinner *ngIf=\"loading\" [fadeBackground]=\"true\"></lx-spinner>\n </ul>\n</div>\n", styles: [":host{display:block}.scrollingPanel{overflow-y:auto;max-height:400px}.groupLabel{line-height:23px;padding:4px 12px;color:#99a5bb;letter-spacing:.5px;font-weight:700;text-transform:uppercase;cursor:default}ul{list-style:none;margin:0;padding:0}ul:not(:last-child){border-bottom:solid 1px #eaedf1}.noResult{display:block;padding:4px 12px}.option{cursor:pointer;display:block;padding:4px 12px}.option:hover{background-color:#e1e5eb!important}.option.highlighted{background:#eaedf1}\n"] }]
|
71
71
|
}], propDecorators: { optionGroups: [{
|
@@ -138,9 +138,9 @@ export class OptionsDropdownComponent {
|
|
138
138
|
return !option.disabled && (isToplevelOptionAndAllowed || isSecondlevelOptionAndAllowed);
|
139
139
|
}
|
140
140
|
}
|
141
|
-
OptionsDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
142
|
-
OptionsDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
143
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
141
|
+
OptionsDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionsDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
142
|
+
OptionsDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: OptionsDropdownComponent, selector: "lx-options-dropdown", inputs: { align: "align", closeOnScroll: "closeOnScroll", disabled: "disabled", maxHeight: "maxHeight", closeOnSelect: "closeOnSelect" }, queries: [{ propertyName: "trigger", first: true, predicate: KeyboardActionSourceDirective, descendants: true }, { propertyName: "_options", predicate: OptionComponent, descendants: true }], ngImport: i0, template: "<div (click)=\"open = !open\" class=\"triggerContainer\">\n <ng-content select=\"[lxKeyboardActionSource]\"></ng-content>\n</div>\n<ul\n *ngIf=\"open\"\n [class.left]=\"align === 'left'\"\n [class.showScrollbar]=\"maxHeight !== 'none'\"\n [style.max-height]=\"maxHeight\"\n lxAutoclose\n (autoclose)=\"closeDropdown()\"\n>\n <ng-content></ng-content>\n</ul>\n", styles: [":host{display:inline-block;position:relative}ul{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;text-align:left;list-style:none;margin:0;padding-left:0;z-index:20;white-space:nowrap}ul::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}ul::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}ul::-webkit-scrollbar-track-piece{background-color:transparent}ul.left{right:0;padding-right:0}ul.showScrollbar{overflow-y:auto}.triggerContainer{display:inline-block}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
143
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionsDropdownComponent, decorators: [{
|
144
144
|
type: Component,
|
145
145
|
args: [{ selector: 'lx-options-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div (click)=\"open = !open\" class=\"triggerContainer\">\n <ng-content select=\"[lxKeyboardActionSource]\"></ng-content>\n</div>\n<ul\n *ngIf=\"open\"\n [class.left]=\"align === 'left'\"\n [class.showScrollbar]=\"maxHeight !== 'none'\"\n [style.max-height]=\"maxHeight\"\n lxAutoclose\n (autoclose)=\"closeDropdown()\"\n>\n <ng-content></ng-content>\n</ul>\n", styles: [":host{display:inline-block;position:relative}ul{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;text-align:left;list-style:none;margin:0;padding-left:0;z-index:20;white-space:nowrap}ul::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}ul::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}ul::-webkit-scrollbar-track-piece{background-color:transparent}ul.left{right:0;padding-right:0}ul.showScrollbar{overflow-y:auto}.triggerContainer{display:inline-block}\n"] }]
|
146
146
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { align: [{
|
package/esm2020/lib/forms-ui/components/options-sub-dropdown/options-sub-dropdown.component.mjs
CHANGED
@@ -67,9 +67,9 @@ export class OptionsSubDropdownComponent {
|
|
67
67
|
this.hidden = true;
|
68
68
|
}
|
69
69
|
}
|
70
|
-
OptionsSubDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
71
|
-
OptionsSubDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
72
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
70
|
+
OptionsSubDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionsSubDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
71
|
+
OptionsSubDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: OptionsSubDropdownComponent, selector: "lx-options-sub-dropdown", inputs: { trigger: "trigger", align: "align" }, host: { listeners: { "mouseenter": "mouseenter()", "mouseleave": "mouseleave()" }, properties: { "class.hidden": "this.hidden" } }, queries: [{ propertyName: "options", predicate: OptionComponent, descendants: true }], ngImport: i0, template: "<div #spacingContainer class=\"spacingContainer\" [class.left]=\"align === 'left'\">\n <ul\n #subDropdown\n class=\"sub-dropdown\"\n lxAutoclose\n [class.showScrollbar]=\"(maxHeight$ | async) !== 'none'\"\n [style.max-height]=\"(maxHeight$ | async) ?? 'none'\"\n (autoclose)=\"closeDropdown()\"\n >\n <ng-content></ng-content>\n </ul>\n</div>\n", styles: [":host{display:block}:host.hidden{display:none}.spacingContainer{position:absolute;left:100%;transform:translateY(-32px);padding:0 0 0 4px}.spacingContainer.left{left:auto;right:100%;padding:0 4px 0 0}.sub-dropdown{position:relative;padding:0;background-color:#fff;border:solid 1px #e1e5eb;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;text-align:left;list-style:none}.sub-dropdown::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}.sub-dropdown::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}.sub-dropdown::-webkit-scrollbar-track-piece{background-color:transparent}.sub-dropdown.showScrollbar{overflow-y:auto}\n"], directives: [{ type: i1.AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }], pipes: { "async": i2.AsyncPipe } });
|
72
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: OptionsSubDropdownComponent, decorators: [{
|
73
73
|
type: Component,
|
74
74
|
args: [{ selector: 'lx-options-sub-dropdown', template: "<div #spacingContainer class=\"spacingContainer\" [class.left]=\"align === 'left'\">\n <ul\n #subDropdown\n class=\"sub-dropdown\"\n lxAutoclose\n [class.showScrollbar]=\"(maxHeight$ | async) !== 'none'\"\n [style.max-height]=\"(maxHeight$ | async) ?? 'none'\"\n (autoclose)=\"closeDropdown()\"\n >\n <ng-content></ng-content>\n </ul>\n</div>\n", styles: [":host{display:block}:host.hidden{display:none}.spacingContainer{position:absolute;left:100%;transform:translateY(-32px);padding:0 0 0 4px}.spacingContainer.left{left:auto;right:100%;padding:0 4px 0 0}.sub-dropdown{position:relative;padding:0;background-color:#fff;border:solid 1px #e1e5eb;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;text-align:left;list-style:none}.sub-dropdown::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}.sub-dropdown::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}.sub-dropdown::-webkit-scrollbar-track-piece{background-color:transparent}.sub-dropdown.showScrollbar{overflow-y:auto}\n"] }]
|
75
75
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { trigger: [{
|
@@ -25,9 +25,9 @@ export class PickerTriggerDirective {
|
|
25
25
|
this.destroyed$.next();
|
26
26
|
}
|
27
27
|
}
|
28
|
-
PickerTriggerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
29
|
-
PickerTriggerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2
|
30
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
28
|
+
PickerTriggerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PickerTriggerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
29
|
+
PickerTriggerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.2", type: PickerTriggerDirective, selector: "[lxPickerTrigger]", ngImport: i0 });
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PickerTriggerDirective, decorators: [{
|
31
31
|
type: Directive,
|
32
32
|
args: [{
|
33
33
|
selector: '[lxPickerTrigger]'
|
@@ -165,15 +165,15 @@ export class PickerComponent {
|
|
165
165
|
propagateChange(_value) { }
|
166
166
|
onTouched() { }
|
167
167
|
}
|
168
|
-
PickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
169
|
-
PickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
168
|
+
PickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PickerComponent, deps: [{ token: i1.Directionality }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
169
|
+
PickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: PickerComponent, selector: "lx-picker", inputs: { listBoxAriaLabel: "listBoxAriaLabel", listBoxAriaLabelledBy: "listBoxAriaLabelledBy", openDirection: "openDirection" }, host: { listeners: { "document:keydown": "manageKeyboardEvents($event)" } }, providers: [
|
170
170
|
{
|
171
171
|
provide: NG_VALUE_ACCESSOR,
|
172
172
|
multi: true,
|
173
173
|
useExisting: forwardRef(() => PickerComponent)
|
174
174
|
}
|
175
175
|
], queries: [{ propertyName: "_trigger", first: true, predicate: PickerTriggerDirective, descendants: true }, { propertyName: "options", predicate: PickerOptionComponent }], ngImport: i0, template: "<div class=\"pickerContainer\">\n <ng-content select=\"[lxPickerTrigger]\"></ng-content>\n <ul\n class=\"pickerOptions\"\n *ngIf=\"open\"\n lxAutoclose\n (autoclose)=\"closePicker()\"\n role=\"listbox\"\n [style.margin-left]=\"leftOffset\"\n [attr.aria-activedescendant]=\"activeDescendantsId\"\n [attr.aria-label]=\"listBoxAriaLabel\"\n [attr.aria-labelledby]=\"listBoxAriaLabelledBy\"\n >\n <ng-content></ng-content>\n </ul>\n</div>\n", styles: [":host{display:inline-block;width:100%;position:relative}.pickerOptions{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;padding:4px;z-index:20;width:185px}\n"], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
176
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
176
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PickerComponent, decorators: [{
|
177
177
|
type: Component,
|
178
178
|
args: [{ selector: 'lx-picker', providers: [
|
179
179
|
{
|
@@ -70,9 +70,9 @@ export class PickerOptionComponent {
|
|
70
70
|
this.select.emit(this.value);
|
71
71
|
}
|
72
72
|
}
|
73
|
-
PickerOptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
74
|
-
PickerOptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
75
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
73
|
+
PickerOptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PickerOptionComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
74
|
+
PickerOptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: PickerOptionComponent, selector: "li[lx-picker-option]", inputs: { optionId: "optionId", ariaLabel: "ariaLabel", value: "value", selected: "selected", isClearOption: "isClearOption" }, outputs: { select: "select" }, host: { listeners: { "click": "manageClickEvents()" }, properties: { "attr.role": "this.role", "attr.aria-selected": "this.ariaSelected", "attr.aria-label": "this.ariaLabelValue", "attr.title": "this.titleValue", "id": "this.id", "class.selected": "this.selected", "class.clearOption": "this.isClearOption", "class.highlighted": "this.highlighted" } }, ngImport: i0, template: "<lx-icon *ngIf=\"isClearOption\" name=\"slash\" color=\"#d8d8d8\"></lx-icon>\n<ng-content *ngIf=\"!isClearOption\"></ng-content>\n", styles: [":host{display:inline-block;cursor:pointer;width:35px;height:35px;line-height:35px;text-align:center;border:1px solid transparent;border-radius:3px}:host.clearOption{border:1px solid #cfd5df}:host.highlighted,:host.selected{border:1px solid #b2bccc;cursor:default}:host:hover{border:1px solid #b2bccc}:host:focus{outline:0}\n"], components: [{ type: i2.IconComponent, selector: "lx-icon", inputs: ["name", "color", "fontAwsomeStyle", "size", "title"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
75
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PickerOptionComponent, decorators: [{
|
76
76
|
type: Component,
|
77
77
|
args: [{ selector: 'li[lx-picker-option]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<lx-icon *ngIf=\"isClearOption\" name=\"slash\" color=\"#d8d8d8\"></lx-icon>\n<ng-content *ngIf=\"!isClearOption\"></ng-content>\n", styles: [":host{display:inline-block;cursor:pointer;width:35px;height:35px;line-height:35px;text-align:center;border:1px solid transparent;border-radius:3px}:host.clearOption{border:1px solid #cfd5df}:host.highlighted,:host.selected{border:1px solid #b2bccc;cursor:default}:host:hover{border:1px solid #b2bccc}:host:focus{outline:0}\n"] }]
|
78
78
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.TranslateService }]; }, propDecorators: { role: [{
|
@@ -13,9 +13,9 @@ export class PillItemComponent {
|
|
13
13
|
}
|
14
14
|
}
|
15
15
|
}
|
16
|
-
PillItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
17
|
-
PillItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
18
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
16
|
+
PillItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PillItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
17
|
+
PillItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: PillItemComponent, selector: "lx-pill-item", inputs: { item: "item", label: "label", disabled: "disabled" }, outputs: { remove: "remove" }, host: { properties: { "class.disabled": "this.disabled" } }, ngImport: i0, template: "<span data-testid=\"pill-label\" class=\"pillLabel\">{{ label }}</span>\n<span *ngIf=\"!disabled\" data-testid=\"remove-pill-item\" (click)=\"removePill(item, true)\" class=\"remove far fa-times\"></span>\n", styles: [":host{margin:2px;border-radius:1px;border:solid 1px #e1e5eb;background-color:#e1e5eb;display:inline-block;padding:4px}:host:hover{background-color:#cfd5df;border:solid 1px #cfd5df;color:#526179}:host-context(.selected){background-color:#c2c9d6}.pillLabel{margin-left:4px;margin-right:4px;font-weight:400;font-style:normal;font-stretch:normal;line-height:normal;letter-spacing:normal;color:#526179;vertical-align:middle}.remove{vertical-align:middle;color:#8594ad;margin:0 4px}.remove:hover{cursor:pointer;color:#526179}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
18
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PillItemComponent, decorators: [{
|
19
19
|
type: Component,
|
20
20
|
args: [{ selector: 'lx-pill-item', template: "<span data-testid=\"pill-label\" class=\"pillLabel\">{{ label }}</span>\n<span *ngIf=\"!disabled\" data-testid=\"remove-pill-item\" (click)=\"removePill(item, true)\" class=\"remove far fa-times\"></span>\n", styles: [":host{margin:2px;border-radius:1px;border:solid 1px #e1e5eb;background-color:#e1e5eb;display:inline-block;padding:4px}:host:hover{background-color:#cfd5df;border:solid 1px #cfd5df;color:#526179}:host-context(.selected){background-color:#c2c9d6}.pillLabel{margin-left:4px;margin-right:4px;font-weight:400;font-style:normal;font-stretch:normal;line-height:normal;letter-spacing:normal;color:#526179;vertical-align:middle}.remove{vertical-align:middle;color:#8594ad;margin:0 4px}.remove:hover{cursor:pointer;color:#526179}\n"] }]
|
21
21
|
}], propDecorators: { item: [{
|
@@ -31,9 +31,9 @@ export class PillListComponent extends KeyboardSelectDirective {
|
|
31
31
|
return (index, pill) => (prop ? pill[prop] : index);
|
32
32
|
}
|
33
33
|
}
|
34
|
-
PillListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
35
|
-
PillListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
36
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
34
|
+
PillListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PillListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
35
|
+
PillListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: PillListComponent, selector: "lx-pill-list", inputs: { pills: "pills", labelKey: "labelKey", itemKey: "itemKey", disabled: "disabled" }, outputs: { remove: "remove" }, host: { properties: { "class.disabled": "this.disabled" } }, queries: [{ propertyName: "pillTemplate", first: true, predicate: ["pillTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "contentItems", predicate: PillItemComponent }], usesInheritance: true, ngImport: i0, template: "<ul class=\"pills\" #keyboardSelectContainer>\n <li\n *ngFor=\"let pill of pills; let index = index; trackBy: trackByProp(itemKey)\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n (select)=\"removePillViaKeyboard(pill)\"\n class=\"pill\"\n [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n >\n <ng-container *ngIf=\"pillTemplate; else defaultTemplate\">\n <ng-container *ngTemplateOutlet=\"pillTemplate; context: { $implicit: pill, index: index }\"></ng-container>\n </ng-container>\n <ng-template #defaultTemplate>\n <lx-pill-item\n [item]=\"pill\"\n [label]=\"labelKey ? pill[labelKey] : pill\"\n [disabled]=\"disabled\"\n (remove)=\"removePill($event)\"\n ></lx-pill-item>\n </ng-template>\n </li>\n</ul>\n", styles: [":host .pill{display:inline}:host.disabled{cursor:not-allowed}:host .pills{display:inline;margin:0!important;padding:0!important}\n"], components: [{ type: i1.PillItemComponent, selector: "lx-pill-item", inputs: ["item", "label", "disabled"], outputs: ["remove"] }], directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i2.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
36
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: PillListComponent, decorators: [{
|
37
37
|
type: Component,
|
38
38
|
args: [{ selector: 'lx-pill-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"pills\" #keyboardSelectContainer>\n <li\n *ngFor=\"let pill of pills; let index = index; trackBy: trackByProp(itemKey)\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n (select)=\"removePillViaKeyboard(pill)\"\n class=\"pill\"\n [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n >\n <ng-container *ngIf=\"pillTemplate; else defaultTemplate\">\n <ng-container *ngTemplateOutlet=\"pillTemplate; context: { $implicit: pill, index: index }\"></ng-container>\n </ng-container>\n <ng-template #defaultTemplate>\n <lx-pill-item\n [item]=\"pill\"\n [label]=\"labelKey ? pill[labelKey] : pill\"\n [disabled]=\"disabled\"\n (remove)=\"removePill($event)\"\n ></lx-pill-item>\n </ng-template>\n </li>\n</ul>\n", styles: [":host .pill{display:inline}:host.disabled{cursor:not-allowed}:host .pills{display:inline;margin:0!important;padding:0!important}\n"] }]
|
39
39
|
}], propDecorators: { pills: [{
|
@@ -66,15 +66,15 @@ export class ResponsiveInputComponent {
|
|
66
66
|
}
|
67
67
|
registerOnTouched(_fn) { }
|
68
68
|
}
|
69
|
-
ResponsiveInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2
|
70
|
-
ResponsiveInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2
|
69
|
+
ResponsiveInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: ResponsiveInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
70
|
+
ResponsiveInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: ResponsiveInputComponent, selector: "lx-responsive-input", outputs: { focus: "focus", blur: "blur" }, providers: [
|
71
71
|
{
|
72
72
|
provide: NG_VALUE_ACCESSOR,
|
73
73
|
multi: true,
|
74
74
|
useExisting: forwardRef(() => ResponsiveInputComponent)
|
75
75
|
}
|
76
76
|
], viewQueries: [{ propertyName: "responsiveInput", first: true, predicate: ["responsiveInput"], descendants: true, static: true }, { propertyName: "inputWidth", first: true, predicate: ["inputWidth"], descendants: true, static: true }], ngImport: i0, template: "<span #inputWidth class=\"inputWidth\"></span>\n<input\n type=\"text\"\n class=\"responsiveInput\"\n (focus)=\"focus.emit()\"\n (blur)=\"blur.emit()\"\n [formControl]=\"inputControl\"\n #responsiveInput\n [style.width]=\"inputWidth$ | async\"\n/>\n", styles: [":host{display:inline-block}.inputWidth{display:none;height:0;overflow:hidden;position:absolute;white-space:pre;max-width:100%}.responsiveInput{border:0;padding:0;height:100%;max-width:100%}.responsiveInput::-ms-clear{display:none}.responsiveInput:focus{outline:0}\n"], directives: [{ type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i2.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
77
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2
|
77
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: ResponsiveInputComponent, decorators: [{
|
78
78
|
type: Component,
|
79
79
|
args: [{ selector: 'lx-responsive-input', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
80
80
|
{
|