@lucca-front/ng 21.0.0-rc.7 → 21.0.0

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

@@ -10,31 +10,31 @@ class TagComponent {
         /**
          * Which text should the tag be? Defaults to medium
          */
-        this.label = input.required();
+        this.label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
         /**
          * Which size should the tag be? Defaults to medium
          */
-        this.size = input('M');
+        this.size = input('M', ...(ngDevMode ? [{ debugName: "size" }] : []));
         /**
          * Which palette should be used for the entire tag.
          * Defaults to none (inherits parent palette)
          */
-        this.palette = input('none');
+        this.palette = input('none', ...(ngDevMode ? [{ debugName: "palette" }] : []));
         /**
          * Should display be outlined?
          */
-        this.outlined = input(false, { transform: booleanAttribute });
+        this.outlined = input(false, { ...(ngDevMode ? { debugName: "outlined" } : {}), transform: booleanAttribute });
         /**
          * For routerLink usage
          */
-        this.link = input();
+        this.link = input(...(ngDevMode ? [undefined, { debugName: "link" }] : []));
         /**
          * Which icon should we display in the tag if any?
          * Defaults to no icon.
          */
-        this.icon = input(null);
-        this.withEllipsis = input(false, { transform: booleanAttribute });
-        this.AI = input(false, { transform: booleanAttribute });
+        this.icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : []));
+        this.withEllipsis = input(false, { ...(ngDevMode ? { debugName: "withEllipsis" } : {}), transform: booleanAttribute });
+        this.AI = input(false, { ...(ngDevMode ? { debugName: "AI" } : {}), transform: booleanAttribute });
         this.tagClasses = computed(() => {
             const size = this.size();
             const palette = this.palette();
@@ -42,15 +42,15 @@ class TagComponent {
                 [`mod-${size}`]: !!size,
                 [`palette-${palette}`]: !this.AI() && !!palette,
             };
-        });
+        }, ...(ngDevMode ? [{ debugName: "tagClasses" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: TagComponent, isStandalone: true, selector: "lu-tag", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, outlined: { classPropertyName: "outlined", publicName: "outlined", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, withEllipsis: { classPropertyName: "withEllipsis", publicName: "withEllipsis", isSignal: true, isRequired: false, transformFunction: null }, AI: { classPropertyName: "AI", publicName: "AI", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (link()) {\n\t<a [routerLink]=\"link()\" class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t</a>\n} @else {\n\t<span class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t@if (withEllipsis()) {\n\t\t\t<span class=\"tag-content pr-u-ellipsis\" luTooltip luTooltipWhenEllipsis>{{ label() }}</span>\n\t\t} @else {\n\t\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t\t}\n\t</span>\n}\n", styles: ["@layer components{.tag{--components-tag-background: var(--palettes-100, var(--palettes-neutral-100));--components-tag-color: var(--palettes-800, var(--palettes-neutral-800));--components-tag-shadow: transparent;--components-tag-font: var(--pr-t-font-body-S);--components-tag-gap: var(--pr-t-spacings-50);--components-tag-decoration: none;--components-tag-cursor: inherit;--components-tag-boxShadow: 0 0 0 1px var(--components-tag-shadow);--components-tag-position: static;--components-tag-fontSize: var(--pr-t-font-body-S-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-S-lineHeight);background-color:var(--components-tag-background);border-radius:var(--pr-t-border-radius-small);padding-block:0;padding-inline:var(--pr-t-spacings-50);text-decoration:var(--components-tag-decoration);box-shadow:0 0 0 1px var(--components-tag-shadow);gap:var(--components-tag-gap);cursor:var(--components-tag-cursor);display:inline-flex;align-items:center;text-align:center;vertical-align:baseline;white-space:nowrap;border:0;font:var(--components-tag-font);font-size:var(--components-tag-fontSize);line-height:var(--components-tag-lineHeight);max-inline-size:100%;position:var(--components-tag-position)}.tag,.tag:is(a,button){color:var(--components-tag-color)}.tag .lucca-icon{--icon-size: 1rem}.tag-content{outline:none;text-decoration:var(--components-tag-decoration)}}@layer mods{.tag.mod-S{--components-tag-font: var(--pr-t-font-body-XS);--components-tag-gap: var(--pr-t-spacings-25);--components-tag-fontSize: var(--pr-t-font-body-XS-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-XS-lineHeight)}.tag.mod-S .lucca-icon{--icon-size: .75rem}.tag.mod-L{--components-tag-font: var(--pr-t-font-body-M);--components-tag-fontSize: var(--pr-t-font-body-M-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-M-lineHeight)}.tag.mod-L .lucca-icon{--icon-size: 1.25rem}.tag:is(a,button),.tag.mod-clickable{--components-tag-cursor: pointer}.tag:is(a,button):hover,.tag:is(a,button):focus,.tag.mod-clickable:hover,.tag.mod-clickable:focus{--components-tag-decoration: underline}.tag:is(a,button):has(.tag-content):hover,.tag:is(a,button):has(.tag-content):focus,.tag.mod-clickable:has(.tag-content):hover,.tag.mod-clickable:has(.tag-content):focus{--components-tag-decoration: none}.tag:is(a,button):has(.tag-content):hover .tag-content,.tag:is(a,button):has(.tag-content):focus .tag-content,.tag.mod-clickable:has(.tag-content):hover .tag-content,.tag.mod-clickable:has(.tag-content):focus .tag-content{--components-tag-decoration: underline}.tag.mod-outlined,.tag.mod-AI{--components-tag-shadow: var(--palettes-300, var(--palettes-neutral-300));--components-tag-background: transparent}.tag.mod-AI:not(:disabled){--components-tag-boxShadow: none;--components-tag-position: relative}.tag.mod-AI:not(:disabled):before{content:\"\";pointer-events:none;position:absolute;inset:calc(var(--commons-divider-width) * -1);padding:var(--commons-divider-width);background-image:conic-gradient(from 135deg,var(--palettes-brand-400),var(--palettes-AI-500),var(--palettes-brand-400));border-radius:calc(var(--pr-t-border-radius-small) + var(--commons-divider-width));mask:linear-gradient(var(--palettes-neutral-0)) content-box,linear-gradient(var(--palettes-neutral-0));-webkit-mask-composite:xor;mask-composite:exclude}.tag.mod-AI:not(:disabled) .lucca-icon{background-image:linear-gradient(135deg,var(--palettes-AI-600),var(--palettes-brand-500));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.tag.mod-disabled{--components-tag-background: var(--commons-disabled-background);--components-tag-color: var(--commons-disabled-color)}.tag:has(.tag-content:focus-visible){outline:2px solid var(--palettes-product-700);outline-offset:2px}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "lu-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: LuTooltipModule }, { kind: "directive", type: i1.LuTooltipTriggerDirective, selector: "[luTooltip]", inputs: ["luTooltip", "luTooltipEnterDelay", "luTooltipLeaveDelay", "luTooltipDisabled", "luTooltipOnlyForDisplay", "luTooltipPosition", "luTooltipWhenEllipsis", "luTooltipAnchor", "id"], exportAs: ["luTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: TagComponent, isStandalone: true, selector: "lu-tag", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, outlined: { classPropertyName: "outlined", publicName: "outlined", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, withEllipsis: { classPropertyName: "withEllipsis", publicName: "withEllipsis", isSignal: true, isRequired: false, transformFunction: null }, AI: { classPropertyName: "AI", publicName: "AI", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (link()) {\n\t<a [routerLink]=\"link()\" class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t</a>\n} @else {\n\t<span class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t@if (withEllipsis()) {\n\t\t\t<span class=\"tag-content pr-u-ellipsis\" luTooltip luTooltipWhenEllipsis>{{ label() }}</span>\n\t\t} @else {\n\t\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t\t}\n\t</span>\n}\n", styles: ["@layer components{.tag{--components-tag-background: var(--palettes-100, var(--palettes-neutral-100));--components-tag-color: var(--palettes-800, var(--palettes-neutral-800));--components-tag-shadow: transparent;--components-tag-font: var(--pr-t-font-body-S);--components-tag-gap: var(--pr-t-spacings-50);--components-tag-decoration: none;--components-tag-cursor: inherit;--components-tag-boxShadow: 0 0 0 1px var(--components-tag-shadow);--components-tag-position: static;--components-tag-fontSize: var(--pr-t-font-body-S-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-S-lineHeight);background-color:var(--components-tag-background);border-radius:var(--pr-t-border-radius-small);padding-block:0;padding-inline:var(--pr-t-spacings-50);text-decoration:var(--components-tag-decoration);box-shadow:0 0 0 1px var(--components-tag-shadow);gap:var(--components-tag-gap);cursor:var(--components-tag-cursor);display:inline-flex;align-items:center;text-align:center;vertical-align:baseline;white-space:nowrap;border:0;font:var(--components-tag-font);font-size:var(--components-tag-fontSize);line-height:var(--components-tag-lineHeight);max-inline-size:100%;position:var(--components-tag-position)}.tag,.tag:is(a,button){color:var(--components-tag-color)}.tag .lucca-icon{--icon-size: 1rem}.tag-content{outline:none;text-decoration:var(--components-tag-decoration)}}@layer mods{.tag.mod-S{--components-tag-font: var(--pr-t-font-body-XS);--components-tag-gap: var(--pr-t-spacings-25)}.tag.mod-S .lucca-icon{--icon-size: .75rem}.tag.mod-S{--components-tag-fontSize: var(--pr-t-font-body-XS-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-XS-lineHeight)}.tag.mod-L{--components-tag-font: var(--pr-t-font-body-M)}.tag.mod-L .lucca-icon{--icon-size: 1.25rem}.tag.mod-L{--components-tag-fontSize: var(--pr-t-font-body-M-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-M-lineHeight)}.tag:is(a,button),.tag.mod-clickable{--components-tag-cursor: pointer}.tag:is(a,button):hover,.tag:is(a,button):focus,.tag.mod-clickable:hover,.tag.mod-clickable:focus{--components-tag-decoration: underline}.tag:is(a,button):has(.tag-content):hover,.tag:is(a,button):has(.tag-content):focus,.tag.mod-clickable:has(.tag-content):hover,.tag.mod-clickable:has(.tag-content):focus{--components-tag-decoration: none}.tag:is(a,button):has(.tag-content):hover .tag-content,.tag:is(a,button):has(.tag-content):focus .tag-content,.tag.mod-clickable:has(.tag-content):hover .tag-content,.tag.mod-clickable:has(.tag-content):focus .tag-content{--components-tag-decoration: underline}.tag.mod-outlined,.tag.mod-AI{--components-tag-shadow: var(--palettes-300, var(--palettes-neutral-300));--components-tag-background: transparent}.tag.mod-AI:not(:disabled){--components-tag-boxShadow: none;--components-tag-position: relative}.tag.mod-AI:not(:disabled):before{content:\"\";pointer-events:none;position:absolute;inset:calc(var(--commons-divider-width) * -1);padding:var(--commons-divider-width);background-image:conic-gradient(from 135deg,var(--palettes-brand-400),var(--palettes-AI-500),var(--palettes-brand-400));border-radius:calc(var(--pr-t-border-radius-small) + var(--commons-divider-width));-webkit-mask:linear-gradient(var(--palettes-neutral-0)) content-box,linear-gradient(var(--palettes-neutral-0));mask:linear-gradient(var(--palettes-neutral-0)) content-box,linear-gradient(var(--palettes-neutral-0));-webkit-mask-composite:xor;mask-composite:exclude}.tag.mod-AI:not(:disabled) .lucca-icon{background-image:linear-gradient(135deg,var(--palettes-AI-600),var(--palettes-brand-500));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.tag.mod-disabled{--components-tag-background: var(--commons-disabled-background);--components-tag-color: var(--commons-disabled-color)}.tag:has(.tag-content:focus-visible){outline:2px solid var(--palettes-product-700);outline-offset:2px}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "lu-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: LuTooltipModule }, { kind: "directive", type: i1.LuTooltipTriggerDirective, selector: "[luTooltip]", inputs: ["luTooltip", "luTooltipEnterDelay", "luTooltipLeaveDelay", "luTooltipDisabled", "luTooltipOnlyForDisplay", "luTooltipPosition", "luTooltipWhenEllipsis", "luTooltipAnchor", "id"], exportAs: ["luTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: TagComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TagComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lu-tag', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [IconComponent, RouterLink, LuTooltipModule], template: "@if (link()) {\n\t<a [routerLink]=\"link()\" class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t</a>\n} @else {\n\t<span class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t@if (withEllipsis()) {\n\t\t\t<span class=\"tag-content pr-u-ellipsis\" luTooltip luTooltipWhenEllipsis>{{ label() }}</span>\n\t\t} @else {\n\t\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t\t}\n\t</span>\n}\n", styles: ["@layer components{.tag{--components-tag-background: var(--palettes-100, var(--palettes-neutral-100));--components-tag-color: var(--palettes-800, var(--palettes-neutral-800));--components-tag-shadow: transparent;--components-tag-font: var(--pr-t-font-body-S);--components-tag-gap: var(--pr-t-spacings-50);--components-tag-decoration: none;--components-tag-cursor: inherit;--components-tag-boxShadow: 0 0 0 1px var(--components-tag-shadow);--components-tag-position: static;--components-tag-fontSize: var(--pr-t-font-body-S-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-S-lineHeight);background-color:var(--components-tag-background);border-radius:var(--pr-t-border-radius-small);padding-block:0;padding-inline:var(--pr-t-spacings-50);text-decoration:var(--components-tag-decoration);box-shadow:0 0 0 1px var(--components-tag-shadow);gap:var(--components-tag-gap);cursor:var(--components-tag-cursor);display:inline-flex;align-items:center;text-align:center;vertical-align:baseline;white-space:nowrap;border:0;font:var(--components-tag-font);font-size:var(--components-tag-fontSize);line-height:var(--components-tag-lineHeight);max-inline-size:100%;position:var(--components-tag-position)}.tag,.tag:is(a,button){color:var(--components-tag-color)}.tag .lucca-icon{--icon-size: 1rem}.tag-content{outline:none;text-decoration:var(--components-tag-decoration)}}@layer mods{.tag.mod-S{--components-tag-font: var(--pr-t-font-body-XS);--components-tag-gap: var(--pr-t-spacings-25);--components-tag-fontSize: var(--pr-t-font-body-XS-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-XS-lineHeight)}.tag.mod-S .lucca-icon{--icon-size: .75rem}.tag.mod-L{--components-tag-font: var(--pr-t-font-body-M);--components-tag-fontSize: var(--pr-t-font-body-M-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-M-lineHeight)}.tag.mod-L .lucca-icon{--icon-size: 1.25rem}.tag:is(a,button),.tag.mod-clickable{--components-tag-cursor: pointer}.tag:is(a,button):hover,.tag:is(a,button):focus,.tag.mod-clickable:hover,.tag.mod-clickable:focus{--components-tag-decoration: underline}.tag:is(a,button):has(.tag-content):hover,.tag:is(a,button):has(.tag-content):focus,.tag.mod-clickable:has(.tag-content):hover,.tag.mod-clickable:has(.tag-content):focus{--components-tag-decoration: none}.tag:is(a,button):has(.tag-content):hover .tag-content,.tag:is(a,button):has(.tag-content):focus .tag-content,.tag.mod-clickable:has(.tag-content):hover .tag-content,.tag.mod-clickable:has(.tag-content):focus .tag-content{--components-tag-decoration: underline}.tag.mod-outlined,.tag.mod-AI{--components-tag-shadow: var(--palettes-300, var(--palettes-neutral-300));--components-tag-background: transparent}.tag.mod-AI:not(:disabled){--components-tag-boxShadow: none;--components-tag-position: relative}.tag.mod-AI:not(:disabled):before{content:\"\";pointer-events:none;position:absolute;inset:calc(var(--commons-divider-width) * -1);padding:var(--commons-divider-width);background-image:conic-gradient(from 135deg,var(--palettes-brand-400),var(--palettes-AI-500),var(--palettes-brand-400));border-radius:calc(var(--pr-t-border-radius-small) + var(--commons-divider-width));mask:linear-gradient(var(--palettes-neutral-0)) content-box,linear-gradient(var(--palettes-neutral-0));-webkit-mask-composite:xor;mask-composite:exclude}.tag.mod-AI:not(:disabled) .lucca-icon{background-image:linear-gradient(135deg,var(--palettes-AI-600),var(--palettes-brand-500));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.tag.mod-disabled{--components-tag-background: var(--commons-disabled-background);--components-tag-color: var(--commons-disabled-color)}.tag:has(.tag-content:focus-visible){outline:2px solid var(--palettes-product-700);outline-offset:2px}}\n"] }]
-        }] });
+            args: [{ selector: 'lu-tag', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [IconComponent, RouterLink, LuTooltipModule], template: "@if (link()) {\n\t<a [routerLink]=\"link()\" class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t</a>\n} @else {\n\t<span class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t@if (withEllipsis()) {\n\t\t\t<span class=\"tag-content pr-u-ellipsis\" luTooltip luTooltipWhenEllipsis>{{ label() }}</span>\n\t\t} @else {\n\t\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t\t}\n\t</span>\n}\n", styles: ["@layer components{.tag{--components-tag-background: var(--palettes-100, var(--palettes-neutral-100));--components-tag-color: var(--palettes-800, var(--palettes-neutral-800));--components-tag-shadow: transparent;--components-tag-font: var(--pr-t-font-body-S);--components-tag-gap: var(--pr-t-spacings-50);--components-tag-decoration: none;--components-tag-cursor: inherit;--components-tag-boxShadow: 0 0 0 1px var(--components-tag-shadow);--components-tag-position: static;--components-tag-fontSize: var(--pr-t-font-body-S-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-S-lineHeight);background-color:var(--components-tag-background);border-radius:var(--pr-t-border-radius-small);padding-block:0;padding-inline:var(--pr-t-spacings-50);text-decoration:var(--components-tag-decoration);box-shadow:0 0 0 1px var(--components-tag-shadow);gap:var(--components-tag-gap);cursor:var(--components-tag-cursor);display:inline-flex;align-items:center;text-align:center;vertical-align:baseline;white-space:nowrap;border:0;font:var(--components-tag-font);font-size:var(--components-tag-fontSize);line-height:var(--components-tag-lineHeight);max-inline-size:100%;position:var(--components-tag-position)}.tag,.tag:is(a,button){color:var(--components-tag-color)}.tag .lucca-icon{--icon-size: 1rem}.tag-content{outline:none;text-decoration:var(--components-tag-decoration)}}@layer mods{.tag.mod-S{--components-tag-font: var(--pr-t-font-body-XS);--components-tag-gap: var(--pr-t-spacings-25)}.tag.mod-S .lucca-icon{--icon-size: .75rem}.tag.mod-S{--components-tag-fontSize: var(--pr-t-font-body-XS-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-XS-lineHeight)}.tag.mod-L{--components-tag-font: var(--pr-t-font-body-M)}.tag.mod-L .lucca-icon{--icon-size: 1.25rem}.tag.mod-L{--components-tag-fontSize: var(--pr-t-font-body-M-fontSize);--components-tag-lineHeight: var(--pr-t-font-body-M-lineHeight)}.tag:is(a,button),.tag.mod-clickable{--components-tag-cursor: pointer}.tag:is(a,button):hover,.tag:is(a,button):focus,.tag.mod-clickable:hover,.tag.mod-clickable:focus{--components-tag-decoration: underline}.tag:is(a,button):has(.tag-content):hover,.tag:is(a,button):has(.tag-content):focus,.tag.mod-clickable:has(.tag-content):hover,.tag.mod-clickable:has(.tag-content):focus{--components-tag-decoration: none}.tag:is(a,button):has(.tag-content):hover .tag-content,.tag:is(a,button):has(.tag-content):focus .tag-content,.tag.mod-clickable:has(.tag-content):hover .tag-content,.tag.mod-clickable:has(.tag-content):focus .tag-content{--components-tag-decoration: underline}.tag.mod-outlined,.tag.mod-AI{--components-tag-shadow: var(--palettes-300, var(--palettes-neutral-300));--components-tag-background: transparent}.tag.mod-AI:not(:disabled){--components-tag-boxShadow: none;--components-tag-position: relative}.tag.mod-AI:not(:disabled):before{content:\"\";pointer-events:none;position:absolute;inset:calc(var(--commons-divider-width) * -1);padding:var(--commons-divider-width);background-image:conic-gradient(from 135deg,var(--palettes-brand-400),var(--palettes-AI-500),var(--palettes-brand-400));border-radius:calc(var(--pr-t-border-radius-small) + var(--commons-divider-width));-webkit-mask:linear-gradient(var(--palettes-neutral-0)) content-box,linear-gradient(var(--palettes-neutral-0));mask:linear-gradient(var(--palettes-neutral-0)) content-box,linear-gradient(var(--palettes-neutral-0));-webkit-mask-composite:xor;mask-composite:exclude}.tag.mod-AI:not(:disabled) .lucca-icon{background-image:linear-gradient(135deg,var(--palettes-AI-600),var(--palettes-brand-500));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.tag.mod-disabled{--components-tag-background: var(--commons-disabled-background);--components-tag-color: var(--commons-disabled-color)}.tag:has(.tag-content:focus-visible){outline:2px solid var(--palettes-product-700);outline-offset:2px}}\n"] }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }], outlined: [{ type: i0.Input, args: [{ isSignal: true, alias: "outlined", required: false }] }], link: [{ type: i0.Input, args: [{ isSignal: true, alias: "link", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], withEllipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "withEllipsis", required: false }] }], AI: [{ type: i0.Input, args: [{ isSignal: true, alias: "AI", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/lucca-front-ng-tag.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lucca-front-ng-tag.mjs","sources":["../../../packages/ng/tag/tag.component.ts","../../../packages/ng/tag/tag.component.html","../../../packages/ng/tag/lucca-front-ng-tag.ts"],"sourcesContent":["import { booleanAttribute, ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { RouterLink } from '@angular/router';\nimport { LuccaIcon } from '@lucca-front/icons';\nimport { DecorativePalette, Palette } from '@lucca-front/ng/core';\nimport { IconComponent } from '@lucca-front/ng/icon';\nimport { LuTooltipModule } from '@lucca-front/ng/tooltip';\n\n@Component({\n\tselector: 'lu-tag',\n\ttemplateUrl: './tag.component.html',\n\tstyleUrl: './tag.component.scss',\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\timports: [IconComponent, RouterLink, LuTooltipModule],\n})\nexport class TagComponent {\n\t/**\n\t * Which text should the tag be? Defaults to medium\n\t */\n\treadonly label = input.required<string>();\n\n\t/**\n\t * Which size should the tag be? Defaults to medium\n\t */\n\treadonly size = input<'S' | 'M' | 'L'>('M');\n\n\t/**\n\t * Which palette should be used for the entire tag.\n\t * Defaults to none (inherits parent palette)\n\t */\n\treadonly palette = input<Palette | DecorativePalette>('none');\n\n\t/**\n\t * Should display be outlined?\n\t */\n\treadonly outlined = input(false, { transform: booleanAttribute });\n\n\t/**\n\t * For routerLink usage\n\t */\n\treadonly link = input<string>();\n\n\t/**\n\t * Which icon should we display in the tag if any?\n\t * Defaults to no icon.\n\t */\n\treadonly icon = input<LuccaIcon | null>(null);\n\n\treadonly withEllipsis = input(false, { transform: booleanAttribute });\n\n\treadonly AI = input(false, { transform: booleanAttribute });\n\n\treadonly tagClasses = computed(() => {\n\t\tconst size = this.size();\n\t\tconst palette = this.palette();\n\t\treturn {\n\t\t\t[`mod-${size}`]: !!size,\n\t\t\t[`palette-${palette}`]: !this.AI() && !!palette,\n\t\t};\n\t});\n}\n","@if (link()) {\n\t<a [routerLink]=\"link()\" class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t</a>\n} @else {\n\t<span class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t@if (withEllipsis()) {\n\t\t\t<span class=\"tag-content pr-u-ellipsis\" luTooltip luTooltipWhenEllipsis>{{ label() }}</span>\n\t\t} @else {\n\t\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t\t}\n\t</span>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAea,YAAY,CAAA;AARzB,IAAA,WAAA,GAAA;AASC;;AAEG;AACM,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAU;AAEzC;;AAEG;AACM,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAkB,GAAG,CAAC;AAE3C;;;AAGG;AACM,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAA8B,MAAM,CAAC;AAE7D;;AAEG;QACM,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AAEjE;;AAEG;QACM,IAAI,CAAA,IAAA,GAAG,KAAK,EAAU;AAE/B;;;AAGG;AACM,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAmB,IAAI,CAAC;QAEpC,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;QAE5D,IAAE,CAAA,EAAA,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;AAElD,QAAA,IAAA,CAAA,UAAU,GAAG,QAAQ,CAAC,MAAK;AACnC,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE;AACxB,YAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE;YAC9B,OAAO;AACN,gBAAA,CAAC,OAAO,IAAI,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI;AACvB,gBAAA,CAAC,CAAW,QAAA,EAAA,OAAO,CAAE,CAAA,GAAG,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC,OAAO;aAC/C;AACF,SAAC,CAAC;AACF;8GA7CY,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAZ,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,+hCCfzB,0rBAmBA,EAAA,MAAA,EAAA,CAAA,+rHAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDNW,aAAa,EAAE,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,KAAA,EAAA,MAAA,EAAA,OAAA,EAAA,IAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,UAAU,mOAAE,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,yBAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,mBAAA,EAAA,yBAAA,EAAA,mBAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,IAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAExC,YAAY,EAAA,UAAA,EAAA,CAAA;kBARxB,SAAS;AACC,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,QAAQ,EAGD,eAAA,EAAA,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAAA,OAAA,EAC5B,CAAC,aAAa,EAAE,UAAU,EAAE,eAAe,CAAC,EAAA,QAAA,EAAA,0rBAAA,EAAA,MAAA,EAAA,CAAA,+rHAAA,CAAA,EAAA;;;AEbtD;;AAEG;;;;"}
+{"version":3,"file":"lucca-front-ng-tag.mjs","sources":["../../../packages/ng/tag/tag.component.ts","../../../packages/ng/tag/tag.component.html","../../../packages/ng/tag/lucca-front-ng-tag.ts"],"sourcesContent":["import { booleanAttribute, ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { RouterLink } from '@angular/router';\nimport { LuccaIcon } from '@lucca-front/icons';\nimport { DecorativePalette, Palette } from '@lucca-front/ng/core';\nimport { IconComponent } from '@lucca-front/ng/icon';\nimport { LuTooltipModule } from '@lucca-front/ng/tooltip';\n\n@Component({\n\tselector: 'lu-tag',\n\ttemplateUrl: './tag.component.html',\n\tstyleUrl: './tag.component.scss',\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\timports: [IconComponent, RouterLink, LuTooltipModule],\n})\nexport class TagComponent {\n\t/**\n\t * Which text should the tag be? Defaults to medium\n\t */\n\treadonly label = input.required<string>();\n\n\t/**\n\t * Which size should the tag be? Defaults to medium\n\t */\n\treadonly size = input<'S' | 'M' | 'L'>('M');\n\n\t/**\n\t * Which palette should be used for the entire tag.\n\t * Defaults to none (inherits parent palette)\n\t */\n\treadonly palette = input<Palette | DecorativePalette>('none');\n\n\t/**\n\t * Should display be outlined?\n\t */\n\treadonly outlined = input(false, { transform: booleanAttribute });\n\n\t/**\n\t * For routerLink usage\n\t */\n\treadonly link = input<string>();\n\n\t/**\n\t * Which icon should we display in the tag if any?\n\t * Defaults to no icon.\n\t */\n\treadonly icon = input<LuccaIcon | null>(null);\n\n\treadonly withEllipsis = input(false, { transform: booleanAttribute });\n\n\treadonly AI = input(false, { transform: booleanAttribute });\n\n\treadonly tagClasses = computed(() => {\n\t\tconst size = this.size();\n\t\tconst palette = this.palette();\n\t\treturn {\n\t\t\t[`mod-${size}`]: !!size,\n\t\t\t[`palette-${palette}`]: !this.AI() && !!palette,\n\t\t};\n\t});\n}\n","@if (link()) {\n\t<a [routerLink]=\"link()\" class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t</a>\n} @else {\n\t<span class=\"tag\" [class]=\"tagClasses()\" [class.mod-outlined]=\"!AI() && outlined()\" [class.mod-AI]=\"AI()\">\n\t\t@if (icon()) {\n\t\t\t<lu-icon [icon]=\"icon()\" />\n\t\t}\n\t\t@if (withEllipsis()) {\n\t\t\t<span class=\"tag-content pr-u-ellipsis\" luTooltip luTooltipWhenEllipsis>{{ label() }}</span>\n\t\t} @else {\n\t\t\t<span class=\"tag-content\">{{ label() }}</span>\n\t\t}\n\t</span>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAea,YAAY,CAAA;AARzB,IAAA,WAAA,GAAA;AASC;;AAEG;AACM,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,gDAAU;AAEzC;;AAEG;AACM,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAkB,GAAG,gDAAC;AAE3C;;;AAGG;AACM,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAA8B,MAAM,mDAAC;AAE7D;;AAEG;QACM,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,qDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEjE;;AAEG;QACM,IAAA,CAAA,IAAI,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;AAE/B;;;AAGG;AACM,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAmB,IAAI,gDAAC;QAEpC,IAAA,CAAA,YAAY,GAAG,KAAK,CAAC,KAAK,yDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;QAE5D,IAAA,CAAA,EAAE,GAAG,KAAK,CAAC,KAAK,+CAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAElD,QAAA,IAAA,CAAA,UAAU,GAAG,QAAQ,CAAC,MAAK;AACnC,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE;AACxB,YAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE;YAC9B,OAAO;AACN,gBAAA,CAAC,OAAO,IAAI,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI;AACvB,gBAAA,CAAC,CAAA,QAAA,EAAW,OAAO,CAAA,CAAE,GAAG,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC,OAAO;aAC/C;AACF,QAAA,CAAC,sDAAC;AACF,IAAA;8GA7CY,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAZ,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,+hCCfzB,0rBAmBA,EAAA,MAAA,EAAA,CAAA,o0HAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDNW,aAAa,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,KAAA,EAAA,MAAA,EAAA,OAAA,EAAA,IAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,UAAU,mOAAE,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,yBAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,mBAAA,EAAA,yBAAA,EAAA,mBAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,IAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAExC,YAAY,EAAA,UAAA,EAAA,CAAA;kBARxB,SAAS;AACC,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,QAAQ,EAAA,eAAA,EAGD,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAAA,OAAA,EAC5B,CAAC,aAAa,EAAE,UAAU,EAAE,eAAe,CAAC,EAAA,QAAA,EAAA,0rBAAA,EAAA,MAAA,EAAA,CAAA,o0HAAA,CAAA,EAAA;;;AEbtD;;AAEG;;;;"}

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

@@ -8,13 +8,13 @@ import { InputDirective } from '@lucca-front/ng/form-field';
 
 class BasePickerComponent {
     constructor() {
-        this.step = input(null);
-        this.disabled = model(false);
-        this.size = input();
-        this.hoursPart = viewChild('hoursPart');
-        this.minutesPart = viewChild('minutesPart');
-        this.hoursIncrement = computed(() => this.getHoursIncrement());
-        this.minutesIncrement = computed(() => this.getMinutesIncrement());
+        this.step = input(null, ...(ngDevMode ? [{ debugName: "step" }] : []));
+        this.disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+        this.size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : []));
+        this.hoursPart = viewChild('hoursPart', ...(ngDevMode ? [{ debugName: "hoursPart" }] : []));
+        this.minutesPart = viewChild('minutesPart', ...(ngDevMode ? [{ debugName: "minutesPart" }] : []));
+        this.hoursIncrement = computed(() => this.getHoursIncrement(), ...(ngDevMode ? [{ debugName: "hoursIncrement" }] : []));
+        this.minutesIncrement = computed(() => this.getMinutesIncrement(), ...(ngDevMode ? [{ debugName: "minutesIncrement" }] : []));
     }
     registerOnChange(fn) {
         this.onChange = fn;
@@ -37,16 +37,16 @@ class BasePickerComponent {
             this.minutesPart()?.focus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: BasePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0.2", type: BasePickerComponent, isStandalone: true, selector: "ng-component", inputs: { step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange" }, viewQueries: [{ propertyName: "hoursPart", first: true, predicate: ["hoursPart"], descendants: true, isSignal: true }, { propertyName: "minutesPart", first: true, predicate: ["minutesPart"], descendants: true, isSignal: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: BasePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.6", type: BasePickerComponent, isStandalone: true, selector: "ng-component", inputs: { step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange" }, viewQueries: [{ propertyName: "hoursPart", first: true, predicate: ["hoursPart"], descendants: true, isSignal: true }, { propertyName: "minutesPart", first: true, predicate: ["minutesPart"], descendants: true, isSignal: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: BasePickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: BasePickerComponent, decorators: [{
             type: Component,
             args: [{
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '',
                 }]
-        }] });
+        }], propDecorators: { step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], hoursPart: [{ type: i0.ViewChild, args: ['hoursPart', { isSignal: true }] }], minutesPart: [{ type: i0.ViewChild, args: ['minutesPart', { isSignal: true }] }] } });
 
 const ISO8601DurationRegExp = /^(?<sign>-)?P(?:(?<years>-?\d+)Y)?(?:(?<months>-?\d+)M)?(?:(?<weeks>-?\d+)W)?(?:(?<days>-?\d+)D)?(?:T(?:(?<hours>-?\d+)H)?(?:(?<minutes>-?\d+)M)?(?:(?<seconds>-?\d+(?:\.\d+)?)S)?)?$/;
 // TODO memoize
@@ -177,42 +177,30 @@ class RepeatOnHoldDirective {
         window.removeEventListener('mouseup', this.onWindowMouseUp);
         this.cancelAnimationFrame();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: RepeatOnHoldDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.2", type: RepeatOnHoldDirective, isStandalone: true, selector: "[luRepeatOnHold]", outputs: { hold: "hold" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RepeatOnHoldDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: RepeatOnHoldDirective, isStandalone: true, selector: "[luRepeatOnHold]", outputs: { hold: "hold" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: RepeatOnHoldDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RepeatOnHoldDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[luRepeatOnHold]',
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }] });
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { hold: [{ type: i0.Output, args: ["hold"] }] } });
 
 let nextId$1 = 0;
 class TimePickerPartComponent {
     constructor(locale) {
         this.locale = locale;
-        this.label = input('');
-        this.decimalConf = input('2.0-0');
-        this.value = model('––');
-        this.display = input();
-        this.max = input(0, {
-            transform: numberAttribute,
-        });
-        this.displayArrows = input(false, {
-            transform: booleanAttribute,
-        });
-        this.isReadonly = input(false, {
-            transform: booleanAttribute,
-        });
-        this.hideValue = input(false, {
-            transform: booleanAttribute,
-        });
-        this.disabled = input(false, {
-            transform: booleanAttribute,
-        });
-        this.focused = input(false, {
-            transform: booleanAttribute,
-        });
+        this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
+        this.decimalConf = input('2.0-0', ...(ngDevMode ? [{ debugName: "decimalConf" }] : []));
+        this.value = model('––', ...(ngDevMode ? [{ debugName: "value" }] : []));
+        this.display = input(...(ngDevMode ? [undefined, { debugName: "display" }] : []));
+        this.max = input(0, { ...(ngDevMode ? { debugName: "max" } : {}), transform: numberAttribute });
+        this.displayArrows = input(false, { ...(ngDevMode ? { debugName: "displayArrows" } : {}), transform: booleanAttribute });
+        this.isReadonly = input(false, { ...(ngDevMode ? { debugName: "isReadonly" } : {}), transform: booleanAttribute });
+        this.hideValue = input(false, { ...(ngDevMode ? { debugName: "hideValue" } : {}), transform: booleanAttribute });
+        this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
+        this.focused = input(false, { ...(ngDevMode ? { debugName: "focused" } : {}), transform: booleanAttribute });
         this.prevRequest = output();
         this.nextRequest = output();
         this.inputControlClick = output();
@@ -229,7 +217,7 @@ class TimePickerPartComponent {
                 return value;
             }
             return formatNumber(value, this.locale, this.decimalConf());
-        });
+        }, ...(ngDevMode ? [{ debugName: "valueLabel" }] : []));
         this.inputId = `time-picker-part-${nextId$1++}`;
     }
     arrowKeyPressed(event, isUpArrow) {
@@ -308,16 +296,16 @@ class TimePickerPartComponent {
             this.timePickerInput.nativeElement.focus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: TimePickerPartComponent, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: TimePickerPartComponent, isStandalone: true, selector: "lu-time-picker-part", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, decimalConf: { classPropertyName: "decimalConf", publicName: "decimalConf", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, displayArrows: { classPropertyName: "displayArrows", publicName: "displayArrows", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, hideValue: { classPropertyName: "hideValue", publicName: "hideValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, focused: { classPropertyName: "focused", publicName: "focused", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", prevRequest: "prevRequest", nextRequest: "nextRequest", inputControlClick: "inputControlClick", touched: "touched" }, viewQueries: [{ propertyName: "timePickerInput", first: true, predicate: ["timePickerInput"], descendants: true }], ngImport: i0, template: "<div class=\"timePicker-fieldset-group-textfield\">\n\t<label class=\"formLabel pr-u-mask\" [attr.id]=\"inputId + '-label'\" [attr.for]=\"inputId + '-input'\">{{ label() }}</label>\n\t<div class=\"timePicker-fieldset-group-textfield\">\n\t\t<input\n\t\t\t#timePickerInput\n\t\t\ttype=\"text\"\n\t\t\tluInput\n\t\t\tluInputStandalone\n\t\t\tinputmode=\"numeric\"\n\t\t\t[attr.id]=\"inputId + '-input'\"\n\t\t\tclass=\"timePicker-fieldset-group-textfield-input\"\n\t\t\t[attr.aria-labelledby]=\"inputId + '-label'\"\n\t\t\tautocomplete=\"off\"\n\t\t\t[value]=\"hideValue() ? null : value()\"\n\t\t\t(input)=\"keysInputHandler($event)\"\n\t\t\t(click)=\"clickHandler($event)\"\n\t\t\t(keydown)=\"keydownHandler($event)\"\n\t\t\t(blur)=\"touched.emit()\"\n\t\t\t(focus)=\"timePickerInput.select()\"\n\t\t/>\n\t\t<span aria-hidden=\"true\" class=\"timePicker-fieldset-group-textfield-display\">{{ valueLabel() }}</span>\n\t</div>\n\t@if (displayArrows()) {\n\t\t<button class=\"timePicker-fieldset-group-stepper\" type=\"button\" tabindex=\"-1\" aria-hidden=\"true\" luRepeatOnHold (hold)=\"up()\">\n\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t</button>\n\t\t<button class=\"timePicker-fieldset-group-stepper\" type=\"button\" tabindex=\"-1\" aria-hidden=\"true\" luRepeatOnHold (hold)=\"down()\">\n\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t</button>\n\t}\n</div>\n", dependencies: [{ kind: "directive", type: RepeatOnHoldDirective, selector: "[luRepeatOnHold]", outputs: ["hold"] }, { kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TimePickerPartComponent, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: TimePickerPartComponent, isStandalone: true, selector: "lu-time-picker-part", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, decimalConf: { classPropertyName: "decimalConf", publicName: "decimalConf", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, displayArrows: { classPropertyName: "displayArrows", publicName: "displayArrows", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, hideValue: { classPropertyName: "hideValue", publicName: "hideValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, focused: { classPropertyName: "focused", publicName: "focused", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", prevRequest: "prevRequest", nextRequest: "nextRequest", inputControlClick: "inputControlClick", touched: "touched" }, viewQueries: [{ propertyName: "timePickerInput", first: true, predicate: ["timePickerInput"], descendants: true }], ngImport: i0, template: "<div class=\"timePicker-fieldset-group-textfield\">\n\t<label class=\"formLabel pr-u-mask\" [attr.id]=\"inputId + '-label'\" [attr.for]=\"inputId + '-input'\">{{ label() }}</label>\n\t<div class=\"timePicker-fieldset-group-textfield\">\n\t\t<input\n\t\t\t#timePickerInput\n\t\t\ttype=\"text\"\n\t\t\tluInput\n\t\t\tluInputStandalone\n\t\t\tinputmode=\"numeric\"\n\t\t\t[attr.id]=\"inputId + '-input'\"\n\t\t\tclass=\"timePicker-fieldset-group-textfield-input\"\n\t\t\t[attr.aria-labelledby]=\"inputId + '-label'\"\n\t\t\tautocomplete=\"off\"\n\t\t\t[value]=\"hideValue() ? null : value()\"\n\t\t\t(input)=\"keysInputHandler($event)\"\n\t\t\t(click)=\"clickHandler($event)\"\n\t\t\t(keydown)=\"keydownHandler($event)\"\n\t\t\t(blur)=\"touched.emit()\"\n\t\t\t(focus)=\"timePickerInput.select()\"\n\t\t/>\n\t\t<span aria-hidden=\"true\" class=\"timePicker-fieldset-group-textfield-display\">{{ valueLabel() }}</span>\n\t</div>\n\t@if (displayArrows()) {\n\t\t<button class=\"timePicker-fieldset-group-stepper\" type=\"button\" tabindex=\"-1\" aria-hidden=\"true\" luRepeatOnHold (hold)=\"up()\">\n\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t</button>\n\t\t<button class=\"timePicker-fieldset-group-stepper\" type=\"button\" tabindex=\"-1\" aria-hidden=\"true\" luRepeatOnHold (hold)=\"down()\">\n\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t</button>\n\t}\n</div>\n", dependencies: [{ kind: "directive", type: RepeatOnHoldDirective, selector: "[luRepeatOnHold]", outputs: ["hold"] }, { kind: "directive", type: InputDirective, selector: "[luInput]", inputs: ["luInputStandalone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: TimePickerPartComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TimePickerPartComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-time-picker-part', imports: [RepeatOnHoldDirective, DecimalPipe, InputDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"timePicker-fieldset-group-textfield\">\n\t<label class=\"formLabel pr-u-mask\" [attr.id]=\"inputId + '-label'\" [attr.for]=\"inputId + '-input'\">{{ label() }}</label>\n\t<div class=\"timePicker-fieldset-group-textfield\">\n\t\t<input\n\t\t\t#timePickerInput\n\t\t\ttype=\"text\"\n\t\t\tluInput\n\t\t\tluInputStandalone\n\t\t\tinputmode=\"numeric\"\n\t\t\t[attr.id]=\"inputId + '-input'\"\n\t\t\tclass=\"timePicker-fieldset-group-textfield-input\"\n\t\t\t[attr.aria-labelledby]=\"inputId + '-label'\"\n\t\t\tautocomplete=\"off\"\n\t\t\t[value]=\"hideValue() ? null : value()\"\n\t\t\t(input)=\"keysInputHandler($event)\"\n\t\t\t(click)=\"clickHandler($event)\"\n\t\t\t(keydown)=\"keydownHandler($event)\"\n\t\t\t(blur)=\"touched.emit()\"\n\t\t\t(focus)=\"timePickerInput.select()\"\n\t\t/>\n\t\t<span aria-hidden=\"true\" class=\"timePicker-fieldset-group-textfield-display\">{{ valueLabel() }}</span>\n\t</div>\n\t@if (displayArrows()) {\n\t\t<button class=\"timePicker-fieldset-group-stepper\" type=\"button\" tabindex=\"-1\" aria-hidden=\"true\" luRepeatOnHold (hold)=\"up()\">\n\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t</button>\n\t\t<button class=\"timePicker-fieldset-group-stepper\" type=\"button\" tabindex=\"-1\" aria-hidden=\"true\" luRepeatOnHold (hold)=\"down()\">\n\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t</button>\n\t}\n</div>\n" }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [LOCALE_ID]
-                }] }], propDecorators: { timePickerInput: [{
+                }] }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], decimalConf: [{ type: i0.Input, args: [{ isSignal: true, alias: "decimalConf", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], displayArrows: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayArrows", required: false }] }], isReadonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "isReadonly", required: false }] }], hideValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideValue", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], focused: [{ type: i0.Input, args: [{ isSignal: true, alias: "focused", required: false }] }], prevRequest: [{ type: i0.Output, args: ["prevRequest"] }], nextRequest: [{ type: i0.Output, args: ["nextRequest"] }], inputControlClick: [{ type: i0.Output, args: ["inputControlClick"] }], touched: [{ type: i0.Output, args: ["touched"] }], timePickerInput: [{
                 type: ViewChild,
                 args: ['timePickerInput']
             }] } });
@@ -376,15 +364,15 @@ class DurationPickerComponent extends BasePickerComponent {
     constructor() {
         super(...arguments);
         this.intl = getIntl(LU_DURATION_PICKER_TRANSLATIONS);
-        this.value = model('PT0S');
-        this.max = input('PT99H');
-        this.displayArrows = input(false, { transform: booleanAttribute });
-        this.label = input();
-        this.hideZeroValue = input(false, { transform: booleanAttribute });
+        this.value = model('PT0S', ...(ngDevMode ? [{ debugName: "value" }] : []));
+        this.max = input('PT99H', ...(ngDevMode ? [{ debugName: "max" }] : []));
+        this.displayArrows = input(false, { ...(ngDevMode ? { debugName: "displayArrows" } : {}), transform: booleanAttribute });
+        this.label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
+        this.hideZeroValue = input(false, { ...(ngDevMode ? { debugName: "hideZeroValue" } : {}), transform: booleanAttribute });
         this.durationChange = output();
-        this.hours = computed(() => getHoursPartFromDuration(this.value()));
-        this.minutes = computed(() => getMinutesPartFromDuration(this.value()));
-        this.shouldHideValue = computed(() => this.hideZeroValue() && this.hours() === 0 && this.minutes() === 0);
+        this.hours = computed(() => getHoursPartFromDuration(this.value()), ...(ngDevMode ? [{ debugName: "hours" }] : []));
+        this.minutes = computed(() => getMinutesPartFromDuration(this.value()), ...(ngDevMode ? [{ debugName: "minutes" }] : []));
+        this.shouldHideValue = computed(() => this.hideZeroValue() && this.hours() === 0 && this.minutes() === 0, ...(ngDevMode ? [{ debugName: "shouldHideValue" }] : []));
         this.pickerClasses = computed(() => {
             return {
                 timePicker: true,
@@ -392,13 +380,13 @@ class DurationPickerComponent extends BasePickerComponent {
                 'mod-stepperHover': this.displayArrows(),
                 [`mod-${this.size()}`]: Boolean(this.size()),
             };
-        });
+        }, ...(ngDevMode ? [{ debugName: "pickerClasses" }] : []));
         this.fieldsetSuffixClasses = computed(() => {
             return {
                 'timePicker-fieldset-groupSeparator': true,
                 'pr-u-visibilityHidden': this.shouldHideValue(),
             };
-        });
+        }, ...(ngDevMode ? [{ debugName: "fieldsetSuffixClasses" }] : []));
         this.separator = this.intl.timePickerTimeSeparator;
         this.hoursDecimalConf = DEFAULT_TIME_DECIMAL_PIPE_FORMAT$1;
     }
@@ -536,8 +524,8 @@ class DurationPickerComponent extends BasePickerComponent {
             this.focusPart('hours');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DurationPickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.2", type: DurationPickerComponent, isStandalone: true, selector: "lu-duration-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, displayArrows: { classPropertyName: "displayArrows", publicName: "displayArrows", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hideZeroValue: { classPropertyName: "hideZeroValue", publicName: "hideZeroValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", durationChange: "durationChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: DurationPickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.6", type: DurationPickerComponent, isStandalone: true, selector: "lu-duration-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, displayArrows: { classPropertyName: "displayArrows", publicName: "displayArrows", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hideZeroValue: { classPropertyName: "hideZeroValue", publicName: "hideZeroValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", durationChange: "durationChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => DurationPickerComponent),
@@ -545,7 +533,7 @@ class DurationPickerComponent extends BasePickerComponent {
             },
         ], usesInheritance: true, ngImport: i0, template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl.timePickerHours\"\n\t\t\t[value]=\"hours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" [class]=\"fieldsetSuffixClasses()\">{{ separator }}</div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl.timePickerMinutes\"\n\t\t\t[value]=\"minutes()\"\n\t\t\t[max]=\"59\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t/>\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-width: 1.5rem;--components-timepicker-padding: 0;--components-timepicker-paddingInput-inline: var(--pr-t-spacings-50);--components-timepicker-paddingInput-block: var(--pr-t-spacings-100);--components-timepicker-separator-left: 2.375rem;padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-product-700);outline-offset:3px}.timePicker-fieldset-groupSeparator{pointer-events:none;display:grid;place-items:center;text-align:center;inline-size:var(--pr-t-spacings-200);margin-block:0;margin-inline:calc(var(--pr-t-spacings-100) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1)}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:var(--components-timepicker-input-width);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-paddingInput-inline);padding-inline:var(--components-timepicker-paddingInput-block);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset:var(--components-timepicker-paddingInput-inline) var(--components-timepicker-paddingInput-block);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{inline-size:calc(var(--components-timepicker-input-width) + var(--components-timepicker-paddingInput-block) * 2);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset:var(--components-timepicker-paddingInput-inline) var(--components-timepicker-paddingInput-block);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip:rect(1px,1px,1px,1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-paddingInput-inline: var(--pr-t-spacings-25);--components-timepicker-paddingInput-block: var(--pr-t-spacings-75);--components-timepicker-input-height: 1.75rem;--components-timepicker-input-width: 1.25rem;--components-timepicker-separator-left: 1.875rem}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-duration-picker{display:inline-flex}}\n"], dependencies: [{ kind: "component", type: TimePickerPartComponent, selector: "lu-time-picker-part", inputs: ["label", "decimalConf", "value", "display", "max", "displayArrows", "isReadonly", "hideValue", "disabled", "focused"], outputs: ["valueChange", "prevRequest", "nextRequest", "inputControlClick", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: DurationPickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: DurationPickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-duration-picker', imports: [TimePickerPartComponent, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         {
@@ -554,7 +542,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImpor
                             multi: true,
                         },
                     ], template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl.timePickerHours\"\n\t\t\t[value]=\"hours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" [class]=\"fieldsetSuffixClasses()\">{{ separator }}</div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl.timePickerMinutes\"\n\t\t\t[value]=\"minutes()\"\n\t\t\t[max]=\"59\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t/>\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-width: 1.5rem;--components-timepicker-padding: 0;--components-timepicker-paddingInput-inline: var(--pr-t-spacings-50);--components-timepicker-paddingInput-block: var(--pr-t-spacings-100);--components-timepicker-separator-left: 2.375rem;padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-product-700);outline-offset:3px}.timePicker-fieldset-groupSeparator{pointer-events:none;display:grid;place-items:center;text-align:center;inline-size:var(--pr-t-spacings-200);margin-block:0;margin-inline:calc(var(--pr-t-spacings-100) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1)}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:var(--components-timepicker-input-width);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-paddingInput-inline);padding-inline:var(--components-timepicker-paddingInput-block);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset:var(--components-timepicker-paddingInput-inline) var(--components-timepicker-paddingInput-block);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{inline-size:calc(var(--components-timepicker-input-width) + var(--components-timepicker-paddingInput-block) * 2);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset:var(--components-timepicker-paddingInput-inline) var(--components-timepicker-paddingInput-block);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip:rect(1px,1px,1px,1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-paddingInput-inline: var(--pr-t-spacings-25);--components-timepicker-paddingInput-block: var(--pr-t-spacings-75);--components-timepicker-input-height: 1.75rem;--components-timepicker-input-width: 1.25rem;--components-timepicker-separator-left: 1.875rem}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-duration-picker{display:inline-flex}}\n"] }]
