@lucca-front/ng 22.1.0-rc.4 → 22.1.1

package/fesm2022/lucca-front-ng-gauge.mjs

@@ -65,10 +65,10 @@ class GaugeComponent {
         ...(ngDevMode ? [{ debugName: "paletteClass" }] : /* istanbul ignore next */ []));
     }
     #locale;
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: GaugeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: GaugeComponent, isStandalone: true, selector: "lu-gauge", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, thin: { classPropertyName: "thin", publicName: "thin", isSignal: true, isRequired: false, transformFunction: null }, circular: { classPropertyName: "circular", publicName: "circular", isSignal: true, isRequired: false, transformFunction: null }, animated: { classPropertyName: "animated", publicName: "animated", isSignal: true, isRequired: false, transformFunction: null }, noAlt: { classPropertyName: "noAlt", publicName: "noAlt", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, providers: [LuClass], ngImport: i0, template: "@if (circular()) {\n\t<svg\n\t\tclass=\"gauge\"\n\t\t[class]=\"paletteClass()\"\n\t\t[class.mod-thin]=\"thin()\"\n\t\t[class.is-animated]=\"animated()\"\n\t\t[class.is-zero]=\"value() === 0\"\n\t\t[attr.width]=\"size()\"\n\t\t[attr.height]=\"size()\"\n\t\t[attr.viewBox]=\"`0 0 ${size()} ${size()}`\"\n\t\t[attr.style]=\"`--components-gauge-value: ${displayValue()}; --components-gauge-circleR: ${(size() - thickness()) / 2}px`\"\n\t>\n\t\t<circle [attr.cx]=\"size() / 2\" [attr.cy]=\"size() / 2\" [attr.r]=\"(size() - thickness()) / 2\" class=\"gauge-circleBackground\" />\n\t\t<circle [attr.cx]=\"size() / 2\" [attr.cy]=\"size() / 2\" [attr.r]=\"(size() - thickness()) / 2\" class=\"gauge-circleBar\" />\n\t</svg>\n} @else {\n\t<div\n\t\tclass=\"gauge\"\n\t\t[attr.style]=\"`--components-gauge-value: ${value()}%`\"\n\t\t[class.mod-thin]=\"thin()\"\n\t\t[class]=\"paletteClass()\"\n\t\t[class.is-animated]=\"animated()\"\n\t></div>\n}\n@if (!noAlt()) {\n\t<span class=\"pr-u-mask\">{{ alt() || defaultAlt() }}</span>\n}\n", styles: ["@layer components{.gauge:before,.gauge-bar{color:currentColor;transition-duration:var(--commons-animations-durations-standard);transition-property:background-color,inline-size,block-size;block-size:var(--components-gauge-blockSize);inline-size:var(--components-gauge-value);background-color:currentColor;border-radius:var(--pr-t-border-radius-full);min-inline-size:var(--components-gauge-before-minInlineSize);min-block-size:var(--components-gauge-before-minInlineSize);animation-name:var(--components-gauge-animationName);animation-duration:var(--components-gauge-animationDuration);animation-timing-function:var(--components-gauge-animationTimingFunction)}@media(prefers-reduced-motion:reduce){.gauge:before,.gauge-bar{--components-gauge-animationDuration: var(--commons-animations-durations-fast);--components-gauge-animationTimingFunction: ease}}}@layer components{.gauge{--components-gauge-blockSize: var(--components-gauge-height, var(--pr-t-spacings-100));--components-gauge-inlineSize: auto;--components-gauge-background: var(--palettes-neutral-100);--components-gauge-before-minInlineSize: var(--components-gauge-blockSize);--components-gauge-value: 0;--components-gauge-borderRadius: var(--pr-t-border-radius-full);--components-gauge-color: var(--palettes-700, var(--palettes-product-700));--components-gauge-animationName: name;--components-gauge-animationDuration: var(--commons-animations-durations-slow);--components-gauge-animationTimingFunction: cubic-bezier(.9, .9, .9, 1.1);--components-gauge-circle-background: var(--palettes-neutral-100);--components-gauge-circle-strokeWidth: var(--pr-t-spacings-100);--components-gauge-circleR: 76px;--components-gauge-circleP: calc(2 * pi * var(--components-gauge-circleR));border-radius:var(--components-gauge-borderRadius);block-size:var(--components-gauge-blockSize);inline-size:var(--components-gauge-inlineSize);background-color:var(--components-gauge-background);display:block;color:var(--components-gauge-color)}.gauge:before{content:\"\";display:block}.gauge:has(.gauge-bar):before{content:none}.gauge-bar{position:absolute}.gauge-circleBackground{fill:transparent;stroke-width:var(--components-gauge-circle-strokeWidth);stroke:var(--components-gauge-circle-background)}.gauge-circleBar{fill:transparent;stroke-width:var(--components-gauge-circle-strokeWidth);stroke-linecap:round;stroke-dashoffset:0;transform:rotate(270deg);transform-origin:50% 50%;stroke-dasharray:calc(var(--components-gauge-circleP) / 100 * var(--components-gauge-value)),9999;stroke:currentColor;animation-name:var(--components-gauge-animationName);animation-duration:var(--components-gauge-animationDuration);animation-timing-function:var(--components-gauge-animationTimingFunction)}@media(prefers-reduced-motion:reduce){.gauge-circleBar{--components-gauge-animationDuration: var(--commons-animations-durations-fast);--components-gauge-animationTimingFunction: ease}}@keyframes gauge-fill{0%{stroke-dasharray:0,9999;inline-size:0}}}@layer mods{.gauge.mod-thin{--components-gauge-blockSize: var(--pr-t-spacings-50);--components-gauge-circle-strokeWidth: var(--pr-t-spacings-50)}.gauge:has(.gauge-circleBackground){--components-gauge-borderRadius: 0;--components-gauge-blockSize: auto;--components-gauge-background: transparent}.gauge.mod-vertical{--components-gauge-blockSize: 100%;--components-gauge-inlineSize: var(--components-gauge-height, var(--pr-t-spacings-100));--components-gauge-before-minInlineSize: var(--components-gauge-inlineSize)}.gauge.mod-vertical .gauge-bar,.gauge.mod-vertical:before{inline-size:100%;block-size:var(--components-gauge-value)}.gauge.mod-vertical.mod-thin{--components-gauge-inlineSize: var(--pr-t-spacings-50)}.gauge.is-zero,.gauge:not([style]),.gauge[style*=\"--components-gauge-value: 0%\"]{--components-gauge-before-minInlineSize: 0;--components-gauge-color: var(--components-gauge-background)}.gauge.is-animated{--components-gauge-animationName: gauge-fill}}lu-gauge{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: GaugeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: GaugeComponent, isStandalone: true, selector: "lu-gauge", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, thin: { classPropertyName: "thin", publicName: "thin", isSignal: true, isRequired: false, transformFunction: null }, circular: { classPropertyName: "circular", publicName: "circular", isSignal: true, isRequired: false, transformFunction: null }, animated: { classPropertyName: "animated", publicName: "animated", isSignal: true, isRequired: false, transformFunction: null }, noAlt: { classPropertyName: "noAlt", publicName: "noAlt", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, providers: [LuClass], ngImport: i0, template: "@if (circular()) {\n\t<svg\n\t\tclass=\"gauge\"\n\t\t[class]=\"paletteClass()\"\n\t\t[class.mod-thin]=\"thin()\"\n\t\t[class.is-animated]=\"animated()\"\n\t\t[class.is-zero]=\"value() === 0\"\n\t\t[attr.width]=\"size()\"\n\t\t[attr.height]=\"size()\"\n\t\t[attr.viewBox]=\"`0 0 ${size()} ${size()}`\"\n\t\t[attr.style]=\"`--components-gauge-value: ${displayValue()}; --components-gauge-circleR: ${(size() - thickness()) / 2}px`\"\n\t>\n\t\t<circle [attr.cx]=\"size() / 2\" [attr.cy]=\"size() / 2\" [attr.r]=\"(size() - thickness()) / 2\" class=\"gauge-circleBackground\" />\n\t\t<circle [attr.cx]=\"size() / 2\" [attr.cy]=\"size() / 2\" [attr.r]=\"(size() - thickness()) / 2\" class=\"gauge-circleBar\" />\n\t</svg>\n} @else {\n\t<div\n\t\tclass=\"gauge\"\n\t\t[attr.style]=\"`--components-gauge-value: ${value()}%`\"\n\t\t[class.mod-thin]=\"thin()\"\n\t\t[class]=\"paletteClass()\"\n\t\t[class.is-animated]=\"animated()\"\n\t></div>\n}\n@if (!noAlt()) {\n\t<span class=\"pr-u-mask\">{{ alt() || defaultAlt() }}</span>\n}\n", styles: ["@layer components{.gauge:before,.gauge-bar{color:currentColor;transition-duration:var(--commons-animations-durations-standard);transition-property:background-color,inline-size,block-size;block-size:var(--components-gauge-blockSize);inline-size:var(--components-gauge-value);background-color:currentColor;border-radius:var(--pr-t-border-radius-full);min-inline-size:var(--components-gauge-before-minInlineSize);min-block-size:var(--components-gauge-before-minInlineSize);animation-name:var(--components-gauge-animationName);animation-duration:var(--components-gauge-animationDuration);animation-timing-function:var(--components-gauge-animationTimingFunction)}@media(prefers-reduced-motion:reduce){.gauge:before,.gauge-bar{--components-gauge-animationDuration: var(--commons-animations-durations-fast);--components-gauge-animationTimingFunction: ease}}}@layer components{.gauge{--components-gauge-blockSize: var(--components-gauge-height, var(--pr-t-spacings-100));--components-gauge-inlineSize: auto;--components-gauge-background: var(--palettes-neutral-100);--components-gauge-before-minInlineSize: var(--components-gauge-blockSize);--components-gauge-value: 0;--components-gauge-borderRadius: var(--pr-t-border-radius-full);--components-gauge-color: var(--palettes-700, var(--palettes-product-700));--components-gauge-animationName: name;--components-gauge-animationDuration: var(--commons-animations-durations-slow);--components-gauge-animationTimingFunction: cubic-bezier(.9, .9, .9, 1.1);--components-gauge-circle-background: var(--palettes-neutral-100);--components-gauge-circle-strokeWidth: var(--pr-t-spacings-100);--components-gauge-circleR: 76px;--components-gauge-circleP: calc(2 * pi * var(--components-gauge-circleR));border-radius:var(--components-gauge-borderRadius);block-size:var(--components-gauge-blockSize);inline-size:var(--components-gauge-inlineSize);background-color:var(--components-gauge-background);display:block;color:var(--components-gauge-color)}.gauge:before{content:\"\";display:block}.gauge:has(.gauge-bar):before{content:none}.gauge-bar{position:absolute}.gauge-circleBackground{fill:transparent;stroke-width:var(--components-gauge-circle-strokeWidth);stroke:var(--components-gauge-circle-background)}.gauge-circleBar{fill:transparent;stroke-width:var(--components-gauge-circle-strokeWidth);stroke-linecap:round;stroke-dashoffset:0;transform:rotate(270deg);transform-origin:50% 50%;stroke-dasharray:calc(var(--components-gauge-circleP) / 100 * var(--components-gauge-value)),9999;stroke:currentColor;animation-name:var(--components-gauge-animationName);animation-duration:var(--components-gauge-animationDuration);animation-timing-function:var(--components-gauge-animationTimingFunction)}@media(prefers-reduced-motion:reduce){.gauge-circleBar{--components-gauge-animationDuration: var(--commons-animations-durations-fast);--components-gauge-animationTimingFunction: ease}}@keyframes gauge-fill{0%{stroke-dasharray:0,9999;inline-size:0}}}@layer mods{.gauge.mod-thin{--components-gauge-blockSize: var(--pr-t-spacings-50);--components-gauge-circle-strokeWidth: var(--pr-t-spacings-50)}.gauge:has(.gauge-circleBackground){--components-gauge-borderRadius: 0;--components-gauge-blockSize: auto;--components-gauge-background: transparent}.gauge.mod-vertical{--components-gauge-blockSize: 100%;--components-gauge-inlineSize: var(--components-gauge-height, var(--pr-t-spacings-100));--components-gauge-before-minInlineSize: var(--components-gauge-inlineSize)}.gauge.mod-vertical .gauge-bar,.gauge.mod-vertical:before{inline-size:100%;block-size:var(--components-gauge-value)}.gauge.mod-vertical.mod-thin{--components-gauge-inlineSize: var(--pr-t-spacings-50)}.gauge.is-zero,.gauge:not([style]),.gauge[style*=\"--components-gauge-value: 0%\"]{--components-gauge-before-minInlineSize: 0;--components-gauge-color: var(--components-gauge-background)}.gauge.is-animated{--components-gauge-animationName: gauge-fill}}lu-gauge{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: GaugeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: GaugeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-gauge', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [LuClass], template: "@if (circular()) {\n\t<svg\n\t\tclass=\"gauge\"\n\t\t[class]=\"paletteClass()\"\n\t\t[class.mod-thin]=\"thin()\"\n\t\t[class.is-animated]=\"animated()\"\n\t\t[class.is-zero]=\"value() === 0\"\n\t\t[attr.width]=\"size()\"\n\t\t[attr.height]=\"size()\"\n\t\t[attr.viewBox]=\"`0 0 ${size()} ${size()}`\"\n\t\t[attr.style]=\"`--components-gauge-value: ${displayValue()}; --components-gauge-circleR: ${(size() - thickness()) / 2}px`\"\n\t>\n\t\t<circle [attr.cx]=\"size() / 2\" [attr.cy]=\"size() / 2\" [attr.r]=\"(size() - thickness()) / 2\" class=\"gauge-circleBackground\" />\n\t\t<circle [attr.cx]=\"size() / 2\" [attr.cy]=\"size() / 2\" [attr.r]=\"(size() - thickness()) / 2\" class=\"gauge-circleBar\" />\n\t</svg>\n} @else {\n\t<div\n\t\tclass=\"gauge\"\n\t\t[attr.style]=\"`--components-gauge-value: ${value()}%`\"\n\t\t[class.mod-thin]=\"thin()\"\n\t\t[class]=\"paletteClass()\"\n\t\t[class.is-animated]=\"animated()\"\n\t></div>\n}\n@if (!noAlt()) {\n\t<span class=\"pr-u-mask\">{{ alt() || defaultAlt() }}</span>\n}\n", styles: ["@layer components{.gauge:before,.gauge-bar{color:currentColor;transition-duration:var(--commons-animations-durations-standard);transition-property:background-color,inline-size,block-size;block-size:var(--components-gauge-blockSize);inline-size:var(--components-gauge-value);background-color:currentColor;border-radius:var(--pr-t-border-radius-full);min-inline-size:var(--components-gauge-before-minInlineSize);min-block-size:var(--components-gauge-before-minInlineSize);animation-name:var(--components-gauge-animationName);animation-duration:var(--components-gauge-animationDuration);animation-timing-function:var(--components-gauge-animationTimingFunction)}@media(prefers-reduced-motion:reduce){.gauge:before,.gauge-bar{--components-gauge-animationDuration: var(--commons-animations-durations-fast);--components-gauge-animationTimingFunction: ease}}}@layer components{.gauge{--components-gauge-blockSize: var(--components-gauge-height, var(--pr-t-spacings-100));--components-gauge-inlineSize: auto;--components-gauge-background: var(--palettes-neutral-100);--components-gauge-before-minInlineSize: var(--components-gauge-blockSize);--components-gauge-value: 0;--components-gauge-borderRadius: var(--pr-t-border-radius-full);--components-gauge-color: var(--palettes-700, var(--palettes-product-700));--components-gauge-animationName: name;--components-gauge-animationDuration: var(--commons-animations-durations-slow);--components-gauge-animationTimingFunction: cubic-bezier(.9, .9, .9, 1.1);--components-gauge-circle-background: var(--palettes-neutral-100);--components-gauge-circle-strokeWidth: var(--pr-t-spacings-100);--components-gauge-circleR: 76px;--components-gauge-circleP: calc(2 * pi * var(--components-gauge-circleR));border-radius:var(--components-gauge-borderRadius);block-size:var(--components-gauge-blockSize);inline-size:var(--components-gauge-inlineSize);background-color:var(--components-gauge-background);display:block;color:var(--components-gauge-color)}.gauge:before{content:\"\";display:block}.gauge:has(.gauge-bar):before{content:none}.gauge-bar{position:absolute}.gauge-circleBackground{fill:transparent;stroke-width:var(--components-gauge-circle-strokeWidth);stroke:var(--components-gauge-circle-background)}.gauge-circleBar{fill:transparent;stroke-width:var(--components-gauge-circle-strokeWidth);stroke-linecap:round;stroke-dashoffset:0;transform:rotate(270deg);transform-origin:50% 50%;stroke-dasharray:calc(var(--components-gauge-circleP) / 100 * var(--components-gauge-value)),9999;stroke:currentColor;animation-name:var(--components-gauge-animationName);animation-duration:var(--components-gauge-animationDuration);animation-timing-function:var(--components-gauge-animationTimingFunction)}@media(prefers-reduced-motion:reduce){.gauge-circleBar{--components-gauge-animationDuration: var(--commons-animations-durations-fast);--components-gauge-animationTimingFunction: ease}}@keyframes gauge-fill{0%{stroke-dasharray:0,9999;inline-size:0}}}@layer mods{.gauge.mod-thin{--components-gauge-blockSize: var(--pr-t-spacings-50);--components-gauge-circle-strokeWidth: var(--pr-t-spacings-50)}.gauge:has(.gauge-circleBackground){--components-gauge-borderRadius: 0;--components-gauge-blockSize: auto;--components-gauge-background: transparent}.gauge.mod-vertical{--components-gauge-blockSize: 100%;--components-gauge-inlineSize: var(--components-gauge-height, var(--pr-t-spacings-100));--components-gauge-before-minInlineSize: var(--components-gauge-inlineSize)}.gauge.mod-vertical .gauge-bar,.gauge.mod-vertical:before{inline-size:100%;block-size:var(--components-gauge-value)}.gauge.mod-vertical.mod-thin{--components-gauge-inlineSize: var(--pr-t-spacings-50)}.gauge.is-zero,.gauge:not([style]),.gauge[style*=\"--components-gauge-value: 0%\"]{--components-gauge-before-minInlineSize: 0;--components-gauge-color: var(--components-gauge-background)}.gauge.is-animated{--components-gauge-animationName: gauge-fill}}lu-gauge{display:contents}\n"] }]
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], thin: [{ type: i0.Input, args: [{ isSignal: true, alias: "thin", required: false }] }], circular: [{ type: i0.Input, args: [{ isSignal: true, alias: "circular", required: false }] }], animated: [{ type: i0.Input, args: [{ isSignal: true, alias: "animated", required: false }] }], noAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "noAlt", required: false }] }], palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });

