@leanix/components 0.2.218 → 0.2.219
Sign up to get free protection for your applications and to get access to all the features.
- package/bundles/leanix-components.umd.js +55 -55
- package/bundles/leanix-components.umd.js.map +1 -1
- package/esm2015/lib/core-ui/components/badge/badge.component.js +2 -2
- package/esm2015/lib/core-ui/components/button/button.component.js +1 -1
- package/esm2015/lib/core-ui/components/card/card.component.js +2 -2
- package/esm2015/lib/core-ui/components/icon-scale/icon-scale.component.js +2 -2
- package/esm2015/lib/core-ui/components/spinner/spinner.component.js +2 -2
- package/esm2015/lib/forms-ui/components/basic-dropdown-item/basic-dropdown-item.component.js +2 -2
- package/esm2015/lib/forms-ui/components/currency/currency-input.component.js +2 -2
- package/esm2015/lib/forms-ui/components/date-input/date-input.component.js +2 -2
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list-item/drag-and-drop-list-item.component.js +2 -2
- package/esm2015/lib/forms-ui/components/drag-and-drop-list/drag-and-drop-list.component.js +2 -2
- package/esm2015/lib/forms-ui/components/form-error/form-error.component.js +2 -2
- package/esm2015/lib/forms-ui/components/input/input.component.js +2 -2
- package/esm2015/lib/forms-ui/components/multi-select/multi-select.component.js +2 -2
- package/esm2015/lib/forms-ui/components/option/option.component.js +2 -2
- package/esm2015/lib/forms-ui/components/option-group/option-group.component.js +2 -2
- package/esm2015/lib/forms-ui/components/option-group-dropdown/option-group-dropdown.component.js +2 -2
- package/esm2015/lib/forms-ui/components/options-dropdown/options-dropdown.component.js +2 -2
- package/esm2015/lib/forms-ui/components/picker/picker.component.js +2 -2
- package/esm2015/lib/forms-ui/components/picker-option/picker-option.component.js +2 -2
- package/esm2015/lib/forms-ui/components/pill-item/pill-item.component.js +2 -2
- package/esm2015/lib/forms-ui/components/pill-list/pill-list.component.js +2 -2
- package/esm2015/lib/forms-ui/components/single-select/single-select.component.js +2 -2
- package/esm2015/lib/modal-ui/components/modal/modal.component.js +2 -2
- package/esm2015/lib/modal-ui/components/modal/modal.component.js.map +1 -1
- package/esm2015/lib/modal-ui/components/modal-footer/modal-footer.component.js +2 -2
- package/esm2015/lib/modal-ui/components/modal-header/modal-header.component.js +2 -2
- package/esm2015/lib/popover-ui/components/popover/popover.component.js +2 -2
- package/esm2015/lib/tab-ui/components/tab/tab.component.js +2 -2
- package/esm2015/lib/tab-ui/components/tab-group/tab-group.component.js +2 -2
- package/fesm2015/leanix-components.js +55 -55
- package/fesm2015/leanix-components.js.map +1 -1
- package/package.json +1 -1
|
@@ -14,13 +14,13 @@ export class PillItemComponent {
|
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
PillItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: PillItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17
|
-
PillItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", 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: [":
|
|
17
|
+
PillItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", 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:1px solid #e1e5eb;background-color:#e1e5eb;display:inline-block;padding:4px}:host:hover{background-color:#cfd5df;border:1px solid #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}.pillLabel,.remove{vertical-align:middle}.remove{color:#8594ad;margin:0 4px}.remove:hover{cursor:pointer;color:#526179}"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
18
18
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: PillItemComponent, decorators: [{
|
|
19
19
|
type: Component,
|
|
20
20
|
args: [{
|
|
21
21
|
selector: 'lx-pill-item',
|
|
22
22
|
templateUrl: 'pill-item.component.html',
|
|
23
|
-
styleUrls: ['pill-item.component.
|
|
23
|
+
styleUrls: ['pill-item.component.scss']
|
|
24
24
|
}]
|
|
25
25
|
}], propDecorators: { item: [{
|
|
26
26
|
type: Input
|
|
@@ -32,14 +32,14 @@ export class PillListComponent extends KeyboardSelectDirective {
|
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
PillListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: PillListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
35
|
-
PillListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", 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: [":
|
|
35
|
+
PillListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", 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}"], 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
36
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: PillListComponent, decorators: [{
|
|
37
37
|
type: Component,
|
|
38
38
|
args: [{
|
|
39
39
|
selector: 'lx-pill-list',
|
|
40
40
|
templateUrl: 'pill-list.component.html',
|
|
41
41
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
42
|
-
styleUrls: ['pill-list.component.
|
|
42
|
+
styleUrls: ['pill-list.component.scss']
|
|
43
43
|
}]
|
|
44
44
|
}], propDecorators: { pills: [{
|
|
45
45
|
type: Input
|
|
@@ -222,13 +222,13 @@ SingleSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
|
|
|
222
222
|
multi: true,
|
|
223
223
|
useExisting: forwardRef(() => SingleSelectComponent)
|
|
224
224
|
}
|
|
225
|
-
], queries: [{ propertyName: "explicitDropdown", first: true, predicate: SelectDropdownDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "explicitSelectedOption", first: true, predicate: SelectedOptionDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "dropdownComponent", first: true, predicate: BasicDropdownComponent, descendants: true }], viewQueries: [{ propertyName: "implicitSelectedOption", first: true, predicate: ["selectedOption"], descendants: true, static: true }, { propertyName: "implicitDropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }, { propertyName: "queryInput", first: true, predicate: ["queryInput"], 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 {{ padding }}Padding\"\n [class.open]=\"dropdownOpen\"\n [class.top]=\"(dropdownDirection$ | async) === 'TOP'\"\n [class.bottom]=\"(dropdownDirection$ | async) === 'BOTTOM'\"\n [class.disabled]=\"disabled\"\n [class.grayBackground]=\"selectionBackground === 'gray'\"\n [class.defaultSize]=\"size === 'default'\"\n [class.smallSize]=\"size === 'small'\"\n [class.select2Size]=\"size === 'select2'\"\n [class.largeSize]=\"size === 'large'\"\n [style.cursor]=\"cursorStyle\"\n [class.focused]=\"isInputFocused\"\n (click)=\"handleClick($event.target === toggle)\"\n>\n <div class=\"selectionContainer\">\n <div class=\"inputContainer\">\n <div *ngIf=\"!selection && !queryInput?.value\" class=\"placeholder\" [attr.title]=\"placeholder\">\n {{ placeholder }}\n </div>\n <div\n *ngIf=\"!allowQuery || !queryInput?.value\"\n class=\"selection\"\n [class.lowerOpacity]=\"allowQuery && !queryInput?.value && dropdownOpen\"\n [class.lightgrayColor]=\"!allowQuery && dropdownOpen\"\n (click)=\"$event.stopPropagation(); focus()\"\n >\n <ng-container *ngTemplateOutlet=\"selectedOptionTmpl\"></ng-container>\n </div>\n <input\n #queryInput\n class=\"queryInput\"\n type=\"text\"\n [class.isHidden]=\"!allowQuery\"\n (keydown.enter)=\"$event.preventDefault()\"\n (focus)=\"isInputFocused = true\"\n (blur)=\"isInputFocused = false; blur.emit()\"\n [tabIndex]=\"disabled ? -1 : tabIndex\"\n [formControl]=\"queryControl\"\n [readOnly]=\"!allowQuery\"\n />\n </div>\n <div class=\"iconContainer\">\n <i *ngIf=\"selection && allowClear\" class=\"far fa-times\" (click)=\"!disabled && removeSelection()\"></i>\n <i #toggle class=\"fas fa-angle-down\" aria-hidden=\"true\"></i>\n </div>\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 #selectedOption>\n <ng-content select=\".selectedOption\"></ng-content>\n</ng-template>\n<ng-template #dropdown>\n <ng-content select=\".dropdownComponent\"></ng-content>\n</ng-template>\n", styles: [":
|
|
225
|
+
], queries: [{ propertyName: "explicitDropdown", first: true, predicate: SelectDropdownDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "explicitSelectedOption", first: true, predicate: SelectedOptionDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "dropdownComponent", first: true, predicate: BasicDropdownComponent, descendants: true }], viewQueries: [{ propertyName: "implicitSelectedOption", first: true, predicate: ["selectedOption"], descendants: true, static: true }, { propertyName: "implicitDropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }, { propertyName: "queryInput", first: true, predicate: ["queryInput"], 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 {{ padding }}Padding\"\n [class.open]=\"dropdownOpen\"\n [class.top]=\"(dropdownDirection$ | async) === 'TOP'\"\n [class.bottom]=\"(dropdownDirection$ | async) === 'BOTTOM'\"\n [class.disabled]=\"disabled\"\n [class.grayBackground]=\"selectionBackground === 'gray'\"\n [class.defaultSize]=\"size === 'default'\"\n [class.smallSize]=\"size === 'small'\"\n [class.select2Size]=\"size === 'select2'\"\n [class.largeSize]=\"size === 'large'\"\n [style.cursor]=\"cursorStyle\"\n [class.focused]=\"isInputFocused\"\n (click)=\"handleClick($event.target === toggle)\"\n>\n <div class=\"selectionContainer\">\n <div class=\"inputContainer\">\n <div *ngIf=\"!selection && !queryInput?.value\" class=\"placeholder\" [attr.title]=\"placeholder\">\n {{ placeholder }}\n </div>\n <div\n *ngIf=\"!allowQuery || !queryInput?.value\"\n class=\"selection\"\n [class.lowerOpacity]=\"allowQuery && !queryInput?.value && dropdownOpen\"\n [class.lightgrayColor]=\"!allowQuery && dropdownOpen\"\n (click)=\"$event.stopPropagation(); focus()\"\n >\n <ng-container *ngTemplateOutlet=\"selectedOptionTmpl\"></ng-container>\n </div>\n <input\n #queryInput\n class=\"queryInput\"\n type=\"text\"\n [class.isHidden]=\"!allowQuery\"\n (keydown.enter)=\"$event.preventDefault()\"\n (focus)=\"isInputFocused = true\"\n (blur)=\"isInputFocused = false; blur.emit()\"\n [tabIndex]=\"disabled ? -1 : tabIndex\"\n [formControl]=\"queryControl\"\n [readOnly]=\"!allowQuery\"\n />\n </div>\n <div class=\"iconContainer\">\n <i *ngIf=\"selection && allowClear\" class=\"far fa-times\" (click)=\"!disabled && removeSelection()\"></i>\n <i #toggle class=\"fas fa-angle-down\" aria-hidden=\"true\"></i>\n </div>\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 #selectedOption>\n <ng-content select=\".selectedOption\"></ng-content>\n</ng-template>\n<ng-template #dropdown>\n <ng-content select=\".dropdownComponent\"></ng-content>\n</ng-template>\n", styles: [":host ::ng-deep .selectedOption{overflow:hidden;text-overflow:ellipsis}.selectContainer{position:relative;height:auto;padding:0;box-sizing:border-box;background:#fff;border:1px solid #99a5bb;box-shadow:inset 0 1px 1px rgba(0,0,0,.07);border-radius:3px}.selectContainer.grayBackground{background:#eaedf1;border-color:#eaedf1;box-shadow:none}.selectContainer.open{z-index:1052;background:#fff;border:1px solid #e1e5eb}.selectContainer.open.bottom{box-shadow:0 6px 6px 0 rgba(33,37,41,.2);border-bottom-color:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0}.selectContainer.open.bottom .optionsContainer{box-shadow:0 6px 6px 0 rgba(33,37,41,.2);top:100%;border:1px solid #e1e5eb;border-top:0;border-top-left-radius:0;border-top-right-radius:0}.selectContainer.open.top{box-shadow:0 -4px 6px 0 rgba(33,37,41,.2);border-top:0;border-top-left-radius:0;border-top-right-radius:0}.selectContainer.open.top .optionsContainer{border-left:1px solid #e1e5eb;border-right:1px solid #e1e5eb;box-shadow:0 -4px 6px 0 rgba(33,37,41,.2);margin-bottom:0;border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0;top:none;bottom:100%}.selectContainer:not(.open).focused{outline:0;border:1px solid #59f}.selectContainer.disabled{background-color:#eaedf1;cursor:not-allowed!important}.selectContainer.defaultPadding .selectionContainer{padding-left:12px}.selectContainer.narrowPadding .selectionContainer{padding-left:4px}.selectContainer .lightgrayColor{color:#8594ad}.selectionContainer{display:flex}.inputContainer{flex:1;position:relative;white-space:nowrap}.queryInput{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding-left:0;background:transparent;position:relative;cursor:inherit}.queryInput::-ms-clear{display:none}.queryInput:focus{outline:0}.queryInput.isHidden{opacity:0}.placeholder{position:absolute;width:100%;text-align:left;color:#8594ad;overflow:hidden;word-break:break-all;white-space:nowrap;text-overflow:ellipsis}.iconContainer{display:flex;align-items:center;text-align:center}.iconContainer .far,.iconContainer .fas{width:10px;cursor:pointer}.disabled .iconContainer .far,.disabled .iconContainer .fas{cursor:inherit}.iconContainer .fa-angle-down{margin:0 12px}.iconContainer .fa-times{margin-left:4px}.selection{width:100%;position:absolute;display:flex;align-items:center}.selection.lowerOpacity{opacity:.7}.backdrop{position:fixed;top:0;bottom:0;left:0;right:0;z-index:1051}.optionsContainer{position:absolute;left:-1px;right:-1px;padding:0;border-radius:3px;background:#fff;z-index:1001}.defaultSize .iconContainer,.defaultSize .inputContainer,.defaultSize .queryInput,.defaultSize .selection{height:29px}.defaultSize .inputContainer{line-height:29px}.defaultSize .selectionContainer{min-height:29px}.smallSize .iconContainer,.smallSize .inputContainer,.smallSize .queryInput,.smallSize .selection{height:22px}.smallSize .inputContainer{line-height:22px}.smallSize .selectionContainer{min-height:22px}.select2Size .iconContainer,.select2Size .inputContainer,.select2Size .queryInput,.select2Size .selection{height:26px}.select2Size .inputContainer{line-height:26px}.select2Size .selectionContainer{min-height:26px}.largeSize .iconContainer,.largeSize .inputContainer,.largeSize .queryInput,.largeSize .selection{height:40px}.largeSize .inputContainer{line-height:40px}.largeSize .selectionContainer{min-height:40px}"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.MarkInvalidDirective, selector: "[lxMarkInvalid]", inputs: ["lxMarkInvalid"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i1.AsyncPipe } });
|
|
226
226
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: SingleSelectComponent, decorators: [{
|
|
227
227
|
type: Component,
|
|
228
228
|
args: [{
|
|
229
229
|
selector: 'lx-single-select',
|
|
230
230
|
templateUrl: 'single-select.component.html',
|
|
231
|
-
styleUrls: ['single-select.component.
|
|
231
|
+
styleUrls: ['single-select.component.scss'],
|
|
232
232
|
providers: [
|
|
233
233
|
{
|
|
234
234
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -150,7 +150,7 @@ export class ModalComponent {
|
|
|
150
150
|
}
|
|
151
151
|
}
|
|
152
152
|
ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: ModalComponent, deps: [{ token: i1.Overlay }, { token: i0.Renderer2 }, { token: MODAL_CLOSE, optional: true }, { token: i2.ConfigurableFocusTrapFactory }], target: i0.ɵɵFactoryTarget.Component });
|
|
153
|
-
ModalComponent.ɵcmp = i0.ɵɵ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: TemplateRef, static: true }], viewQueries: [{ propertyName: "cdkPortal", first: true, predicate: CdkPortal, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, 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: ["
|
|
153
|
+
ModalComponent.ɵcmp = i0.ɵɵ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: TemplateRef, static: true }], viewQueries: [{ propertyName: "cdkPortal", first: true, predicate: CdkPortal, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, 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.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "translate": i5.TranslatePipe }, animations: [
|
|
154
154
|
trigger('modal', [
|
|
155
155
|
transition(':enter', [style({ opacity: 0 }), animate('0.15s', style({ opacity: 1 }))]),
|
|
156
156
|
transition(':leave', animate('0.15s', style({ opacity: 0 })))
|
|
@@ -161,7 +161,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImpor
|
|
|
161
161
|
args: [{
|
|
162
162
|
selector: 'lx-modal',
|
|
163
163
|
templateUrl: 'modal.component.html',
|
|
164
|
-
styleUrls: ['modal.component.
|
|
164
|
+
styleUrls: ['modal.component.scss'],
|
|
165
165
|
animations: [
|
|
166
166
|
trigger('modal', [
|
|
167
167
|
transition(':enter', [style({ opacity: 0 }), animate('0.15s', style({ opacity: 1 }))]),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal.component.js","sourceRoot":"","sources":["modal.component.ts","modal.component.html"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"modal.component.js","sourceRoot":"","sources":["modal.component.ts","modal.component.html"],"names":[],"mappings":"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"}
|
|
@@ -3,13 +3,13 @@ import * as i0 from "@angular/core";
|
|
|
3
3
|
export class ModalFooterComponent {
|
|
4
4
|
}
|
|
5
5
|
ModalFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: ModalFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6
|
-
ModalFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: ModalFooterComponent, selector: "lx-modal-footer", ngImport: i0, template: "<div class=\"footerContainer\">\n <ng-content></ng-content>\n</div>\n", styles: [":
|
|
6
|
+
ModalFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: ModalFooterComponent, selector: "lx-modal-footer", ngImport: i0, template: "<div class=\"footerContainer\">\n <ng-content></ng-content>\n</div>\n", styles: [":host{display:block;text-align:right}:host-context(.fullscreen) .footerContainer{padding-left:90px;height:70px}:host-context(.dialog) .footerContainer,:host-context(.dialog-large) .footerContainer{padding:16px;height:64px;background-color:#f0f2f5;border-radius:0 0 6px 6px}.footerContainer{border-top:1px solid #cfd5df}"] });
|
|
7
7
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: ModalFooterComponent, decorators: [{
|
|
8
8
|
type: Component,
|
|
9
9
|
args: [{
|
|
10
10
|
selector: 'lx-modal-footer',
|
|
11
11
|
templateUrl: 'modal-footer.component.html',
|
|
12
|
-
styleUrls: ['modal-footer.component.
|
|
12
|
+
styleUrls: ['modal-footer.component.scss']
|
|
13
13
|
}]
|
|
14
14
|
}] });
|
|
15
15
|
//# sourceMappingURL=../../../../../../../../libs/components/src/lib/modal-ui/components/modal-footer/modal-footer.component.js.map
|
|
@@ -9,13 +9,13 @@ export class ModalHeaderComponent {
|
|
|
9
9
|
}
|
|
10
10
|
}
|
|
11
11
|
ModalHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: ModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12
|
-
ModalHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: ModalHeaderComponent, selector: "lx-modal-header", inputs: { title: "title", subtitle: "subtitle", bottomBorder: "bottomBorder" }, ngImport: i0, template: "<div class=\"headerContainer\" [class.withSubtitle]=\"subtitle.length > 0\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content></ng-content>\n <h1>{{ title }}</h1>\n <h2 *ngIf=\"subtitle.length > 0\">{{ subtitle }}</h2>\n</div>\n", styles: [":
|
|
12
|
+
ModalHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: ModalHeaderComponent, selector: "lx-modal-header", inputs: { title: "title", subtitle: "subtitle", bottomBorder: "bottomBorder" }, ngImport: i0, template: "<div class=\"headerContainer\" [class.withSubtitle]=\"subtitle.length > 0\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content></ng-content>\n <h1>{{ title }}</h1>\n <h2 *ngIf=\"subtitle.length > 0\">{{ subtitle }}</h2>\n</div>\n", styles: [":host{display:block}:host-context(.fullscreen) .headerContainer{padding:28px 90px}:host-context(.fullscreen) .headerContainer h1{margin-left:auto;margin-right:auto;font-weight:700}:host-context(.fullscreen) .headerContainer h1,:host-context(.fullscreen) .headerContainer h2{font-size:21px}:host-context(.fullscreen) .headerContainer.withSubtitle h1{margin:0 0 0 auto}:host-context(.dialog) .headerContainer,:host-context(.dialog-large) .headerContainer{padding:16px;background-color:#f0f2f5;border-radius:6px 6px 0 0}:host-context(.dialog) .headerContainer h1,:host-context(.dialog-large) .headerContainer h1{margin-right:28px;word-break:break-word}:host-context(.dialog) .headerContainer h1,:host-context(.dialog) .headerContainer h2,:host-context(.dialog-large) .headerContainer h1,:host-context(.dialog-large) .headerContainer h2{font-size:15px}h1,h2{margin:0;padding:0}h2{margin:0 auto 0 4px;font-weight:300}.headerContainer{display:flex}.headerContainer.bottomBorder{border-bottom:1px solid #cfd5df}"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
13
13
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: ModalHeaderComponent, decorators: [{
|
|
14
14
|
type: Component,
|
|
15
15
|
args: [{
|
|
16
16
|
selector: 'lx-modal-header',
|
|
17
17
|
templateUrl: 'modal-header.component.html',
|
|
18
|
-
styleUrls: ['modal-header.component.
|
|
18
|
+
styleUrls: ['modal-header.component.scss']
|
|
19
19
|
}]
|
|
20
20
|
}], propDecorators: { title: [{
|
|
21
21
|
type: Input
|
|
@@ -166,13 +166,13 @@ export class PopoverComponent {
|
|
|
166
166
|
}
|
|
167
167
|
}
|
|
168
168
|
PopoverComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: PopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
169
|
-
PopoverComponent.ɵcmp = i0.ɵɵ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: TemplateRef, static: true }], viewQueries: [{ propertyName: "satPopover", first: true, predicate: SatPopover, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, 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: ["
|
|
169
|
+
PopoverComponent.ɵcmp = i0.ɵɵ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: TemplateRef, static: true }], viewQueries: [{ propertyName: "satPopover", first: true, predicate: SatPopover, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, 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.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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
|
|
170
170
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: PopoverComponent, decorators: [{
|
|
171
171
|
type: Component,
|
|
172
172
|
args: [{
|
|
173
173
|
selector: 'lx-popover',
|
|
174
174
|
templateUrl: 'popover.component.html',
|
|
175
|
-
styleUrls: ['popover.component.
|
|
175
|
+
styleUrls: ['popover.component.scss']
|
|
176
176
|
}]
|
|
177
177
|
}], propDecorators: { trigger: [{
|
|
178
178
|
type: Input
|
|
@@ -32,13 +32,13 @@ export class TabComponent {
|
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
TabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: TabComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
35
|
-
TabComponent.ɵcmp = i0.ɵɵ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: RouterLinkActive, descendants: true }], ngImport: i0, 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: [":
|
|
35
|
+
TabComponent.ɵcmp = i0.ɵɵ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: RouterLinkActive, descendants: true }], ngImport: i0, 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: i1.BadgeComponent, selector: "lx-badge", inputs: ["content", "size", "color"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], exportAs: ["routerLinkActive"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
36
36
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: TabComponent, decorators: [{
|
|
37
37
|
type: Component,
|
|
38
38
|
args: [{
|
|
39
39
|
selector: 'lx-tab',
|
|
40
40
|
templateUrl: 'tab.component.html',
|
|
41
|
-
styleUrls: ['tab.component.
|
|
41
|
+
styleUrls: ['tab.component.scss'],
|
|
42
42
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
43
43
|
}]
|
|
44
44
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { icon: [{
|
|
@@ -56,13 +56,13 @@ export class TabGroupComponent {
|
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
TabGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: TabGroupComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
59
|
-
TabGroupComponent.ɵcmp = i0.ɵɵ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, 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: ["
|
|
59
|
+
TabGroupComponent.ɵcmp = i0.ɵɵ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, 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: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
60
60
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0, type: TabGroupComponent, decorators: [{
|
|
61
61
|
type: Component,
|
|
62
62
|
args: [{
|
|
63
63
|
selector: 'lx-tab-group',
|
|
64
64
|
templateUrl: 'tab-group.component.html',
|
|
65
|
-
styleUrls: ['tab-group.component.
|
|
65
|
+
styleUrls: ['tab-group.component.scss'],
|
|
66
66
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
67
67
|
}]
|
|
68
68
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { isCentered: [{
|