@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
|
@@ -6,10 +6,10 @@ class HorizontalNavigationLinkDirective {
|
|
|
6
6
|
constructor() {
|
|
7
7
|
this.template = inject(TemplateRef);
|
|
8
8
|
}
|
|
9
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
10
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
9
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: HorizontalNavigationLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
10
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.8", type: HorizontalNavigationLinkDirective, isStandalone: true, selector: "[luHorizontalNavigationLink]", ngImport: i0 }); }
|
|
11
11
|
}
|
|
12
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
12
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: HorizontalNavigationLinkDirective, decorators: [{
|
|
13
13
|
type: Directive,
|
|
14
14
|
args: [{
|
|
15
15
|
selector: '[luHorizontalNavigationLink]',
|
|
@@ -22,22 +22,19 @@ class HorizontalNavigationComponent {
|
|
|
22
22
|
this.noBorder = input(false, { ...(ngDevMode ? { debugName: "noBorder" } : {}), transform: booleanAttribute });
|
|
23
23
|
this.container = input(false, { ...(ngDevMode ? { debugName: "container" } : {}), transform: booleanAttribute });
|
|
24
24
|
this.vertical = input(false, { ...(ngDevMode ? { debugName: "vertical" } : {}), transform: booleanAttribute });
|
|
25
|
-
/**
|
|
26
|
-
* Which size should the horizontal navigation be? Defaults and small
|
|
27
|
-
*/
|
|
28
25
|
this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
29
26
|
}
|
|
30
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
31
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: HorizontalNavigationComponent, isStandalone: true, selector: "lu-horizontal-navigation", inputs: { noBorder: { classPropertyName: "noBorder", publicName: "noBorder", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-noBorder": "noBorder()", "class.mod-S": "size() === `S`", "class.mod-vertical": "vertical()" }, classAttribute: "horizontalNavigation" }, queries: [{ propertyName: "links", predicate: HorizontalNavigationLinkDirective, isSignal: true }], ngImport: i0, template: "@if (container()) {\n\t<div class=\"horizontalNavigation-containerOptional\">\n\t\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n\t</div>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n}\n\n<ng-template #horizontalNavigationList>\n\t<ul class=\"horizontalNavigation-list\">\n\t\t@for (link of links(); track $index) {\n\t\t\t<li class=\"horizontalNavigation-list-item\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"link.template\" />\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n", styles: ["@layer components{.horizontalNavigation,.menu{--components-horizontalNavigation-borderContent: \"\";--components-horizontalNavigation-listPadding: 0;--components-horizontalNavigation-listItemActionPaddingBlock: var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionPaddingInline: 0px;--components-horizontalNavigation-listItemActionPadding: var(--components-horizontalNavigation-listItemActionPaddingBlock) var(--components-horizontalNavigation-listItemActionPaddingInline);--components-horizontalNavigation-listGap: 0 var(--pr-t-spacings-400);--components-horizontalNavigation-listDirection: row;--components-horizontalNavigation-listAlign: flex-end;--components-horizontalNavigation-listItemActionAlign: center;--components-horizontalNavigation-listItemActionTransform: scale(0, 1);--components-horizontalNavigation-listItemActionColor: var(--pr-t-color-text);--components-horizontalNavigation-listItemActionSize: 2px;--components-horizontalNavigation-listItemActionFont: inherit;--components-horizontalNavigation-listItemActionInset: auto 0 0 0;--components-horizontalNavigation-listItemActionRadius: var(--pr-t-border-radius-default) var(--pr-t-border-radius-default) 0 0;--components-horizontalNavigation-listItemActionRadiusWidth: auto;--components-horizontalNavigation-listItemActionRadiusHeight: var(--components-horizontalNavigation-listItemActionSize);column-gap:var(--pr-t-spacings-400);align-items:center;display:flex;position:relative;flex-wrap:wrap;padding:var(--components-horizontalNavigation-listPadding)}.horizontalNavigation:after,.menu:after{content:var(--components-horizontalNavigation-borderContent);border-block-end-width:var(--commons-divider-width);border-block-end-color:var(--commons-divider-color);border-block-end-style:solid;position:absolute;block-size:1px;inset:auto 0 0}.horizontalNavigation .label,.menu .label{margin-inline-end:0;background-color:var(--palettes-neutral-100);color:var(--palettes-neutral-700)}.horizontalNavigation-containerOptional,.menu-containerOptional{max-inline-size:var(--commons-container-maxWidth);padding-inline:var(--commons-container-padding)}.horizontalNavigation-list,.menu-list{margin:0;padding:0;list-style-type:none;align-items:var(--components-horizontalNavigation-listAlign);gap:var(--components-horizontalNavigation-listGap);flex-direction:var(--components-horizontalNavigation-listDirection);display:flex;flex-grow:1;flex-wrap:wrap}.scrollBox .horizontalNavigation-list,.scrollBox .menu-list{flex-wrap:nowrap}.horizontalNavigation-list-item-action,.menu-list-item-action,.menu-link{padding:0;border:0;inline-size:100%;background-color:transparent;color:inherit;text-align:start;display:block;font:inherit;cursor:pointer;font:var(--components-horizontalNavigation-listItemActionFont);padding:var(--components-horizontalNavigation-listItemActionPadding);border-radius:var(--pr-t-border-radius-small);color:var(--components-horizontalNavigation-listItemActionColor);display:inline-flex;text-align:var(--components-horizontalNavigation-listItemActionAlign);transition-duration:var(--commons-animations-durations-fast);gap:var(--pr-t-spacings-100);align-items:center;transition-property:color;position:relative;text-decoration:none;inline-size:auto;z-index:1;scroll-margin-inline:var(--pr-t-spacings-200)}.horizontalNavigation-list-item-action:before,.menu-list-item-action:before,.menu-link:before{content:\"\";position:absolute;inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) - var(--pr-t-spacings-25));border-radius:var(--pr-t-border-radius-small)}.horizontalNavigation-list-item-action:after,.menu-list-item-action:after,.menu-link:after{background-color:var(--palettes-700, var(--palettes-product-700));border-radius:var(--components-horizontalNavigation-listItemActionRadius);transition-duration:var(--commons-animations-durations-fast);block-size:var(--components-horizontalNavigation-listItemActionRadiusHeight);inline-size:var(--components-horizontalNavigation-listItemActionRadiusWidth);transform:var(--components-horizontalNavigation-listItemActionTransform);inset:var(--components-horizontalNavigation-listItemActionInset);transition-property:transform;display:block;position:absolute;z-index:1;content:\"\"}.horizontalNavigation-list-item-action:focus-visible,.menu-list-item-action:focus-visible,.menu-link:focus-visible{outline:none!important}.horizontalNavigation-list-item-action:focus-visible:before,.menu-list-item-action:focus-visible:before,.menu-link:focus-visible:before{outline:2px solid var(--palettes-product-700);outline-offset:2px}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]),.menu-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]),.menu-link:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]){color:var(--palettes-neutral-900)}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover .label,.menu-list-item-action:not(.is-disabled,[disabled]):hover .label,.menu-link:not(.is-disabled,[disabled]):hover .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:after,.menu-list-item-action:not(.is-disabled,[disabled]):hover:after,.menu-link:not(.is-disabled,[disabled]):hover:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.horizontalNavigation-list-item-action .link-text,.menu-list-item-action .link-text,.menu-link .link-text{text-decoration:none}.horizontalNavigation-link-placeholder:after,.menu-link-placeholder:after{content:attr(data-content-after);display:block;block-size:0;overflow:hidden;font-weight:var(--pr-t-font-fontWeight-semibold)}}@layer mods{.horizontalNavigation.mod-header,.menu.mod-header{--components-horizontalNavigation-listPadding: 0 var(--pr-t-spacings-500)}.horizontalNavigation.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-S .menu-list-item-action,.horizontalNavigation.mod-S .menu-link,.menu.mod-S .horizontalNavigation-list-item-action,.menu.mod-S .menu-list-item-action,.menu.mod-S .menu-link{--components-horizontalNavigation-listItemActionFont: var(--pr-t-font-body-S);--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-150) 0}.horizontalNavigation.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-S .menu-list-item-action:before,.horizontalNavigation.mod-S .menu-link:before,.menu.mod-S .horizontalNavigation-list-item-action:before,.menu.mod-S .menu-list-item-action:before,.menu.mod-S .menu-link:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-75));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) - var(--pr-t-spacings-25))}.horizontalNavigation.mod-S .menu-link,.menu.mod-S .menu-link{margin-inline-end:var(--pr-t-spacings-300)}.horizontalNavigation.mod-S .label,.menu.mod-S .label{block-size:var(--pr-t-font-body-S-lineHeight);min-inline-size:var(--pr-t-font-body-S-lineHeight);line-height:var(--pr-t-font-body-S-lineHeight);padding:0}.horizontalNavigation.mod-S .numericBadge,.menu.mod-S .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS);--components-numericBadge-fontSize: var(--pr-t-font-body-XS-fontSize);--components-numericBadge-lineHeight: var(--pr-t-font-body-XS-lineHeight)}.horizontalNavigation.mod-noBorder:after,.menu.mod-noBorder:after{--components-horizontalNavigation-borderContent: none}.horizontalNavigation.mod-vertical:after,.menu.mod-vertical:after{--components-horizontalNavigation-borderContent: none}.horizontalNavigation.mod-vertical .horizontalNavigation-list,.horizontalNavigation.mod-vertical .menu-list,.menu.mod-vertical .horizontalNavigation-list,.menu.mod-vertical .menu-list{--components-horizontalNavigation-listDirection: column;--components-horizontalNavigation-listGap: 0;--components-horizontalNavigation-listAlign: stretch}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical .menu-list-item-action,.menu.mod-vertical .horizontalNavigation-list-item-action,.menu.mod-vertical .menu-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionAlign: left}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical .menu-list-item-action:before,.menu.mod-vertical .horizontalNavigation-list-item-action:before,.menu.mod-vertical .menu-list-item-action:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-150) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) + var(--pr-t-spacings-150) + var(--pr-t-spacings-25))}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:after,.horizontalNavigation.mod-vertical .menu-list-item-action:after,.menu.mod-vertical .horizontalNavigation-list-item-action:after,.menu.mod-vertical .menu-list-item-action:after{--components-horizontalNavigation-listItemActionTransform: scale(1, 0);--components-horizontalNavigation-listItemActionInset: 0 auto 0 0;--components-horizontalNavigation-listItemActionRadius: 0 var(--pr-t-border-radius-default) var(--pr-t-border-radius-default) 0;--components-horizontalNavigation-listItemActionRadiusWidth: var(--components-horizontalNavigation-listItemActionSize);--components-horizontalNavigation-listItemActionRadiusHeight: auto}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:hover:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:hover:after,.menu.mod-vertical .horizontalNavigation-list-item-action:hover:after,.menu.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after,.menu.mod-vertical .menu-list-item-action:hover:after,.menu.mod-vertical .menu-list-item-action[aria-current=page]:hover:after{--components-horizontalNavigation-listItemActionTransform: scale(1, .75)}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action.is-active:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .menu-list-item-action.is-active:after,.menu.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.menu.mod-vertical .horizontalNavigation-list-item-action.is-active:after,.menu.mod-vertical .menu-list-item-action[aria-current=page]:after,.menu.mod-vertical .menu-list-item-action.is-active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action,.menu.mod-vertical.mod-S .menu-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-150)}.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action:before,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.menu.mod-vertical.mod-S .menu-list-item-action:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-150) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) + var(--pr-t-spacings-100) + var(--pr-t-spacings-25))}}@layer mods{.horizontalNavigation-list-item-action[aria-current=page],.horizontalNavigation-list-item-action.is-active,.horizontalNavigation-list-item-action.active,.menu-link[aria-current=page],.menu-link.is-active,.menu-link.active,.menu-list-item-action[aria-current=page],.menu-list-item-action.is-active,.menu-list-item-action.active{--components-horizontalNavigation-listItemActionColor: var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action[aria-current=page] .label,.horizontalNavigation-list-item-action.is-active .label,.horizontalNavigation-list-item-action.active .label,.menu-link[aria-current=page] .label,.menu-link.is-active .label,.menu-link.active .label,.menu-list-item-action[aria-current=page] .label,.menu-list-item-action.is-active .label,.menu-list-item-action.active .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation-list-item-action.is-active:after,.horizontalNavigation-list-item-action.active:after,.menu-link[aria-current=page]:after,.menu-link.is-active:after,.menu-link.active:after,.menu-list-item-action[aria-current=page]:after,.menu-list-item-action.is-active:after,.menu-list-item-action.active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.horizontalNavigation-list-item-action[aria-current=page]:focus-visible:after,.horizontalNavigation-list-item-action.is-active:focus-visible:after,.horizontalNavigation-list-item-action.active:focus-visible:after,.menu-link[aria-current=page]:focus-visible:after,.menu-link.is-active:focus-visible:after,.menu-link.active:focus-visible:after,.menu-list-item-action[aria-current=page]:focus-visible:after,.menu-list-item-action.is-active:focus-visible:after,.menu-list-item-action.active:focus-visible:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.horizontalNavigation-list-item-action[aria-current=page] .numericBadge,.horizontalNavigation-list-item-action.is-active .numericBadge,.horizontalNavigation-list-item-action.active .numericBadge,.menu-link[aria-current=page] .numericBadge,.menu-link.is-active .numericBadge,.menu-link.active .numericBadge,.menu-list-item-action[aria-current=page] .numericBadge,.menu-list-item-action.is-active .numericBadge,.menu-list-item-action.active .numericBadge{--components-numericBadge-background: var(--palettes-200, var(--palettes-product-200));--components-numericBadge-color: var(--palettes-800, var(--palettes-product-800))}.horizontalNavigation-list-item-action.is-disabled,.horizontalNavigation-list-item-action.is-disabled .label,.horizontalNavigation-list-item-action.disabled,.horizontalNavigation-list-item-action.disabled .label,.horizontalNavigation-list-item-action[disabled],.horizontalNavigation-list-item-action[disabled] .label,.menu-link.is-disabled,.menu-link.is-disabled .label,.menu-link.disabled,.menu-link.disabled .label,.menu-link[disabled],.menu-link[disabled] .label,.menu-list-item-action.is-disabled,.menu-list-item-action.is-disabled .label,.menu-list-item-action.disabled,.menu-list-item-action.disabled .label,.menu-list-item-action[disabled],.menu-list-item-action[disabled] .label{color:var(--palettes-neutral-500);pointer-events:none}.horizontalNavigation-list-item-action.is-disabled .numericBadge,.horizontalNavigation-list-item-action.disabled .numericBadge,.horizontalNavigation-list-item-action[disabled] .numericBadge,.menu-link.is-disabled .numericBadge,.menu-link.disabled .numericBadge,.menu-link[disabled] .numericBadge,.menu-list-item-action.is-disabled .numericBadge,.menu-list-item-action.disabled .numericBadge,.menu-list-item-action[disabled] .numericBadge{--components-numericBadge-background: var(--palettes-neutral-200);--components-numericBadge-color: var(--palettes-neutral-500)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
27
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: HorizontalNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
28
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: HorizontalNavigationComponent, isStandalone: true, selector: "lu-horizontal-navigation", inputs: { noBorder: { classPropertyName: "noBorder", publicName: "noBorder", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-noBorder": "noBorder()", "class.mod-S": "size() === `S`", "class.mod-vertical": "vertical()" }, classAttribute: "horizontalNavigation" }, queries: [{ propertyName: "links", predicate: HorizontalNavigationLinkDirective, isSignal: true }], ngImport: i0, template: "@if (container()) {\n\t<div class=\"horizontalNavigation-containerOptional\">\n\t\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n\t</div>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n}\n\n<ng-template #horizontalNavigationList>\n\t<ul class=\"horizontalNavigation-list\">\n\t\t@for (link of links(); track $index) {\n\t\t\t<li class=\"horizontalNavigation-list-item\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"link.template\" />\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n", styles: ["@layer components{.horizontalNavigation,.menu{--components-horizontalNavigation-borderContent: \"\";--components-horizontalNavigation-listPadding: 0;--components-horizontalNavigation-listItemActionPaddingBlock: var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionPaddingInline: 0px;--components-horizontalNavigation-listItemActionPadding: var(--components-horizontalNavigation-listItemActionPaddingBlock) var(--components-horizontalNavigation-listItemActionPaddingInline);--components-horizontalNavigation-listGap: 0 var(--pr-t-spacings-400);--components-horizontalNavigation-listDirection: row;--components-horizontalNavigation-listAlign: flex-end;--components-horizontalNavigation-listItemActionAlign: center;--components-horizontalNavigation-listItemActionTransform: scale(0, 1);--components-horizontalNavigation-listItemActionColor: var(--pr-t-color-text);--components-horizontalNavigation-listItemActionSize: 2px;--components-horizontalNavigation-listItemActionFont: inherit;--components-horizontalNavigation-listItemActionInset: auto 0 0 0;--components-horizontalNavigation-listItemActionRadius: var(--pr-t-border-radius-default) var(--pr-t-border-radius-default) 0 0;--components-horizontalNavigation-listItemActionRadiusWidth: auto;--components-horizontalNavigation-listItemActionRadiusHeight: var(--components-horizontalNavigation-listItemActionSize);column-gap:var(--pr-t-spacings-400);align-items:center;display:flex;position:relative;flex-wrap:wrap;padding:var(--components-horizontalNavigation-listPadding)}.horizontalNavigation:after,.menu:after{content:var(--components-horizontalNavigation-borderContent);border-block-end-width:var(--commons-divider-width);border-block-end-color:var(--commons-divider-color);border-block-end-style:solid;position:absolute;block-size:1px;inset:auto 0 0}.horizontalNavigation .label,.menu .label{margin-inline-end:0;background-color:var(--palettes-neutral-100);color:var(--palettes-neutral-700)}.horizontalNavigation-containerOptional,.menu-containerOptional{max-inline-size:var(--commons-container-maxWidth);padding:var(--commons-container-padding)}.horizontalNavigation-list,.menu-list{margin:0;padding:0;list-style-type:none;align-items:var(--components-horizontalNavigation-listAlign);gap:var(--components-horizontalNavigation-listGap);flex-direction:var(--components-horizontalNavigation-listDirection);display:flex;flex-grow:1;flex-wrap:wrap}.scrollBox .horizontalNavigation-list,.scrollBox .menu-list{flex-wrap:nowrap}.horizontalNavigation-list-item-action,.menu-list-item-action,.menu-link{padding:0;border:0;inline-size:100%;background-color:transparent;color:inherit;text-align:start;display:block;font:inherit;cursor:pointer;font:var(--components-horizontalNavigation-listItemActionFont);padding:var(--components-horizontalNavigation-listItemActionPadding);border-radius:var(--pr-t-border-radius-small);color:var(--components-horizontalNavigation-listItemActionColor);display:inline-flex;text-align:var(--components-horizontalNavigation-listItemActionAlign);transition-duration:var(--commons-animations-durations-fast);gap:var(--pr-t-spacings-100);align-items:center;transition-property:color;position:relative;text-decoration:none;inline-size:auto;z-index:1;scroll-margin-inline:var(--pr-t-spacings-200)}.horizontalNavigation-list-item-action:before,.menu-list-item-action:before,.menu-link:before{content:\"\";position:absolute;inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) - var(--pr-t-spacings-25));border-radius:var(--pr-t-border-radius-small)}.horizontalNavigation-list-item-action:after,.menu-list-item-action:after,.menu-link:after{background-color:var(--palettes-700, var(--palettes-product-700));border-radius:var(--components-horizontalNavigation-listItemActionRadius);transition-duration:var(--commons-animations-durations-fast);block-size:var(--components-horizontalNavigation-listItemActionRadiusHeight);inline-size:var(--components-horizontalNavigation-listItemActionRadiusWidth);transform:var(--components-horizontalNavigation-listItemActionTransform);inset:var(--components-horizontalNavigation-listItemActionInset);transition-property:transform;display:block;position:absolute;z-index:1;content:\"\"}.horizontalNavigation-list-item-action:focus-visible,.menu-list-item-action:focus-visible,.menu-link:focus-visible{outline:none!important}.horizontalNavigation-list-item-action:focus-visible:before,.menu-list-item-action:focus-visible:before,.menu-link:focus-visible:before{outline:2px solid var(--palettes-product-700);outline-offset:2px}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]),.menu-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]),.menu-link:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]){color:var(--palettes-neutral-900)}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover .label,.menu-list-item-action:not(.is-disabled,[disabled]):hover .label,.menu-link:not(.is-disabled,[disabled]):hover .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:after,.menu-list-item-action:not(.is-disabled,[disabled]):hover:after,.menu-link:not(.is-disabled,[disabled]):hover:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.horizontalNavigation-list-item-action .link-text,.menu-list-item-action .link-text,.menu-link .link-text{text-decoration:none}.horizontalNavigation-link-placeholder:after,.menu-link-placeholder:after{content:attr(data-content-after);display:block;block-size:0;overflow:hidden;font-weight:var(--pr-t-font-fontWeight-semibold)}}@layer mods{.horizontalNavigation.mod-header,.menu.mod-header{--components-horizontalNavigation-listPadding: 0 var(--pr-t-spacings-500)}.horizontalNavigation.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-S .menu-list-item-action,.horizontalNavigation.mod-S .menu-link,.menu.mod-S .horizontalNavigation-list-item-action,.menu.mod-S .menu-list-item-action,.menu.mod-S .menu-link{--components-horizontalNavigation-listItemActionFont: var(--pr-t-font-body-S);--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-150) 0}.horizontalNavigation.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-S .menu-list-item-action:before,.horizontalNavigation.mod-S .menu-link:before,.menu.mod-S .horizontalNavigation-list-item-action:before,.menu.mod-S .menu-list-item-action:before,.menu.mod-S .menu-link:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-75));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) - var(--pr-t-spacings-25))}.horizontalNavigation.mod-S .menu-link,.menu.mod-S .menu-link{margin-inline-end:var(--pr-t-spacings-300)}.horizontalNavigation.mod-S .label,.menu.mod-S .label{block-size:var(--pr-t-font-body-S-lineHeight);min-inline-size:var(--pr-t-font-body-S-lineHeight);line-height:var(--pr-t-font-body-S-lineHeight);padding:0}.horizontalNavigation.mod-S .numericBadge,.menu.mod-S .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS);--components-numericBadge-fontSize: var(--pr-t-font-body-XS-fontSize);--components-numericBadge-lineHeight: var(--pr-t-font-body-XS-lineHeight)}.horizontalNavigation.mod-noBorder:after,.menu.mod-noBorder:after{--components-horizontalNavigation-borderContent: none}.horizontalNavigation.mod-vertical:after,.menu.mod-vertical:after{--components-horizontalNavigation-borderContent: none}.horizontalNavigation.mod-vertical .horizontalNavigation-list,.horizontalNavigation.mod-vertical .menu-list,.menu.mod-vertical .horizontalNavigation-list,.menu.mod-vertical .menu-list{--components-horizontalNavigation-listDirection: column;--components-horizontalNavigation-listGap: 0;--components-horizontalNavigation-listAlign: stretch}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical .menu-list-item-action,.menu.mod-vertical .horizontalNavigation-list-item-action,.menu.mod-vertical .menu-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionAlign: left}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical .menu-list-item-action:before,.menu.mod-vertical .horizontalNavigation-list-item-action:before,.menu.mod-vertical .menu-list-item-action:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-150) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) + var(--pr-t-spacings-150) + var(--pr-t-spacings-25))}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:after,.horizontalNavigation.mod-vertical .menu-list-item-action:after,.menu.mod-vertical .horizontalNavigation-list-item-action:after,.menu.mod-vertical .menu-list-item-action:after{--components-horizontalNavigation-listItemActionTransform: scale(1, 0);--components-horizontalNavigation-listItemActionInset: 0 auto 0 0;--components-horizontalNavigation-listItemActionRadius: 0 var(--pr-t-border-radius-default) var(--pr-t-border-radius-default) 0;--components-horizontalNavigation-listItemActionRadiusWidth: var(--components-horizontalNavigation-listItemActionSize);--components-horizontalNavigation-listItemActionRadiusHeight: auto}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:hover:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:hover:after,.menu.mod-vertical .horizontalNavigation-list-item-action:hover:after,.menu.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after,.menu.mod-vertical .menu-list-item-action:hover:after,.menu.mod-vertical .menu-list-item-action[aria-current=page]:hover:after{--components-horizontalNavigation-listItemActionTransform: scale(1, .75)}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action.is-active:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .menu-list-item-action.is-active:after,.menu.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.menu.mod-vertical .horizontalNavigation-list-item-action.is-active:after,.menu.mod-vertical .menu-list-item-action[aria-current=page]:after,.menu.mod-vertical .menu-list-item-action.is-active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action,.menu.mod-vertical.mod-S .menu-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-150)}.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action:before,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.menu.mod-vertical.mod-S .menu-list-item-action:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-150) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) + var(--pr-t-spacings-100) + var(--pr-t-spacings-25))}}@layer mods{.horizontalNavigation-list-item-action[aria-current=page],.horizontalNavigation-list-item-action.is-active,.horizontalNavigation-list-item-action.active,.menu-link[aria-current=page],.menu-link.is-active,.menu-link.active,.menu-list-item-action[aria-current=page],.menu-list-item-action.is-active,.menu-list-item-action.active{--components-horizontalNavigation-listItemActionColor: var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action[aria-current=page] .label,.horizontalNavigation-list-item-action.is-active .label,.horizontalNavigation-list-item-action.active .label,.menu-link[aria-current=page] .label,.menu-link.is-active .label,.menu-link.active .label,.menu-list-item-action[aria-current=page] .label,.menu-list-item-action.is-active .label,.menu-list-item-action.active .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation-list-item-action.is-active:after,.horizontalNavigation-list-item-action.active:after,.menu-link[aria-current=page]:after,.menu-link.is-active:after,.menu-link.active:after,.menu-list-item-action[aria-current=page]:after,.menu-list-item-action.is-active:after,.menu-list-item-action.active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.horizontalNavigation-list-item-action[aria-current=page]:focus-visible:after,.horizontalNavigation-list-item-action.is-active:focus-visible:after,.horizontalNavigation-list-item-action.active:focus-visible:after,.menu-link[aria-current=page]:focus-visible:after,.menu-link.is-active:focus-visible:after,.menu-link.active:focus-visible:after,.menu-list-item-action[aria-current=page]:focus-visible:after,.menu-list-item-action.is-active:focus-visible:after,.menu-list-item-action.active:focus-visible:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.horizontalNavigation-list-item-action[aria-current=page] .numericBadge,.horizontalNavigation-list-item-action.is-active .numericBadge,.horizontalNavigation-list-item-action.active .numericBadge,.menu-link[aria-current=page] .numericBadge,.menu-link.is-active .numericBadge,.menu-link.active .numericBadge,.menu-list-item-action[aria-current=page] .numericBadge,.menu-list-item-action.is-active .numericBadge,.menu-list-item-action.active .numericBadge{--components-numericBadge-background: var(--palettes-200, var(--palettes-product-200));--components-numericBadge-color: var(--palettes-800, var(--palettes-product-800))}.horizontalNavigation-list-item-action.is-disabled,.horizontalNavigation-list-item-action.is-disabled .label,.horizontalNavigation-list-item-action.disabled,.horizontalNavigation-list-item-action.disabled .label,.horizontalNavigation-list-item-action[disabled],.horizontalNavigation-list-item-action[disabled] .label,.menu-link.is-disabled,.menu-link.is-disabled .label,.menu-link.disabled,.menu-link.disabled .label,.menu-link[disabled],.menu-link[disabled] .label,.menu-list-item-action.is-disabled,.menu-list-item-action.is-disabled .label,.menu-list-item-action.disabled,.menu-list-item-action.disabled .label,.menu-list-item-action[disabled],.menu-list-item-action[disabled] .label{color:var(--palettes-neutral-500);pointer-events:none}.horizontalNavigation-list-item-action.is-disabled .numericBadge,.horizontalNavigation-list-item-action.disabled .numericBadge,.horizontalNavigation-list-item-action[disabled] .numericBadge,.menu-link.is-disabled .numericBadge,.menu-link.disabled .numericBadge,.menu-link[disabled] .numericBadge,.menu-list-item-action.is-disabled .numericBadge,.menu-list-item-action.disabled .numericBadge,.menu-list-item-action[disabled] .numericBadge{--components-numericBadge-background: var(--palettes-neutral-200);--components-numericBadge-color: var(--palettes-neutral-500)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
32
29
|
}
|
|
33
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: HorizontalNavigationComponent, decorators: [{
|
|
34
31
|
type: Component,
|
|
35
32
|
args: [{ selector: 'lu-horizontal-navigation', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], host: {
|
|
36
33
|
class: 'horizontalNavigation',
|
|
37
34
|
'[class.mod-noBorder]': 'noBorder()',
|
|
38
35
|
'[class.mod-S]': 'size() === `S`',
|
|
39
36
|
'[class.mod-vertical]': 'vertical()',
|
|
40
|
-
}, template: "@if (container()) {\n\t<div class=\"horizontalNavigation-containerOptional\">\n\t\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n\t</div>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n}\n\n<ng-template #horizontalNavigationList>\n\t<ul class=\"horizontalNavigation-list\">\n\t\t@for (link of links(); track $index) {\n\t\t\t<li class=\"horizontalNavigation-list-item\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"link.template\" />\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n", styles: ["@layer components{.horizontalNavigation,.menu{--components-horizontalNavigation-borderContent: \"\";--components-horizontalNavigation-listPadding: 0;--components-horizontalNavigation-listItemActionPaddingBlock: var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionPaddingInline: 0px;--components-horizontalNavigation-listItemActionPadding: var(--components-horizontalNavigation-listItemActionPaddingBlock) var(--components-horizontalNavigation-listItemActionPaddingInline);--components-horizontalNavigation-listGap: 0 var(--pr-t-spacings-400);--components-horizontalNavigation-listDirection: row;--components-horizontalNavigation-listAlign: flex-end;--components-horizontalNavigation-listItemActionAlign: center;--components-horizontalNavigation-listItemActionTransform: scale(0, 1);--components-horizontalNavigation-listItemActionColor: var(--pr-t-color-text);--components-horizontalNavigation-listItemActionSize: 2px;--components-horizontalNavigation-listItemActionFont: inherit;--components-horizontalNavigation-listItemActionInset: auto 0 0 0;--components-horizontalNavigation-listItemActionRadius: var(--pr-t-border-radius-default) var(--pr-t-border-radius-default) 0 0;--components-horizontalNavigation-listItemActionRadiusWidth: auto;--components-horizontalNavigation-listItemActionRadiusHeight: var(--components-horizontalNavigation-listItemActionSize);column-gap:var(--pr-t-spacings-400);align-items:center;display:flex;position:relative;flex-wrap:wrap;padding:var(--components-horizontalNavigation-listPadding)}.horizontalNavigation:after,.menu:after{content:var(--components-horizontalNavigation-borderContent);border-block-end-width:var(--commons-divider-width);border-block-end-color:var(--commons-divider-color);border-block-end-style:solid;position:absolute;block-size:1px;inset:auto 0 0}.horizontalNavigation .label,.menu .label{margin-inline-end:0;background-color:var(--palettes-neutral-100);color:var(--palettes-neutral-700)}.horizontalNavigation-containerOptional,.menu-containerOptional{max-inline-size:var(--commons-container-maxWidth);padding-inline:var(--commons-container-padding)}.horizontalNavigation-list,.menu-list{margin:0;padding:0;list-style-type:none;align-items:var(--components-horizontalNavigation-listAlign);gap:var(--components-horizontalNavigation-listGap);flex-direction:var(--components-horizontalNavigation-listDirection);display:flex;flex-grow:1;flex-wrap:wrap}.scrollBox .horizontalNavigation-list,.scrollBox .menu-list{flex-wrap:nowrap}.horizontalNavigation-list-item-action,.menu-list-item-action,.menu-link{padding:0;border:0;inline-size:100%;background-color:transparent;color:inherit;text-align:start;display:block;font:inherit;cursor:pointer;font:var(--components-horizontalNavigation-listItemActionFont);padding:var(--components-horizontalNavigation-listItemActionPadding);border-radius:var(--pr-t-border-radius-small);color:var(--components-horizontalNavigation-listItemActionColor);display:inline-flex;text-align:var(--components-horizontalNavigation-listItemActionAlign);transition-duration:var(--commons-animations-durations-fast);gap:var(--pr-t-spacings-100);align-items:center;transition-property:color;position:relative;text-decoration:none;inline-size:auto;z-index:1;scroll-margin-inline:var(--pr-t-spacings-200)}.horizontalNavigation-list-item-action:before,.menu-list-item-action:before,.menu-link:before{content:\"\";position:absolute;inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) - var(--pr-t-spacings-25));border-radius:var(--pr-t-border-radius-small)}.horizontalNavigation-list-item-action:after,.menu-list-item-action:after,.menu-link:after{background-color:var(--palettes-700, var(--palettes-product-700));border-radius:var(--components-horizontalNavigation-listItemActionRadius);transition-duration:var(--commons-animations-durations-fast);block-size:var(--components-horizontalNavigation-listItemActionRadiusHeight);inline-size:var(--components-horizontalNavigation-listItemActionRadiusWidth);transform:var(--components-horizontalNavigation-listItemActionTransform);inset:var(--components-horizontalNavigation-listItemActionInset);transition-property:transform;display:block;position:absolute;z-index:1;content:\"\"}.horizontalNavigation-list-item-action:focus-visible,.menu-list-item-action:focus-visible,.menu-link:focus-visible{outline:none!important}.horizontalNavigation-list-item-action:focus-visible:before,.menu-list-item-action:focus-visible:before,.menu-link:focus-visible:before{outline:2px solid var(--palettes-product-700);outline-offset:2px}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]),.menu-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]),.menu-link:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]){color:var(--palettes-neutral-900)}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover .label,.menu-list-item-action:not(.is-disabled,[disabled]):hover .label,.menu-link:not(.is-disabled,[disabled]):hover .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:after,.menu-list-item-action:not(.is-disabled,[disabled]):hover:after,.menu-link:not(.is-disabled,[disabled]):hover:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.horizontalNavigation-list-item-action .link-text,.menu-list-item-action .link-text,.menu-link .link-text{text-decoration:none}.horizontalNavigation-link-placeholder:after,.menu-link-placeholder:after{content:attr(data-content-after);display:block;block-size:0;overflow:hidden;font-weight:var(--pr-t-font-fontWeight-semibold)}}@layer mods{.horizontalNavigation.mod-header,.menu.mod-header{--components-horizontalNavigation-listPadding: 0 var(--pr-t-spacings-500)}.horizontalNavigation.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-S .menu-list-item-action,.horizontalNavigation.mod-S .menu-link,.menu.mod-S .horizontalNavigation-list-item-action,.menu.mod-S .menu-list-item-action,.menu.mod-S .menu-link{--components-horizontalNavigation-listItemActionFont: var(--pr-t-font-body-S);--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-150) 0}.horizontalNavigation.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-S .menu-list-item-action:before,.horizontalNavigation.mod-S .menu-link:before,.menu.mod-S .horizontalNavigation-list-item-action:before,.menu.mod-S .menu-list-item-action:before,.menu.mod-S .menu-link:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-75));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) - var(--pr-t-spacings-25))}.horizontalNavigation.mod-S .menu-link,.menu.mod-S .menu-link{margin-inline-end:var(--pr-t-spacings-300)}.horizontalNavigation.mod-S .label,.menu.mod-S .label{block-size:var(--pr-t-font-body-S-lineHeight);min-inline-size:var(--pr-t-font-body-S-lineHeight);line-height:var(--pr-t-font-body-S-lineHeight);padding:0}.horizontalNavigation.mod-S .numericBadge,.menu.mod-S .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS);--components-numericBadge-fontSize: var(--pr-t-font-body-XS-fontSize);--components-numericBadge-lineHeight: var(--pr-t-font-body-XS-lineHeight)}.horizontalNavigation.mod-noBorder:after,.menu.mod-noBorder:after{--components-horizontalNavigation-borderContent: none}.horizontalNavigation.mod-vertical:after,.menu.mod-vertical:after{--components-horizontalNavigation-borderContent: none}.horizontalNavigation.mod-vertical .horizontalNavigation-list,.horizontalNavigation.mod-vertical .menu-list,.menu.mod-vertical .horizontalNavigation-list,.menu.mod-vertical .menu-list{--components-horizontalNavigation-listDirection: column;--components-horizontalNavigation-listGap: 0;--components-horizontalNavigation-listAlign: stretch}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical .menu-list-item-action,.menu.mod-vertical .horizontalNavigation-list-item-action,.menu.mod-vertical .menu-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionAlign: left}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical .menu-list-item-action:before,.menu.mod-vertical .horizontalNavigation-list-item-action:before,.menu.mod-vertical .menu-list-item-action:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-150) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) + var(--pr-t-spacings-150) + var(--pr-t-spacings-25))}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:after,.horizontalNavigation.mod-vertical .menu-list-item-action:after,.menu.mod-vertical .horizontalNavigation-list-item-action:after,.menu.mod-vertical .menu-list-item-action:after{--components-horizontalNavigation-listItemActionTransform: scale(1, 0);--components-horizontalNavigation-listItemActionInset: 0 auto 0 0;--components-horizontalNavigation-listItemActionRadius: 0 var(--pr-t-border-radius-default) var(--pr-t-border-radius-default) 0;--components-horizontalNavigation-listItemActionRadiusWidth: var(--components-horizontalNavigation-listItemActionSize);--components-horizontalNavigation-listItemActionRadiusHeight: auto}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:hover:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:hover:after,.menu.mod-vertical .horizontalNavigation-list-item-action:hover:after,.menu.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after,.menu.mod-vertical .menu-list-item-action:hover:after,.menu.mod-vertical .menu-list-item-action[aria-current=page]:hover:after{--components-horizontalNavigation-listItemActionTransform: scale(1, .75)}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action.is-active:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .menu-list-item-action.is-active:after,.menu.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.menu.mod-vertical .horizontalNavigation-list-item-action.is-active:after,.menu.mod-vertical .menu-list-item-action[aria-current=page]:after,.menu.mod-vertical .menu-list-item-action.is-active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action,.menu.mod-vertical.mod-S .menu-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-150)}.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action:before,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.menu.mod-vertical.mod-S .menu-list-item-action:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-150) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) + var(--pr-t-spacings-100) + var(--pr-t-spacings-25))}}@layer mods{.horizontalNavigation-list-item-action[aria-current=page],.horizontalNavigation-list-item-action.is-active,.horizontalNavigation-list-item-action.active,.menu-link[aria-current=page],.menu-link.is-active,.menu-link.active,.menu-list-item-action[aria-current=page],.menu-list-item-action.is-active,.menu-list-item-action.active{--components-horizontalNavigation-listItemActionColor: var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action[aria-current=page] .label,.horizontalNavigation-list-item-action.is-active .label,.horizontalNavigation-list-item-action.active .label,.menu-link[aria-current=page] .label,.menu-link.is-active .label,.menu-link.active .label,.menu-list-item-action[aria-current=page] .label,.menu-list-item-action.is-active .label,.menu-list-item-action.active .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation-list-item-action.is-active:after,.horizontalNavigation-list-item-action.active:after,.menu-link[aria-current=page]:after,.menu-link.is-active:after,.menu-link.active:after,.menu-list-item-action[aria-current=page]:after,.menu-list-item-action.is-active:after,.menu-list-item-action.active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.horizontalNavigation-list-item-action[aria-current=page]:focus-visible:after,.horizontalNavigation-list-item-action.is-active:focus-visible:after,.horizontalNavigation-list-item-action.active:focus-visible:after,.menu-link[aria-current=page]:focus-visible:after,.menu-link.is-active:focus-visible:after,.menu-link.active:focus-visible:after,.menu-list-item-action[aria-current=page]:focus-visible:after,.menu-list-item-action.is-active:focus-visible:after,.menu-list-item-action.active:focus-visible:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.horizontalNavigation-list-item-action[aria-current=page] .numericBadge,.horizontalNavigation-list-item-action.is-active .numericBadge,.horizontalNavigation-list-item-action.active .numericBadge,.menu-link[aria-current=page] .numericBadge,.menu-link.is-active .numericBadge,.menu-link.active .numericBadge,.menu-list-item-action[aria-current=page] .numericBadge,.menu-list-item-action.is-active .numericBadge,.menu-list-item-action.active .numericBadge{--components-numericBadge-background: var(--palettes-200, var(--palettes-product-200));--components-numericBadge-color: var(--palettes-800, var(--palettes-product-800))}.horizontalNavigation-list-item-action.is-disabled,.horizontalNavigation-list-item-action.is-disabled .label,.horizontalNavigation-list-item-action.disabled,.horizontalNavigation-list-item-action.disabled .label,.horizontalNavigation-list-item-action[disabled],.horizontalNavigation-list-item-action[disabled] .label,.menu-link.is-disabled,.menu-link.is-disabled .label,.menu-link.disabled,.menu-link.disabled .label,.menu-link[disabled],.menu-link[disabled] .label,.menu-list-item-action.is-disabled,.menu-list-item-action.is-disabled .label,.menu-list-item-action.disabled,.menu-list-item-action.disabled .label,.menu-list-item-action[disabled],.menu-list-item-action[disabled] .label{color:var(--palettes-neutral-500);pointer-events:none}.horizontalNavigation-list-item-action.is-disabled .numericBadge,.horizontalNavigation-list-item-action.disabled .numericBadge,.horizontalNavigation-list-item-action[disabled] .numericBadge,.menu-link.is-disabled .numericBadge,.menu-link.disabled .numericBadge,.menu-link[disabled] .numericBadge,.menu-list-item-action.is-disabled .numericBadge,.menu-list-item-action.disabled .numericBadge,.menu-list-item-action[disabled] .numericBadge{--components-numericBadge-background: var(--palettes-neutral-200);--components-numericBadge-color: var(--palettes-neutral-500)}}\n"] }]
|
|
37
|
+
}, template: "@if (container()) {\n\t<div class=\"horizontalNavigation-containerOptional\">\n\t\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n\t</div>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n}\n\n<ng-template #horizontalNavigationList>\n\t<ul class=\"horizontalNavigation-list\">\n\t\t@for (link of links(); track $index) {\n\t\t\t<li class=\"horizontalNavigation-list-item\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"link.template\" />\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n", styles: ["@layer components{.horizontalNavigation,.menu{--components-horizontalNavigation-borderContent: \"\";--components-horizontalNavigation-listPadding: 0;--components-horizontalNavigation-listItemActionPaddingBlock: var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionPaddingInline: 0px;--components-horizontalNavigation-listItemActionPadding: var(--components-horizontalNavigation-listItemActionPaddingBlock) var(--components-horizontalNavigation-listItemActionPaddingInline);--components-horizontalNavigation-listGap: 0 var(--pr-t-spacings-400);--components-horizontalNavigation-listDirection: row;--components-horizontalNavigation-listAlign: flex-end;--components-horizontalNavigation-listItemActionAlign: center;--components-horizontalNavigation-listItemActionTransform: scale(0, 1);--components-horizontalNavigation-listItemActionColor: var(--pr-t-color-text);--components-horizontalNavigation-listItemActionSize: 2px;--components-horizontalNavigation-listItemActionFont: inherit;--components-horizontalNavigation-listItemActionInset: auto 0 0 0;--components-horizontalNavigation-listItemActionRadius: var(--pr-t-border-radius-default) var(--pr-t-border-radius-default) 0 0;--components-horizontalNavigation-listItemActionRadiusWidth: auto;--components-horizontalNavigation-listItemActionRadiusHeight: var(--components-horizontalNavigation-listItemActionSize);column-gap:var(--pr-t-spacings-400);align-items:center;display:flex;position:relative;flex-wrap:wrap;padding:var(--components-horizontalNavigation-listPadding)}.horizontalNavigation:after,.menu:after{content:var(--components-horizontalNavigation-borderContent);border-block-end-width:var(--commons-divider-width);border-block-end-color:var(--commons-divider-color);border-block-end-style:solid;position:absolute;block-size:1px;inset:auto 0 0}.horizontalNavigation .label,.menu .label{margin-inline-end:0;background-color:var(--palettes-neutral-100);color:var(--palettes-neutral-700)}.horizontalNavigation-containerOptional,.menu-containerOptional{max-inline-size:var(--commons-container-maxWidth);padding:var(--commons-container-padding)}.horizontalNavigation-list,.menu-list{margin:0;padding:0;list-style-type:none;align-items:var(--components-horizontalNavigation-listAlign);gap:var(--components-horizontalNavigation-listGap);flex-direction:var(--components-horizontalNavigation-listDirection);display:flex;flex-grow:1;flex-wrap:wrap}.scrollBox .horizontalNavigation-list,.scrollBox .menu-list{flex-wrap:nowrap}.horizontalNavigation-list-item-action,.menu-list-item-action,.menu-link{padding:0;border:0;inline-size:100%;background-color:transparent;color:inherit;text-align:start;display:block;font:inherit;cursor:pointer;font:var(--components-horizontalNavigation-listItemActionFont);padding:var(--components-horizontalNavigation-listItemActionPadding);border-radius:var(--pr-t-border-radius-small);color:var(--components-horizontalNavigation-listItemActionColor);display:inline-flex;text-align:var(--components-horizontalNavigation-listItemActionAlign);transition-duration:var(--commons-animations-durations-fast);gap:var(--pr-t-spacings-100);align-items:center;transition-property:color;position:relative;text-decoration:none;inline-size:auto;z-index:1;scroll-margin-inline:var(--pr-t-spacings-200)}.horizontalNavigation-list-item-action:before,.menu-list-item-action:before,.menu-link:before{content:\"\";position:absolute;inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) - var(--pr-t-spacings-25));border-radius:var(--pr-t-border-radius-small)}.horizontalNavigation-list-item-action:after,.menu-list-item-action:after,.menu-link:after{background-color:var(--palettes-700, var(--palettes-product-700));border-radius:var(--components-horizontalNavigation-listItemActionRadius);transition-duration:var(--commons-animations-durations-fast);block-size:var(--components-horizontalNavigation-listItemActionRadiusHeight);inline-size:var(--components-horizontalNavigation-listItemActionRadiusWidth);transform:var(--components-horizontalNavigation-listItemActionTransform);inset:var(--components-horizontalNavigation-listItemActionInset);transition-property:transform;display:block;position:absolute;z-index:1;content:\"\"}.horizontalNavigation-list-item-action:focus-visible,.menu-list-item-action:focus-visible,.menu-link:focus-visible{outline:none!important}.horizontalNavigation-list-item-action:focus-visible:before,.menu-list-item-action:focus-visible:before,.menu-link:focus-visible:before{outline:2px solid var(--palettes-product-700);outline-offset:2px}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]),.menu-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]),.menu-link:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]){color:var(--palettes-neutral-900)}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover .label,.menu-list-item-action:not(.is-disabled,[disabled]):hover .label,.menu-link:not(.is-disabled,[disabled]):hover .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:after,.menu-list-item-action:not(.is-disabled,[disabled]):hover:after,.menu-link:not(.is-disabled,[disabled]):hover:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.horizontalNavigation-list-item-action .link-text,.menu-list-item-action .link-text,.menu-link .link-text{text-decoration:none}.horizontalNavigation-link-placeholder:after,.menu-link-placeholder:after{content:attr(data-content-after);display:block;block-size:0;overflow:hidden;font-weight:var(--pr-t-font-fontWeight-semibold)}}@layer mods{.horizontalNavigation.mod-header,.menu.mod-header{--components-horizontalNavigation-listPadding: 0 var(--pr-t-spacings-500)}.horizontalNavigation.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-S .menu-list-item-action,.horizontalNavigation.mod-S .menu-link,.menu.mod-S .horizontalNavigation-list-item-action,.menu.mod-S .menu-list-item-action,.menu.mod-S .menu-link{--components-horizontalNavigation-listItemActionFont: var(--pr-t-font-body-S);--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-150) 0}.horizontalNavigation.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-S .menu-list-item-action:before,.horizontalNavigation.mod-S .menu-link:before,.menu.mod-S .horizontalNavigation-list-item-action:before,.menu.mod-S .menu-list-item-action:before,.menu.mod-S .menu-link:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-75));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) - var(--pr-t-spacings-25))}.horizontalNavigation.mod-S .menu-link,.menu.mod-S .menu-link{margin-inline-end:var(--pr-t-spacings-300)}.horizontalNavigation.mod-S .label,.menu.mod-S .label{block-size:var(--pr-t-font-body-S-lineHeight);min-inline-size:var(--pr-t-font-body-S-lineHeight);line-height:var(--pr-t-font-body-S-lineHeight);padding:0}.horizontalNavigation.mod-S .numericBadge,.menu.mod-S .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS);--components-numericBadge-fontSize: var(--pr-t-font-body-XS-fontSize);--components-numericBadge-lineHeight: var(--pr-t-font-body-XS-lineHeight)}.horizontalNavigation.mod-noBorder:after,.menu.mod-noBorder:after{--components-horizontalNavigation-borderContent: none}.horizontalNavigation.mod-vertical:after,.menu.mod-vertical:after{--components-horizontalNavigation-borderContent: none}.horizontalNavigation.mod-vertical .horizontalNavigation-list,.horizontalNavigation.mod-vertical .menu-list,.menu.mod-vertical .horizontalNavigation-list,.menu.mod-vertical .menu-list{--components-horizontalNavigation-listDirection: column;--components-horizontalNavigation-listGap: 0;--components-horizontalNavigation-listAlign: stretch}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical .menu-list-item-action,.menu.mod-vertical .horizontalNavigation-list-item-action,.menu.mod-vertical .menu-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionAlign: left}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical .menu-list-item-action:before,.menu.mod-vertical .horizontalNavigation-list-item-action:before,.menu.mod-vertical .menu-list-item-action:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-150) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) + var(--pr-t-spacings-150) + var(--pr-t-spacings-25))}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:after,.horizontalNavigation.mod-vertical .menu-list-item-action:after,.menu.mod-vertical .horizontalNavigation-list-item-action:after,.menu.mod-vertical .menu-list-item-action:after{--components-horizontalNavigation-listItemActionTransform: scale(1, 0);--components-horizontalNavigation-listItemActionInset: 0 auto 0 0;--components-horizontalNavigation-listItemActionRadius: 0 var(--pr-t-border-radius-default) var(--pr-t-border-radius-default) 0;--components-horizontalNavigation-listItemActionRadiusWidth: var(--components-horizontalNavigation-listItemActionSize);--components-horizontalNavigation-listItemActionRadiusHeight: auto}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:hover:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:hover:after,.menu.mod-vertical .horizontalNavigation-list-item-action:hover:after,.menu.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after,.menu.mod-vertical .menu-list-item-action:hover:after,.menu.mod-vertical .menu-list-item-action[aria-current=page]:hover:after{--components-horizontalNavigation-listItemActionTransform: scale(1, .75)}.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action.is-active:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .menu-list-item-action.is-active:after,.menu.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.menu.mod-vertical .horizontalNavigation-list-item-action.is-active:after,.menu.mod-vertical .menu-list-item-action[aria-current=page]:after,.menu.mod-vertical .menu-list-item-action.is-active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action,.menu.mod-vertical.mod-S .menu-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-150)}.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action:before,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.menu.mod-vertical.mod-S .menu-list-item-action:before{inset-block:calc(var(--components-horizontalNavigation-listItemActionPaddingBlock) - var(--pr-t-spacings-150) - var(--pr-t-spacings-25));inset-inline:calc(var(--components-horizontalNavigation-listItemActionPaddingInline) + var(--pr-t-spacings-100) + var(--pr-t-spacings-25))}}@layer mods{.horizontalNavigation-list-item-action[aria-current=page],.horizontalNavigation-list-item-action.is-active,.horizontalNavigation-list-item-action.active,.menu-link[aria-current=page],.menu-link.is-active,.menu-link.active,.menu-list-item-action[aria-current=page],.menu-list-item-action.is-active,.menu-list-item-action.active{--components-horizontalNavigation-listItemActionColor: var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action[aria-current=page] .label,.horizontalNavigation-list-item-action.is-active .label,.horizontalNavigation-list-item-action.active .label,.menu-link[aria-current=page] .label,.menu-link.is-active .label,.menu-link.active .label,.menu-list-item-action[aria-current=page] .label,.menu-list-item-action.is-active .label,.menu-list-item-action.active .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation-list-item-action.is-active:after,.horizontalNavigation-list-item-action.active:after,.menu-link[aria-current=page]:after,.menu-link.is-active:after,.menu-link.active:after,.menu-list-item-action[aria-current=page]:after,.menu-list-item-action.is-active:after,.menu-list-item-action.active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.horizontalNavigation-list-item-action[aria-current=page]:focus-visible:after,.horizontalNavigation-list-item-action.is-active:focus-visible:after,.horizontalNavigation-list-item-action.active:focus-visible:after,.menu-link[aria-current=page]:focus-visible:after,.menu-link.is-active:focus-visible:after,.menu-link.active:focus-visible:after,.menu-list-item-action[aria-current=page]:focus-visible:after,.menu-list-item-action.is-active:focus-visible:after,.menu-list-item-action.active:focus-visible:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.horizontalNavigation-list-item-action[aria-current=page] .numericBadge,.horizontalNavigation-list-item-action.is-active .numericBadge,.horizontalNavigation-list-item-action.active .numericBadge,.menu-link[aria-current=page] .numericBadge,.menu-link.is-active .numericBadge,.menu-link.active .numericBadge,.menu-list-item-action[aria-current=page] .numericBadge,.menu-list-item-action.is-active .numericBadge,.menu-list-item-action.active .numericBadge{--components-numericBadge-background: var(--palettes-200, var(--palettes-product-200));--components-numericBadge-color: var(--palettes-800, var(--palettes-product-800))}.horizontalNavigation-list-item-action.is-disabled,.horizontalNavigation-list-item-action.is-disabled .label,.horizontalNavigation-list-item-action.disabled,.horizontalNavigation-list-item-action.disabled .label,.horizontalNavigation-list-item-action[disabled],.horizontalNavigation-list-item-action[disabled] .label,.menu-link.is-disabled,.menu-link.is-disabled .label,.menu-link.disabled,.menu-link.disabled .label,.menu-link[disabled],.menu-link[disabled] .label,.menu-list-item-action.is-disabled,.menu-list-item-action.is-disabled .label,.menu-list-item-action.disabled,.menu-list-item-action.disabled .label,.menu-list-item-action[disabled],.menu-list-item-action[disabled] .label{color:var(--palettes-neutral-500);pointer-events:none}.horizontalNavigation-list-item-action.is-disabled .numericBadge,.horizontalNavigation-list-item-action.disabled .numericBadge,.horizontalNavigation-list-item-action[disabled] .numericBadge,.menu-link.is-disabled .numericBadge,.menu-link.disabled .numericBadge,.menu-link[disabled] .numericBadge,.menu-list-item-action.is-disabled .numericBadge,.menu-list-item-action.disabled .numericBadge,.menu-list-item-action[disabled] .numericBadge{--components-numericBadge-background: var(--palettes-neutral-200);--components-numericBadge-color: var(--palettes-neutral-500)}}\n"] }]
|
|
41
38
|
}], propDecorators: { links: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => HorizontalNavigationLinkDirective), { isSignal: true }] }], noBorder: [{ type: i0.Input, args: [{ isSignal: true, alias: "noBorder", required: false }] }], container: [{ type: i0.Input, args: [{ isSignal: true, alias: "container", required: false }] }], vertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "vertical", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
42
39
|
|
|
43
40
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lucca-front-ng-horizontal-navigation.mjs","sources":["../../../packages/ng/horizontal-navigation/horizontal-navigation-link.directive.ts","../../../packages/ng/horizontal-navigation/horizontal-navigation.component.ts","../../../packages/ng/horizontal-navigation/horizontal-navigation.component.html","../../../packages/ng/horizontal-navigation/lucca-front-ng-horizontal-navigation.ts"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n\tselector: '[luHorizontalNavigationLink]',\n})\nexport class HorizontalNavigationLinkDirective {\n\tpublic template = inject(TemplateRef);\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport { booleanAttribute, ChangeDetectionStrategy, Component, contentChildren, input, ViewEncapsulation } from '@angular/core';\nimport { HorizontalNavigationLinkDirective } from './horizontal-navigation-link.directive';\n\n@Component({\n\tselector: 'lu-horizontal-navigation',\n\ttemplateUrl: './horizontal-navigation.component.html',\n\tstyleUrl: './horizontal-navigation.component.scss',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\timports: [NgTemplateOutlet],\n\thost: {\n\t\tclass: 'horizontalNavigation',\n\t\t'[class.mod-noBorder]': 'noBorder()',\n\t\t'[class.mod-S]': 'size() === `S`',\n\t\t'[class.mod-vertical]': 'vertical()',\n\t},\n})\nexport class HorizontalNavigationComponent {\n\treadonly links = contentChildren(HorizontalNavigationLinkDirective);\n\n\treadonly noBorder = input(false, { transform: booleanAttribute });\n\
|
|
1
|
+
{"version":3,"file":"lucca-front-ng-horizontal-navigation.mjs","sources":["../../../packages/ng/horizontal-navigation/horizontal-navigation-link.directive.ts","../../../packages/ng/horizontal-navigation/horizontal-navigation.component.ts","../../../packages/ng/horizontal-navigation/horizontal-navigation.component.html","../../../packages/ng/horizontal-navigation/lucca-front-ng-horizontal-navigation.ts"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n\tselector: '[luHorizontalNavigationLink]',\n})\nexport class HorizontalNavigationLinkDirective {\n\tpublic template = inject(TemplateRef);\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport { booleanAttribute, ChangeDetectionStrategy, Component, contentChildren, input, ViewEncapsulation } from '@angular/core';\nimport { HorizontalNavigationLinkDirective } from './horizontal-navigation-link.directive';\n\n@Component({\n\tselector: 'lu-horizontal-navigation',\n\ttemplateUrl: './horizontal-navigation.component.html',\n\tstyleUrl: './horizontal-navigation.component.scss',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\timports: [NgTemplateOutlet],\n\thost: {\n\t\tclass: 'horizontalNavigation',\n\t\t'[class.mod-noBorder]': 'noBorder()',\n\t\t'[class.mod-S]': 'size() === `S`',\n\t\t'[class.mod-vertical]': 'vertical()',\n\t},\n})\nexport class HorizontalNavigationComponent {\n\treadonly links = contentChildren(HorizontalNavigationLinkDirective);\n\n\treadonly noBorder = input(false, { transform: booleanAttribute });\n\treadonly container = input(false, { transform: booleanAttribute });\n\treadonly vertical = input(false, { transform: booleanAttribute });\n\treadonly size = input<null | 'S'>(null);\n}\n","@if (container()) {\n\t<div class=\"horizontalNavigation-containerOptional\">\n\t\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n\t</div>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n}\n\n<ng-template #horizontalNavigationList>\n\t<ul class=\"horizontalNavigation-list\">\n\t\t@for (link of links(); track $index) {\n\t\t\t<li class=\"horizontalNavigation-list-item\">\n\t\t\t\t<ng-container *ngTemplateOutlet=\"link.template\" />\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAKa,iCAAiC,CAAA;AAH9C,IAAA,WAAA,GAAA;AAIQ,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAC,WAAW,CAAC;AACrC,IAAA;8GAFY,iCAAiC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAjC,iCAAiC,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,8BAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAjC,iCAAiC,EAAA,UAAA,EAAA,CAAA;kBAH7C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACV,oBAAA,QAAQ,EAAE,8BAA8B;AACxC,iBAAA;;;MCcY,6BAA6B,CAAA;AAd1C,IAAA,WAAA,GAAA;AAeU,QAAA,IAAA,CAAA,KAAK,GAAG,eAAe,CAAC,iCAAiC,iDAAC;QAE1D,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,qDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;QACxD,IAAA,CAAA,SAAS,GAAG,KAAK,CAAC,KAAK,sDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;QACzD,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,qDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AACxD,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAa,IAAI,gDAAC;AACvC,IAAA;8GAPY,6BAA6B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAA7B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,6BAA6B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,0BAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,EAAA,cAAA,EAAA,sBAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EACR,iCAAiC,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnBnE,ohBAiBA,q2fDPW,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAQd,6BAA6B,EAAA,UAAA,EAAA,CAAA;kBAdzC,SAAS;AACC,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,0BAA0B,EAAA,aAAA,EAGrB,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,OAAA,EACtC,CAAC,gBAAgB,CAAC,EAAA,IAAA,EACrB;AACL,wBAAA,KAAK,EAAE,sBAAsB;AAC7B,wBAAA,sBAAsB,EAAE,YAAY;AACpC,wBAAA,eAAe,EAAE,gBAAgB;AACjC,wBAAA,sBAAsB,EAAE,YAAY;AACpC,qBAAA,EAAA,QAAA,EAAA,ohBAAA,EAAA,MAAA,EAAA,CAAA,6yfAAA,CAAA,EAAA;6FAGgC,iCAAiC,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,UAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,SAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,WAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,UAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,MAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AEnBnE;;AAEG;;;;"}
|
|
@@ -1,47 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
import * as i0 from '@angular/core';
|
|
3
|
-
import { input, booleanAttribute, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
4
|
-
|
|
5
|
-
class IconComponent {
|
|
6
|
-
constructor() {
|
|
7
|
-
/**
|
|
8
|
-
* Defines icon to display
|
|
9
|
-
*/
|
|
10
|
-
this.icon = input.required(...(ngDevMode ? [{ debugName: "icon" }] : []));
|
|
11
|
-
/**
|
|
12
|
-
* Information conveyed by the screen reader
|
|
13
|
-
*/
|
|
14
|
-
this.alt = input(...(ngDevMode ? [undefined, { debugName: "alt" }] : []));
|
|
15
|
-
/**
|
|
16
|
-
* Which size should the icon be? XXS to XXL
|
|
17
|
-
*/
|
|
18
|
-
this.size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : []));
|
|
19
|
-
/**
|
|
20
|
-
* Changes the color of the icon (inherit by default)
|
|
21
|
-
*/
|
|
22
|
-
this.color = input('inherit', ...(ngDevMode ? [{ debugName: "color" }] : []));
|
|
23
|
-
/**
|
|
24
|
-
* Display icon in AI mode
|
|
25
|
-
*/
|
|
26
|
-
this.AI = input(false, { ...(ngDevMode ? { debugName: "AI" } : {}), transform: booleanAttribute });
|
|
27
|
-
this.iconClasses = computed(() => {
|
|
28
|
-
const size = this.size();
|
|
29
|
-
return {
|
|
30
|
-
[`mod-${size}`]: !!size,
|
|
31
|
-
};
|
|
32
|
-
}, ...(ngDevMode ? [{ debugName: "iconClasses" }] : []));
|
|
33
|
-
}
|
|
34
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
35
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: IconComponent, isStandalone: true, selector: "lu-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, AI: { classPropertyName: "AI", publicName: "AI", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<span\n\taria-hidden=\"true\"\n\t[class.mod-AI]=\"AI()\"\n\tclass=\"lucca-icon icon-{{ icon() }} icon-color-{{ color() }}\"\n\t[ngClass]=\"iconClasses()\"\n></span>\n@if (alt()) {\n\t<span class=\"pr-u-mask\">{{ alt() }}</span>\n}\n", styles: ["@layer base{lu-icon{display:inline-flex}}@layer mods{.icon-color-primary,.icon-color-secondary,.icon-color-product{color:var(--palettes-product-700)}.icon-color-error{color:var(--palettes-error-700)}.icon-color-warning{color:var(--palettes-warning-700)}.icon-color-success{color:var(--palettes-success-700)}.icon-color-light{color:var(--palettes-neutral-600)}.icon-color-placeholder{color:var(--palettes-neutral-400)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
36
|
-
}
|
|
37
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: IconComponent, decorators: [{
|
|
38
|
-
type: Component,
|
|
39
|
-
args: [{ selector: 'lu-icon', imports: [NgClass], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span\n\taria-hidden=\"true\"\n\t[class.mod-AI]=\"AI()\"\n\tclass=\"lucca-icon icon-{{ icon() }} icon-color-{{ color() }}\"\n\t[ngClass]=\"iconClasses()\"\n></span>\n@if (alt()) {\n\t<span class=\"pr-u-mask\">{{ alt() }}</span>\n}\n", styles: ["@layer base{lu-icon{display:inline-flex}}@layer mods{.icon-color-primary,.icon-color-secondary,.icon-color-product{color:var(--palettes-product-700)}.icon-color-error{color:var(--palettes-error-700)}.icon-color-warning{color:var(--palettes-warning-700)}.icon-color-success{color:var(--palettes-success-700)}.icon-color-light{color:var(--palettes-neutral-600)}.icon-color-placeholder{color:var(--palettes-neutral-400)}}\n"] }]
|
|
40
|
-
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], AI: [{ type: i0.Input, args: [{ isSignal: true, alias: "AI", required: false }] }] } });
|
|
1
|
+
export * from '@lucca/prisme/icon';
|
|
41
2
|
|
|
42
3
|
/**
|
|
43
4
|
* Generated bundle index. Do not edit.
|
|
44
5
|
*/
|
|
45
|
-
|
|
46
|
-
export { IconComponent };
|
|
47
6
|
//# sourceMappingURL=lucca-front-ng-icon.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lucca-front-ng-icon.mjs","sources":["../../../packages/ng/icon/
|
|
1
|
+
{"version":3,"file":"lucca-front-ng-icon.mjs","sources":["../../../packages/ng/icon/lucca-front-ng-icon.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;AAAA;;AAEG"}
|