package/fesm2022/lucca-front-ng-grid.mjs

@@ -42,10 +42,10 @@ class GridColumnComponent {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "style" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: GridColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: GridColumnComponent, isStandalone: true, selector: "lu-grid-column, [lu-grid-column]", inputs: { colspan: { classPropertyName: "colspan", publicName: "colspan", isSignal: true, isRequired: false, transformFunction: null }, rowspan: { classPropertyName: "rowspan", publicName: "rowspan", isSignal: true, isRequired: false, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: false, transformFunction: null }, row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style": "style()" }, classAttribute: "grid-column" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: GridColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.1", type: GridColumnComponent, isStandalone: true, selector: "lu-grid-column, [lu-grid-column]", inputs: { colspan: { classPropertyName: "colspan", publicName: "colspan", isSignal: true, isRequired: false, transformFunction: null }, rowspan: { classPropertyName: "rowspan", publicName: "rowspan", isSignal: true, isRequired: false, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: false, transformFunction: null }, row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style": "style()" }, classAttribute: "grid-column" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: GridColumnComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: GridColumnComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'lu-grid-column, [lu-grid-column]',
@@ -97,15 +97,15 @@ class GridComponent {
         ...(ngDevMode ? [{ debugName: "gridStyle" }] : /* istanbul ignore next */ []));
     }
     #gapTransform;
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: GridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: GridComponent, isStandalone: true, selector: "lu-grid, [lu-grid]", inputs: { container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, colspan: { classPropertyName: "colspan", publicName: "colspan", isSignal: true, isRequired: false, transformFunction: null }, rowspan: { classPropertyName: "rowspan", publicName: "rowspan", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, columnGap: { classPropertyName: "columnGap", publicName: "columnGap", isSignal: true, isRequired: false, transformFunction: null }, rowGap: { classPropertyName: "rowGap", publicName: "rowGap", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: GridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: GridComponent, isStandalone: true, selector: "lu-grid, [lu-grid]", inputs: { container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, colspan: { classPropertyName: "colspan", publicName: "colspan", isSignal: true, isRequired: false, transformFunction: null }, rowspan: { classPropertyName: "rowspan", publicName: "rowspan", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, columnGap: { classPropertyName: "columnGap", publicName: "columnGap", isSignal: true, isRequired: false, transformFunction: null }, rowGap: { classPropertyName: "rowGap", publicName: "rowGap", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             {
                 provide: LU_GRID_INSTANCE,
                 useExisting: forwardRef(() => GridComponent),
             },
         ], ngImport: i0, template: "@if (container()) {\n\t<div class=\"grid-containerWrapper\">\n\t\t<ng-container *ngTemplateOutlet=\"content\" />\n\t</div>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"content\" />\n}\n\n<ng-template #content>\n\t<div class=\"grid\" [class]=\"mode() && `mod-${mode()}`\" [style]=\"gridStyle()\">\n\t\t<ng-content />\n\t</div>\n</ng-template>\n", styles: ["@layer components{.grid{--grid-columns: 12;--grid-gap: var(--pr-t-spacings-150);--grid-column-gap: var(--grid-gap);--grid-row-gap: var(--grid-gap);--grid-maxWidth: none;--grid-column-start: auto;--grid-row-start: auto;--grid-column-end: auto;--grid-row-end: auto;--grid-column-align: auto;--grid-column-justify: auto;--grid-template-columns: repeat(var(--grid-columns), 1fr);display:grid;grid-template-columns:var(--grid-template-columns);gap:var(--grid-row-gap) var(--grid-column-gap);inline-size:var(--grid-max-width, var(--grid-maxWidth));max-inline-size:100%}.grid-containerWrapper{container-type:inline-size;container-name:grid}.grid-column{align-self:var(--grid-align, var(--grid-column-align));justify-self:var(--grid-justify, var(--grid-column-justify));grid-column-start:var(--grid-column, var(--grid-column-start));grid-row-start:var(--grid-row, var(--grid-row-start));grid-column-end:span var(--grid-colspan, var(--grid-column-end));grid-row-end:span var(--grid-rowspan, var(--grid-row-end));min-inline-size:0;text-align:inherit}@media(min-width:20em){.grid-column[style*=grid-colspanAtMediaMinXXXS]{grid-column-end:span var(--grid-colspanAtMediaMinXXXS)}.grid-column[style*=grid-rowspanAtMediaMinXXXS]{grid-row-end:span var(--grid-rowspanAtMediaMinXXXS)}.grid-column[style*=grid-columnAtMediaMinXXXS]{grid-column-start:var(--grid-columnAtMediaMinXXXS)}.grid-column[style*=grid-rowAtMediaMinXXXS]{grid-row-start:var(--grid-rowAtMediaMinXXXS)}.grid-column[style*=grid-colspan-at-media-min-xxxs]{grid-column-end:span var(--grid-colspan-at-media-min-xxxs)}.grid-column[style*=grid-rowspan-at-media-min-xxxs]{grid-row-end:span var(--grid-rowspan-at-media-min-xxxs)}.grid-column[style*=grid-column-at-media-min-xxxs]{grid-column-start:var(--grid-column-at-media-min-xxxs)}.grid-column[style*=grid-row-at-media-min-xxxs]{grid-row-start:var(--grid-row-at-media-min-xxxs)}}@container grid (min-width: 20em){.grid-column[style*=grid-colspanAtContainerMinXXXS]{grid-column-end:span var(--grid-colspanAtContainerMinXXXS)}.grid-column[style*=grid-rowspanAtContainerMinXXXS]{grid-row-end:span var(--grid-rowspanAtContainerMinXXXS)}.grid-column[style*=grid-columnAtContainerMinXXXS]{grid-column-start:var(--grid-columnAtContainerMinXXXS)}.grid-column[style*=grid-rowAtContainerMinXXXS]{grid-row-start:var(--grid-rowAtContainerMinXXXS)}.grid-column[style*=grid-colspan-at-container-min-xxxs]{grid-column-end:span var(--grid-colspan-at-container-min-xxxs)}.grid-column[style*=grid-rowspan-at-container-min-xxxs]{grid-row-end:span var(--grid-rowspan-at-container-min-xxxs)}.grid-column[style*=grid-column-at-container-min-xxxs]{grid-column-start:var(--grid-column-at-container-min-xxxs)}.grid-column[style*=grid-row-at-container-min-xxxs]{grid-row-start:var(--grid-row-at-container-min-xxxs)}}@media(min-width:30em){.grid-column[style*=grid-colspanAtMediaMinXXS]{grid-column-end:span var(--grid-colspanAtMediaMinXXS)}.grid-column[style*=grid-rowspanAtMediaMinXXS]{grid-row-end:span var(--grid-rowspanAtMediaMinXXS)}.grid-column[style*=grid-columnAtMediaMinXXS]{grid-column-start:var(--grid-columnAtMediaMinXXS)}.grid-column[style*=grid-rowAtMediaMinXXS]{grid-row-start:var(--grid-rowAtMediaMinXXS)}.grid-column[style*=grid-colspan-at-media-min-xxs]{grid-column-end:span var(--grid-colspan-at-media-min-xxs)}.grid-column[style*=grid-rowspan-at-media-min-xxs]{grid-row-end:span var(--grid-rowspan-at-media-min-xxs)}.grid-column[style*=grid-column-at-media-min-xxs]{grid-column-start:var(--grid-column-at-media-min-xxs)}.grid-column[style*=grid-row-at-media-min-xxs]{grid-row-start:var(--grid-row-at-media-min-xxs)}}@container grid (min-width: 30em){.grid-column[style*=grid-colspanAtContainerMinXXS]{grid-column-end:span var(--grid-colspanAtContainerMinXXS)}.grid-column[style*=grid-rowspanAtContainerMinXXS]{grid-row-end:span var(--grid-rowspanAtContainerMinXXS)}.grid-column[style*=grid-columnAtContainerMinXXS]{grid-column-start:var(--grid-columnAtContainerMinXXS)}.grid-column[style*=grid-rowAtContainerMinXXS]{grid-row-start:var(--grid-rowAtContainerMinXXS)}.grid-column[style*=grid-colspan-at-container-min-xxs]{grid-column-end:span var(--grid-colspan-at-container-min-xxs)}.grid-column[style*=grid-rowspan-at-container-min-xxs]{grid-row-end:span var(--grid-rowspan-at-container-min-xxs)}.grid-column[style*=grid-column-at-container-min-xxs]{grid-column-start:var(--grid-column-at-container-min-xxs)}.grid-column[style*=grid-row-at-container-min-xxs]{grid-row-start:var(--grid-row-at-container-min-xxs)}}@media(min-width:40em){.grid-column[style*=grid-colspanAtMediaMinXS]{grid-column-end:span var(--grid-colspanAtMediaMinXS)}.grid-column[style*=grid-rowspanAtMediaMinXS]{grid-row-end:span var(--grid-rowspanAtMediaMinXS)}.grid-column[style*=grid-columnAtMediaMinXS]{grid-column-start:var(--grid-columnAtMediaMinXS)}.grid-column[style*=grid-rowAtMediaMinXS]{grid-row-start:var(--grid-rowAtMediaMinXS)}.grid-column[style*=grid-colspan-at-media-min-xs]{grid-column-end:span var(--grid-colspan-at-media-min-xs)}.grid-column[style*=grid-rowspan-at-media-min-xs]{grid-row-end:span var(--grid-rowspan-at-media-min-xs)}.grid-column[style*=grid-column-at-media-min-xs]{grid-column-start:var(--grid-column-at-media-min-xs)}.grid-column[style*=grid-row-at-media-min-xs]{grid-row-start:var(--grid-row-at-media-min-xs)}}@container grid (min-width: 40em){.grid-column[style*=grid-colspanAtContainerMinXS]{grid-column-end:span var(--grid-colspanAtContainerMinXS)}.grid-column[style*=grid-rowspanAtContainerMinXS]{grid-row-end:span var(--grid-rowspanAtContainerMinXS)}.grid-column[style*=grid-columnAtContainerMinXS]{grid-column-start:var(--grid-columnAtContainerMinXS)}.grid-column[style*=grid-rowAtContainerMinXS]{grid-row-start:var(--grid-rowAtContainerMinXS)}.grid-column[style*=grid-colspan-at-container-min-xs]{grid-column-end:span var(--grid-colspan-at-container-min-xs)}.grid-column[style*=grid-rowspan-at-container-min-xs]{grid-row-end:span var(--grid-rowspan-at-container-min-xs)}.grid-column[style*=grid-column-at-container-min-xs]{grid-column-start:var(--grid-column-at-container-min-xs)}.grid-column[style*=grid-row-at-container-min-xs]{grid-row-start:var(--grid-row-at-container-min-xs)}}@media(min-width:50em){.grid-column[style*=grid-colspanAtMediaMinS]{grid-column-end:span var(--grid-colspanAtMediaMinS)}.grid-column[style*=grid-rowspanAtMediaMinS]{grid-row-end:span var(--grid-rowspanAtMediaMinS)}.grid-column[style*=grid-columnAtMediaMinS]{grid-column-start:var(--grid-columnAtMediaMinS)}.grid-column[style*=grid-rowAtMediaMinS]{grid-row-start:var(--grid-rowAtMediaMinS)}.grid-column[style*=grid-colspan-at-media-min-s]{grid-column-end:span var(--grid-colspan-at-media-min-s)}.grid-column[style*=grid-rowspan-at-media-min-s]{grid-row-end:span var(--grid-rowspan-at-media-min-s)}.grid-column[style*=grid-column-at-media-min-s]{grid-column-start:var(--grid-column-at-media-min-s)}.grid-column[style*=grid-row-at-media-min-s]{grid-row-start:var(--grid-row-at-media-min-s)}}@container grid (min-width: 50em){.grid-column[style*=grid-colspanAtContainerMinS]{grid-column-end:span var(--grid-colspanAtContainerMinS)}.grid-column[style*=grid-rowspanAtContainerMinS]{grid-row-end:span var(--grid-rowspanAtContainerMinS)}.grid-column[style*=grid-columnAtContainerMinS]{grid-column-start:var(--grid-columnAtContainerMinS)}.grid-column[style*=grid-rowAtContainerMinS]{grid-row-start:var(--grid-rowAtContainerMinS)}.grid-column[style*=grid-colspan-at-container-min-s]{grid-column-end:span var(--grid-colspan-at-container-min-s)}.grid-column[style*=grid-rowspan-at-container-min-s]{grid-row-end:span var(--grid-rowspan-at-container-min-s)}.grid-column[style*=grid-column-at-container-min-s]{grid-column-start:var(--grid-column-at-container-min-s)}.grid-column[style*=grid-row-at-container-min-s]{grid-row-start:var(--grid-row-at-container-min-s)}}@media(min-width:64em){.grid-column[style*=grid-colspanAtMediaMinM]{grid-column-end:span var(--grid-colspanAtMediaMinM)}.grid-column[style*=grid-rowspanAtMediaMinM]{grid-row-end:span var(--grid-rowspanAtMediaMinM)}.grid-column[style*=grid-columnAtMediaMinM]{grid-column-start:var(--grid-columnAtMediaMinM)}.grid-column[style*=grid-rowAtMediaMinM]{grid-row-start:var(--grid-rowAtMediaMinM)}.grid-column[style*=grid-colspan-at-media-min-m]{grid-column-end:span var(--grid-colspan-at-media-min-m)}.grid-column[style*=grid-rowspan-at-media-min-m]{grid-row-end:span var(--grid-rowspan-at-media-min-m)}.grid-column[style*=grid-column-at-media-min-m]{grid-column-start:var(--grid-column-at-media-min-m)}.grid-column[style*=grid-row-at-media-min-m]{grid-row-start:var(--grid-row-at-media-min-m)}}@container grid (min-width: 64em){.grid-column[style*=grid-colspanAtContainerMinM]{grid-column-end:span var(--grid-colspanAtContainerMinM)}.grid-column[style*=grid-rowspanAtContainerMinM]{grid-row-end:span var(--grid-rowspanAtContainerMinM)}.grid-column[style*=grid-columnAtContainerMinM]{grid-column-start:var(--grid-columnAtContainerMinM)}.grid-column[style*=grid-rowAtContainerMinM]{grid-row-start:var(--grid-rowAtContainerMinM)}.grid-column[style*=grid-colspan-at-container-min-m]{grid-column-end:span var(--grid-colspan-at-container-min-m)}.grid-column[style*=grid-rowspan-at-container-min-m]{grid-row-end:span var(--grid-rowspan-at-container-min-m)}.grid-column[style*=grid-column-at-container-min-m]{grid-column-start:var(--grid-column-at-container-min-m)}.grid-column[style*=grid-row-at-container-min-m]{grid-row-start:var(--grid-row-at-container-min-m)}}@media(min-width:80em){.grid-column[style*=grid-colspanAtMediaMinL]{grid-column-end:span var(--grid-colspanAtMediaMinL)}.grid-column[style*=grid-rowspanAtMediaMinL]{grid-row-end:span var(--grid-rowspanAtMediaMinL)}.grid-column[style*=grid-columnAtMediaMinL]{grid-column-start:var(--grid-columnAtMediaMinL)}.grid-column[style*=grid-rowAtMediaMinL]{grid-row-start:var(--grid-rowAtMediaMinL)}.grid-column[style*=grid-colspan-at-media-min-l]{grid-column-end:span var(--grid-colspan-at-media-min-l)}.grid-column[style*=grid-rowspan-at-media-min-l]{grid-row-end:span var(--grid-rowspan-at-media-min-l)}.grid-column[style*=grid-column-at-media-min-l]{grid-column-start:var(--grid-column-at-media-min-l)}.grid-column[style*=grid-row-at-media-min-l]{grid-row-start:var(--grid-row-at-media-min-l)}}@container grid (min-width: 80em){.grid-column[style*=grid-colspanAtContainerMinL]{grid-column-end:span var(--grid-colspanAtContainerMinL)}.grid-column[style*=grid-rowspanAtContainerMinL]{grid-row-end:span var(--grid-rowspanAtContainerMinL)}.grid-column[style*=grid-columnAtContainerMinL]{grid-column-start:var(--grid-columnAtContainerMinL)}.grid-column[style*=grid-rowAtContainerMinL]{grid-row-start:var(--grid-rowAtContainerMinL)}.grid-column[style*=grid-colspan-at-container-min-l]{grid-column-end:span var(--grid-colspan-at-container-min-l)}.grid-column[style*=grid-rowspan-at-container-min-l]{grid-row-end:span var(--grid-rowspan-at-container-min-l)}.grid-column[style*=grid-column-at-container-min-l]{grid-column-start:var(--grid-column-at-container-min-l)}.grid-column[style*=grid-row-at-container-min-l]{grid-row-start:var(--grid-row-at-container-min-l)}}@media(min-width:85.375em){.grid-column[style*=grid-colspanAtMediaMinXL]{grid-column-end:span var(--grid-colspanAtMediaMinXL)}.grid-column[style*=grid-rowspanAtMediaMinXL]{grid-row-end:span var(--grid-rowspanAtMediaMinXL)}.grid-column[style*=grid-columnAtMediaMinXL]{grid-column-start:var(--grid-columnAtMediaMinXL)}.grid-column[style*=grid-rowAtMediaMinXL]{grid-row-start:var(--grid-rowAtMediaMinXL)}.grid-column[style*=grid-colspan-at-media-min-xl]{grid-column-end:span var(--grid-colspan-at-media-min-xl)}.grid-column[style*=grid-rowspan-at-media-min-xl]{grid-row-end:span var(--grid-rowspan-at-media-min-xl)}.grid-column[style*=grid-column-at-media-min-xl]{grid-column-start:var(--grid-column-at-media-min-xl)}.grid-column[style*=grid-row-at-media-min-xl]{grid-row-start:var(--grid-row-at-media-min-xl)}}@container grid (min-width: 85.375em){.grid-column[style*=grid-colspanAtContainerMinXL]{grid-column-end:span var(--grid-colspanAtContainerMinXL)}.grid-column[style*=grid-rowspanAtContainerMinXL]{grid-row-end:span var(--grid-rowspanAtContainerMinXL)}.grid-column[style*=grid-columnAtContainerMinXL]{grid-column-start:var(--grid-columnAtContainerMinXL)}.grid-column[style*=grid-rowAtContainerMinXL]{grid-row-start:var(--grid-rowAtContainerMinXL)}.grid-column[style*=grid-colspan-at-container-min-xl]{grid-column-end:span var(--grid-colspan-at-container-min-xl)}.grid-column[style*=grid-rowspan-at-container-min-xl]{grid-row-end:span var(--grid-rowspan-at-container-min-xl)}.grid-column[style*=grid-column-at-container-min-xl]{grid-column-start:var(--grid-column-at-container-min-xl)}.grid-column[style*=grid-row-at-container-min-xl]{grid-row-start:var(--grid-row-at-container-min-xl)}}@media(min-width:100em){.grid-column[style*=grid-colspanAtMediaMinXXL]{grid-column-end:span var(--grid-colspanAtMediaMinXXL)}.grid-column[style*=grid-rowspanAtMediaMinXXL]{grid-row-end:span var(--grid-rowspanAtMediaMinXXL)}.grid-column[style*=grid-columnAtMediaMinXXL]{grid-column-start:var(--grid-columnAtMediaMinXXL)}.grid-column[style*=grid-rowAtMediaMinXXL]{grid-row-start:var(--grid-rowAtMediaMinXXL)}.grid-column[style*=grid-colspan-at-media-min-xxl]{grid-column-end:span var(--grid-colspan-at-media-min-xxl)}.grid-column[style*=grid-rowspan-at-media-min-xxl]{grid-row-end:span var(--grid-rowspan-at-media-min-xxl)}.grid-column[style*=grid-column-at-media-min-xxl]{grid-column-start:var(--grid-column-at-media-min-xxl)}.grid-column[style*=grid-row-at-media-min-xxl]{grid-row-start:var(--grid-row-at-media-min-xxl)}}@container grid (min-width: 100em){.grid-column[style*=grid-colspanAtContainerMinXXL]{grid-column-end:span var(--grid-colspanAtContainerMinXXL)}.grid-column[style*=grid-rowspanAtContainerMinXXL]{grid-row-end:span var(--grid-rowspanAtContainerMinXXL)}.grid-column[style*=grid-columnAtContainerMinXXL]{grid-column-start:var(--grid-columnAtContainerMinXXL)}.grid-column[style*=grid-rowAtContainerMinXXL]{grid-row-start:var(--grid-rowAtContainerMinXXL)}.grid-column[style*=grid-colspan-at-container-min-xxl]{grid-column-end:span var(--grid-colspan-at-container-min-xxl)}.grid-column[style*=grid-rowspan-at-container-min-xxl]{grid-row-end:span var(--grid-rowspan-at-container-min-xxl)}.grid-column[style*=grid-column-at-container-min-xxl]{grid-column-start:var(--grid-column-at-container-min-xxl)}.grid-column[style*=grid-row-at-container-min-xxl]{grid-row-start:var(--grid-row-at-container-min-xxl)}}@media(min-width:120em){.grid-column[style*=grid-colspanAtMediaMinXXXL]{grid-column-end:span var(--grid-colspanAtMediaMinXXXL)}.grid-column[style*=grid-rowspanAtMediaMinXXXL]{grid-row-end:span var(--grid-rowspanAtMediaMinXXXL)}.grid-column[style*=grid-columnAtMediaMinXXXL]{grid-column-start:var(--grid-columnAtMediaMinXXXL)}.grid-column[style*=grid-rowAtMediaMinXXXL]{grid-row-start:var(--grid-rowAtMediaMinXXXL)}.grid-column[style*=grid-colspan-at-media-min-xxxl]{grid-column-end:span var(--grid-colspan-at-media-min-xxxl)}.grid-column[style*=grid-rowspan-at-media-min-xxxl]{grid-row-end:span var(--grid-rowspan-at-media-min-xxxl)}.grid-column[style*=grid-column-at-media-min-xxxl]{grid-column-start:var(--grid-column-at-media-min-xxxl)}.grid-column[style*=grid-row-at-media-min-xxxl]{grid-row-start:var(--grid-row-at-media-min-xxxl)}}@container grid (min-width: 120em){.grid-column[style*=grid-colspanAtContainerMinXXXL]{grid-column-end:span var(--grid-colspanAtContainerMinXXXL)}.grid-column[style*=grid-rowspanAtContainerMinXXXL]{grid-row-end:span var(--grid-rowspanAtContainerMinXXXL)}.grid-column[style*=grid-columnAtContainerMinXXXL]{grid-column-start:var(--grid-columnAtContainerMinXXXL)}.grid-column[style*=grid-rowAtContainerMinXXXL]{grid-row-start:var(--grid-rowAtContainerMinXXXL)}.grid-column[style*=grid-colspan-at-container-min-xxxl]{grid-column-end:span var(--grid-colspan-at-container-min-xxxl)}.grid-column[style*=grid-rowspan-at-container-min-xxxl]{grid-row-end:span var(--grid-rowspan-at-container-min-xxxl)}.grid-column[style*=grid-column-at-container-min-xxxl]{grid-column-start:var(--grid-column-at-container-min-xxxl)}.grid-column[style*=grid-row-at-container-min-xxxl]{grid-row-start:var(--grid-row-at-container-min-xxxl)}}}@layer mods{.grid.mod-auto{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-auto .grid-column{grid-row:1}.grid.mod-autoAtMediaMinXXXS{--grid-columns: 1}@media(min-width:20em){.grid.mod-autoAtMediaMinXXXS{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinXXXS .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinXXXS{--grid-columns: 1}@container grid (min-width: 20em){.grid.mod-autoAtContainerMinXXXS{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinXXXS .grid-column{grid-row:1}}.grid.mod-autoAtMediaMinXXS{--grid-columns: 1}@media(min-width:30em){.grid.mod-autoAtMediaMinXXS{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinXXS .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinXXS{--grid-columns: 1}@container grid (min-width: 30em){.grid.mod-autoAtContainerMinXXS{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinXXS .grid-column{grid-row:1}}.grid.mod-autoAtMediaMinXS{--grid-columns: 1}@media(min-width:40em){.grid.mod-autoAtMediaMinXS{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinXS .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinXS{--grid-columns: 1}@container grid (min-width: 40em){.grid.mod-autoAtContainerMinXS{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinXS .grid-column{grid-row:1}}.grid.mod-autoAtMediaMinS{--grid-columns: 1}@media(min-width:50em){.grid.mod-autoAtMediaMinS{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinS .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinS{--grid-columns: 1}@container grid (min-width: 50em){.grid.mod-autoAtContainerMinS{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinS .grid-column{grid-row:1}}.grid.mod-autoAtMediaMinM{--grid-columns: 1}@media(min-width:64em){.grid.mod-autoAtMediaMinM{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinM .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinM{--grid-columns: 1}@container grid (min-width: 64em){.grid.mod-autoAtContainerMinM{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinM .grid-column{grid-row:1}}.grid.mod-autoAtMediaMinL{--grid-columns: 1}@media(min-width:80em){.grid.mod-autoAtMediaMinL{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinL .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinL{--grid-columns: 1}@container grid (min-width: 80em){.grid.mod-autoAtContainerMinL{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinL .grid-column{grid-row:1}}.grid.mod-autoAtMediaMinXL{--grid-columns: 1}@media(min-width:85.375em){.grid.mod-autoAtMediaMinXL{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinXL .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinXL{--grid-columns: 1}@container grid (min-width: 85.375em){.grid.mod-autoAtContainerMinXL{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinXL .grid-column{grid-row:1}}.grid.mod-autoAtMediaMinXXL{--grid-columns: 1}@media(min-width:100em){.grid.mod-autoAtMediaMinXXL{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinXXL .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinXXL{--grid-columns: 1}@container grid (min-width: 100em){.grid.mod-autoAtContainerMinXXL{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinXXL .grid-column{grid-row:1}}.grid.mod-autoAtMediaMinXXXL{--grid-columns: 1}@media(min-width:120em){.grid.mod-autoAtMediaMinXXXL{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtMediaMinXXXL .grid-column{grid-row:1}}.grid.mod-autoAtContainerMinXXXL{--grid-columns: 1}@container grid (min-width: 120em){.grid.mod-autoAtContainerMinXXXL{--grid-template-columns: none;grid-auto-columns:1fr}.grid.mod-autoAtContainerMinXXXL .grid-column{grid-row:1}}.grid.mod-form{--grid-columns: 4;--grid-maxWidth: var(--components-form-maxWidth, 50rem)}.grid.mod-dense{grid-auto-flow:dense}}lu-grid{display:contents}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: GridComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: GridComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-grid, [lu-grid]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], providers: [
                         {

package/fesm2022/lucca-front-ng-highlight-data.mjs

@@ -93,10 +93,10 @@ class HighlightDataComponent {
             });
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HighlightDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: HighlightDataComponent, isStandalone: true, selector: "lu-highlight-data", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, subText: { classPropertyName: "subText", publicName: "subText", isSignal: true, isRequired: false, transformFunction: null }, bubble: { classPropertyName: "bubble", publicName: "bubble", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, illustration: { classPropertyName: "illustration", publicName: "illustration", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, valueFirst: { classPropertyName: "valueFirst", publicName: "valueFirst", isSignal: true, isRequired: false, transformFunction: null }, nested: { classPropertyName: "nested", publicName: "nested", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-light": "this.theme() === \"light\"", "class.mod-dark": "this.theme() === \"dark\"" }, classAttribute: "highlightData" }, providers: [LuClass], ngImport: i0, template: "<dl class=\"highlightData-content\">\n\t<dt class=\"highlightData-content-title\"><ng-container *luPortal=\"heading()\" /></dt>\n\t<dd class=\"highlightData-content-value\"><ng-container *luPortal=\"value()\" /></dd>\n\t@if (subText(); as subText) {\n\t\t<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content /></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n\t<div class=\"highlightData-illustrations\">\n\t\t@if (bubble()) {\n\t\t\t<div class=\"highlightData-illustrations-back\" aria-hidden=\"true\" [innerHtml]=\"bubbleSrc() | luSafeExternalSvg\"></div>\n\t\t}\n\t\t@if (illustration()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t\t}\n\t</div>\n}\n", styles: ["@layer components{.highlightData{--components-highlightData-display: grid;--components-highlightData-grid: \"title   action\" \"value   action\" \"subtext action\";--components-highlightData-alignItem: center;--components-highlightData-background: var(--pr-t-elevation-surface-raised);--components-highlightData-padding-inline: var(--pr-t-spacings-200);--components-highlightData-padding-block: var(--pr-t-spacings-150);--components-highlightData-padding: var(--components-highlightData-padding-block) var(--components-highlightData-padding-inline);--components-highlightData-gap: var(--components-highlightData-padding-inline);--components-highlightData-borderRadius: var(--pr-t-border-radius-structure);--components-highlightData-title-color: var(--palettes-neutral-200);--components-highlightData-value-font: var(--pr-t-font-highlight-XXL);--components-highlightData-value-order: 0;--components-highlightData-action-padding: 0;--components-highlightData-illustrations-width: 86px;--components-highlightData-illustrations-height: 72px;--components-highlightData-illustrations-display: grid;--components-highlightData-bubble-primary-light: var(--palettes-assets-primary-light);--components-highlightData-bubble-primary-dark: var(--palettes-assets-primary-dark);--components-highlightData-bubble-secondary-light: var(--palettes-assets-secondary-light);--components-highlightData-bubble-secondary-dark: var(--palettes-assets-secondary-lighter);--components-highlightData-bubble-brand-light: var(--palettes-assets-brand-dark);--components-highlightData-bubble-brand-dark: var(--palettes-assets-brand-lighter);--palettes-assets-primary: var(--components-highlightData-bubble-primary-light);--palettes-assets-secondary: var(--components-highlightData-bubble-secondary-light);--palettes-assets-brand: var(--components-highlightData-bubble-brand-light);display:block;background-color:var(--components-highlightData-background);border-radius:var(--components-highlightData-borderRadius);overflow:hidden;padding:var(--components-highlightData-padding);position:relative}.highlightData-content{margin:0}.highlightData-content>dd,.highlightData-content>div>dd{margin:0}.highlightData-content{display:var(--components-highlightData-display);grid-template-columns:1fr auto;grid-template-areas:var(--components-highlightData-grid);align-items:var(--components-highlightData-alignItem);flex-direction:column;column-gap:var(--components-highlightData-gap)}.highlightData-content-title{grid-area:title;font:var(--pr-t-font-body-S);color:var(--pr-t-color-text-subtle)}.highlightData-content-value{grid-area:value;font:var(--components-highlightData-value-font);order:var(--components-highlightData-value-order);color:var(--pr-t-color-text-heading)}.highlightData-content-subText{grid-area:subtext;font:var(--pr-t-font-body-XS);color:var(--pr-t-color-text-subtle);margin-block-start:var(--pr-t-spacings-100)!important}.highlightData-content-action{grid-area:action;padding-block-start:var(--components-highlightData-action-padding)}.highlightData-content-action:empty{display:none}.highlightData-content-action .link{--commons-text-link-color: var(--palettes-700, var(--palettes-product-700));--commons-text-link-hover: var(--palettes-800, var(--palettes-product-800))}.highlightData-content-action .button.mod-outlined{--palettes-text: var(--palettes-neutral-text);--palettes-0: var(--palettes-neutral-0);--palettes-25: var(--palettes-neutral-25);--palettes-50: var(--palettes-neutral-50);--palettes-100: var(--palettes-neutral-100);--palettes-200: var(--palettes-neutral-200);--palettes-300: var(--palettes-neutral-300);--palettes-400: var(--palettes-neutral-400);--palettes-500: var(--palettes-neutral-500);--palettes-600: var(--palettes-neutral-600);--palettes-700: var(--palettes-neutral-700);--palettes-800: var(--palettes-neutral-800);--palettes-900: var(--palettes-neutral-900)}.highlightData-illustrations{display:var(--components-highlightData-illustrations-display);place-content:center;position:absolute;inset-block-end:0;inset-inline-end:0}.highlightData-illustrations-back,.highlightData-illustrations-front{grid-area:1/1;block-size:var(--components-highlightData-illustrations-height);inline-size:var(--components-highlightData-illustrations-width)}}@layer mods{.highlightData.mod-light{--components-highlightData-background: var(--palettes-50, var(--palettes-product-50))}.highlightData.mod-dark{--components-highlightData-background: var(--palettes-100, var(--palettes-product-100));--palettes-assets-primary: var(--components-highlightData-bubble-primary-dark);--palettes-assets-secondary: var(--components-highlightData-bubble-secondary-dark);--palettes-assets-brand: var(--components-highlightData-bubble-brand-dark)}.highlightData.palette-success{--components-highlightData-bubble-primary-light: var(--palettes-success-100);--components-highlightData-bubble-primary-dark: var(--palettes-success-300);--components-highlightData-bubble-secondary-light: var(--palettes-brand-300);--components-highlightData-bubble-secondary-dark: var(--palettes-brand-100);--components-highlightData-bubble-brand-dark: var(--palettes-assets-primary-light)}.highlightData.palette-warning{--components-highlightData-bubble-primary-light: var(--palettes-warning-100);--components-highlightData-bubble-primary-dark: var(--palettes-warning-300);--components-highlightData-bubble-secondary-light: var(--palettes-brand-300);--components-highlightData-bubble-secondary-dark: var(--palettes-assets-brand-lighter);--components-highlightData-bubble-brand-dark: var(--palettes-assets-primary-dark)}.highlightData.palette-critical{--components-highlightData-bubble-primary-light: var(--palettes-critical-100);--components-highlightData-bubble-primary-dark: var(--palettes-critical-300);--components-highlightData-bubble-secondary-light: var(--palettes-brand-300);--components-highlightData-bubble-secondary-dark: var(--palettes-assets-brand-lighter);--components-highlightData-bubble-brand-dark: var(--palettes-brand-300)}.highlightData.mod-valueFirst{--components-highlightData-grid: \"value   action\" \"title   action\" \"subtext action\"}.highlightData.mod-S{--components-highlightData-value-font: var(--pr-t-font-highlight-XL);--components-highlightData-illustrations-width: 82px;--components-highlightData-illustrations-height: 68px}.highlightData.mod-XS{--components-highlightData-value-font: var(--pr-t-font-highlight-L);--components-highlightData-illustrations-width: 77px;--components-highlightData-illustrations-height: 64px}.highlightData.mod-nested{--components-highlightData-borderRadius: var(--pr-t-border-radius-default)}.highlightData:has(.highlightData-illustrations){--components-highlightData-display: flex;--components-highlightData-alignItem: start;--components-highlightData-action-padding: var(--pr-t-spacings-100);padding-inline-end:calc(var(--components-highlightData-illustrations-width) + var(--components-highlightData-padding-inline))}.highlightData:has(.highlightData-illustrations).mod-valueFirst{--components-highlightData-value-order: -1}}\n"], dependencies: [{ kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "pipe", type: LuSafeExternalSvgPipe, name: "luSafeExternalSvg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HighlightDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: HighlightDataComponent, isStandalone: true, selector: "lu-highlight-data", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, subText: { classPropertyName: "subText", publicName: "subText", isSignal: true, isRequired: false, transformFunction: null }, bubble: { classPropertyName: "bubble", publicName: "bubble", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, illustration: { classPropertyName: "illustration", publicName: "illustration", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, valueFirst: { classPropertyName: "valueFirst", publicName: "valueFirst", isSignal: true, isRequired: false, transformFunction: null }, nested: { classPropertyName: "nested", publicName: "nested", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-light": "this.theme() === \"light\"", "class.mod-dark": "this.theme() === \"dark\"" }, classAttribute: "highlightData" }, providers: [LuClass], ngImport: i0, template: "<dl class=\"highlightData-content\">\n\t<dt class=\"highlightData-content-title\"><ng-container *luPortal=\"heading()\" /></dt>\n\t<dd class=\"highlightData-content-value\"><ng-container *luPortal=\"value()\" /></dd>\n\t@if (subText(); as subText) {\n\t\t<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content /></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n\t<div class=\"highlightData-illustrations\">\n\t\t@if (bubble()) {\n\t\t\t<div class=\"highlightData-illustrations-back\" aria-hidden=\"true\" [innerHtml]=\"bubbleSrc() | luSafeExternalSvg\"></div>\n\t\t}\n\t\t@if (illustration()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t\t}\n\t</div>\n}\n", styles: ["@layer components{.highlightData{--components-highlightData-display: grid;--components-highlightData-grid: \"title   action\" \"value   action\" \"subtext action\";--components-highlightData-alignItem: center;--components-highlightData-background: var(--pr-t-elevation-surface-raised);--components-highlightData-padding-inline: var(--pr-t-spacings-200);--components-highlightData-padding-block: var(--pr-t-spacings-150);--components-highlightData-padding: var(--components-highlightData-padding-block) var(--components-highlightData-padding-inline);--components-highlightData-gap: var(--components-highlightData-padding-inline);--components-highlightData-borderRadius: var(--pr-t-border-radius-structure);--components-highlightData-title-color: var(--palettes-neutral-200);--components-highlightData-value-font: var(--pr-t-font-highlight-XXL);--components-highlightData-value-order: 0;--components-highlightData-action-padding: 0;--components-highlightData-illustrations-width: 86px;--components-highlightData-illustrations-height: 72px;--components-highlightData-illustrations-display: grid;--components-highlightData-bubble-primary-light: var(--palettes-assets-primary-light);--components-highlightData-bubble-primary-dark: var(--palettes-assets-primary-dark);--components-highlightData-bubble-secondary-light: var(--palettes-assets-secondary-light);--components-highlightData-bubble-secondary-dark: var(--palettes-assets-secondary-lighter);--components-highlightData-bubble-brand-light: var(--palettes-assets-brand-dark);--components-highlightData-bubble-brand-dark: var(--palettes-assets-brand-lighter);--palettes-assets-primary: var(--components-highlightData-bubble-primary-light);--palettes-assets-secondary: var(--components-highlightData-bubble-secondary-light);--palettes-assets-brand: var(--components-highlightData-bubble-brand-light);display:block;background-color:var(--components-highlightData-background);border-radius:var(--components-highlightData-borderRadius);overflow:hidden;padding:var(--components-highlightData-padding);position:relative}.highlightData-content{margin:0}.highlightData-content>dd,.highlightData-content>div>dd{margin:0}.highlightData-content{display:var(--components-highlightData-display);grid-template-columns:1fr auto;grid-template-areas:var(--components-highlightData-grid);align-items:var(--components-highlightData-alignItem);flex-direction:column;column-gap:var(--components-highlightData-gap)}.highlightData-content-title{grid-area:title;font:var(--pr-t-font-body-S);color:var(--pr-t-color-text-subtle)}.highlightData-content-value{grid-area:value;font:var(--components-highlightData-value-font);order:var(--components-highlightData-value-order);color:var(--pr-t-color-text-heading)}.highlightData-content-subText{grid-area:subtext;font:var(--pr-t-font-body-XS);color:var(--pr-t-color-text-subtle);margin-block-start:var(--pr-t-spacings-100)!important}.highlightData-content-action{grid-area:action;padding-block-start:var(--components-highlightData-action-padding)}.highlightData-content-action:empty{display:none}.highlightData-content-action .link{--commons-text-link-color: var(--palettes-700, var(--palettes-product-700));--commons-text-link-hover: var(--palettes-800, var(--palettes-product-800))}.highlightData-content-action .button.mod-outlined{--palettes-text: var(--palettes-neutral-text);--palettes-0: var(--palettes-neutral-0);--palettes-25: var(--palettes-neutral-25);--palettes-50: var(--palettes-neutral-50);--palettes-100: var(--palettes-neutral-100);--palettes-200: var(--palettes-neutral-200);--palettes-300: var(--palettes-neutral-300);--palettes-400: var(--palettes-neutral-400);--palettes-500: var(--palettes-neutral-500);--palettes-600: var(--palettes-neutral-600);--palettes-700: var(--palettes-neutral-700);--palettes-800: var(--palettes-neutral-800);--palettes-900: var(--palettes-neutral-900)}.highlightData-illustrations{display:var(--components-highlightData-illustrations-display);place-content:center;position:absolute;inset-block-end:0;inset-inline-end:0}.highlightData-illustrations-back,.highlightData-illustrations-front{grid-area:1/1;block-size:var(--components-highlightData-illustrations-height);inline-size:var(--components-highlightData-illustrations-width)}}@layer mods{.highlightData.mod-light{--components-highlightData-background: var(--palettes-50, var(--palettes-product-50))}.highlightData.mod-dark{--components-highlightData-background: var(--palettes-100, var(--palettes-product-100));--palettes-assets-primary: var(--components-highlightData-bubble-primary-dark);--palettes-assets-secondary: var(--components-highlightData-bubble-secondary-dark);--palettes-assets-brand: var(--components-highlightData-bubble-brand-dark)}.highlightData.palette-success{--components-highlightData-bubble-primary-light: var(--palettes-success-100);--components-highlightData-bubble-primary-dark: var(--palettes-success-300);--components-highlightData-bubble-secondary-light: var(--palettes-brand-300);--components-highlightData-bubble-secondary-dark: var(--palettes-brand-100);--components-highlightData-bubble-brand-dark: var(--palettes-assets-primary-light)}.highlightData.palette-warning{--components-highlightData-bubble-primary-light: var(--palettes-warning-100);--components-highlightData-bubble-primary-dark: var(--palettes-warning-300);--components-highlightData-bubble-secondary-light: var(--palettes-brand-300);--components-highlightData-bubble-secondary-dark: var(--palettes-assets-brand-lighter);--components-highlightData-bubble-brand-dark: var(--palettes-assets-primary-dark)}.highlightData.palette-critical{--components-highlightData-bubble-primary-light: var(--palettes-critical-100);--components-highlightData-bubble-primary-dark: var(--palettes-critical-300);--components-highlightData-bubble-secondary-light: var(--palettes-brand-300);--components-highlightData-bubble-secondary-dark: var(--palettes-assets-brand-lighter);--components-highlightData-bubble-brand-dark: var(--palettes-brand-300)}.highlightData.mod-valueFirst{--components-highlightData-grid: \"value   action\" \"title   action\" \"subtext action\"}.highlightData.mod-S{--components-highlightData-value-font: var(--pr-t-font-highlight-XL);--components-highlightData-illustrations-width: 82px;--components-highlightData-illustrations-height: 68px}.highlightData.mod-XS{--components-highlightData-value-font: var(--pr-t-font-highlight-L);--components-highlightData-illustrations-width: 77px;--components-highlightData-illustrations-height: 64px}.highlightData.mod-nested{--components-highlightData-borderRadius: var(--pr-t-border-radius-default)}.highlightData:has(.highlightData-illustrations){--components-highlightData-display: flex;--components-highlightData-alignItem: start;--components-highlightData-action-padding: var(--pr-t-spacings-100);padding-inline-end:calc(var(--components-highlightData-illustrations-width) + var(--components-highlightData-padding-inline))}.highlightData:has(.highlightData-illustrations).mod-valueFirst{--components-highlightData-value-order: -1}}\n"], dependencies: [{ kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "pipe", type: LuSafeExternalSvgPipe, name: "luSafeExternalSvg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HighlightDataComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HighlightDataComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-highlight-data', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [PortalDirective, LuSafeExternalSvgPipe], providers: [LuClass], host: {
                         class: 'highlightData',

package/fesm2022/lucca-front-ng-highlight-section.mjs

@@ -27,6 +27,9 @@ const HIGHLIGHT_SECTION_ILLUSTRATION = [
 ];
 
 const ILLUSTRATION_CDN_PATH = 'https://cdn.lucca.fr/transverse/prisme/visuals/highlight-section';
+/**
+ * @deprecated Will be replaced by `lu-box` in v22.2.
+ */
 class HighlightSectionComponent {
     constructor() {
         /**
@@ -64,10 +67,10 @@ class HighlightSectionComponent {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "illustrationSrc" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HighlightSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: HighlightSectionComponent, isStandalone: true, selector: "lu-highlight-section", inputs: { theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, bubbleStart: { classPropertyName: "bubbleStart", publicName: "bubbleStart", isSignal: true, isRequired: false, transformFunction: null }, bubbleEnd: { classPropertyName: "bubbleEnd", publicName: "bubbleEnd", isSignal: true, isRequired: false, transformFunction: null }, illustration: { classPropertyName: "illustration", publicName: "illustration", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-light": "this.theme() === \"light\"", "class.mod-dark": "this.theme() === \"dark\"", "class": "\"palette-\" + palette()" }, classAttribute: "highlightSection" }, providers: [LuClass], ngImport: i0, template: "@if (bubbleStart()) {\n\t<div class=\"highlightSection-bubbleStart\" [innerHtml]=\"bubbleStartSrc() | luSafeExternalSvg\"></div>\n}\n@if (bubbleEnd()) {\n\t<div class=\"highlightSection-bubbleEnd\" [innerHtml]=\"bubbleEndSrc() | luSafeExternalSvg\"></div>\n}\n\n<div class=\"highlightSection-content\">\n\t<div class=\"highlightSection-content-slot\"><ng-content /></div>\n\t@if (illustration()) {\n\t\t<img alt=\"\" class=\"highlightSection-content-illustration\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n", styles: ["@layer components{.highlightSection{--components-highlightSection-background: var(--pr-t-elevation-surface-raised);--components-highlightSection-borderRadius: var(--pr-t-border-radius-structure);--components-highlightSection-gap: var(--pr-t-spacings-100);--components-highlightSection-illustration-blockSize: 150px;--components-highlightSection-illustration-inlineSize: 140px;--components-highlightSection-padding: var(--pr-t-spacings-200);--components-highlightSection-content-illustration-display: block;--components-highlightSection-bubbleStartBubbleEnd-display: flex;background-color:var(--components-highlightSection-background);border-radius:var(--components-highlightSection-borderRadius);display:block;overflow:hidden;padding:var(--components-highlightSection-padding);position:relative}.highlightSection-content{align-items:flex-start;column-gap:var(--components-highlightSection-gap);display:flex;position:relative}.highlightSection-content-slot{flex-grow:1;min-inline-size:0}.highlightSection-content-illustration{block-size:var(--components-highlightSection-illustration-blockSize);inline-size:var(--components-highlightSection-illustration-inlineSize);flex-shrink:0;display:var(--components-highlightSection-content-illustration-display)}.highlightSection-bubbleStart,.highlightSection-bubbleEnd{inset-block-end:0;position:absolute;pointer-events:none;display:var(--components-highlightSection-bubbleStartBubbleEnd-display)}.highlightSection-bubbleStart{inset-inline-start:0}.highlightSection-bubbleEnd{inset-inline-end:0;transform:scaleX(-1)}}@layer mods{.highlightSection.mod-light{--components-highlightSection-background: var(--palettes-50, var(--palettes-product-50));--palettes-assets-primary: var(--palettes-assets-primary-light)}.highlightSection.mod-dark{--components-highlightSection-background: var(--palettes-100, var(--palettes-product-100));--palettes-assets-primary: var(--palettes-assets-primary-dark)}@media not all and (min-width:30em){.highlightSection{--components-highlightSection-content-illustration-display: none;--components-highlightSection-bubbleStartBubbleEnd-display: none}}}\n"], dependencies: [{ kind: "pipe", type: LuSafeExternalSvgPipe, name: "luSafeExternalSvg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HighlightSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: HighlightSectionComponent, isStandalone: true, selector: "lu-highlight-section", inputs: { theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, bubbleStart: { classPropertyName: "bubbleStart", publicName: "bubbleStart", isSignal: true, isRequired: false, transformFunction: null }, bubbleEnd: { classPropertyName: "bubbleEnd", publicName: "bubbleEnd", isSignal: true, isRequired: false, transformFunction: null }, illustration: { classPropertyName: "illustration", publicName: "illustration", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-light": "this.theme() === \"light\"", "class.mod-dark": "this.theme() === \"dark\"", "class": "\"palette-\" + palette()" }, classAttribute: "highlightSection" }, providers: [LuClass], ngImport: i0, template: "@if (bubbleStart()) {\n\t<div class=\"highlightSection-bubbleStart\" [innerHtml]=\"bubbleStartSrc() | luSafeExternalSvg\"></div>\n}\n@if (bubbleEnd()) {\n\t<div class=\"highlightSection-bubbleEnd\" [innerHtml]=\"bubbleEndSrc() | luSafeExternalSvg\"></div>\n}\n\n<div class=\"highlightSection-content\">\n\t<div class=\"highlightSection-content-slot\"><ng-content /></div>\n\t@if (illustration()) {\n\t\t<img alt=\"\" class=\"highlightSection-content-illustration\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n", styles: ["@layer components{.highlightSection{--components-highlightSection-background: var(--pr-t-elevation-surface-raised);--components-highlightSection-borderRadius: var(--pr-t-border-radius-structure);--components-highlightSection-gap: var(--pr-t-spacings-100);--components-highlightSection-illustration-blockSize: 150px;--components-highlightSection-illustration-inlineSize: 140px;--components-highlightSection-padding: var(--pr-t-spacings-200);--components-highlightSection-content-illustration-display: block;--components-highlightSection-bubbleStartBubbleEnd-display: flex;background-color:var(--components-highlightSection-background);border-radius:var(--components-highlightSection-borderRadius);display:block;overflow:hidden;padding:var(--components-highlightSection-padding);position:relative}.highlightSection-content{align-items:flex-start;column-gap:var(--components-highlightSection-gap);display:flex;position:relative}.highlightSection-content-slot{flex-grow:1;min-inline-size:0}.highlightSection-content-illustration{block-size:var(--components-highlightSection-illustration-blockSize);inline-size:var(--components-highlightSection-illustration-inlineSize);flex-shrink:0;display:var(--components-highlightSection-content-illustration-display)}.highlightSection-bubbleStart,.highlightSection-bubbleEnd{inset-block-end:0;position:absolute;pointer-events:none;display:var(--components-highlightSection-bubbleStartBubbleEnd-display)}.highlightSection-bubbleStart{inset-inline-start:0}.highlightSection-bubbleEnd{inset-inline-end:0;transform:scaleX(-1)}}@layer mods{.highlightSection.mod-light{--components-highlightSection-background: var(--palettes-50, var(--palettes-product-50));--palettes-assets-primary: var(--palettes-assets-primary-light)}.highlightSection.mod-dark{--components-highlightSection-background: var(--palettes-100, var(--palettes-product-100));--palettes-assets-primary: var(--palettes-assets-primary-dark)}@media not all and (min-width:30em){.highlightSection{--components-highlightSection-content-illustration-display: none;--components-highlightSection-bubbleStartBubbleEnd-display: none}}}\n"], dependencies: [{ kind: "pipe", type: LuSafeExternalSvgPipe, name: "luSafeExternalSvg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HighlightSectionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HighlightSectionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-highlight-section', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [LuClass], imports: [LuSafeExternalSvgPipe], host: {
                         class: 'highlightSection',

package/fesm2022/lucca-front-ng-highlight-section.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lucca-front-ng-highlight-section.mjs","sources":["../../../packages/ng/highlight-section/highlight-section.type.ts","../../../packages/ng/highlight-section/highlight-section.component.ts","../../../packages/ng/highlight-section/highlight-section.component.html","../../../packages/ng/highlight-section/lucca-front-ng-highlight-section.ts"],"sourcesContent":["/**\n * Available HighlightSectionComponent Types\n */\n\nexport const HIGHLIGHT_SECTION_THEME = ['white', 'light', 'dark'] as const;\nexport type HighlightSectionTheme = (typeof HIGHLIGHT_SECTION_THEME)[number];\n\nexport const HIGHLIGHT_SECTION_PALETTE = ['lucca', 'cleemy', 'timmi', 'poplee', 'coreHR', 'pagga', 'cc'] as const;\nexport type HighlightSectionPalette = (typeof HIGHLIGHT_SECTION_PALETTE)[number];\n\nexport const HIGHLIGHT_SECTION_BUBBLE = [1, 2, 3] as const;\nexport type HighlightSectionBubble = (typeof HIGHLIGHT_SECTION_BUBBLE)[number];\n\nexport const HIGHLIGHT_SECTION_ILLUSTRATION = [\n\t'coffee',\n\t'cookie',\n\t'error',\n\t'glasses',\n\t'lock',\n\t'lucca',\n\t'paiement-card',\n\t'party-favor',\n\t'plant-01',\n\t'plant-02',\n\t'plug',\n\t'pola',\n\t'post-its',\n\t'tea',\n] as const;\nexport type HighlightSectionIllustration = (typeof HIGHLIGHT_SECTION_ILLUSTRATION)[number];\n","import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { LuClass } from '@lucca-front/ng/core';\nimport { LuSafeExternalSvgPipe } from '@lucca-front/ng/safe-content';\nimport { HighlightSectionBubble, HighlightSectionIllustration, HighlightSectionPalette, HighlightSectionTheme } from './highlight-section.type';\n\nconst ILLUSTRATION_CDN_PATH = 'https://cdn.lucca.fr/transverse/prisme/visuals/highlight-section';\n\n@Component({\n\tselector: 'lu-highlight-section',\n\ttemplateUrl: './highlight-section.component.html',\n\tstyleUrl: './highlight-section.component.scss',\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\tproviders: [LuClass],\n\timports: [LuSafeExternalSvgPipe],\n\thost: {\n\t\tclass: 'highlightSection',\n\t\t'[class.mod-light]': 'this.theme() === \"light\"',\n\t\t'[class.mod-dark]': 'this.theme() === \"dark\"',\n\t\t'[class]': '\"palette-\" + palette()',\n\t},\n})\nexport class HighlightSectionComponent {\n\t/**\n\t * Define a specific theme white light or dark. (White by default)\n\t */\n\treadonly theme = input<HighlightSectionTheme>('white');\n\n\t/**\n\t * Apply product name to ornaments URL and CSS component palette\n\t * This specific palette must be set up on config.scss\n\t */\n\treadonly palette = input<HighlightSectionPalette | string>('lucca');\n\n\t/**\n\t * Define an ornament style based on the CDN image bubble number.\n\t * Ornaments are hidden when this input is not set.\n\t */\n\treadonly bubbleStart = input<HighlightSectionBubble | number>();\n\treadonly bubbleEnd = input<HighlightSectionBubble | number>();\n\n\t/**\n\t * Illustration displayed at the end of the content\n\t * An URL can be apply for custom images\n\t */\n\treadonly illustration = input<HighlightSectionIllustration | string>();\n\n\treadonly bubbleStartSrc = computed(() => `${ILLUSTRATION_CDN_PATH}/bubbles-${this.bubbleStart()}.svg`);\n\treadonly bubbleEndSrc = computed(() => `${ILLUSTRATION_CDN_PATH}/bubbles-${this.bubbleEnd()}.svg`);\n\n\treadonly illustrationSrc = computed(() => {\n\t\tconst illustration = this.illustration() ?? '';\n\t\treturn illustration.includes('/') ? illustration : `${ILLUSTRATION_CDN_PATH}/${illustration}.svg`;\n\t});\n}\n","@if (bubbleStart()) {\n\t<div class=\"highlightSection-bubbleStart\" [innerHtml]=\"bubbleStartSrc() | luSafeExternalSvg\"></div>\n}\n@if (bubbleEnd()) {\n\t<div class=\"highlightSection-bubbleEnd\" [innerHtml]=\"bubbleEndSrc() | luSafeExternalSvg\"></div>\n}\n\n<div class=\"highlightSection-content\">\n\t<div class=\"highlightSection-content-slot\"><ng-content /></div>\n\t@if (illustration()) {\n\t\t<img alt=\"\" class=\"highlightSection-content-illustration\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAAA;;AAEG;AAEI,MAAM,uBAAuB,GAAG,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM;AAGzD,MAAM,yBAAyB,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI;AAGhG,MAAM,wBAAwB,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;AAGzC,MAAM,8BAA8B,GAAG;IAC7C,QAAQ;IACR,QAAQ;IACR,OAAO;IACP,SAAS;IACT,MAAM;IACN,OAAO;IACP,eAAe;IACf,aAAa;IACb,UAAU;IACV,UAAU;IACV,MAAM;IACN,MAAM;IACN,UAAU;IACV,KAAK;;;ACtBN,MAAM,qBAAqB,GAAG,kEAAkE;MAiBnF,yBAAyB,CAAA;AAftC,IAAA,WAAA,GAAA;AAgBC;;AAEG;QACM,IAAA,CAAA,KAAK,GAAG,KAAK,CAAwB,OAAO;kFAAC;AAEtD;;;AAGG;QACM,IAAA,CAAA,OAAO,GAAG,KAAK,CAAmC,OAAO;oFAAC;AAEnE;;;AAGG;AACM,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK;mGAAmC;AACtD,QAAA,IAAA,CAAA,SAAS,GAAG,KAAK;iGAAmC;AAE7D;;;AAGG;AACM,QAAA,IAAA,CAAA,YAAY,GAAG,KAAK;oGAAyC;AAE7D,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,qBAAqB,CAAA,SAAA,EAAY,IAAI,CAAC,WAAW,EAAE,CAAA,IAAA,CAAM;2FAAC;AAC7F,QAAA,IAAA,CAAA,YAAY,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,qBAAqB,CAAA,SAAA,EAAY,IAAI,CAAC,SAAS,EAAE,CAAA,IAAA,CAAM;yFAAC;AAEzF,QAAA,IAAA,CAAA,eAAe,GAAG,QAAQ,CAAC,MAAK;YACxC,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,EAAE;AAC9C,YAAA,OAAO,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,YAAY,GAAG,CAAA,EAAG,qBAAqB,CAAA,CAAA,EAAI,YAAY,MAAM;QAClG,CAAC;4FAAC;AACF,IAAA;8GAhCY,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAzB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,yBAAyB,m6BAT1B,CAAC,OAAO,CAAC,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECbrB,qgBAaA,4nEDCW,qBAAqB,EAAA,IAAA,EAAA,mBAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAQnB,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBAfrC,SAAS;AACC,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sBAAsB,mBAGf,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,SAAA,EAC1B,CAAC,OAAO,CAAC,EAAA,OAAA,EACX,CAAC,qBAAqB,CAAC,EAAA,IAAA,EAC1B;AACL,wBAAA,KAAK,EAAE,kBAAkB;AACzB,wBAAA,mBAAmB,EAAE,0BAA0B;AAC/C,wBAAA,kBAAkB,EAAE,yBAAyB;AAC7C,wBAAA,SAAS,EAAE,wBAAwB;AACnC,qBAAA,EAAA,QAAA,EAAA,qgBAAA,EAAA,MAAA,EAAA,CAAA,ykEAAA,CAAA,EAAA;;;AEpBF;;AAEG;;"}
+{"version":3,"file":"lucca-front-ng-highlight-section.mjs","sources":["../../../packages/ng/highlight-section/highlight-section.type.ts","../../../packages/ng/highlight-section/highlight-section.component.ts","../../../packages/ng/highlight-section/highlight-section.component.html","../../../packages/ng/highlight-section/lucca-front-ng-highlight-section.ts"],"sourcesContent":["/**\n * Available HighlightSectionComponent Types\n */\n\nexport const HIGHLIGHT_SECTION_THEME = ['white', 'light', 'dark'] as const;\nexport type HighlightSectionTheme = (typeof HIGHLIGHT_SECTION_THEME)[number];\n\nexport const HIGHLIGHT_SECTION_PALETTE = ['lucca', 'cleemy', 'timmi', 'poplee', 'coreHR', 'pagga', 'cc'] as const;\nexport type HighlightSectionPalette = (typeof HIGHLIGHT_SECTION_PALETTE)[number];\n\nexport const HIGHLIGHT_SECTION_BUBBLE = [1, 2, 3] as const;\nexport type HighlightSectionBubble = (typeof HIGHLIGHT_SECTION_BUBBLE)[number];\n\nexport const HIGHLIGHT_SECTION_ILLUSTRATION = [\n\t'coffee',\n\t'cookie',\n\t'error',\n\t'glasses',\n\t'lock',\n\t'lucca',\n\t'paiement-card',\n\t'party-favor',\n\t'plant-01',\n\t'plant-02',\n\t'plug',\n\t'pola',\n\t'post-its',\n\t'tea',\n] as const;\nexport type HighlightSectionIllustration = (typeof HIGHLIGHT_SECTION_ILLUSTRATION)[number];\n","import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { LuClass } from '@lucca-front/ng/core';\nimport { LuSafeExternalSvgPipe } from '@lucca-front/ng/safe-content';\nimport { HighlightSectionBubble, HighlightSectionIllustration, HighlightSectionPalette, HighlightSectionTheme } from './highlight-section.type';\n\nconst ILLUSTRATION_CDN_PATH = 'https://cdn.lucca.fr/transverse/prisme/visuals/highlight-section';\n\n/**\n * @deprecated Will be replaced by `lu-box` in v22.2.\n */\n@Component({\n\tselector: 'lu-highlight-section',\n\ttemplateUrl: './highlight-section.component.html',\n\tstyleUrl: './highlight-section.component.scss',\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\tproviders: [LuClass],\n\timports: [LuSafeExternalSvgPipe],\n\thost: {\n\t\tclass: 'highlightSection',\n\t\t'[class.mod-light]': 'this.theme() === \"light\"',\n\t\t'[class.mod-dark]': 'this.theme() === \"dark\"',\n\t\t'[class]': '\"palette-\" + palette()',\n\t},\n})\nexport class HighlightSectionComponent {\n\t/**\n\t * Define a specific theme white light or dark. (White by default)\n\t */\n\treadonly theme = input<HighlightSectionTheme>('white');\n\n\t/**\n\t * Apply product name to ornaments URL and CSS component palette\n\t * This specific palette must be set up on config.scss\n\t */\n\treadonly palette = input<HighlightSectionPalette | string>('lucca');\n\n\t/**\n\t * Define an ornament style based on the CDN image bubble number.\n\t * Ornaments are hidden when this input is not set.\n\t */\n\treadonly bubbleStart = input<HighlightSectionBubble | number>();\n\treadonly bubbleEnd = input<HighlightSectionBubble | number>();\n\n\t/**\n\t * Illustration displayed at the end of the content\n\t * An URL can be apply for custom images\n\t */\n\treadonly illustration = input<HighlightSectionIllustration | string>();\n\n\treadonly bubbleStartSrc = computed(() => `${ILLUSTRATION_CDN_PATH}/bubbles-${this.bubbleStart()}.svg`);\n\treadonly bubbleEndSrc = computed(() => `${ILLUSTRATION_CDN_PATH}/bubbles-${this.bubbleEnd()}.svg`);\n\n\treadonly illustrationSrc = computed(() => {\n\t\tconst illustration = this.illustration() ?? '';\n\t\treturn illustration.includes('/') ? illustration : `${ILLUSTRATION_CDN_PATH}/${illustration}.svg`;\n\t});\n}\n","@if (bubbleStart()) {\n\t<div class=\"highlightSection-bubbleStart\" [innerHtml]=\"bubbleStartSrc() | luSafeExternalSvg\"></div>\n}\n@if (bubbleEnd()) {\n\t<div class=\"highlightSection-bubbleEnd\" [innerHtml]=\"bubbleEndSrc() | luSafeExternalSvg\"></div>\n}\n\n<div class=\"highlightSection-content\">\n\t<div class=\"highlightSection-content-slot\"><ng-content /></div>\n\t@if (illustration()) {\n\t\t<img alt=\"\" class=\"highlightSection-content-illustration\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAAA;;AAEG;AAEI,MAAM,uBAAuB,GAAG,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM;AAGzD,MAAM,yBAAyB,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI;AAGhG,MAAM,wBAAwB,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;AAGzC,MAAM,8BAA8B,GAAG;IAC7C,QAAQ;IACR,QAAQ;IACR,OAAO;IACP,SAAS;IACT,MAAM;IACN,OAAO;IACP,eAAe;IACf,aAAa;IACb,UAAU;IACV,UAAU;IACV,MAAM;IACN,MAAM;IACN,UAAU;IACV,KAAK;;;ACtBN,MAAM,qBAAqB,GAAG,kEAAkE;AAEhG;;AAEG;MAgBU,yBAAyB,CAAA;AAftC,IAAA,WAAA,GAAA;AAgBC;;AAEG;QACM,IAAA,CAAA,KAAK,GAAG,KAAK,CAAwB,OAAO;kFAAC;AAEtD;;;AAGG;QACM,IAAA,CAAA,OAAO,GAAG,KAAK,CAAmC,OAAO;oFAAC;AAEnE;;;AAGG;AACM,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK;mGAAmC;AACtD,QAAA,IAAA,CAAA,SAAS,GAAG,KAAK;iGAAmC;AAE7D;;;AAGG;AACM,QAAA,IAAA,CAAA,YAAY,GAAG,KAAK;oGAAyC;AAE7D,QAAA,IAAA,CAAA,cAAc,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,qBAAqB,CAAA,SAAA,EAAY,IAAI,CAAC,WAAW,EAAE,CAAA,IAAA,CAAM;2FAAC;AAC7F,QAAA,IAAA,CAAA,YAAY,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,qBAAqB,CAAA,SAAA,EAAY,IAAI,CAAC,SAAS,EAAE,CAAA,IAAA,CAAM;yFAAC;AAEzF,QAAA,IAAA,CAAA,eAAe,GAAG,QAAQ,CAAC,MAAK;YACxC,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,EAAE;AAC9C,YAAA,OAAO,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,YAAY,GAAG,CAAA,EAAG,qBAAqB,CAAA,CAAA,EAAI,YAAY,MAAM;QAClG,CAAC;4FAAC;AACF,IAAA;8GAhCY,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAzB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,yBAAyB,m6BAT1B,CAAC,OAAO,CAAC,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EChBrB,qgBAaA,4nEDIW,qBAAqB,EAAA,IAAA,EAAA,mBAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAQnB,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBAfrC,SAAS;AACC,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sBAAsB,mBAGf,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,SAAA,EAC1B,CAAC,OAAO,CAAC,EAAA,OAAA,EACX,CAAC,qBAAqB,CAAC,EAAA,IAAA,EAC1B;AACL,wBAAA,KAAK,EAAE,kBAAkB;AACzB,wBAAA,mBAAmB,EAAE,0BAA0B;AAC/C,wBAAA,kBAAkB,EAAE,yBAAyB;AAC7C,wBAAA,SAAS,EAAE,wBAAwB;AACnC,qBAAA,EAAA,QAAA,EAAA,qgBAAA,EAAA,MAAA,EAAA,CAAA,ykEAAA,CAAA,EAAA;;;AEvBF;;AAEG;;"}

package/fesm2022/lucca-front-ng-highlight-text.mjs

@@ -8,10 +8,10 @@ class HighlightTextComponent {
         this.paletteClass = computed(() => ({ [`palette-${this.palette()}`]: !!this.palette() }), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "paletteClass" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HighlightTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: HighlightTextComponent, isStandalone: true, selector: "lu-highlight-text", inputs: { palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "strong" }, properties: { "class": "paletteClass()" }, classAttribute: "highlightText" }, ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer components{.highlightText{--components-highlightText-backgroundColor: var(--palettes-300, var(--palettes-product-300));--components-highlightText-backgroundDiameter: .25em;--components-highlightText-backgroundBlockSize: .5em;--components-highlightText-backgroundRadius: calc(var(--components-highlightText-backgroundDiameter) / 2);--components-highlightText-backgroundStart: var(--components-highlightText-backgroundRadius);--components-highlightText-backgroundEnd: calc(100% - var(--components-highlightText-backgroundRadius));padding-inline:.125em;margin-inline:-.125em;background-repeat:no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone;font-weight:inherit;background-image:linear-gradient(var(--components-highlightText-backgroundColor)),linear-gradient(var(--components-highlightText-backgroundColor)),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundStart) var(--components-highlightText-backgroundEnd),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundEnd) var(--components-highlightText-backgroundEnd),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundStart) calc(100% - var(--components-highlightText-backgroundBlockSize) + var(--components-highlightText-backgroundRadius)),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundEnd) calc(100% - var(--components-highlightText-backgroundBlockSize) + var(--components-highlightText-backgroundRadius)),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%);background-size:100% calc(var(--components-highlightText-backgroundBlockSize) - var(--components-highlightText-backgroundDiameter)),calc(100% - var(--components-highlightText-backgroundDiameter)) var(--components-highlightText-backgroundBlockSize),100% 100%,100% 100%,100% 100%,100% 100%;background-position:50% calc(100% - var(--components-highlightText-backgroundRadius)),50% 100%,0 0,0 0,0 0,0 0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HighlightTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.1", type: HighlightTextComponent, isStandalone: true, selector: "lu-highlight-text", inputs: { palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "strong" }, properties: { "class": "paletteClass()" }, classAttribute: "highlightText" }, ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer components{.highlightText{--components-highlightText-backgroundColor: var(--palettes-300, var(--palettes-product-300));--components-highlightText-backgroundDiameter: .25em;--components-highlightText-backgroundBlockSize: .5em;--components-highlightText-backgroundRadius: calc(var(--components-highlightText-backgroundDiameter) / 2);--components-highlightText-backgroundStart: var(--components-highlightText-backgroundRadius);--components-highlightText-backgroundEnd: calc(100% - var(--components-highlightText-backgroundRadius));padding-inline:.125em;margin-inline:-.125em;background-repeat:no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone;font-weight:inherit;background-image:linear-gradient(var(--components-highlightText-backgroundColor)),linear-gradient(var(--components-highlightText-backgroundColor)),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundStart) var(--components-highlightText-backgroundEnd),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundEnd) var(--components-highlightText-backgroundEnd),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundStart) calc(100% - var(--components-highlightText-backgroundBlockSize) + var(--components-highlightText-backgroundRadius)),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundEnd) calc(100% - var(--components-highlightText-backgroundBlockSize) + var(--components-highlightText-backgroundRadius)),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%);background-size:100% calc(var(--components-highlightText-backgroundBlockSize) - var(--components-highlightText-backgroundDiameter)),calc(100% - var(--components-highlightText-backgroundDiameter)) var(--components-highlightText-backgroundBlockSize),100% 100%,100% 100%,100% 100%,100% 100%;background-position:50% calc(100% - var(--components-highlightText-backgroundRadius)),50% 100%,0 0,0 0,0 0,0 0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HighlightTextComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HighlightTextComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-highlight-text', template: '<ng-content />', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         role: 'strong',

package/fesm2022/lucca-front-ng-horizontal-navigation.mjs

@@ -8,10 +8,10 @@ class HorizontalNavigationLinkDirective {
     constructor() {
         this.template = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HorizontalNavigationLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.4", type: HorizontalNavigationLinkDirective, isStandalone: true, selector: "[luHorizontalNavigationLink]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HorizontalNavigationLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.1", type: HorizontalNavigationLinkDirective, isStandalone: true, selector: "[luHorizontalNavigationLink]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HorizontalNavigationLinkDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HorizontalNavigationLinkDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[luHorizontalNavigationLink]',
@@ -31,10 +31,10 @@ class HorizontalNavigationTabComponent {
         this.selected = computed(() => !this.disabled() && this.index() === this.horizontalNavigationRef.selectedIndex(), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HorizontalNavigationTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: HorizontalNavigationTabComponent, isStandalone: true, selector: "lu-horizontal-navigation-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tabpanel", "tabindex": "0" }, properties: { "class.is-active": "selected()", "id": "'panel-' + index()", "aria-labelledby": "'tab-' + index()" }, classAttribute: "horizontalNavigation_panel" }, ngImport: i0, template: '<ng-content/>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HorizontalNavigationTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.1", type: HorizontalNavigationTabComponent, isStandalone: true, selector: "lu-horizontal-navigation-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tabpanel", "tabindex": "0" }, properties: { "class.is-active": "selected()", "id": "'panel-' + index()", "aria-labelledby": "'tab-' + index()" }, classAttribute: "horizontalNavigation_panel" }, ngImport: i0, template: '<ng-content/>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HorizontalNavigationTabComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HorizontalNavigationTabComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'lu-horizontal-navigation-tab',
@@ -172,15 +172,15 @@ class HorizontalNavigationComponent {
             this.navigateToLastEnabledTab();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HorizontalNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", 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 }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, currentIndex: { classPropertyName: "currentIndex", publicName: "currentIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { currentIndex: "currentIndexChange" }, host: { properties: { "class.horizontalNavigationWrapper": "this.dialogRef !== null" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HorizontalNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", 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 }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, currentIndex: { classPropertyName: "currentIndex", publicName: "currentIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { currentIndex: "currentIndexChange" }, host: { properties: { "class.horizontalNavigationWrapper": "this.dialogRef !== null" } }, providers: [
             {
                 provide: LU_HORIZONTALNAVIGATION_INSTANCE,
                 useExisting: forwardRef(() => HorizontalNavigationComponent),
             },
         ], queries: [{ propertyName: "links", predicate: HorizontalNavigationLinkDirective, isSignal: true }, { propertyName: "tabs", predicate: HorizontalNavigationTabComponent, isSignal: true }], viewQueries: [{ propertyName: "buttons", predicate: ["tabButton"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n\tclass=\"horizontalNavigation\"\n\t[class]=\"paletteClass()\"\n\t[class.mod-noBorder]=\"noBorder()\"\n\t[class.mod-S]=\"size() === `S`\"\n\t[class.mod-vertical]=\"vertical()\"\n>\n\t@if (container() || this.dialogRef !== null) {\n\t\t<div class=\"horizontalNavigation-containerOptional\">\n\t\t\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n\t\t</div>\n\t} @else {\n\t\t<ng-container *ngTemplateOutlet=\"horizontalNavigationList\" />\n\t}\n</div>\n\n@if (isTablist()) {\n\t<ng-content />\n}\n\n<ng-template #horizontalNavigationList>\n\t<ul class=\"horizontalNavigation-list\" [attr.role]=\"isTablist() ? 'tablist' : null\">\n\t\t@if (isTablist()) {\n\t\t\t@for (tab of tabs(); track $index) {\n\t\t\t\t<li class=\"horizontalNavigation-list-item\">\n\t\t\t\t\t<button\n\t\t\t\t\t\t#tabButton\n\t\t\t\t\t\t[attr.tabindex]=\"selectedIndex() !== $index ? '-1' : null\"\n\t\t\t\t\t\t[attr.aria-selected]=\"selectedIndex() === $index\"\n\t\t\t\t\t\t[attr.disabled]=\"tab.disabled() ? 'disabled' : null\"\n\t\t\t\t\t\taria-controls=\"panel-{{ tab.index() }}\"\n\t\t\t\t\t\tid=\"tab-{{ tab.index() }}\"\n\t\t\t\t\t\t(keydown)=\"changeTab($event, $index)\"\n\t\t\t\t\t\t(click)=\"navigateToTabByIndex($index)\"\n\t\t\t\t\t\trole=\"tab\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tclass=\"horizontalNavigation-list-item-action\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ng-container *luPortal=\"tab.label()\" />\n\t\t\t\t\t</button>\n\t\t\t\t</li>\n\t\t\t}\n\t\t} @else {\n\t\t\t@for (link of links(); track $index) {\n\t\t\t\t<li class=\"horizontalNavigation-list-item\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"link.template\" />\n\t\t\t\t</li>\n\t\t\t}\n\t\t}\n\t</ul>\n</ng-template>\n", styles: ["@layer components{.menu,.horizontalNavigation{--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);--components-horizontalNavigation-containerOptional-padding: var(--commons-container-padding);column-gap:var(--pr-t-spacings-400);align-items:center;display:flex;position:relative;flex-wrap:wrap;padding:var(--components-horizontalNavigation-listPadding)}.menu:after,.horizontalNavigation: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}.menu .label,.horizontalNavigation .label{margin-inline-end:0;background-color:var(--palettes-neutral-100);color:var(--palettes-neutral-700)}.horizontalNavigationWrapper{grid-area:overflow;min-block-size:0;display:flex;flex-direction:column}.menu-containerOptional,.horizontalNavigation-containerOptional{max-inline-size:var(--commons-container-maxWidth);padding:var(--components-horizontalNavigation-containerOptional-padding)}.menu-list,.horizontalNavigation-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 .menu-list,.scrollBox .horizontalNavigation-list{flex-wrap:nowrap}.menu-link,.menu-list-item-action,.horizontalNavigation-list-item-action{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)}.menu-link:before,.menu-list-item-action:before,.horizontalNavigation-list-item-action: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)}.menu-link:after,.menu-list-item-action:after,.horizontalNavigation-list-item-action: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:\"\"}.menu-link:focus-visible,.menu-list-item-action:focus-visible,.horizontalNavigation-list-item-action:focus-visible{outline:none!important}.menu-link:focus-visible:before,.menu-list-item-action:focus-visible:before,.horizontalNavigation-list-item-action:focus-visible:before{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:2px}.menu-link: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]),.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:not(.is-active,[aria-current=page]){color:var(--palettes-neutral-900)}.menu-link:not(.is-disabled,[disabled]):hover .label,.menu-list-item-action:not(.is-disabled,[disabled]):hover .label,.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.menu-link:not(.is-disabled,[disabled]):hover:after,.menu-list-item-action:not(.is-disabled,[disabled]):hover:after,.horizontalNavigation-list-item-action:not(.is-disabled,[disabled]):hover:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.menu-link .link-text,.menu-list-item-action .link-text,.horizontalNavigation-list-item-action .link-text{text-decoration:none}.menu-link-placeholder:after,.horizontalNavigation-link-placeholder:after{content:attr(data-content-after);display:block;block-size:0;overflow:hidden;font-weight:var(--pr-t-font-fontWeight-semibold)}.horizontalNavigation_panel{display:var(--components-horizontalNavigation-panel-display);overflow:var(--components-horizontalNavigation-panel-overflow);flex-grow:var(--components-horizontalNavigation-panel-flexGrow);min-block-size:0;flex-direction:column}.horizontalNavigation_panel:focus-visible{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:-2px;border-radius:var(--pr-t-border-radius-small)}.horizontalNavigation_panel:not(.is-active){display:none}}@layer mods{.menu.mod-header,.horizontalNavigation.mod-header{--components-horizontalNavigation-listPadding: 0 var(--pr-t-spacings-500)}.menu.mod-S .menu-list-item-action,.menu.mod-S .menu-link,.menu.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-S .menu-list-item-action,.horizontalNavigation.mod-S .menu-link,.horizontalNavigation.mod-S .horizontalNavigation-list-item-action{--components-horizontalNavigation-listItemActionFont: var(--pr-t-font-body-S);--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-150) 0}.menu.mod-S .menu-list-item-action:before,.menu.mod-S .menu-link:before,.menu.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-S .menu-list-item-action:before,.horizontalNavigation.mod-S .menu-link:before,.horizontalNavigation.mod-S .horizontalNavigation-list-item-action: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))}.menu.mod-S .menu-link,.horizontalNavigation.mod-S .menu-link{margin-inline-end:var(--pr-t-spacings-300)}.menu.mod-S .label,.horizontalNavigation.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}.menu.mod-S .numericBadge,.horizontalNavigation.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)}.menu.mod-noBorder:after,.horizontalNavigation.mod-noBorder:after{--components-horizontalNavigation-borderContent: none}.dialog .menu,.dialog .horizontalNavigation{--components-horizontalNavigation-containerOptional-padding: 0 var(--components-dialog-insideContent-paddingInline)}.menu.mod-vertical:after,.horizontalNavigation.mod-vertical:after{--components-horizontalNavigation-borderContent: none}.menu.mod-vertical .menu-list,.menu.mod-vertical .horizontalNavigation-list,.horizontalNavigation.mod-vertical .menu-list,.horizontalNavigation.mod-vertical .horizontalNavigation-list{--components-horizontalNavigation-listDirection: column;--components-horizontalNavigation-listGap: 0;--components-horizontalNavigation-listAlign: stretch}.menu.mod-vertical .menu-list-item-action,.menu.mod-vertical .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical .menu-list-item-action,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-200);--components-horizontalNavigation-listItemActionAlign: left}.menu.mod-vertical .menu-list-item-action:before,.menu.mod-vertical .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical .menu-list-item-action:before,.horizontalNavigation.mod-vertical .horizontalNavigation-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))}.menu.mod-vertical .menu-list-item-action:after,.menu.mod-vertical .horizontalNavigation-list-item-action:after,.horizontalNavigation.mod-vertical .menu-list-item-action:after,.horizontalNavigation.mod-vertical .horizontalNavigation-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}.menu.mod-vertical .menu-list-item-action:hover:after,.menu.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,.horizontalNavigation.mod-vertical .menu-list-item-action:hover:after,.horizontalNavigation.mod-vertical .menu-list-item-action[aria-current=page]:hover:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action:hover:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:hover:after{--components-horizontalNavigation-listItemActionTransform: scale(1, .75)}.menu.mod-vertical .menu-list-item-action[aria-current=page]:after,.menu.mod-vertical .menu-list-item-action[aria-selected=true]:after,.menu.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[aria-selected=true]:after,.menu.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[aria-selected=true]:after,.horizontalNavigation.mod-vertical .menu-list-item-action.is-active:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action[aria-selected=true]:after,.horizontalNavigation.mod-vertical .horizontalNavigation-list-item-action.is-active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.menu.mod-vertical.mod-S .menu-list-item-action,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action,.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-list-item-action{--components-horizontalNavigation-listItemActionPadding: var(--pr-t-spacings-50) var(--pr-t-spacings-150)}.menu.mod-vertical.mod-S .menu-list-item-action:before,.menu.mod-vertical.mod-S .horizontalNavigation-list-item-action:before,.horizontalNavigation.mod-vertical.mod-S .menu-list-item-action:before,.horizontalNavigation.mod-vertical.mod-S .horizontalNavigation-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 components{.horizontalNavigation_panel{--components-horizontalNavigation-panel-display: block;--components-horizontalNavigation-panel-overflow: visible;--components-horizontalNavigation-panel-flexGrow: 0}}@layer mods{.dialog .horizontalNavigation_panel{--components-horizontalNavigation-panel-display: flex;--components-horizontalNavigation-panel-overflow: auto;--components-horizontalNavigation-panel-flexGrow: 1}.dialog .horizontalNavigation_panel:focus-visible{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:-4px;border-radius:var(--pr-t-border-radius-structure)}}@layer mods{.menu-link.active,.menu-link[aria-current=page],.menu-link[aria-selected=true],.menu-link.is-active,.menu-list-item-action.active,.menu-list-item-action[aria-current=page],.menu-list-item-action[aria-selected=true],.menu-list-item-action.is-active,.horizontalNavigation-list-item-action.active,.horizontalNavigation-list-item-action[aria-current=page],.horizontalNavigation-list-item-action[aria-selected=true],.horizontalNavigation-list-item-action.is-active{--components-horizontalNavigation-listItemActionColor: var(--palettes-700, var(--palettes-product-700))}.menu-link.active .label,.menu-link[aria-current=page] .label,.menu-link[aria-selected=true] .label,.menu-link.is-active .label,.menu-list-item-action.active .label,.menu-list-item-action[aria-current=page] .label,.menu-list-item-action[aria-selected=true] .label,.menu-list-item-action.is-active .label,.horizontalNavigation-list-item-action.active .label,.horizontalNavigation-list-item-action[aria-current=page] .label,.horizontalNavigation-list-item-action[aria-selected=true] .label,.horizontalNavigation-list-item-action.is-active .label{background-color:var(--palettes-100, var(--palettes-product-100));color:var(--palettes-700, var(--palettes-product-700))}.menu-link.active:after,.menu-link[aria-current=page]:after,.menu-link[aria-selected=true]:after,.menu-link.is-active:after,.menu-list-item-action.active:after,.menu-list-item-action[aria-current=page]:after,.menu-list-item-action[aria-selected=true]:after,.menu-list-item-action.is-active:after,.horizontalNavigation-list-item-action.active:after,.horizontalNavigation-list-item-action[aria-current=page]:after,.horizontalNavigation-list-item-action[aria-selected=true]:after,.horizontalNavigation-list-item-action.is-active:after{--components-horizontalNavigation-listItemActionTransform: scale(1)}.menu-link.active:focus-visible:after,.menu-link[aria-current=page]:focus-visible:after,.menu-link[aria-selected=true]:focus-visible:after,.menu-link.is-active:focus-visible:after,.menu-list-item-action.active:focus-visible:after,.menu-list-item-action[aria-current=page]:focus-visible:after,.menu-list-item-action[aria-selected=true]:focus-visible:after,.menu-list-item-action.is-active:focus-visible:after,.horizontalNavigation-list-item-action.active:focus-visible:after,.horizontalNavigation-list-item-action[aria-current=page]:focus-visible:after,.horizontalNavigation-list-item-action[aria-selected=true]:focus-visible:after,.horizontalNavigation-list-item-action.is-active:focus-visible:after{--components-horizontalNavigation-listItemActionTransform: scale(.75, 1)}.menu-link.active .numericBadge,.menu-link[aria-current=page] .numericBadge,.menu-link[aria-selected=true] .numericBadge,.menu-link.is-active .numericBadge,.menu-list-item-action.active .numericBadge,.menu-list-item-action[aria-current=page] .numericBadge,.menu-list-item-action[aria-selected=true] .numericBadge,.menu-list-item-action.is-active .numericBadge,.horizontalNavigation-list-item-action.active .numericBadge,.horizontalNavigation-list-item-action[aria-current=page] .numericBadge,.horizontalNavigation-list-item-action[aria-selected=true] .numericBadge,.horizontalNavigation-list-item-action.is-active .numericBadge{--components-numericBadge-background: var(--palettes-200, var(--palettes-product-200));--components-numericBadge-color: var(--palettes-800, var(--palettes-product-800))}.menu-link:not(.active,[aria-current=page],[aria-selected=true]) .numericBadge,.menu-list-item-action:not(.active,[aria-current=page],[aria-selected=true]) .numericBadge,.horizontalNavigation-list-item-action:not(.active,[aria-current=page],[aria-selected=true]) .numericBadge{--palettes-text: var(--palettes-text);--palettes-0: var(--palettes-0);--palettes-25: var(--palettes-25);--palettes-50: var(--palettes-50);--palettes-100: var(--palettes-100);--palettes-200: var(--palettes-200);--palettes-300: var(--palettes-300);--palettes-400: var(--palettes-400);--palettes-500: var(--palettes-500);--palettes-600: var(--palettes-600);--palettes-700: var(--palettes-700);--palettes-800: var(--palettes-800);--palettes-900: var(--palettes-900)}.menu-link.disabled .label,.menu-link.disabled,.menu-link[disabled] .label,.menu-link[disabled],.menu-link.is-disabled .label,.menu-link.is-disabled,.menu-list-item-action.disabled .label,.menu-list-item-action.disabled,.menu-list-item-action[disabled] .label,.menu-list-item-action[disabled],.menu-list-item-action.is-disabled .label,.menu-list-item-action.is-disabled,.horizontalNavigation-list-item-action.disabled .label,.horizontalNavigation-list-item-action.disabled,.horizontalNavigation-list-item-action[disabled] .label,.horizontalNavigation-list-item-action[disabled],.horizontalNavigation-list-item-action.is-disabled .label,.horizontalNavigation-list-item-action.is-disabled{color:var(--palettes-neutral-500);pointer-events:none}.menu-link.disabled .numericBadge,.menu-link[disabled] .numericBadge,.menu-link.is-disabled .numericBadge,.menu-list-item-action.disabled .numericBadge,.menu-list-item-action[disabled] .numericBadge,.menu-list-item-action.is-disabled .numericBadge,.horizontalNavigation-list-item-action.disabled .numericBadge,.horizontalNavigation-list-item-action[disabled] .numericBadge,.horizontalNavigation-list-item-action.is-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"] }, { kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: HorizontalNavigationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: HorizontalNavigationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-horizontal-navigation', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class.horizontalNavigationWrapper]': 'this.dialogRef !== null',

package/fesm2022/lucca-front-ng-impersonation.mjs

@@ -75,6 +75,7 @@ class ImpersonationComponent {
         this.enableFormerEmployees = input(false, { ...(ngDevMode ? { debugName: "enableFormerEmployees" } : /* istanbul ignore next */ {}), transform: luBooleanAttribute });
         /**
          * Restricts the users to the ones reachable through these operations, scoped by `appInstanceId`.
+         * @deprecated use `uniqueOperationIds` instead
          */
         this.operationIds = input(null, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "operationIds" }] : /* istanbul ignore next */ []));
@@ -86,6 +87,7 @@ class ImpersonationComponent {
         ...(ngDevMode ? [{ debugName: "uniqueOperationIds" }] : /* istanbul ignore next */ []));
         /**
          * Application instance the `operationIds` are scoped to. Unused with `uniqueOperationIds`.
+         * @deprecated use `uniqueOperationIds` instead
          */
         this.appInstanceId = input(null, { ...(ngDevMode ? { debugName: "appInstanceId" } : /* istanbul ignore next */ {}), transform: luNullableNumberAttribute });
         this.isNotMe = computed(() => this.selectedUser()?.id !== this.currentUserId, /* @ts-ignore */
@@ -121,10 +123,10 @@ class ImpersonationComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: ImpersonationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: ImpersonationComponent, isStandalone: true, selector: "lu-impersonation", inputs: { intl: { classPropertyName: "intl", publicName: "intl", isSignal: true, isRequired: false, transformFunction: null }, selectedUser: { classPropertyName: "selectedUser", publicName: "selectedUser", isSignal: true, isRequired: false, transformFunction: null }, enableFormerEmployees: { classPropertyName: "enableFormerEmployees", publicName: "enableFormerEmployees", isSignal: true, isRequired: false, transformFunction: null }, operationIds: { classPropertyName: "operationIds", publicName: "operationIds", isSignal: true, isRequired: false, transformFunction: null }, uniqueOperationIds: { classPropertyName: "uniqueOperationIds", publicName: "uniqueOperationIds", isSignal: true, isRequired: false, transformFunction: null }, appInstanceId: { classPropertyName: "appInstanceId", publicName: "appInstanceId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedUser: "selectedUserChange", clear: "clear" }, host: { classAttribute: "impersonation" }, viewQueries: [{ propertyName: "inputComponentRef", first: true, predicate: LuSimpleSelectInputComponent, descendants: true, isSignal: true }, { propertyName: "popoverRef", first: true, predicate: PopoverDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<button\n\ttype=\"button\"\n\tclass=\"impersonation-trigger\"\n\t[class.is-active]=\"isNotMe() && selectedUser()\"\n\t[luPopover2]=\"impersonationPopover\"\n\t[luPopoverNoCloseButton]=\"true\"\n\t[customPositions]=\"popoverPositions\"\n\t[luPopoverAnchor]=\"elementRef\"\n\t#popoverRef=\"luPopover2\"\n\t[attr.aria-expanded]=\"popoverRef.opened()\"\n\t(keydown.arrowDown)=\"$event.preventDefault(); popoverRef.openPopover(true)\"\n\t(keydown.arrowUp)=\"$event.preventDefault(); popoverRef.openPopover(true)\"\n>\n\t<span class=\"pr-u-mask\">{{ intl().switchProfile }}</span>\n\n\t@let user = selectedUser();\n\t@if (user) {\n\t\t<lu-user-picture aria-hidden=\"true\" [user]=\"user\" size=\"S\" softRounded />\n\t\t{{ user | luUserDisplay }}\n\t} @else {\n\t\t<lu-user-picture placeholder aria-hidden=\"true\" size=\"S\" softRounded />\n\t\t<div class=\"skeleton is-loading\" style=\"inline-size: 5.5rem\">\n\t\t\t<span class=\"skeleton-item\"></span>\n\t\t</div>\n\t}\n\t<span class=\"pr-u-mask\">{{ intl().a11yNavigationDescription }}</span>\n\t<lu-icon class=\"impersonation-trigger-icon\" icon=\"chevronBottom\" />\n</button>\n<lu-clear class=\"impersonation-clear\" (onClear)=\"clear.emit()\" [intl]=\"{ clear: intl().clear }\" />\n\n<ng-template #impersonationPopover>\n\t<div class=\"impersonation_popover-content popover-contentOptional\">\n\t\t<lu-simple-select\n\t\t\timpersonation\n\t\t\t[(ngModel)]=\"selectedUser\"\n\t\t\tusers\n\t\t\t[enableFormerEmployees]=\"enableFormerEmployees()\"\n\t\t\t[operationIds]=\"operationIds()\"\n\t\t\t[uniqueOperationIds]=\"uniqueOperationIds()\"\n\t\t\t[appInstanceId]=\"appInstanceId()\"\n\t\t\t#selectRef\n\t\t>\n\t\t\t<ng-container *luOption=\"let user; select: selectRef\">\n\t\t\t\t<div class=\"impersonation_popover-content-option\" [class.mod-me]=\"currentUserId === user.id\">\n\t\t\t\t\t<lu-user-picture aria-hidden=\"true\" [user]=\"user\" size=\"XS\" softRounded />\n\t\t\t\t\t<div>\n\t\t\t\t\t\t@if (currentUserId === user.id) {\n\t\t\t\t\t\t\t{{ intl().me }} <span translate=\"no\">{{ user | luUserDisplay }}</span>\n\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t<span translate=\"no\">{{ user | luUserDisplay }}</span>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t<!-- Handle homonyms -->\n\t\t\t\t\t\t@if (user.additionalInformation) {\n\t\t\t\t\t\t\t<div class=\"option-additional\">\n\t\t\t\t\t\t\t\t{{ user.additionalInformation }}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t</lu-simple-select>\n\t</div>\n</ng-template>\n", styles: ["@layer components{.impersonation{--components-impersonation-trigger-borderColor: var(--palettes-neutral-100);--components-impersonation-trigger-icon-rotate: 0deg;--components-impersonation-trigger-backgroundColor: var(--palettes-neutral-0);--components-impersonation-trigger-fontWeight: var(--pr-t-font-fontWeight-regular);--components-impersonation-trigger-color: var(--pr-t-color-text);--components-impersonation-trigger-icon-color: var(--pr-t-color-text-subtle);--components-impersonation-clear-display: none;--components-impersonation-trigger-icon-marginInlineStart: auto;position:relative;inline-size:fit-content;display:block}.impersonation-trigger{padding:0;border:0;inline-size:100%;background-color:transparent;color:inherit;text-align:start;display:block;font:inherit;cursor:pointer;box-shadow:0 0 0 1px var(--components-impersonation-trigger-borderColor);background-color:var(--components-impersonation-trigger-backgroundColor);border-radius:var(--pr-t-border-radius-200);inline-size:fit-content;display:flex;align-items:center;gap:var(--pr-t-spacings-100);padding:var(--pr-t-spacings-50);padding-inline-end:var(--pr-t-spacings-100);min-block-size:var(--pr-t-spacings-500);font-weight:var(--components-impersonation-trigger-fontWeight);color:var(--components-impersonation-trigger-color);transition-property:box-shadow,border-color;transition-duration:var(--commons-animations-durations-fast)}.impersonation-trigger-icon{color:var(--components-impersonation-trigger-icon-color);rotate:var(--components-impersonation-trigger-icon-rotate);transition-property:rotate;transition-duration:var(--commons-animations-durations-fast);margin-inline-start:var(--components-impersonation-trigger-icon-marginInlineStart)}.impersonation-clear.clear{position:absolute;z-index:1;inset-inline-end:calc(var(--pr-t-spacings-400) + var(--pr-t-spacings-75));inset-block-start:calc(var(--pr-t-spacings-150) + 1px);display:var(--components-impersonation-clear-display);--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background: var(--palettes-product-800)}.impersonation-clear.clear:hover{--components-clear-background: var(--palettes-product-700)}.impersonation-clear.clear:active{--components-clear-background: var(--palettes-product-900)}.impersonation_popover-content-option{display:flex;color:var(--pr-t-color-text)}.impersonation_popover-content-option.mod-me{font-weight:var(--pr-t-font-fontWeight-semibold)}}@layer mods{.impersonation:has(.impersonation-trigger.is-active){--components-impersonation-trigger-backgroundColor: var(--palettes-product-50);--components-impersonation-trigger-borderColor: var(--palettes-product-200);--components-impersonation-trigger-fontWeight: var(--pr-t-font-fontWeight-semibold);--components-impersonation-trigger-color: var(--palettes-product-800);--components-impersonation-trigger-icon-color: var(--palettes-product-700);--components-impersonation-clear-display: grid;--components-impersonation-trigger-icon-marginInlineStart: var(--pr-t-spacings-250)}.impersonation:has(.impersonation-trigger:hover){--components-impersonation-trigger-borderColor: var(--palettes-product-400);--components-impersonation-trigger-shadow: var(--pr-t-elevation-shadow-button)}.impersonation:has(.impersonation-trigger[aria-expanded=true]){--components-impersonation-trigger-icon-rotate: 180deg}}\n"], dependencies: [{ kind: "directive", type: PopoverDirective, selector: "[luPopover2]", inputs: ["intl", "luPopover2", "luPopoverPosition", "luPopoverMaxBlockSize", "luPopoverMaxInlineSize", "overlayScrollStrategy", "luPopoverDisabled", "luPopoverTrigger", "customPositions", "luPopoverNoCloseButton", "luPopoverAnchor", "luPopoverBackdrop", "luPopoverIgnoredOutsidePointerTargets", "luPopoverOpenDelay", "luPopoverCloseDelay"], outputs: ["luPopoverTriggerChange", "luPopoverClosed", "luPopoverOpened"], exportAs: ["luPopover2"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LuSimpleSelectInputComponent, selector: "lu-simple-select", inputs: ["intl", "autocomplete", "impersonation"] }, { kind: "directive", type: LuCoreSelectUsersDirective, selector: "lu-simple-select[users],lu-multi-select[users]", inputs: ["displayFormat", "filters", "url", "orderBy", "operationIds", "uniqueOperationIds", "appInstanceId", "enableFormerEmployees", "displayMeOption", "customUserOptionTpl", "searchDelimiter"], outputs: ["customUserOptionTplChange"], exportAs: ["luUsers"] }, { kind: "directive", type: LuOptionDirective, selector: "[luOption]", inputs: ["luOptionSelect"] }, { kind: "component", type: LuUserPictureComponent, selector: "lu-user-picture", inputs: ["displayFormat", "user", "AI", "placeholder", "softRounded", "size", "imageLoadingAttribute"] }, { kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["intl", "size", "disabled", "palette", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }, { kind: "pipe", type: LuUserDisplayPipe, name: "luUserDisplay" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: ImpersonationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: ImpersonationComponent, isStandalone: true, selector: "lu-impersonation", inputs: { intl: { classPropertyName: "intl", publicName: "intl", isSignal: true, isRequired: false, transformFunction: null }, selectedUser: { classPropertyName: "selectedUser", publicName: "selectedUser", isSignal: true, isRequired: false, transformFunction: null }, enableFormerEmployees: { classPropertyName: "enableFormerEmployees", publicName: "enableFormerEmployees", isSignal: true, isRequired: false, transformFunction: null }, operationIds: { classPropertyName: "operationIds", publicName: "operationIds", isSignal: true, isRequired: false, transformFunction: null }, uniqueOperationIds: { classPropertyName: "uniqueOperationIds", publicName: "uniqueOperationIds", isSignal: true, isRequired: false, transformFunction: null }, appInstanceId: { classPropertyName: "appInstanceId", publicName: "appInstanceId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedUser: "selectedUserChange", clear: "clear" }, host: { classAttribute: "impersonation" }, viewQueries: [{ propertyName: "inputComponentRef", first: true, predicate: LuSimpleSelectInputComponent, descendants: true, isSignal: true }, { propertyName: "popoverRef", first: true, predicate: PopoverDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<button\n\ttype=\"button\"\n\tclass=\"impersonation-trigger\"\n\t[class.is-active]=\"isNotMe() && selectedUser()\"\n\t[luPopover2]=\"impersonationPopover\"\n\t[luPopoverNoCloseButton]=\"true\"\n\t[customPositions]=\"popoverPositions\"\n\t[luPopoverAnchor]=\"elementRef\"\n\t#popoverRef=\"luPopover2\"\n\t[attr.aria-expanded]=\"popoverRef.opened()\"\n\t(keydown.arrowDown)=\"$event.preventDefault(); popoverRef.openPopover(true)\"\n\t(keydown.arrowUp)=\"$event.preventDefault(); popoverRef.openPopover(true)\"\n>\n\t<span class=\"pr-u-mask\">{{ intl().switchProfile }}</span>\n\n\t@let user = selectedUser();\n\t@if (user) {\n\t\t<lu-user-picture aria-hidden=\"true\" [user]=\"user\" size=\"S\" softRounded />\n\t\t{{ user | luUserDisplay }}\n\t} @else {\n\t\t<lu-user-picture placeholder aria-hidden=\"true\" size=\"S\" softRounded />\n\t\t<div class=\"skeleton is-loading\" style=\"inline-size: 5.5rem\">\n\t\t\t<span class=\"skeleton-item\"></span>\n\t\t</div>\n\t}\n\t<span class=\"pr-u-mask\">{{ intl().a11yNavigationDescription }}</span>\n\t<lu-icon class=\"impersonation-trigger-icon\" icon=\"chevronBottom\" />\n</button>\n<lu-clear class=\"impersonation-clear\" (onClear)=\"clear.emit()\" [intl]=\"{ clear: intl().clear }\" />\n\n<ng-template #impersonationPopover>\n\t<div class=\"impersonation_popover-content popover-contentOptional\">\n\t\t<lu-simple-select\n\t\t\timpersonation\n\t\t\t[(ngModel)]=\"selectedUser\"\n\t\t\tusers\n\t\t\t[enableFormerEmployees]=\"enableFormerEmployees()\"\n\t\t\t[operationIds]=\"operationIds()\"\n\t\t\t[uniqueOperationIds]=\"uniqueOperationIds()\"\n\t\t\t[appInstanceId]=\"appInstanceId()\"\n\t\t\t#selectRef\n\t\t>\n\t\t\t<ng-container *luOption=\"let user; select: selectRef\">\n\t\t\t\t<div class=\"impersonation_popover-content-option\" [class.mod-me]=\"currentUserId === user.id\">\n\t\t\t\t\t<lu-user-picture aria-hidden=\"true\" [user]=\"user\" size=\"XS\" softRounded />\n\t\t\t\t\t<div>\n\t\t\t\t\t\t@if (currentUserId === user.id) {\n\t\t\t\t\t\t\t{{ intl().me }} <span translate=\"no\">{{ user | luUserDisplay }}</span>\n\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t<span translate=\"no\">{{ user | luUserDisplay }}</span>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t<!-- Handle homonyms -->\n\t\t\t\t\t\t@if (user.additionalInformation) {\n\t\t\t\t\t\t\t<div class=\"option-additional\">\n\t\t\t\t\t\t\t\t{{ user.additionalInformation }}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t</lu-simple-select>\n\t</div>\n</ng-template>\n", styles: ["@layer components{.impersonation{--components-impersonation-trigger-borderColor: var(--palettes-neutral-100);--components-impersonation-trigger-icon-rotate: 0deg;--components-impersonation-trigger-backgroundColor: var(--palettes-neutral-0);--components-impersonation-trigger-fontWeight: var(--pr-t-font-fontWeight-regular);--components-impersonation-trigger-color: var(--pr-t-color-text);--components-impersonation-trigger-icon-color: var(--pr-t-color-text-subtle);--components-impersonation-clear-display: none;--components-impersonation-trigger-icon-marginInlineStart: auto;position:relative;inline-size:fit-content;display:block}.impersonation-trigger{padding:0;border:0;inline-size:100%;background-color:transparent;color:inherit;text-align:start;display:block;font:inherit;cursor:pointer;box-shadow:0 0 0 1px var(--components-impersonation-trigger-borderColor);background-color:var(--components-impersonation-trigger-backgroundColor);border-radius:var(--pr-t-border-radius-200);inline-size:fit-content;display:flex;align-items:center;gap:var(--pr-t-spacings-100);padding:var(--pr-t-spacings-50);padding-inline-end:var(--pr-t-spacings-100);min-block-size:var(--pr-t-spacings-500);font-weight:var(--components-impersonation-trigger-fontWeight);color:var(--components-impersonation-trigger-color);transition-property:box-shadow,border-color;transition-duration:var(--commons-animations-durations-fast)}.impersonation-trigger-icon{color:var(--components-impersonation-trigger-icon-color);rotate:var(--components-impersonation-trigger-icon-rotate);transition-property:rotate;transition-duration:var(--commons-animations-durations-fast);margin-inline-start:var(--components-impersonation-trigger-icon-marginInlineStart)}.impersonation-clear.clear{position:absolute;z-index:1;inset-inline-end:calc(var(--pr-t-spacings-400) + var(--pr-t-spacings-75));inset-block-start:calc(var(--pr-t-spacings-150) + 1px);display:var(--components-impersonation-clear-display);--components-clear-cross-color: var(--palettes-neutral-0);--components-clear-background: var(--palettes-product-800)}.impersonation-clear.clear:hover{--components-clear-background: var(--palettes-product-700)}.impersonation-clear.clear:active{--components-clear-background: var(--palettes-product-900)}.impersonation_popover-content-option{display:flex;color:var(--pr-t-color-text)}.impersonation_popover-content-option.mod-me{font-weight:var(--pr-t-font-fontWeight-semibold)}}@layer mods{.impersonation:has(.impersonation-trigger.is-active){--components-impersonation-trigger-backgroundColor: var(--palettes-product-50);--components-impersonation-trigger-borderColor: var(--palettes-product-200);--components-impersonation-trigger-fontWeight: var(--pr-t-font-fontWeight-semibold);--components-impersonation-trigger-color: var(--palettes-product-800);--components-impersonation-trigger-icon-color: var(--palettes-product-700);--components-impersonation-clear-display: grid;--components-impersonation-trigger-icon-marginInlineStart: var(--pr-t-spacings-250)}.impersonation:has(.impersonation-trigger:hover){--components-impersonation-trigger-borderColor: var(--palettes-product-400);--components-impersonation-trigger-shadow: var(--pr-t-elevation-shadow-button)}.impersonation:has(.impersonation-trigger[aria-expanded=true]){--components-impersonation-trigger-icon-rotate: 180deg}}\n"], dependencies: [{ kind: "directive", type: PopoverDirective, selector: "[luPopover2]", inputs: ["intl", "luPopover2", "luPopoverPosition", "luPopoverMaxBlockSize", "luPopoverMaxInlineSize", "overlayScrollStrategy", "luPopoverDisabled", "luPopoverTrigger", "customPositions", "luPopoverNoCloseButton", "luPopoverAnchor", "luPopoverBackdrop", "luPopoverIgnoredOutsidePointerTargets", "luPopoverOpenDelay", "luPopoverCloseDelay"], outputs: ["luPopoverTriggerChange", "luPopoverClosed", "luPopoverOpened"], exportAs: ["luPopover2"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LuSimpleSelectInputComponent, selector: "lu-simple-select", inputs: ["intl", "autocomplete", "impersonation"] }, { kind: "directive", type: LuCoreSelectUsersDirective, selector: "lu-simple-select[users],lu-multi-select[users]", inputs: ["displayFormat", "filters", "url", "orderBy", "operationIds", "uniqueOperationIds", "appInstanceId", "enableFormerEmployees", "displayMeOption", "customUserOptionTpl", "searchDelimiter"], outputs: ["customUserOptionTplChange"], exportAs: ["luUsers"] }, { kind: "directive", type: LuOptionDirective, selector: "[luOption]", inputs: ["luOptionSelect"] }, { kind: "component", type: LuUserPictureComponent, selector: "lu-user-picture", inputs: ["displayFormat", "user", "AI", "placeholder", "softRounded", "size", "withAlt", "imageLoadingAttribute"] }, { kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "component", type: ClearComponent, selector: "lu-clear", inputs: ["intl", "size", "disabled", "palette", "inverted"], outputs: ["onClear"], exportAs: ["luClearer"] }, { kind: "pipe", type: LuUserDisplayPipe, name: "luUserDisplay" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: ImpersonationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: ImpersonationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-impersonation', imports: [PopoverDirective, FormsModule, LuSimpleSelectInputComponent, LuCoreSelectUsersDirective, LuUserDisplayPipe, LuOptionDirective, LuUserPictureComponent, IconComponent, ClearComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'impersonation',