-        }] });
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], displayArrows: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayArrows", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hideZeroValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideZeroValue", required: false }] }], durationChange: [{ type: i0.Output, args: ["durationChange"] }] } });
 
 const castToIsoTime = (str) => str;
 const convertStringToIsoTime = (time) => {
@@ -669,12 +657,12 @@ class TimePickerComponent extends BasePickerComponent {
         this.intl = getIntl(LU_TIME_PICKER_TRANSLATIONS);
         this.localeId = inject(LOCALE_ID);
         this.idSuffix = nextId++;
-        this.anteMeridiemRef = viewChild('anteMeridiemRef');
-        this.postMeridiemRef = viewChild('postMeridiemRef');
-        this.value = model('--:--:--');
-        this.max = input(MAX_TIME);
-        this.displayArrows = input(false, { transform: booleanAttribute });
-        this.forceMeridiemDisplay = input(null);
+        this.anteMeridiemRef = viewChild('anteMeridiemRef', ...(ngDevMode ? [{ debugName: "anteMeridiemRef" }] : []));
+        this.postMeridiemRef = viewChild('postMeridiemRef', ...(ngDevMode ? [{ debugName: "postMeridiemRef" }] : []));
+        this.value = model('--:--:--', ...(ngDevMode ? [{ debugName: "value" }] : []));
+        this.max = input(MAX_TIME, ...(ngDevMode ? [{ debugName: "max" }] : []));
+        this.displayArrows = input(false, { ...(ngDevMode ? { debugName: "displayArrows" } : {}), transform: booleanAttribute });
+        this.forceMeridiemDisplay = input(null, ...(ngDevMode ? [{ debugName: "forceMeridiemDisplay" }] : []));
         this.enableMeridiemDisplay = computed(() => {
             if (this.forceMeridiemDisplay() !== null) {
                 return this.forceMeridiemDisplay();
@@ -686,13 +674,13 @@ class TimePickerComponent extends BasePickerComponent {
             })
                 .format(new Date('1/1/1 17:00:00'))
                 .includes('PM');
-        });
-        this.label = input();
+        }, ...(ngDevMode ? [{ debugName: "enableMeridiemDisplay" }] : []));
+        this.label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
         this.timeChange = output();
