@lucca-front/ng 21.0.3 → 21.1.0-split.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/lucca-front-ng-a11y.mjs +8 -8
- package/fesm2022/lucca-front-ng-a11y.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-api.mjs +51 -51
- package/fesm2022/lucca-front-ng-api.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-app-layout.mjs +4 -4
- package/fesm2022/lucca-front-ng-app-layout.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-box.mjs +3 -3
- package/fesm2022/lucca-front-ng-box.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-breadcrumbs.mjs +10 -10
- package/fesm2022/lucca-front-ng-breadcrumbs.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-bubble-icon.mjs +51 -0
- package/fesm2022/lucca-front-ng-bubble-icon.mjs.map +1 -0
- package/fesm2022/lucca-front-ng-bubble-illustration.mjs +135 -0
- package/fesm2022/lucca-front-ng-bubble-illustration.mjs.map +1 -0
- package/fesm2022/lucca-front-ng-button.mjs +1 -119
- package/fesm2022/lucca-front-ng-button.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-callout.mjs +37 -63
- package/fesm2022/lucca-front-ng-callout.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-chip.mjs +9 -39
- package/fesm2022/lucca-front-ng-chip.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-clear.mjs +8 -23
- package/fesm2022/lucca-front-ng-clear.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-code.mjs +3 -3
- package/fesm2022/lucca-front-ng-color.mjs +28 -0
- package/fesm2022/lucca-front-ng-color.mjs.map +1 -0
- package/fesm2022/lucca-front-ng-comment.mjs +26 -28
- package/fesm2022/lucca-front-ng-comment.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-container.mjs +11 -9
- package/fesm2022/lucca-front-ng-container.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-core-select-api.mjs +9 -9
- package/fesm2022/lucca-front-ng-core-select-department.mjs +6 -6
- package/fesm2022/lucca-front-ng-core-select-establishment.mjs +9 -9
- package/fesm2022/lucca-front-ng-core-select-job-qualification.mjs +8 -6
- package/fesm2022/lucca-front-ng-core-select-job-qualification.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-core-select-occupation-category.mjs +3 -3
- package/fesm2022/lucca-front-ng-core-select-user.mjs +30 -30
- package/fesm2022/lucca-front-ng-core-select-user.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-core-select.mjs +117 -96
- package/fesm2022/lucca-front-ng-core-select.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-core.mjs +27 -87
- package/fesm2022/lucca-front-ng-core.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-data-table.mjs +31 -31
- package/fesm2022/lucca-front-ng-data-table.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-date.mjs +111 -112
- package/fesm2022/lucca-front-ng-date.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-date2.mjs +50 -44
- package/fesm2022/lucca-front-ng-date2.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-department.mjs +34 -34
- package/fesm2022/lucca-front-ng-department.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-dialog.mjs +61 -38
- package/fesm2022/lucca-front-ng-dialog.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-divider.mjs +4 -13
- package/fesm2022/lucca-front-ng-divider.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-dropdown.mjs +40 -40
- package/fesm2022/lucca-front-ng-empty-state.mjs +56 -30
- package/fesm2022/lucca-front-ng-empty-state.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-establishment.mjs +58 -58
- package/fesm2022/lucca-front-ng-establishment.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-fancy-box.mjs +3 -15
- package/fesm2022/lucca-front-ng-fancy-box.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-file-upload.mjs +67 -44
- package/fesm2022/lucca-front-ng-file-upload.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-filter-pills.mjs +30 -29
- package/fesm2022/lucca-front-ng-filter-pills.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-footer.mjs +3 -6
- package/fesm2022/lucca-front-ng-footer.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-form-field.mjs +15 -15
- package/fesm2022/lucca-front-ng-form-field.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-form-header.mjs +3 -6
- package/fesm2022/lucca-front-ng-form-header.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-form.mjs +4 -4
- package/fesm2022/lucca-front-ng-form.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-formly.mjs +58 -58
- package/fesm2022/lucca-front-ng-formly.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-forms-phone-number-input.mjs +10 -9
- package/fesm2022/lucca-front-ng-forms-phone-number-input.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-forms-rich-text-input.mjs +74 -74
- package/fesm2022/lucca-front-ng-forms-rich-text-input.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-forms.mjs +136 -69
- package/fesm2022/lucca-front-ng-forms.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-gauge.mjs +8 -31
- package/fesm2022/lucca-front-ng-gauge.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-grid.mjs +9 -9
- package/fesm2022/lucca-front-ng-grid.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-highlight-data.mjs +28 -33
- package/fesm2022/lucca-front-ng-highlight-data.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-horizontal-navigation.mjs +7 -10
- package/fesm2022/lucca-front-ng-horizontal-navigation.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-icon.mjs +1 -42
- package/fesm2022/lucca-front-ng-icon.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-index-table.mjs +33 -33
- package/fesm2022/lucca-front-ng-index-table.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-inline-message.mjs +3 -15
- package/fesm2022/lucca-front-ng-inline-message.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-input.mjs +27 -27
- package/fesm2022/lucca-front-ng-input.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-link.mjs +21 -30
- package/fesm2022/lucca-front-ng-link.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-listbox.mjs +14 -26
- package/fesm2022/lucca-front-ng-listbox.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-listing.mjs +13 -42
- package/fesm2022/lucca-front-ng-listing.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-loading.mjs +3 -3
- package/fesm2022/lucca-front-ng-loading.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-main-layout.mjs +7 -13
- package/fesm2022/lucca-front-ng-main-layout.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-mobile-push.mjs +16 -24
- package/fesm2022/lucca-front-ng-mobile-push.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-modal.mjs +22 -22
- package/fesm2022/lucca-front-ng-modal.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-multi-select.mjs +61 -64
- package/fesm2022/lucca-front-ng-multi-select.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-new-badge.mjs +3 -6
- package/fesm2022/lucca-front-ng-new-badge.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-number-format.mjs +6 -6
- package/fesm2022/lucca-front-ng-number.mjs +7 -7
- package/fesm2022/lucca-front-ng-numeric-badge.mjs +4 -13
- package/fesm2022/lucca-front-ng-numeric-badge.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-option.mjs +179 -177
- package/fesm2022/lucca-front-ng-option.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-page-header.mjs +3 -12
- package/fesm2022/lucca-front-ng-page-header.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-pagination.mjs +7 -31
- package/fesm2022/lucca-front-ng-pagination.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-plg-push.mjs +7 -13
- package/fesm2022/lucca-front-ng-plg-push.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-popover.mjs +25 -25
- package/fesm2022/lucca-front-ng-popover2.mjs +27 -37
- package/fesm2022/lucca-front-ng-popover2.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-popup.mjs +10 -10
- package/fesm2022/lucca-front-ng-progress-bar.mjs +8 -15
- package/fesm2022/lucca-front-ng-progress-bar.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-read-more.mjs +25 -38
- package/fesm2022/lucca-front-ng-read-more.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-resource-card.mjs +19 -19
- package/fesm2022/lucca-front-ng-resource-card.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-safe-content.mjs +10 -10
- package/fesm2022/lucca-front-ng-scroll-box.mjs +6 -9
- package/fesm2022/lucca-front-ng-scroll-box.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-scroll.mjs +7 -7
- package/fesm2022/lucca-front-ng-segmented-control-tabs.mjs +9 -15
- package/fesm2022/lucca-front-ng-segmented-control-tabs.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-segmented-control.mjs +7 -22
- package/fesm2022/lucca-front-ng-segmented-control.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-select.mjs +14 -14
- package/fesm2022/lucca-front-ng-sidepanel.mjs +7 -7
- package/fesm2022/lucca-front-ng-simple-select.mjs +27 -27
- package/fesm2022/lucca-front-ng-simple-select.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-skeleton.mjs +31 -82
- package/fesm2022/lucca-front-ng-skeleton.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-sortable-list.mjs +6 -30
- package/fesm2022/lucca-front-ng-sortable-list.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-status-badge.mjs +3 -15
- package/fesm2022/lucca-front-ng-status-badge.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-table-of-content.mjs +6 -6
- package/fesm2022/lucca-front-ng-tag.mjs +3 -9
- package/fesm2022/lucca-front-ng-tag.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-time.mjs +30 -30
- package/fesm2022/lucca-front-ng-time.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-title.mjs +10 -10
- package/fesm2022/lucca-front-ng-toast.mjs +14 -14
- package/fesm2022/lucca-front-ng-toast.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-tooltip.mjs +28 -26
- package/fesm2022/lucca-front-ng-tooltip.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-tree-select.mjs +6 -6
- package/fesm2022/lucca-front-ng-tree-select.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-user-popover.mjs +23 -23
- package/fesm2022/lucca-front-ng-user-popover.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-user.mjs +72 -72
- package/fesm2022/lucca-front-ng-user.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-vertical-navigation.mjs +12 -42
- package/fesm2022/lucca-front-ng-vertical-navigation.mjs.map +1 -1
- package/package.json +17 -3
- package/schematics/lib/local-deps/package-lock.json +2 -0
- package/schematics/lib/local-deps/package.json +1 -2
- package/src/components/cdk/_overlay.scss +0 -5
- package/src/definitions/option/_option-item.scss +0 -1
- package/types/lucca-front-ng-a11y.d.ts +3 -3
- package/types/lucca-front-ng-breadcrumbs.d.ts +9 -9
- package/types/lucca-front-ng-bubble-icon.d.ts +20 -0
- package/types/lucca-front-ng-bubble-illustration.d.ts +24 -0
- package/types/lucca-front-ng-button.d.ts +1 -61
- package/types/lucca-front-ng-callout.d.ts +3 -33
- package/types/lucca-front-ng-chip.d.ts +3 -33
- package/types/lucca-front-ng-clear.d.ts +6 -21
- package/types/lucca-front-ng-color.d.ts +12 -0
- package/types/lucca-front-ng-comment.d.ts +11 -19
- package/types/lucca-front-ng-container.d.ts +4 -4
- package/types/lucca-front-ng-core-select.d.ts +83 -78
- package/types/lucca-front-ng-core.d.ts +25 -19
- package/types/lucca-front-ng-data-table.d.ts +2 -2
- package/types/lucca-front-ng-date.d.ts +5 -5
- package/types/lucca-front-ng-date2.d.ts +6 -5
- package/types/lucca-front-ng-department.d.ts +2 -2
- package/types/lucca-front-ng-dialog.d.ts +12 -5
- package/types/lucca-front-ng-divider.d.ts +0 -10
- package/types/lucca-front-ng-empty-state.d.ts +6 -20
- package/types/lucca-front-ng-establishment.d.ts +2 -2
- package/types/lucca-front-ng-fancy-box.d.ts +0 -12
- package/types/lucca-front-ng-file-upload.d.ts +18 -8
- package/types/lucca-front-ng-filter-pills.d.ts +6 -5
- package/types/lucca-front-ng-footer.d.ts +0 -3
- package/types/lucca-front-ng-form-field.d.ts +2 -2
- package/types/lucca-front-ng-form-header.d.ts +0 -3
- package/types/lucca-front-ng-forms-rich-text-input.d.ts +14 -16
- package/types/lucca-front-ng-forms.d.ts +40 -13
- package/types/lucca-front-ng-gauge.d.ts +0 -25
- package/types/lucca-front-ng-grid.d.ts +1 -1
- package/types/lucca-front-ng-highlight-data.d.ts +15 -36
- package/types/lucca-front-ng-horizontal-navigation.d.ts +0 -3
- package/types/lucca-front-ng-icon.d.ts +1 -32
- package/types/lucca-front-ng-inline-message.d.ts +0 -12
- package/types/lucca-front-ng-input.d.ts +2 -2
- package/types/lucca-front-ng-link.d.ts +4 -20
- package/types/lucca-front-ng-listbox.d.ts +4 -16
- package/types/lucca-front-ng-listing.d.ts +2 -33
- package/types/lucca-front-ng-main-layout.d.ts +0 -6
- package/types/lucca-front-ng-mobile-push.d.ts +2 -9
- package/types/lucca-front-ng-multi-select.d.ts +26 -24
- package/types/lucca-front-ng-new-badge.d.ts +0 -3
- package/types/lucca-front-ng-numeric-badge.d.ts +0 -9
- package/types/lucca-front-ng-option.d.ts +8 -8
- package/types/lucca-front-ng-page-header.d.ts +0 -9
- package/types/lucca-front-ng-pagination.d.ts +2 -26
- package/types/lucca-front-ng-plg-push.d.ts +2 -8
- package/types/lucca-front-ng-popover2.d.ts +6 -8
- package/types/lucca-front-ng-progress-bar.d.ts +0 -9
- package/types/lucca-front-ng-read-more.d.ts +10 -25
- package/types/lucca-front-ng-resource-card.d.ts +0 -6
- package/types/lucca-front-ng-scroll-box.d.ts +1 -4
- package/types/lucca-front-ng-segmented-control-tabs.d.ts +1 -7
- package/types/lucca-front-ng-segmented-control.d.ts +1 -16
- package/types/lucca-front-ng-simple-select.d.ts +5 -4
- package/types/lucca-front-ng-skeleton.d.ts +6 -61
- package/types/lucca-front-ng-sortable-list.d.ts +0 -24
- package/types/lucca-front-ng-status-badge.d.ts +0 -12
- package/types/lucca-front-ng-tag.d.ts +0 -6
- package/types/lucca-front-ng-time.d.ts +6 -6
- package/types/lucca-front-ng-toast.d.ts +2 -2
- package/types/lucca-front-ng-tooltip.d.ts +5 -3
- package/types/lucca-front-ng-user-popover.d.ts +6 -7
- package/types/lucca-front-ng-user.d.ts +4 -4
- package/types/lucca-front-ng-vertical-navigation.d.ts +0 -30
|
@@ -20,10 +20,10 @@ class DropdownActionComponent {
|
|
|
20
20
|
this.#popoverContentRef.close();
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
24
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.
|
|
23
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
24
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.8", type: DropdownActionComponent, isStandalone: true, selector: "[lu-dropdown-action]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, critical: { classPropertyName: "critical", publicName: "critical", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "closePanel()" }, properties: { "class.is-disabled": "disabled()", "class.mod-critical": "critical()" }, classAttribute: "dropdown-list-option-action" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
25
25
|
}
|
|
26
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownActionComponent, decorators: [{
|
|
27
27
|
type: Component,
|
|
28
28
|
args: [{
|
|
29
29
|
selector: '[lu-dropdown-action]',
|
|
@@ -40,10 +40,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
40
40
|
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], critical: [{ type: i0.Input, args: [{ isSignal: true, alias: "critical", required: false }] }] } });
|
|
41
41
|
|
|
42
42
|
class DropdownDividerComponent {
|
|
43
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
44
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.
|
|
43
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
44
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: DropdownDividerComponent, isStandalone: true, selector: "lu-dropdown-divider", host: { attributes: { "role": "listitem" }, properties: { "attr.aria-hidden": "true" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: '<lu-divider class="dropdown-list-option-divider" />', isInline: true, dependencies: [{ kind: "component", type: DividerComponent, selector: "lu-divider", inputs: ["separatorRole", "vertical", "size", "withRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
45
45
|
}
|
|
46
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
46
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownDividerComponent, decorators: [{
|
|
47
47
|
type: Component,
|
|
48
48
|
args: [{
|
|
49
49
|
selector: 'lu-dropdown-divider',
|
|
@@ -63,10 +63,10 @@ class DropdownGroupComponent {
|
|
|
63
63
|
constructor() {
|
|
64
64
|
this.label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
65
65
|
}
|
|
66
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
67
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.
|
|
66
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
67
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.8", type: DropdownGroupComponent, isStandalone: true, selector: "lu-dropdown-group", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "listitem" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: "{{ label() }}\n<ul class=\"dropdown-list\">\n\t<ng-content />\n</ul>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
68
68
|
}
|
|
69
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
69
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownGroupComponent, decorators: [{
|
|
70
70
|
type: Component,
|
|
71
71
|
args: [{ selector: 'lu-dropdown-group', encapsulation: ViewEncapsulation.None, host: {
|
|
72
72
|
class: 'dropdown-list-option',
|
|
@@ -75,10 +75,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
75
75
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
|
|
76
76
|
|
|
77
77
|
class DropdownItemComponent {
|
|
78
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
79
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.
|
|
78
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
79
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: DropdownItemComponent, isStandalone: true, selector: "lu-dropdown-item", host: { attributes: { "role": "listitem" }, classAttribute: "dropdown-list-option" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
80
80
|
}
|
|
81
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
81
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownItemComponent, decorators: [{
|
|
82
82
|
type: Component,
|
|
83
83
|
args: [{
|
|
84
84
|
selector: 'lu-dropdown-item',
|
|
@@ -93,10 +93,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
93
93
|
}] });
|
|
94
94
|
|
|
95
95
|
class DropdownMenuComponent {
|
|
96
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
97
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.
|
|
96
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
97
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: DropdownMenuComponent, isStandalone: true, selector: "lu-dropdown-menu", ngImport: i0, template: "<div class=\"dropdown\">\n\t<ul class=\"dropdown-list\">\n\t\t<ng-content />\n\t</ul>\n</div>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
98
98
|
}
|
|
99
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
99
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: DropdownMenuComponent, decorators: [{
|
|
100
100
|
type: Component,
|
|
101
101
|
args: [{ selector: 'lu-dropdown-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"dropdown\">\n\t<ul class=\"dropdown-list\">\n\t\t<ng-content />\n\t</ul>\n</div>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"] }]
|
|
102
102
|
}] });
|
|
@@ -124,8 +124,8 @@ class LuDropdownItemDirective extends ALuDropdownItem {
|
|
|
124
124
|
ngOnDestroy() {
|
|
125
125
|
this.onSelect.complete();
|
|
126
126
|
}
|
|
127
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
128
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
127
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownItemDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
128
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.8", type: LuDropdownItemDirective, isStandalone: true, selector: "[luDropdownItem]", outputs: { onSelect: "onSelect" }, host: { listeners: { "click": "onClick($event)", "keydown.enter": "onEnter($event)" } }, providers: [
|
|
129
129
|
{
|
|
130
130
|
provide: ALuDropdownItem,
|
|
131
131
|
useExisting: forwardRef(() => LuDropdownItemDirective),
|
|
@@ -133,7 +133,7 @@ class LuDropdownItemDirective extends ALuDropdownItem {
|
|
|
133
133
|
},
|
|
134
134
|
], exportAs: ["LuDropdownItem"], usesInheritance: true, ngImport: i0 }); }
|
|
135
135
|
}
|
|
136
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
136
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownItemDirective, decorators: [{
|
|
137
137
|
type: Directive,
|
|
138
138
|
args: [{
|
|
139
139
|
selector: '[luDropdownItem]',
|
|
@@ -160,11 +160,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
160
160
|
* @deprecated use `LuDropdownItemDirective` instead
|
|
161
161
|
*/
|
|
162
162
|
class LuDropdownItemModule {
|
|
163
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
164
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
165
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
163
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownItemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
164
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownItemModule, imports: [LuDropdownItemDirective], exports: [LuDropdownItemDirective] }); }
|
|
165
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownItemModule }); }
|
|
166
166
|
}
|
|
167
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownItemModule, decorators: [{
|
|
168
168
|
type: NgModule,
|
|
169
169
|
args: [{
|
|
170
170
|
imports: [LuDropdownItemDirective],
|
|
@@ -249,10 +249,10 @@ class LuDropdownPanelComponent extends ALuPopoverPanel {
|
|
|
249
249
|
firstItem.focus();
|
|
250
250
|
}
|
|
251
251
|
}
|
|
252
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
253
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.
|
|
252
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
253
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.8", type: LuDropdownPanelComponent, isStandalone: true, selector: "lu-dropdown", inputs: { inputPanelClasses: ["panel-classes", "inputPanelClasses"], inputContentClasses: ["content-classes", "inputContentClasses"] }, outputs: { close: "close", open: "open", hovered: "hovered" }, queries: [{ propertyName: "optionsQL", predicate: ALuDropdownItem, descendants: true }], viewQueries: [{ propertyName: "vcTemplateRef", first: true, predicate: TemplateRef, descendants: true, static: true }], exportAs: ["LuDropdownPanel"], usesInheritance: true, ngImport: i0, template: "<ng-template>\n\t<div\n\t\tclass=\"lu-dropdown-panel lu-popover-panel\"\n\t\t[class]=\"panelClassesMap\"\n\t\t(keydown)=\"_handleKeydown($event)\"\n\t\t(click)=\"onClick()\"\n\t\t(mouseover)=\"onMouseOver()\"\n\t\t(mouseleave)=\"onMouseLeave()\"\n\t\t(mousedown)=\"onMouseDown()\"\n\t\t[attr.id]=\"panelId\"\n\t\t[attr.aria-labelledby]=\"triggerId\"\n\t\t[@transformPopover]=\"'enter'\"\n\t>\n\t\t<div class=\"lu-popover-content dropdown\" [class]=\"contentClassesMap\">\n\t\t\t<ul class=\"dropdown-list\">\n\t\t\t\t<ng-content />\n\t\t\t</ul>\n\t\t</div>\n\t</div>\n</ng-template>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"], animations: [luTransformPopover], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
254
254
|
}
|
|
255
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
255
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownPanelComponent, decorators: [{
|
|
256
256
|
type: Component,
|
|
257
257
|
args: [{ selector: 'lu-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, animations: [luTransformPopover], exportAs: 'LuDropdownPanel', encapsulation: ViewEncapsulation.None, template: "<ng-template>\n\t<div\n\t\tclass=\"lu-dropdown-panel lu-popover-panel\"\n\t\t[class]=\"panelClassesMap\"\n\t\t(keydown)=\"_handleKeydown($event)\"\n\t\t(click)=\"onClick()\"\n\t\t(mouseover)=\"onMouseOver()\"\n\t\t(mouseleave)=\"onMouseLeave()\"\n\t\t(mousedown)=\"onMouseDown()\"\n\t\t[attr.id]=\"panelId\"\n\t\t[attr.aria-labelledby]=\"triggerId\"\n\t\t[@transformPopover]=\"'enter'\"\n\t>\n\t\t<div class=\"lu-popover-content dropdown\" [class]=\"contentClassesMap\">\n\t\t\t<ul class=\"dropdown-list\">\n\t\t\t\t<ng-content />\n\t\t\t</ul>\n\t\t</div>\n\t</div>\n</ng-template>\n", styles: ["@layer components{.dropdown,.lu-dropdown-content.lu-popover-content{--components-dropdown-minInlineSize: 10rem;--components-dropdown-maxInlineSize: 30rem;--components-dropdown-maxBlockSize: min(60vh, 30rem);--components-dropdown-list-option-action-color: currentColor;--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: auto;padding:0!important;border-radius:var(--pr-t-border-radius-structure);min-inline-size:var(--components-dropdown-minInlineSize);max-inline-size:var(--components-dropdown-maxInlineSize);max-block-size:var(--components-dropdown-maxBlockSize);overflow-x:hidden;overflow-y:auto}.dropdown-list,.lu-dropdown-options{list-style-type:none;padding-block:var(--pr-t-spacings-50);padding-inline:0;margin:0;display:flex;flex-direction:column;gap:var(--pr-t-spacings-25)}.dropdown-list .dropdown-list,.lu-dropdown-options .dropdown-list,.dropdown-list-option,.lu-dropdown-options-item{padding-block:0}.dropdown-list-option:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider),.lu-dropdown-options-item:not(:has(.divider.dropdown-list-option-divider,.dropdown-list-option),.dropdown-list-option.mod-divider,.lu-dropdown-options-item.mod-divider){padding-inline:var(--pr-t-spacings-50)}.dropdown-list-option:has(>.dropdown-list),.lu-dropdown-options-item:has(>.dropdown-list){padding-block-start:var(--pr-t-spacings-100);padding-inline:var(--pr-t-spacings-150);color:var(--pr-t-color-text-subtle);font:var(--pr-t-font-body-S);font-weight:var(--pr-t-font-fontWeight-semibold)}.dropdown-list-option>.dropdown-list,.lu-dropdown-options-item>.dropdown-list{color:var(--pr-t-color-text);font:var(--pr-t-font-body-M);font-weight:var(--pr-t-font-fontWeight-regular);margin-block-start:var(--pr-t-spacings-50);margin-inline:calc(var(--pr-t-spacings-150) * -1)}.dropdown-list-option-action,.lu-dropdown-options-item-action{border:0;border-radius:var(--pr-t-border-radius-default);background-color:var(--components-dropdown-list-option-action-backgroundColor);display:flex;align-items:flex-start;gap:var(--pr-t-spacings-100);line-height:var(--pr-t-font-body-M-lineHeight);padding:var(--pr-t-spacings-50) var(--pr-t-spacings-100);text-align:left;transition:background-color var(--commons-animations-durations-fast);text-decoration:none;inline-size:100%;pointer-events:var(--components-dropdown-list-option-action-pointerEvents);cursor:pointer}.dropdown-list-option-action .lucca-icon,.lu-dropdown-options-item-action .lucca-icon{--icon-size: 1.25rem;margin-block:var(--pr-t-spacings-25)}.dropdown-list-option-action,.dropdown-list-option-action:hover,.lu-dropdown-options-item-action,.lu-dropdown-options-item-action:hover{color:var(--components-dropdown-list-option-action-color)}.dropdown-list-option-action:hover,.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:hover,.lu-dropdown-options-item-action:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-50)}.dropdown-list-option-action:active,.lu-dropdown-options-item-action:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-100)}.dropdown-list-option-action:focus-visible,.lu-dropdown-options-item-action:focus-visible{outline:2px solid var(--palettes-product-700);outline-offset:0;z-index:1;position:relative}.divider.dropdown-list-option-divider{--components-divider-marginBlock: var(--pr-t-spacings-25)}}@layer mods{.dropdown-list-option-action[disabled],.dropdown-list-option-action.is-disabled,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action.is-disabled{--components-dropdown-list-option-action-color: var(--pr-t-color-text-disabled);--components-dropdown-list-option-action-backgroundColor: transparent;--components-dropdown-list-option-action-pointerEvents: none}.dropdown-list-option-action[disabled],.dropdown-list-option-action[disabled]:hover,.dropdown-list-option-action.is-disabled,.dropdown-list-option-action.is-disabled:hover,.lu-dropdown-options-item-action[disabled],.lu-dropdown-options-item-action[disabled]:hover,.lu-dropdown-options-item-action.is-disabled,.lu-dropdown-options-item-action.is-disabled:hover{--components-dropdown-list-option-action-backgroundColor: var(--palettes-neutral-0)}.dropdown-list-option-action.mod-critical,.dropdown-list-option-action.mod-delete,.lu-dropdown-options-item-action.mod-critical,.lu-dropdown-options-item-action.mod-delete{--components-dropdown-list-option-action-color: var(--pr-t-color-text-critical)}.dropdown-list-option-action.mod-critical:hover,.dropdown-list-option-action.mod-critical:focus-visible,.dropdown-list-option-action.mod-delete:hover,.dropdown-list-option-action.mod-delete:focus-visible,.lu-dropdown-options-item-action.mod-critical:hover,.lu-dropdown-options-item-action.mod-critical:focus-visible,.lu-dropdown-options-item-action.mod-delete:hover,.lu-dropdown-options-item-action.mod-delete:focus-visible{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-50)}.dropdown-list-option-action.mod-critical:active,.dropdown-list-option-action.mod-delete:active,.lu-dropdown-options-item-action.mod-critical:active,.lu-dropdown-options-item-action.mod-delete:active{--components-dropdown-list-option-action-backgroundColor: var(--palettes-critical-100)}}\n"] }]
|
|
258
258
|
}], ctorParameters: () => [], propDecorators: { inputPanelClasses: [{
|
|
@@ -279,11 +279,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
279
279
|
* @deprecated use `LuDropdownPanelComponent` instead
|
|
280
280
|
*/
|
|
281
281
|
class LuDropdownPanelModule {
|
|
282
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
283
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
284
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
282
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
283
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownPanelModule, imports: [LuDropdownPanelComponent], exports: [LuDropdownPanelComponent] }); }
|
|
284
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownPanelModule }); }
|
|
285
285
|
}
|
|
286
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
286
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownPanelModule, decorators: [{
|
|
287
287
|
type: NgModule,
|
|
288
288
|
args: [{
|
|
289
289
|
imports: [LuDropdownPanelComponent],
|
|
@@ -426,10 +426,10 @@ class LuDropdownTriggerDirective {
|
|
|
426
426
|
}
|
|
427
427
|
return x;
|
|
428
428
|
}
|
|
429
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
430
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
429
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
430
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.8", type: LuDropdownTriggerDirective, isStandalone: true, selector: "[luDropdown]", inputs: { inputPanel: ["luDropdown", "inputPanel"] }, host: { properties: { "attr.aria-expanded": "popover2.opened()" } }, exportAs: ["LuDropdownTrigger"], hostDirectives: [{ directive: i1.PopoverDirective, inputs: ["luPopoverPosition", "luDropdownPosition", "luPopoverDisabled", "luDropdownDisabled", "customPositions", "customPositions"], outputs: ["luPopoverOpened", "luDropdownOnOpen", "luPopoverClosed", "luDropdownOnClose"] }], ngImport: i0 }); }
|
|
431
431
|
}
|
|
432
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
432
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownTriggerDirective, decorators: [{
|
|
433
433
|
type: Directive,
|
|
434
434
|
args: [{
|
|
435
435
|
selector: '[luDropdown]',
|
|
@@ -454,11 +454,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
454
454
|
* @deprecated use `LuDropdownTriggerDirective` instead
|
|
455
455
|
*/
|
|
456
456
|
class LuDropdownTriggerModule {
|
|
457
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
458
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
459
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
457
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownTriggerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
458
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownTriggerModule, imports: [LuDropdownTriggerDirective], exports: [LuDropdownTriggerDirective] }); }
|
|
459
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownTriggerModule }); }
|
|
460
460
|
}
|
|
461
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
461
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownTriggerModule, decorators: [{
|
|
462
462
|
type: NgModule,
|
|
463
463
|
args: [{
|
|
464
464
|
imports: [LuDropdownTriggerDirective],
|
|
@@ -470,11 +470,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
470
470
|
* @deprecated use `LuDropdownTriggerDirective, LuDropdownPanelComponent, LuDropdownItemDirective` instead
|
|
471
471
|
*/
|
|
472
472
|
class LuDropdownModule {
|
|
473
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
474
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
475
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
473
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
474
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownModule, imports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule], exports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule] }); }
|
|
475
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownModule, imports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule, LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule] }); }
|
|
476
476
|
}
|
|
477
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
477
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: LuDropdownModule, decorators: [{
|
|
478
478
|
type: NgModule,
|
|
479
479
|
args: [{
|
|
480
480
|
imports: [LuDropdownTriggerModule, LuDropdownPanelModule, LuDropdownItemModule],
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, numberAttribute, ViewEncapsulation, ChangeDetectionStrategy, Component,
|
|
2
|
+
import { input, numberAttribute, ViewEncapsulation, ChangeDetectionStrategy, Component, computed, booleanAttribute } from '@angular/core';
|
|
3
3
|
import { PortalDirective } from '@lucca-front/ng/core';
|
|
4
4
|
import { LuSafeExternalSvgPipe } from '@lucca-front/ng/safe-content';
|
|
5
|
+
import { BubbleIllustrationComponent } from '@lucca-front/ng/bubble-illustration';
|
|
5
6
|
|
|
6
7
|
class EmptyStatePageComponent {
|
|
7
8
|
constructor() {
|
|
@@ -29,57 +30,82 @@ class EmptyStatePageComponent {
|
|
|
29
30
|
* Background color for content (text)
|
|
30
31
|
*/
|
|
31
32
|
this.contentBackgroundColor = input('var(--pr-t-elevation-surface-default)', ...(ngDevMode ? [{ debugName: "contentBackgroundColor" }] : []));
|
|
32
|
-
/**
|
|
33
|
-
* Add content above heading
|
|
34
|
-
*/
|
|
35
33
|
this.slotTop = input(...(ngDevMode ? [undefined, { debugName: "slotTop" }] : []));
|
|
36
34
|
this.heading = input(...(ngDevMode ? [undefined, { debugName: "heading" }] : []));
|
|
37
35
|
this.description = input(...(ngDevMode ? [undefined, { debugName: "description" }] : []));
|
|
38
36
|
this.hx = input(1, { ...(ngDevMode ? { debugName: "hx" } : {}), transform: numberAttribute });
|
|
39
37
|
}
|
|
40
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
41
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
38
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: EmptyStatePageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
39
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: EmptyStatePageComponent, isStandalone: true, selector: "lu-empty-state-page", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, topRightBackground: { classPropertyName: "topRightBackground", publicName: "topRightBackground", isSignal: true, isRequired: false, transformFunction: null }, topRightForeground: { classPropertyName: "topRightForeground", publicName: "topRightForeground", isSignal: true, isRequired: false, transformFunction: null }, bottomLeftBackground: { classPropertyName: "bottomLeftBackground", publicName: "bottomLeftBackground", isSignal: true, isRequired: false, transformFunction: null }, bottomLeftForeground: { classPropertyName: "bottomLeftForeground", publicName: "bottomLeftForeground", isSignal: true, isRequired: false, transformFunction: null }, contentBackgroundColor: { classPropertyName: "contentBackgroundColor", publicName: "contentBackgroundColor", isSignal: true, isRequired: false, transformFunction: null }, slotTop: { classPropertyName: "slotTop", publicName: "slotTop", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, hx: { classPropertyName: "hx", publicName: "hx", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "emptyState-wrapper" }, ngImport: i0, template: "<section\n\tclass=\"emptyState mod-page\"\n\t[attr.role]=\"heading() ? null : 'presentation'\"\n\t[style.--components-emptyState-background-color]=\"contentBackgroundColor()\"\n\tstyle.--components-emptyState-illustration-background-bottom-left=\"url({{ bottomLeftBackground() }})\"\n\tstyle.--components-emptyState-illustration-foreground-bottom-left=\"url({{ bottomLeftForeground() }})\"\n\tstyle.--components-emptyState-illustration-background-top-right=\"url({{ topRightBackground() }})\"\n\tstyle.--components-emptyState-illustration-foreground-top-right=\"url({{ topRightForeground() }})\"\n>\n\t<div class=\"emptyState-container\">\n\t\t<div class=\"emptyState-content\">\n\t\t\t@if (icon()) {\n\t\t\t\t<div class=\"emptyState-content-icon\" aria-hidden=\"true\" [innerHtml]=\"icon() | luSafeExternalSvg\"></div>\n\t\t\t}\n\t\t\t<div class=\"emptyState-content-text\">\n\t\t\t\t@if (slotTop()) {\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<ng-container *luPortal=\"slotTop()\" />\n\t\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t\t@if (heading()) {\n\t\t\t\t\t<div role=\"heading\" [attr.aria-level]=\"hx()\" class=\"emptyState-content-heading\">{{ heading() }}</div>\n\t\t\t\t}\n\t\t\t\t@if (description()) {\n\t\t\t\t\t<p class=\"emptyState-content-description\">\n\t\t\t\t\t\t<ng-container *luPortal=\"description()\" />\n\t\t\t\t\t</p>\n\t\t\t\t}\n\t\t\t\t<div class=\"emptyState-actions\">\n\t\t\t\t\t<ng-content />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</section>\n", styles: ["@layer components{.emptyState{--components-emptyState-container-maxWidth: calc(100vw - var(--commons-navSide-width) - 7rem);--components-emptyState-container-left: calc(var(--commons-navSide-width) + var(--pr-t-spacings-400));--components-emptyState-container-position: static;--components-emptyState-background-color: var(--pr-t-elevation-surface-default);--components-emptyState-illustration-top-right-offset-left: min( calc(100% + 5rem) , calc(var(--components-emptyState-container-maxWidth) - 8.5rem) );--components-emptyState-illustration-top-right-offset-left-S: min( calc(100% + 3.5rem) , calc(var(--components-emptyState-container-maxWidth) - 8.5rem) );--background-left-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/bubbles-bottom-left-01.svg);--foreground-left-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/core-hr-01.svg);--background-right-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/bubbles-top-right-01.svg);--foreground-right-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/generic/coffee-01.svg);--components-emptyState-illustration-background-bottom-left: var(--background-left-01);--components-emptyState-illustration-foreground-bottom-left: var(--foreground-left-01);--components-emptyState-illustration-background-top-right: var(--background-right-01);--components-emptyState-illustration-foreground-top-right: var(--foreground-right-01);display:flex;flex-direction:column;flex-grow:1;padding:var(--pr-t-spacings-200)}.emptyState-container{align-items:center;display:flex;flex-grow:1;justify-content:center;max-inline-size:var(--components-emptyState-container-maxWidth);inset-inline-start:var(--components-emptyState-container-left);padding:0;inline-size:100%;position:var(--components-emptyState-container-position)}.emptyState-content{border-radius:var(--pr-t-border-radius-structure);max-inline-size:100%;padding:var(--pr-t-spacings-50);inline-size:calc(25rem + var(--pr-t-spacings-50) * 2)}.emptyState-content-icon{--components-emptyState-icon-background-color: var(--palettes-100, var(--palettes-product-100));--components-emptyState-icon-action-color: var(--palettes-600, var(--palettes-brand-600));display:inline-flex;margin-block-end:var(--pr-t-spacings-200)}.emptyState-content-text{padding-inline:var(--pr-t-spacings-50)}.emptyState-content-heading{font:var(--pr-t-font-heading-3);margin-block-end:var(--pr-t-spacings-50)}.emptyState-content-description{margin:0}.emptyState-actions{display:flex;flex-wrap:wrap;align-items:center;margin-block-start:var(--pr-t-spacings-200);gap:var(--pr-t-spacings-200)}.emptyState-actions .button{margin:0}.emptyState-actions:empty{display:none}}@layer mods{.emptyState.mod-page{--components-emptyState-container-maxWidth: var(--commons-container-maxWidth);background-image:var(--components-emptyState-illustration-foreground-bottom-left),var(--components-emptyState-illustration-background-bottom-left),var(--components-emptyState-illustration-foreground-top-right),var(--components-emptyState-illustration-background-top-right);background-repeat:no-repeat;background-position:bottom left,bottom left,top left var(--components-emptyState-illustration-top-right-offset-left),top left var(--components-emptyState-illustration-top-right-offset-left)}@media not all and (min-width:50em){.emptyState.mod-page{background-position:bottom left,bottom left,top left var(--components-emptyState-illustration-top-right-offset-left-S),top left var(--components-emptyState-illustration-top-right-offset-left-S);background-size:auto 10.875rem}}.emptyState.mod-page .emptyState-content{background-color:var(--components-emptyState-background-color);box-shadow:0 0 8px 4px var(--components-emptyState-background-color)}.emptyState.mod-page .emptyState-content-text{padding:0}.emptyState.mod-page .emptyState-content-heading{font:var(--pr-t-font-heading-1)}@media not all and (min-width:30em){.emptyState.mod-page .emptyState-content-heading{font:var(--pr-t-font-heading-2)}}@media not all and (min-width:30em){.emptyState.mod-page .emptyState-actions .button{flex-basis:100%}}.emptyState.mod-center{text-align:center}.emptyState.mod-center .emptyState-actions{justify-content:center}.table .emptyState,.indexTable .emptyState,.dataTable .emptyState{--components-emptyState-container-position: sticky}.container .emptyState{--components-emptyState-container-maxWidth: none;--components-emptyState-container-left: auto}}@layer components{.emptyState-wrapper{display:flex;flex-direction:column;flex-grow:1}}\n"], dependencies: [{ kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "pipe", type: LuSafeExternalSvgPipe, name: "luSafeExternalSvg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
42
40
|
}
|
|
43
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
41
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: EmptyStatePageComponent, decorators: [{
|
|
44
42
|
type: Component,
|
|
45
43
|
args: [{ selector: 'lu-empty-state-page', imports: [LuSafeExternalSvgPipe, PortalDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
46
44
|
class: 'emptyState-wrapper',
|
|
47
|
-
}, template: "<section\n\tclass=\"emptyState mod-page\"\n\t[attr.role]=\"heading() ? null : 'presentation'\"\n\t[style.--components-emptyState-background-color]=\"contentBackgroundColor()\"\n\tstyle.--components-emptyState-illustration-background-bottom-left=\"url({{ bottomLeftBackground() }})\"\n\tstyle.--components-emptyState-illustration-foreground-bottom-left=\"url({{ bottomLeftForeground() }})\"\n\tstyle.--components-emptyState-illustration-background-top-right=\"url({{ topRightBackground() }})\"\n\tstyle.--components-emptyState-illustration-foreground-top-right=\"url({{ topRightForeground() }})\"\n>\n\t<div class=\"emptyState-container\">\n\t\t<div class=\"emptyState-content\">\n\t\t\t@if (icon()) {\n\t\t\t\t<div class=\"emptyState-content-icon\" aria-hidden=\"true\" [innerHtml]=\"icon() | luSafeExternalSvg\"></div>\n\t\t\t}\n\t\t\t<div class=\"emptyState-content-text\">\n\t\t\t\t@if (slotTop()) {\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<ng-container *luPortal=\"slotTop()\" />\n\t\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t\t@if (heading()) {\n\t\t\t\t\t<div role=\"heading\" [attr.aria-level]=\"hx()\" class=\"emptyState-content-heading\">{{ heading() }}</div>\n\t\t\t\t}\n\t\t\t\t@if (description()) {\n\t\t\t\t\t<p class=\"emptyState-content-description\">\n\t\t\t\t\t\t<ng-container *luPortal=\"description()\" />\n\t\t\t\t\t</p>\n\t\t\t\t}\n\t\t\t\t<div class=\"emptyState-actions\">\n\t\t\t\t\t<ng-content />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</section>\n", styles: ["@layer components{.emptyState{--components-emptyState-container-maxWidth: calc(100vw - var(--commons-navSide-width) - 7rem);--components-emptyState-container-left: calc(var(--commons-navSide-width) +
|
|
45
|
+
}, template: "<section\n\tclass=\"emptyState mod-page\"\n\t[attr.role]=\"heading() ? null : 'presentation'\"\n\t[style.--components-emptyState-background-color]=\"contentBackgroundColor()\"\n\tstyle.--components-emptyState-illustration-background-bottom-left=\"url({{ bottomLeftBackground() }})\"\n\tstyle.--components-emptyState-illustration-foreground-bottom-left=\"url({{ bottomLeftForeground() }})\"\n\tstyle.--components-emptyState-illustration-background-top-right=\"url({{ topRightBackground() }})\"\n\tstyle.--components-emptyState-illustration-foreground-top-right=\"url({{ topRightForeground() }})\"\n>\n\t<div class=\"emptyState-container\">\n\t\t<div class=\"emptyState-content\">\n\t\t\t@if (icon()) {\n\t\t\t\t<div class=\"emptyState-content-icon\" aria-hidden=\"true\" [innerHtml]=\"icon() | luSafeExternalSvg\"></div>\n\t\t\t}\n\t\t\t<div class=\"emptyState-content-text\">\n\t\t\t\t@if (slotTop()) {\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<ng-container *luPortal=\"slotTop()\" />\n\t\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t\t@if (heading()) {\n\t\t\t\t\t<div role=\"heading\" [attr.aria-level]=\"hx()\" class=\"emptyState-content-heading\">{{ heading() }}</div>\n\t\t\t\t}\n\t\t\t\t@if (description()) {\n\t\t\t\t\t<p class=\"emptyState-content-description\">\n\t\t\t\t\t\t<ng-container *luPortal=\"description()\" />\n\t\t\t\t\t</p>\n\t\t\t\t}\n\t\t\t\t<div class=\"emptyState-actions\">\n\t\t\t\t\t<ng-content />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</section>\n", styles: ["@layer components{.emptyState{--components-emptyState-container-maxWidth: calc(100vw - var(--commons-navSide-width) - 7rem);--components-emptyState-container-left: calc(var(--commons-navSide-width) + var(--pr-t-spacings-400));--components-emptyState-container-position: static;--components-emptyState-background-color: var(--pr-t-elevation-surface-default);--components-emptyState-illustration-top-right-offset-left: min( calc(100% + 5rem) , calc(var(--components-emptyState-container-maxWidth) - 8.5rem) );--components-emptyState-illustration-top-right-offset-left-S: min( calc(100% + 3.5rem) , calc(var(--components-emptyState-container-maxWidth) - 8.5rem) );--background-left-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/bubbles-bottom-left-01.svg);--foreground-left-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/core-hr-01.svg);--background-right-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/bubbles-top-right-01.svg);--foreground-right-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/generic/coffee-01.svg);--components-emptyState-illustration-background-bottom-left: var(--background-left-01);--components-emptyState-illustration-foreground-bottom-left: var(--foreground-left-01);--components-emptyState-illustration-background-top-right: var(--background-right-01);--components-emptyState-illustration-foreground-top-right: var(--foreground-right-01);display:flex;flex-direction:column;flex-grow:1;padding:var(--pr-t-spacings-200)}.emptyState-container{align-items:center;display:flex;flex-grow:1;justify-content:center;max-inline-size:var(--components-emptyState-container-maxWidth);inset-inline-start:var(--components-emptyState-container-left);padding:0;inline-size:100%;position:var(--components-emptyState-container-position)}.emptyState-content{border-radius:var(--pr-t-border-radius-structure);max-inline-size:100%;padding:var(--pr-t-spacings-50);inline-size:calc(25rem + var(--pr-t-spacings-50) * 2)}.emptyState-content-icon{--components-emptyState-icon-background-color: var(--palettes-100, var(--palettes-product-100));--components-emptyState-icon-action-color: var(--palettes-600, var(--palettes-brand-600));display:inline-flex;margin-block-end:var(--pr-t-spacings-200)}.emptyState-content-text{padding-inline:var(--pr-t-spacings-50)}.emptyState-content-heading{font:var(--pr-t-font-heading-3);margin-block-end:var(--pr-t-spacings-50)}.emptyState-content-description{margin:0}.emptyState-actions{display:flex;flex-wrap:wrap;align-items:center;margin-block-start:var(--pr-t-spacings-200);gap:var(--pr-t-spacings-200)}.emptyState-actions .button{margin:0}.emptyState-actions:empty{display:none}}@layer mods{.emptyState.mod-page{--components-emptyState-container-maxWidth: var(--commons-container-maxWidth);background-image:var(--components-emptyState-illustration-foreground-bottom-left),var(--components-emptyState-illustration-background-bottom-left),var(--components-emptyState-illustration-foreground-top-right),var(--components-emptyState-illustration-background-top-right);background-repeat:no-repeat;background-position:bottom left,bottom left,top left var(--components-emptyState-illustration-top-right-offset-left),top left var(--components-emptyState-illustration-top-right-offset-left)}@media not all and (min-width:50em){.emptyState.mod-page{background-position:bottom left,bottom left,top left var(--components-emptyState-illustration-top-right-offset-left-S),top left var(--components-emptyState-illustration-top-right-offset-left-S);background-size:auto 10.875rem}}.emptyState.mod-page .emptyState-content{background-color:var(--components-emptyState-background-color);box-shadow:0 0 8px 4px var(--components-emptyState-background-color)}.emptyState.mod-page .emptyState-content-text{padding:0}.emptyState.mod-page .emptyState-content-heading{font:var(--pr-t-font-heading-1)}@media not all and (min-width:30em){.emptyState.mod-page .emptyState-content-heading{font:var(--pr-t-font-heading-2)}}@media not all and (min-width:30em){.emptyState.mod-page .emptyState-actions .button{flex-basis:100%}}.emptyState.mod-center{text-align:center}.emptyState.mod-center .emptyState-actions{justify-content:center}.table .emptyState,.indexTable .emptyState,.dataTable .emptyState{--components-emptyState-container-position: sticky}.container .emptyState{--components-emptyState-container-maxWidth: none;--components-emptyState-container-left: auto}}@layer components{.emptyState-wrapper{display:flex;flex-direction:column;flex-grow:1}}\n"] }]
|
|
48
46
|
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], topRightBackground: [{ type: i0.Input, args: [{ isSignal: true, alias: "topRightBackground", required: false }] }], topRightForeground: [{ type: i0.Input, args: [{ isSignal: true, alias: "topRightForeground", required: false }] }], bottomLeftBackground: [{ type: i0.Input, args: [{ isSignal: true, alias: "bottomLeftBackground", required: false }] }], bottomLeftForeground: [{ type: i0.Input, args: [{ isSignal: true, alias: "bottomLeftForeground", required: false }] }], contentBackgroundColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentBackgroundColor", required: false }] }], slotTop: [{ type: i0.Input, args: [{ isSignal: true, alias: "slotTop", required: false }] }], heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], hx: [{ type: i0.Input, args: [{ isSignal: true, alias: "hx", required: false }] }] } });
|
|
49
47
|
|
|
48
|
+
const ICON_TO_ILLUSTRATION = {
|
|
49
|
+
Banknote: 'banknote',
|
|
50
|
+
Bell: 'bell',
|
|
51
|
+
Bulb: 'bulb',
|
|
52
|
+
Calendar: 'calendar',
|
|
53
|
+
Chat: 'chat',
|
|
54
|
+
Clock: 'clock',
|
|
55
|
+
Coffee: 'coffee',
|
|
56
|
+
CreditCard: 'paymentCards',
|
|
57
|
+
Folder: 'folder',
|
|
58
|
+
Gift: 'gift',
|
|
59
|
+
Graduate: 'graduate',
|
|
60
|
+
IDCard: 'polaroid',
|
|
61
|
+
Lock: 'lock',
|
|
62
|
+
Mail: 'mail',
|
|
63
|
+
Megaphone: 'megaphone',
|
|
64
|
+
Paint: 'paint',
|
|
65
|
+
Paper: 'invoice',
|
|
66
|
+
Party: 'party',
|
|
67
|
+
Picture: 'picture',
|
|
68
|
+
Poc: 'banknote',
|
|
69
|
+
Rocket: 'rocket',
|
|
70
|
+
Search: 'magnifyingGlass',
|
|
71
|
+
Temperature: 'temperature',
|
|
72
|
+
Thumb: 'thumbUp',
|
|
73
|
+
Warning: 'warning',
|
|
74
|
+
};
|
|
50
75
|
class EmptyStateSectionComponent {
|
|
51
76
|
constructor() {
|
|
52
|
-
/**
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
this.
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
77
|
+
/** @deprecated use illustration and action */
|
|
78
|
+
this.icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : []));
|
|
79
|
+
this.actionIllustration = computed(() => this.action() || this.icon()?.includes('Action.svg'), ...(ngDevMode ? [{ debugName: "actionIllustration" }] : []));
|
|
80
|
+
this.illustration = input(null, ...(ngDevMode ? [{ debugName: "illustration" }] : []));
|
|
81
|
+
this.action = input(false, { ...(ngDevMode ? { debugName: "action" } : {}), transform: booleanAttribute });
|
|
82
|
+
this.iconOrIllustration = computed(() => {
|
|
83
|
+
if (this.icon()) {
|
|
84
|
+
if (this.icon().includes('Success')) {
|
|
85
|
+
return 'thumbUp';
|
|
86
|
+
}
|
|
87
|
+
if (this.icon().includes('Error')) {
|
|
88
|
+
return 'error';
|
|
89
|
+
}
|
|
90
|
+
const iconName = this.icon().split('/').pop().replace('.svg', '').replace('ActionError', '').replace('ActionSuccess', '').replace('Action', '').replace('icon', '');
|
|
91
|
+
return ICON_TO_ILLUSTRATION[iconName];
|
|
92
|
+
}
|
|
93
|
+
return this.illustration();
|
|
94
|
+
}, ...(ngDevMode ? [{ debugName: "iconOrIllustration" }] : []));
|
|
60
95
|
this.palette = input('none', ...(ngDevMode ? [{ debugName: "palette" }] : []));
|
|
61
96
|
this.center = input(false, { ...(ngDevMode ? { debugName: "center" } : {}), transform: booleanAttribute });
|
|
62
|
-
/**
|
|
63
|
-
* The title of the empty state section
|
|
64
|
-
*/
|
|
65
97
|
this.heading = input(...(ngDevMode ? [undefined, { debugName: "heading" }] : []));
|
|
66
|
-
/**
|
|
67
|
-
* The description of the empty state section
|
|
68
|
-
*/
|
|
69
98
|
this.description = input(...(ngDevMode ? [undefined, { debugName: "description" }] : []));
|
|
70
|
-
/**
|
|
71
|
-
* Define the aria level of the title
|
|
72
|
-
*/
|
|
73
99
|
this.hx = input(3, { ...(ngDevMode ? { debugName: "hx" } : {}), transform: numberAttribute });
|
|
74
100
|
this.emptyStateClasses = computed(() => ({ [`palette-${this.palette()}`]: !!this.palette() }), ...(ngDevMode ? [{ debugName: "emptyStateClasses" }] : []));
|
|
75
101
|
}
|
|
76
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
77
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
102
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: EmptyStateSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
103
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: EmptyStateSectionComponent, isStandalone: true, selector: "lu-empty-state-section", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, illustration: { classPropertyName: "illustration", publicName: "illustration", isSignal: true, isRequired: false, transformFunction: null }, action: { classPropertyName: "action", publicName: "action", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, center: { classPropertyName: "center", publicName: "center", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, hx: { classPropertyName: "hx", publicName: "hx", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<section class=\"emptyState\" [class.mod-center]=\"center()\" [attr.role]=\"heading() ? null : 'presentation'\">\n\t<div class=\"emptyState-container\">\n\t\t<div class=\"emptyState-content\">\n\t\t\t@if (iconOrIllustration()) {\n\t\t\t\t<div class=\"emptyState-content-icon\">\n\t\t\t\t\t<lu-bubble-illustration [action]=\"actionIllustration()\" [illustration]=\"iconOrIllustration()\" size=\"L\" [palette]=\"palette()\" />\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t<div class=\"emptyState-content-text\">\n\t\t\t\t@if (heading()) {\n\t\t\t\t\t<div role=\"heading\" [attr.aria-level]=\"hx()\" class=\"emptyState-content-heading\">{{ heading() }}</div>\n\t\t\t\t}\n\t\t\t\t@if (description()) {\n\t\t\t\t\t<p class=\"emptyState-content-description\">\n\t\t\t\t\t\t<ng-container *luPortal=\"description()\" />\n\t\t\t\t\t</p>\n\t\t\t\t}\n\t\t\t\t<div class=\"emptyState-actions\">\n\t\t\t\t\t<ng-content />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</section>\n", styles: ["@layer components{.emptyState{--components-emptyState-container-maxWidth: calc(100vw - var(--commons-navSide-width) - 7rem);--components-emptyState-container-left: calc(var(--commons-navSide-width) + var(--pr-t-spacings-400));--components-emptyState-container-position: static;--components-emptyState-background-color: var(--pr-t-elevation-surface-default);--components-emptyState-illustration-top-right-offset-left: min( calc(100% + 5rem) , calc(var(--components-emptyState-container-maxWidth) - 8.5rem) );--components-emptyState-illustration-top-right-offset-left-S: min( calc(100% + 3.5rem) , calc(var(--components-emptyState-container-maxWidth) - 8.5rem) );--background-left-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/bubbles-bottom-left-01.svg);--foreground-left-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/core-hr-01.svg);--background-right-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/bubbles-top-right-01.svg);--foreground-right-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/generic/coffee-01.svg);--components-emptyState-illustration-background-bottom-left: var(--background-left-01);--components-emptyState-illustration-foreground-bottom-left: var(--foreground-left-01);--components-emptyState-illustration-background-top-right: var(--background-right-01);--components-emptyState-illustration-foreground-top-right: var(--foreground-right-01);display:flex;flex-direction:column;flex-grow:1;padding:var(--pr-t-spacings-200)}.emptyState-container{align-items:center;display:flex;flex-grow:1;justify-content:center;max-inline-size:var(--components-emptyState-container-maxWidth);inset-inline-start:var(--components-emptyState-container-left);padding:0;inline-size:100%;position:var(--components-emptyState-container-position)}.emptyState-content{border-radius:var(--pr-t-border-radius-structure);max-inline-size:100%;padding:var(--pr-t-spacings-50);inline-size:calc(25rem + var(--pr-t-spacings-50) * 2)}.emptyState-content-icon{--components-emptyState-icon-background-color: var(--palettes-100, var(--palettes-product-100));--components-emptyState-icon-action-color: var(--palettes-600, var(--palettes-brand-600));display:inline-flex;margin-block-end:var(--pr-t-spacings-200)}.emptyState-content-text{padding-inline:var(--pr-t-spacings-50)}.emptyState-content-heading{font:var(--pr-t-font-heading-3);margin-block-end:var(--pr-t-spacings-50)}.emptyState-content-description{margin:0}.emptyState-actions{display:flex;flex-wrap:wrap;align-items:center;margin-block-start:var(--pr-t-spacings-200);gap:var(--pr-t-spacings-200)}.emptyState-actions .button{margin:0}.emptyState-actions:empty{display:none}}@layer mods{.emptyState.mod-page{--components-emptyState-container-maxWidth: var(--commons-container-maxWidth);background-image:var(--components-emptyState-illustration-foreground-bottom-left),var(--components-emptyState-illustration-background-bottom-left),var(--components-emptyState-illustration-foreground-top-right),var(--components-emptyState-illustration-background-top-right);background-repeat:no-repeat;background-position:bottom left,bottom left,top left var(--components-emptyState-illustration-top-right-offset-left),top left var(--components-emptyState-illustration-top-right-offset-left)}@media not all and (min-width:50em){.emptyState.mod-page{background-position:bottom left,bottom left,top left var(--components-emptyState-illustration-top-right-offset-left-S),top left var(--components-emptyState-illustration-top-right-offset-left-S);background-size:auto 10.875rem}}.emptyState.mod-page .emptyState-content{background-color:var(--components-emptyState-background-color);box-shadow:0 0 8px 4px var(--components-emptyState-background-color)}.emptyState.mod-page .emptyState-content-text{padding:0}.emptyState.mod-page .emptyState-content-heading{font:var(--pr-t-font-heading-1)}@media not all and (min-width:30em){.emptyState.mod-page .emptyState-content-heading{font:var(--pr-t-font-heading-2)}}@media not all and (min-width:30em){.emptyState.mod-page .emptyState-actions .button{flex-basis:100%}}.emptyState.mod-center{text-align:center}.emptyState.mod-center .emptyState-actions{justify-content:center}.table .emptyState,.indexTable .emptyState,.dataTable .emptyState{--components-emptyState-container-position: sticky}.container .emptyState{--components-emptyState-container-maxWidth: none;--components-emptyState-container-left: auto}}@layer base{lu-empty-state-section{inline-size:100%}}\n"], dependencies: [{ kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "component", type: BubbleIllustrationComponent, selector: "lu-bubble-illustration", inputs: ["illustration", "palette", "size", "action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
78
104
|
}
|
|
79
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
105
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: EmptyStateSectionComponent, decorators: [{
|
|
80
106
|
type: Component,
|
|
81
|
-
args: [{ selector: 'lu-empty-state-section', imports: [LuSafeExternalSvgPipe, PortalDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<section class=\"emptyState\" [class.mod-center]=\"center()\" [attr.role]=\"heading() ? null : 'presentation'\">\n\t<div class=\"emptyState-container\">\n\t\t<div class=\"emptyState-content\">\n\t\t\t@if (
|
|
82
|
-
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }], center: [{ type: i0.Input, args: [{ isSignal: true, alias: "center", required: false }] }], heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], hx: [{ type: i0.Input, args: [{ isSignal: true, alias: "hx", required: false }] }] } });
|
|
107
|
+
args: [{ selector: 'lu-empty-state-section', imports: [LuSafeExternalSvgPipe, PortalDirective, BubbleIllustrationComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<section class=\"emptyState\" [class.mod-center]=\"center()\" [attr.role]=\"heading() ? null : 'presentation'\">\n\t<div class=\"emptyState-container\">\n\t\t<div class=\"emptyState-content\">\n\t\t\t@if (iconOrIllustration()) {\n\t\t\t\t<div class=\"emptyState-content-icon\">\n\t\t\t\t\t<lu-bubble-illustration [action]=\"actionIllustration()\" [illustration]=\"iconOrIllustration()\" size=\"L\" [palette]=\"palette()\" />\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t<div class=\"emptyState-content-text\">\n\t\t\t\t@if (heading()) {\n\t\t\t\t\t<div role=\"heading\" [attr.aria-level]=\"hx()\" class=\"emptyState-content-heading\">{{ heading() }}</div>\n\t\t\t\t}\n\t\t\t\t@if (description()) {\n\t\t\t\t\t<p class=\"emptyState-content-description\">\n\t\t\t\t\t\t<ng-container *luPortal=\"description()\" />\n\t\t\t\t\t</p>\n\t\t\t\t}\n\t\t\t\t<div class=\"emptyState-actions\">\n\t\t\t\t\t<ng-content />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</section>\n", styles: ["@layer components{.emptyState{--components-emptyState-container-maxWidth: calc(100vw - var(--commons-navSide-width) - 7rem);--components-emptyState-container-left: calc(var(--commons-navSide-width) + var(--pr-t-spacings-400));--components-emptyState-container-position: static;--components-emptyState-background-color: var(--pr-t-elevation-surface-default);--components-emptyState-illustration-top-right-offset-left: min( calc(100% + 5rem) , calc(var(--components-emptyState-container-maxWidth) - 8.5rem) );--components-emptyState-illustration-top-right-offset-left-S: min( calc(100% + 3.5rem) , calc(var(--components-emptyState-container-maxWidth) - 8.5rem) );--background-left-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/bubbles-bottom-left-01.svg);--foreground-left-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/core-hr-01.svg);--background-right-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/poplee/bubbles-top-right-01.svg);--foreground-right-01: url(https://cdn.lucca.fr/lucca-front/assets/empty-states/generic/coffee-01.svg);--components-emptyState-illustration-background-bottom-left: var(--background-left-01);--components-emptyState-illustration-foreground-bottom-left: var(--foreground-left-01);--components-emptyState-illustration-background-top-right: var(--background-right-01);--components-emptyState-illustration-foreground-top-right: var(--foreground-right-01);display:flex;flex-direction:column;flex-grow:1;padding:var(--pr-t-spacings-200)}.emptyState-container{align-items:center;display:flex;flex-grow:1;justify-content:center;max-inline-size:var(--components-emptyState-container-maxWidth);inset-inline-start:var(--components-emptyState-container-left);padding:0;inline-size:100%;position:var(--components-emptyState-container-position)}.emptyState-content{border-radius:var(--pr-t-border-radius-structure);max-inline-size:100%;padding:var(--pr-t-spacings-50);inline-size:calc(25rem + var(--pr-t-spacings-50) * 2)}.emptyState-content-icon{--components-emptyState-icon-background-color: var(--palettes-100, var(--palettes-product-100));--components-emptyState-icon-action-color: var(--palettes-600, var(--palettes-brand-600));display:inline-flex;margin-block-end:var(--pr-t-spacings-200)}.emptyState-content-text{padding-inline:var(--pr-t-spacings-50)}.emptyState-content-heading{font:var(--pr-t-font-heading-3);margin-block-end:var(--pr-t-spacings-50)}.emptyState-content-description{margin:0}.emptyState-actions{display:flex;flex-wrap:wrap;align-items:center;margin-block-start:var(--pr-t-spacings-200);gap:var(--pr-t-spacings-200)}.emptyState-actions .button{margin:0}.emptyState-actions:empty{display:none}}@layer mods{.emptyState.mod-page{--components-emptyState-container-maxWidth: var(--commons-container-maxWidth);background-image:var(--components-emptyState-illustration-foreground-bottom-left),var(--components-emptyState-illustration-background-bottom-left),var(--components-emptyState-illustration-foreground-top-right),var(--components-emptyState-illustration-background-top-right);background-repeat:no-repeat;background-position:bottom left,bottom left,top left var(--components-emptyState-illustration-top-right-offset-left),top left var(--components-emptyState-illustration-top-right-offset-left)}@media not all and (min-width:50em){.emptyState.mod-page{background-position:bottom left,bottom left,top left var(--components-emptyState-illustration-top-right-offset-left-S),top left var(--components-emptyState-illustration-top-right-offset-left-S);background-size:auto 10.875rem}}.emptyState.mod-page .emptyState-content{background-color:var(--components-emptyState-background-color);box-shadow:0 0 8px 4px var(--components-emptyState-background-color)}.emptyState.mod-page .emptyState-content-text{padding:0}.emptyState.mod-page .emptyState-content-heading{font:var(--pr-t-font-heading-1)}@media not all and (min-width:30em){.emptyState.mod-page .emptyState-content-heading{font:var(--pr-t-font-heading-2)}}@media not all and (min-width:30em){.emptyState.mod-page .emptyState-actions .button{flex-basis:100%}}.emptyState.mod-center{text-align:center}.emptyState.mod-center .emptyState-actions{justify-content:center}.table .emptyState,.indexTable .emptyState,.dataTable .emptyState{--components-emptyState-container-position: sticky}.container .emptyState{--components-emptyState-container-maxWidth: none;--components-emptyState-container-left: auto}}@layer base{lu-empty-state-section{inline-size:100%}}\n"] }]
|
|
108
|
+
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], illustration: [{ type: i0.Input, args: [{ isSignal: true, alias: "illustration", required: false }] }], action: [{ type: i0.Input, args: [{ isSignal: true, alias: "action", required: false }] }], palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }], center: [{ type: i0.Input, args: [{ isSignal: true, alias: "center", required: false }] }], heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], hx: [{ type: i0.Input, args: [{ isSignal: true, alias: "hx", required: false }] }] } });
|
|
83
109
|
|
|
84
110
|
/**
|
|
85
111
|
* Generated bundle index. Do not edit.
|