-        this.hoursDisplay = computed(() => getHoursDisplayPartFromIsoTime(this.value(), this.enableMeridiemDisplay()));
-        this.minutesDisplay = computed(() => getMinutesDisplayPartFromIsoTime(this.value()));
-        this.hours = computed(() => getHoursPartFromIsoTime(this.value()));
-        this.minutes = computed(() => getMinutesPartFromIsoTime(this.value()));
+        this.hoursDisplay = computed(() => getHoursDisplayPartFromIsoTime(this.value(), this.enableMeridiemDisplay()), ...(ngDevMode ? [{ debugName: "hoursDisplay" }] : []));
+        this.minutesDisplay = computed(() => getMinutesDisplayPartFromIsoTime(this.value()), ...(ngDevMode ? [{ debugName: "minutesDisplay" }] : []));
+        this.hours = computed(() => getHoursPartFromIsoTime(this.value()), ...(ngDevMode ? [{ debugName: "hours" }] : []));
+        this.minutes = computed(() => getMinutesPartFromIsoTime(this.value()), ...(ngDevMode ? [{ debugName: "minutes" }] : []));
         this.pickerClasses = computed(() => {
             return {
                 timePicker: true,
@@ -700,7 +688,7 @@ class TimePickerComponent extends BasePickerComponent {
                 'mod-stepperHover': this.displayArrows(),
                 [`mod-${this.size()}`]: Boolean(this.size()),
             };
-        });
+        }, ...(ngDevMode ? [{ debugName: "pickerClasses" }] : []));
         this.separator = this.intl.timePickerTimeSeparator;
         this.hoursDecimalConf = DEFAULT_TIME_DECIMAL_PIPE_FORMAT;
         this.maxHours = computed(() => {
@@ -708,10 +696,10 @@ class TimePickerComponent extends BasePickerComponent {
                 return 12;
             }
             return getHoursPartFromIsoTime(this.max() ?? '23:59:59');
-        });
+        }, ...(ngDevMode ? [{ debugName: "maxHours" }] : []));
         this.ampmDisplay = computed(() => {
             return formatAMPM(this.hours()).suffix;
-        });
+        }, ...(ngDevMode ? [{ debugName: "ampmDisplay" }] : []));
     }
     focusPart(type) {
         if (type === 'meridiem') {
@@ -854,8 +842,8 @@ class TimePickerComponent extends BasePickerComponent {
             value: createIsoTimeFromHoursAndMinutes(hours, minutes),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: TimePickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.2", type: TimePickerComponent, isStandalone: true, selector: "lu-time-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, displayArrows: { classPropertyName: "displayArrows", publicName: "displayArrows", isSignal: true, isRequired: false, transformFunction: null }, forceMeridiemDisplay: { classPropertyName: "forceMeridiemDisplay", publicName: "forceMeridiemDisplay", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", timeChange: "timeChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TimePickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: TimePickerComponent, isStandalone: true, selector: "lu-time-picker", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, displayArrows: { classPropertyName: "displayArrows", publicName: "displayArrows", isSignal: true, isRequired: false, transformFunction: null }, forceMeridiemDisplay: { classPropertyName: "forceMeridiemDisplay", publicName: "forceMeridiemDisplay", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", timeChange: "timeChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => TimePickerComponent),
@@ -863,7 +851,7 @@ class TimePickerComponent extends BasePickerComponent {
             },
         ], viewQueries: [{ propertyName: "anteMeridiemRef", first: true, predicate: ["anteMeridiemRef"], descendants: true, isSignal: true }, { propertyName: "postMeridiemRef", first: true, predicate: ["postMeridiemRef"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl.timePickerHours\"\n\t\t\t[value]=\"hours()\"\n\t\t\t[display]=\"hoursDisplay()\"\n\t\t\t[max]=\"maxHours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" class=\"timePicker-fieldset-groupSeparator\">{{ separator }}</div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl.timePickerMinutes\"\n\t\t\t[value]=\"minutesDisplay()\"\n\t\t\t[max]=\"59\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(nextRequest)=\"focusPart('meridiem')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t/>\n\t\t@if (enableMeridiemDisplay()) {\n\t\t\t<div\n\t\t\t\tclass=\"timePicker-fieldset-meridiem\"\n\t\t\t\t(copy)=\"copyHandler($event)\"\n\t\t\t\t(paste)=\"pasteHandler($event)\"\n\t\t\t\t(keydown.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(click)=\"ampmDisplay() === 'AM' ? anteMeridiemRef.focus() : postMeridiemRef.focus()\"\n\t\t\t>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-ante\">\n\t\t\t\t\t<label [attr.for]=\"'anteMeridiem-' + idSuffix\">AM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#anteMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'anteMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-ante-input\"\n\t\t\t\t\t\tvalue=\"AM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-post\">\n\t\t\t\t\t<label [attr.for]=\"'postMeridiem-' + idSuffix\">PM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#postMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'postMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-post-input\"\n\t\t\t\t\t\tvalue=\"PM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t@if (displayArrows()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-width: 1.5rem;--components-timepicker-padding: 0;--components-timepicker-paddingInput-inline: var(--pr-t-spacings-50);--components-timepicker-paddingInput-block: var(--pr-t-spacings-100);--components-timepicker-separator-left: 2.375rem;padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-product-700);outline-offset:3px}.timePicker-fieldset-groupSeparator{pointer-events:none;display:grid;place-items:center;text-align:center;inline-size:var(--pr-t-spacings-200);margin-block:0;margin-inline:calc(var(--pr-t-spacings-100) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1)}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:var(--components-timepicker-input-width);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-paddingInput-inline);padding-inline:var(--components-timepicker-paddingInput-block);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset:var(--components-timepicker-paddingInput-inline) var(--components-timepicker-paddingInput-block);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{inline-size:calc(var(--components-timepicker-input-width) + var(--components-timepicker-paddingInput-block) * 2);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset:var(--components-timepicker-paddingInput-inline) var(--components-timepicker-paddingInput-block);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip:rect(1px,1px,1px,1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-paddingInput-inline: var(--pr-t-spacings-25);--components-timepicker-paddingInput-block: var(--pr-t-spacings-75);--components-timepicker-input-height: 1.75rem;--components-timepicker-input-width: 1.25rem;--components-timepicker-separator-left: 1.875rem}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-picker{display:inline-flex}}\n"], dependencies: [{ kind: "component", type: TimePickerPartComponent, selector: "lu-time-picker-part", inputs: ["label", "decimalConf", "value", "display", "max", "displayArrows", "isReadonly", "hideValue", "disabled", "focused"], outputs: ["valueChange", "prevRequest", "nextRequest", "inputControlClick", "touched"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { 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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImport: i0, type: TimePickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TimePickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-time-picker', imports: [TimePickerPartComponent, NgClass, FormsModule, RepeatOnHoldDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         {
@@ -872,7 +860,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.2", ngImpor
                             multi: true,
                         },
                     ], template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl.timePickerHours\"\n\t\t\t[value]=\"hours()\"\n\t\t\t[display]=\"hoursDisplay()\"\n\t\t\t[max]=\"maxHours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" class=\"timePicker-fieldset-groupSeparator\">{{ separator }}</div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl.timePickerMinutes\"\n\t\t\t[value]=\"minutesDisplay()\"\n\t\t\t[max]=\"59\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(nextRequest)=\"focusPart('meridiem')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t/>\n\t\t@if (enableMeridiemDisplay()) {\n\t\t\t<div\n\t\t\t\tclass=\"timePicker-fieldset-meridiem\"\n\t\t\t\t(copy)=\"copyHandler($event)\"\n\t\t\t\t(paste)=\"pasteHandler($event)\"\n\t\t\t\t(keydown.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(click)=\"ampmDisplay() === 'AM' ? anteMeridiemRef.focus() : postMeridiemRef.focus()\"\n\t\t\t>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-ante\">\n\t\t\t\t\t<label [attr.for]=\"'anteMeridiem-' + idSuffix\">AM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#anteMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'anteMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-ante-input\"\n\t\t\t\t\t\tvalue=\"AM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-post\">\n\t\t\t\t\t<label [attr.for]=\"'postMeridiem-' + idSuffix\">PM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#postMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'postMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-post-input\"\n\t\t\t\t\t\tvalue=\"PM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t@if (displayArrows()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-width: 1.5rem;--components-timepicker-padding: 0;--components-timepicker-paddingInput-inline: var(--pr-t-spacings-50);--components-timepicker-paddingInput-block: var(--pr-t-spacings-100);--components-timepicker-separator-left: 2.375rem;padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-product-700);outline-offset:3px}.timePicker-fieldset-groupSeparator{pointer-events:none;display:grid;place-items:center;text-align:center;inline-size:var(--pr-t-spacings-200);margin-block:0;margin-inline:calc(var(--pr-t-spacings-100) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1)}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:var(--components-timepicker-input-width);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-paddingInput-inline);padding-inline:var(--components-timepicker-paddingInput-block);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset:var(--components-timepicker-paddingInput-inline) var(--components-timepicker-paddingInput-block);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{inline-size:calc(var(--components-timepicker-input-width) + var(--components-timepicker-paddingInput-block) * 2);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset:var(--components-timepicker-paddingInput-inline) var(--components-timepicker-paddingInput-block);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip:rect(1px,1px,1px,1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-paddingInput-inline: var(--pr-t-spacings-25);--components-timepicker-paddingInput-block: var(--pr-t-spacings-75);--components-timepicker-input-height: 1.75rem;--components-timepicker-input-width: 1.25rem;--components-timepicker-separator-left: 1.875rem}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-picker{display:inline-flex}}\n"] }]
-        }] });
+        }], propDecorators: { anteMeridiemRef: [{ type: i0.ViewChild, args: ['anteMeridiemRef', { isSignal: true }] }], postMeridiemRef: [{ type: i0.ViewChild, args: ['postMeridiemRef', { isSignal: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], displayArrows: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayArrows", required: false }] }], forceMeridiemDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "forceMeridiemDisplay", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], timeChange: [{ type: i0.Output, args: ["timeChange"] }] } });
 
 /**
  * Generated bundle index. Do not edit.