structra-ui 0.1.50 → 0.1.51

package/fesm2022/structra-ui.mjs

@@ -369,10 +369,10 @@ class BaseFieldDirective {
         this.clearable = true;
         this.clearAriaLabel = 'Limpar campo';
         /**
-         * Se `true`, o navegador pode exibir sugestões de preenchimento automático.
-         * Padrão `false` (`autocomplete="off"` em todos os campos).
+         * Se `true`, o atributo HTML fica `autocomplete="on"` (sugestões do browser).
+         * `false` → `autocomplete="off"`. Padrão `true`.
          */
-        this.autocomplete = false;
+        this.autocomplete = true;
         /** Placeholder de carregamento no `app-base-field` (skeleton). */
         this.loading = false;
         /**
@@ -508,7 +508,7 @@ class BaseFieldDirective {
         this.cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.2.9", type: BaseFieldDirective, isStandalone: true, inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", errorMessage: "errorMessage", showErrorMessage: "showErrorMessage", required: "required", showRequiredMark: "showRequiredMark", readonly: "readonly", showPrefixIcon: "showPrefixIcon", prefixIcon: "prefixIcon", iconLeft: "iconLeft", clearable: "clearable", clearAriaLabel: "clearAriaLabel", autocomplete: "autocomplete", loading: ["loading", "loading", booleanAttribute], mostrarMenuContexto: ["mostrarMenuContexto", "mostrarMenuContexto", booleanAttribute], contextMenuItems: "contextMenuItems", contextMenuId: "contextMenuId" }, outputs: { contextMenuSelect: "contextMenuSelect" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.2.9", type: BaseFieldDirective, isStandalone: true, inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", errorMessage: "errorMessage", showErrorMessage: "showErrorMessage", required: "required", showRequiredMark: "showRequiredMark", readonly: "readonly", showPrefixIcon: "showPrefixIcon", prefixIcon: "prefixIcon", iconLeft: "iconLeft", clearable: "clearable", clearAriaLabel: "clearAriaLabel", autocomplete: ["autocomplete", "autocomplete", booleanAttribute], loading: ["loading", "loading", booleanAttribute], mostrarMenuContexto: ["mostrarMenuContexto", "mostrarMenuContexto", booleanAttribute], contextMenuItems: "contextMenuItems", contextMenuId: "contextMenuId" }, outputs: { contextMenuSelect: "contextMenuSelect" }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFieldDirective, decorators: [{
             type: Directive
@@ -542,7 +542,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
             }], clearAriaLabel: [{
                 type: Input
             }], autocomplete: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], loading: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
@@ -1461,11 +1462,11 @@ class BaseFieldComponent {
         this.contextMenuSelect.emit(id);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: BaseFieldComponent, isStandalone: true, selector: "app-base-field", inputs: { label: "label", errorMessage: "errorMessage", required: "required", showRequiredMark: "showRequiredMark", invalid: "invalid", filled: "filled", disabled: "disabled", readonly: "readonly", inputId: "inputId", errorId: "errorId", showPrefixIcon: "showPrefixIcon", prefixIcon: "prefixIcon", clearable: "clearable", clearAriaLabel: "clearAriaLabel", showSuffixSlot: "showSuffixSlot", valueAlignEnd: "valueAlignEnd", loading: ["loading", "loading", booleanAttribute], skeletonVariant: "skeletonVariant", mostrarMenuContexto: ["mostrarMenuContexto", "mostrarMenuContexto", booleanAttribute], contextMenuItems: "contextMenuItems", contextMenuId: "contextMenuId" }, outputs: { clear: "clear", contextMenuSelect: "contextMenuSelect" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"base-field\" [class.base-field--invalid]=\"invalid\" [class.base-field--filled]=\"filled\"\n  [class.base-field--disabled]=\"disabled\" [class.base-field--readonly]=\"readonly\"\n  [class.base-field--loading]=\"loading\" [attr.aria-busy]=\"loading ? true : null\"\n  [attr.aria-label]=\"loading && showFloatTpl ? label : null\">\n  <div class=\"base-field__box\">\n    <div class=\"base-field__prefix\">\n      @if (!loading) {\n      <ng-content select=\"[appFieldPrefix]\" />\n      }\n      @if (showFaTpl) {\n      <i [attr.class]=\"prefixIconClassTpl + (loading ? ' base-field__prefix-icon--loading-dim' : '')\"\n        aria-hidden=\"true\"></i>\n      }\n    </div>\n\n    <div class=\"base-field__field\">\n      @if (showFloatTpl && !loading) {\n      <label class=\"base-field__float-label\" [attr.for]=\"inputId || null\">\n        {{ label }}\n        @if (required && showRequiredMark) {\n        <span class=\"base-field__required\" aria-hidden=\"true\">*</span>\n        }\n      </label>\n      }\n\n      <div class=\"base-field__control\" [class.base-field__control--value-end]=\"valueAlignEnd\">\n        @if (!loading) {\n        <ng-content />\n        } @else {\n        <app-skeleton-field-shell [variant]=\"skeletonVariant\" [showLeadingIcon]=\"!showFaTpl\" />\n        }\n      </div>\n    </div>\n\n    @if (showSuffixTpl) {\n    <div class=\"base-field__suffix\" [class.base-field__suffix--loading]=\"loading\">\n      @if (!loading) {\n      @if (showCtxMenuTpl) {\n      <app-dropdown-menu\n        class=\"base-field__ctx-dropdown\"\n        [items]=\"contextMenuItems\"\n        [minWidthPx]=\"200\"\n        [matchTriggerWidth]=\"false\"\n        [menuId]=\"resolvedContextMenuId\"\n        (itemSelect)=\"onContextMenuItemSelect($event)\"\n      >\n        <button type=\"button\" class=\"base-field__ctx-trigger\" aria-label=\"Mais op\u00E7\u00F5es\" tabindex=\"-1\">\n          <i class=\"fa-solid fa-ellipsis\" aria-hidden=\"true\"></i>\n        </button>\n      </app-dropdown-menu>\n      }\n      @if (showSuffixSlot) {\n      <ng-content select=\"[appFieldSuffix]\" />\n      }\n      @if (showClearTpl) {\n      <button type=\"button\" class=\"base-field__clear\" tabindex=\"-1\" [attr.aria-label]=\"clearAriaLabel\"\n        (click)=\"onClearClick()\">\n        <span class=\"base-field__clear-x\" aria-hidden=\"true\">&times;</span>\n      </button>\n      }\n      } @else if (loading && showSuffixSlot) {\n      <span class=\"base-field__suffix-reserve\" aria-hidden=\"true\"></span>\n      }\n    </div>\n    }\n  </div>\n\n  @if (!loading && showErrorTpl) {\n  <p class=\"base-field__error\" [id]=\"errorId || null\" role=\"alert\">\n    {{ errorMessage }}\n  </p>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;box-sizing:border-box}.base-field{display:flex;flex-direction:column;gap:.35rem;width:100%;max-width:100%;box-sizing:border-box}.base-field--loading .base-field__box{pointer-events:none}.base-field--loading .base-field__field{justify-content:center}.base-field--loading .base-field__control{display:flex;align-items:center;width:100%;min-height:0}.base-field__box{display:flex;align-items:stretch;width:100%;min-width:0;border:1px solid var(--ui-field-float-border);border-radius:var(--ui-field-float-border-radius);background:var(--ui-field-float-bg);transition:border-color .1s ease,box-shadow .1s ease;contain:layout}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}.base-field--readonly:not(.base-field--disabled) .base-field__box{background:var(--ui-field-readonly-bg);border-color:var(--ui-field-readonly-border)}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}.base-field--invalid .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--readonly.base-field--invalid:not(.base-field--disabled) .base-field__box{background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--invalid:not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--disabled .base-field__box{opacity:var(--ui-field-input-disabled-opacity)}.base-field__prefix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-left:.75rem;color:var(--ui-field-float-prefix-color);user-select:none;-webkit-user-select:none}.base-field__prefix:empty{display:none}.base-field__prefix-icon{font-style:normal;font-size:1rem;line-height:1;color:var(--ui-field-float-prefix-color)}.base-field__prefix-icon--loading-dim{opacity:.34;pointer-events:none}.base-field__suffix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-right:.4rem;padding-left:.1rem}.base-field__ctx-dropdown{display:inline-flex;flex-shrink:0;align-items:center;max-width:100%}.base-field__ctx-trigger{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__ctx-trigger:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-top-color)}.base-field__ctx-trigger:focus,.base-field__ctx-trigger:focus-visible{outline:none}.base-field__clear{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__clear:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-top-color)}.base-field__clear:focus,.base-field__clear:focus-visible{outline:none}.base-field__clear-x{font-size:1.35rem;line-height:1;font-weight:300}.base-field--invalid .base-field__prefix,.base-field--invalid .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__prefix-icon:before{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__suffix,.base-field--invalid .base-field__clear,.base-field--invalid .base-field__ctx-trigger{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__clear:hover,.base-field--invalid .base-field__ctx-trigger:hover{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));color:var(--ui-field-float-label-invalid-color)}.base-field__field{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;contain:layout style}.base-field__float-label{position:absolute;left:.75rem;right:.75rem;top:.45rem;transform:translate3d(0,calc((1.8rem + 1.35em)/2 - .45rem - .6em),0) scale(1);transform-origin:left top;font-size:1rem;font-weight:400;line-height:1.2;color:var(--ui-field-float-label-color);pointer-events:none;user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .11s cubic-bezier(.4,0,.2,1),color .11s ease}@media(prefers-reduced-motion:reduce){.base-field__float-label{transition:none}}.base-field__box:focus-within .base-field__float-label,.base-field--filled .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:500;color:var(--ui-field-float-label-top-color)}.base-field--invalid .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--filled .base-field__float-label,.base-field--invalid .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field__required{color:var(--ui-field-required-mark-color);margin-left:.15rem}.base-field--invalid .base-field__required{color:var(--ui-field-float-label-invalid-color)}.base-field__control{display:block;width:100%;min-width:0}.base-field__suffix-reserve{display:block;flex-shrink:0;width:2rem;height:2rem;margin:0 .1rem;box-sizing:border-box}.base-field__control--value-end :where(input){text-align:right}.base-field--readonly:not(.base-field--disabled) .base-field__float-label{color:var(--ui-field-readonly-label-color)}.base-field--readonly.base-field--filled .base-field__float-label,.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-readonly-label-top-color)}.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-readonly-prefix-color)}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea){color:var(--ui-field-readonly-input-text)}.base-field--invalid.base-field--readonly .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--filled .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field__error{margin:0;padding-left:.15rem;font-size:.75rem;color:var(--ui-field-error-text-color);user-select:none;-webkit-user-select:none}\n"], dependencies: [{ kind: "component", type: SkeletonFieldShellComponent, selector: "app-skeleton-field-shell", inputs: ["variant", "animate", "showLeadingIcon"] }, { kind: "component", type: DropdownMenuComponent, selector: "app-dropdown-menu", inputs: ["items", "placement", "minWidthPx", "matchTriggerWidth", "menuId"], outputs: ["itemSelect", "openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: BaseFieldComponent, isStandalone: true, selector: "app-base-field", inputs: { label: "label", errorMessage: "errorMessage", required: "required", showRequiredMark: "showRequiredMark", invalid: "invalid", filled: "filled", disabled: "disabled", readonly: "readonly", inputId: "inputId", errorId: "errorId", showPrefixIcon: "showPrefixIcon", prefixIcon: "prefixIcon", clearable: "clearable", clearAriaLabel: "clearAriaLabel", showSuffixSlot: "showSuffixSlot", valueAlignEnd: "valueAlignEnd", loading: ["loading", "loading", booleanAttribute], skeletonVariant: "skeletonVariant", mostrarMenuContexto: ["mostrarMenuContexto", "mostrarMenuContexto", booleanAttribute], contextMenuItems: "contextMenuItems", contextMenuId: "contextMenuId" }, outputs: { clear: "clear", contextMenuSelect: "contextMenuSelect" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"base-field\" [class.base-field--invalid]=\"invalid\" [class.base-field--filled]=\"filled\"\n  [class.base-field--disabled]=\"disabled\" [class.base-field--readonly]=\"readonly\"\n  [class.base-field--loading]=\"loading\" [attr.aria-busy]=\"loading ? true : null\"\n  [attr.aria-label]=\"loading && showFloatTpl ? label : null\">\n  <div class=\"base-field__box\">\n    <div class=\"base-field__prefix\">\n      @if (!loading) {\n      <ng-content select=\"[appFieldPrefix]\" />\n      }\n      @if (showFaTpl) {\n      <i [attr.class]=\"prefixIconClassTpl + (loading ? ' base-field__prefix-icon--loading-dim' : '')\"\n        aria-hidden=\"true\"></i>\n      }\n    </div>\n\n    <div class=\"base-field__field\">\n      @if (showFloatTpl && !loading) {\n      <label class=\"base-field__float-label\" [attr.for]=\"inputId || null\">\n        {{ label }}\n        @if (required && showRequiredMark) {\n        <span class=\"base-field__required\" aria-hidden=\"true\">*</span>\n        }\n      </label>\n      }\n\n      <div class=\"base-field__control\" [class.base-field__control--value-end]=\"valueAlignEnd\">\n        @if (!loading) {\n        <ng-content />\n        } @else {\n        <app-skeleton-field-shell [variant]=\"skeletonVariant\" [showLeadingIcon]=\"!showFaTpl\" />\n        }\n      </div>\n    </div>\n\n    @if (showSuffixTpl) {\n    <div class=\"base-field__suffix\" [class.base-field__suffix--loading]=\"loading\">\n      @if (!loading) {\n      @if (showCtxMenuTpl) {\n      <app-dropdown-menu\n        class=\"base-field__ctx-dropdown\"\n        [items]=\"contextMenuItems\"\n        [minWidthPx]=\"200\"\n        [matchTriggerWidth]=\"false\"\n        [menuId]=\"resolvedContextMenuId\"\n        (itemSelect)=\"onContextMenuItemSelect($event)\"\n      >\n        <button type=\"button\" class=\"base-field__ctx-trigger\" aria-label=\"Mais op\u00E7\u00F5es\" tabindex=\"-1\">\n          <i class=\"fa-solid fa-ellipsis\" aria-hidden=\"true\"></i>\n        </button>\n      </app-dropdown-menu>\n      }\n      @if (showSuffixSlot) {\n      <ng-content select=\"[appFieldSuffix]\" />\n      }\n      @if (showClearTpl) {\n      <button type=\"button\" class=\"base-field__clear\" tabindex=\"-1\" [attr.aria-label]=\"clearAriaLabel\"\n        (click)=\"onClearClick()\">\n        <span class=\"base-field__clear-x\" aria-hidden=\"true\">&times;</span>\n      </button>\n      }\n      } @else if (loading && showSuffixSlot) {\n      <span class=\"base-field__suffix-reserve\" aria-hidden=\"true\"></span>\n      }\n    </div>\n    }\n  </div>\n\n  @if (!loading && showErrorTpl) {\n  <p class=\"base-field__error\" [id]=\"errorId || null\" role=\"alert\">\n    {{ errorMessage }}\n  </p>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;box-sizing:border-box}.base-field{display:flex;flex-direction:column;gap:.35rem;width:100%;max-width:100%;box-sizing:border-box}.base-field--loading .base-field__box{pointer-events:none}.base-field--loading .base-field__field{justify-content:center}.base-field--loading .base-field__control{display:flex;align-items:center;width:100%;min-height:0}.base-field__box{display:flex;align-items:stretch;width:100%;min-width:0;border:1px solid var(--ui-field-float-border);border-radius:var(--ui-field-float-border-radius);background:var(--ui-field-float-bg);transition:border-color .1s ease,box-shadow .1s ease;contain:layout}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}.base-field--readonly:not(.base-field--disabled) .base-field__box{background:var(--ui-field-readonly-bg);border-color:var(--ui-field-readonly-border)}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}.base-field--invalid .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--readonly.base-field--invalid:not(.base-field--disabled) .base-field__box{background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--invalid:not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--disabled .base-field__box{opacity:var(--ui-field-input-disabled-opacity)}.base-field__prefix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-left:.75rem;color:var(--ui-field-float-prefix-color);user-select:none;-webkit-user-select:none}.base-field__prefix:empty{display:none}.base-field__prefix-icon{font-style:normal;font-size:1rem;line-height:1;color:var(--ui-field-float-prefix-color)}.base-field__prefix-icon--loading-dim{opacity:.34;pointer-events:none}.base-field__suffix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-right:.4rem;padding-left:.1rem}.base-field__ctx-dropdown{display:inline-flex;flex-shrink:0;align-items:center;max-width:100%}.base-field__ctx-trigger{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__ctx-trigger:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-top-color)}.base-field__ctx-trigger:focus,.base-field__ctx-trigger:focus-visible{outline:none}.base-field__clear{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__clear:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-top-color)}.base-field__clear:focus,.base-field__clear:focus-visible{outline:none}.base-field__clear-x{font-size:1.35rem;line-height:1;font-weight:300}.base-field--invalid .base-field__prefix,.base-field--invalid .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__prefix-icon:before{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__suffix,.base-field--invalid .base-field__clear,.base-field--invalid .base-field__ctx-trigger{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__clear:hover,.base-field--invalid .base-field__ctx-trigger:hover{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));color:var(--ui-field-float-label-invalid-color)}.base-field__field{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;contain:layout style}.base-field__float-label{position:absolute;left:.75rem;right:.75rem;top:.45rem;transform:translate3d(0,calc((1.8rem + 1.35em)/2 - .45rem - .6em),0) scale(1);transform-origin:left top;font-size:1rem;font-weight:400;line-height:1.2;color:var(--ui-field-float-label-color);pointer-events:none;user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .11s cubic-bezier(.4,0,.2,1),color .11s ease}@media(prefers-reduced-motion:reduce){.base-field__float-label{transition:none}}.base-field__box:focus-within .base-field__float-label,.base-field--filled .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:500;color:var(--ui-field-float-label-top-color)}.base-field--invalid .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--filled .base-field__float-label,.base-field--invalid .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field__required{color:var(--ui-field-required-mark-color);margin-left:.15rem}.base-field--invalid .base-field__required{color:var(--ui-field-float-label-invalid-color)}.base-field__control{display:block;width:100%;min-width:0}.base-field__suffix-reserve{display:block;flex-shrink:0;width:2rem;height:2rem;margin:0 .1rem;box-sizing:border-box}.base-field__control--value-end :where(input){text-align:right}.base-field--readonly:not(.base-field--disabled) .base-field__float-label{color:var(--ui-field-readonly-label-color)}.base-field--readonly.base-field--filled .base-field__float-label,.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-readonly-label-top-color)}.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-readonly-prefix-color)}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea){color:var(--ui-field-readonly-input-text)}.base-field--invalid.base-field--readonly .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--filled .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field__error{margin:0;padding-left:.15rem;font-size:.75rem;color:var(--ui-field-error-text-color);user-select:none;-webkit-user-select:none}.base-field__control :where(input,textarea):-webkit-autofill,.base-field__control :where(input,textarea):-webkit-autofill:hover,.base-field__control :where(input,textarea):-webkit-autofill:focus,.base-field__control :where(input,textarea):-webkit-autofill:active{-webkit-text-fill-color:var(--ui-field-float-input-text);caret-color:var(--ui-field-float-input-text);box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset;transition:background-color 50000s ease-in-out 0s}.base-field--invalid:not(.base-field--readonly) .base-field__control :where(input,textarea):-webkit-autofill,.base-field--invalid:not(.base-field--readonly) .base-field__control :where(input,textarea):-webkit-autofill:hover,.base-field--invalid:not(.base-field--readonly) .base-field__control :where(input,textarea):-webkit-autofill:focus,.base-field--invalid:not(.base-field--readonly) .base-field__control :where(input,textarea):-webkit-autofill:active{-webkit-text-fill-color:var(--ui-field-float-input-text);box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea):-webkit-autofill,.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea):-webkit-autofill:hover,.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea):-webkit-autofill:focus,.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea):-webkit-autofill:active{-webkit-text-fill-color:var(--ui-field-readonly-input-text);box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset}\n"], dependencies: [{ kind: "component", type: SkeletonFieldShellComponent, selector: "app-skeleton-field-shell", inputs: ["variant", "animate", "showLeadingIcon"] }, { kind: "component", type: DropdownMenuComponent, selector: "app-dropdown-menu", inputs: ["items", "placement", "minWidthPx", "matchTriggerWidth", "menuId"], outputs: ["itemSelect", "openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-base-field', imports: [SkeletonFieldShellComponent, DropdownMenuComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"base-field\" [class.base-field--invalid]=\"invalid\" [class.base-field--filled]=\"filled\"\n  [class.base-field--disabled]=\"disabled\" [class.base-field--readonly]=\"readonly\"\n  [class.base-field--loading]=\"loading\" [attr.aria-busy]=\"loading ? true : null\"\n  [attr.aria-label]=\"loading && showFloatTpl ? label : null\">\n  <div class=\"base-field__box\">\n    <div class=\"base-field__prefix\">\n      @if (!loading) {\n      <ng-content select=\"[appFieldPrefix]\" />\n      }\n      @if (showFaTpl) {\n      <i [attr.class]=\"prefixIconClassTpl + (loading ? ' base-field__prefix-icon--loading-dim' : '')\"\n        aria-hidden=\"true\"></i>\n      }\n    </div>\n\n    <div class=\"base-field__field\">\n      @if (showFloatTpl && !loading) {\n      <label class=\"base-field__float-label\" [attr.for]=\"inputId || null\">\n        {{ label }}\n        @if (required && showRequiredMark) {\n        <span class=\"base-field__required\" aria-hidden=\"true\">*</span>\n        }\n      </label>\n      }\n\n      <div class=\"base-field__control\" [class.base-field__control--value-end]=\"valueAlignEnd\">\n        @if (!loading) {\n        <ng-content />\n        } @else {\n        <app-skeleton-field-shell [variant]=\"skeletonVariant\" [showLeadingIcon]=\"!showFaTpl\" />\n        }\n      </div>\n    </div>\n\n    @if (showSuffixTpl) {\n    <div class=\"base-field__suffix\" [class.base-field__suffix--loading]=\"loading\">\n      @if (!loading) {\n      @if (showCtxMenuTpl) {\n      <app-dropdown-menu\n        class=\"base-field__ctx-dropdown\"\n        [items]=\"contextMenuItems\"\n        [minWidthPx]=\"200\"\n        [matchTriggerWidth]=\"false\"\n        [menuId]=\"resolvedContextMenuId\"\n        (itemSelect)=\"onContextMenuItemSelect($event)\"\n      >\n        <button type=\"button\" class=\"base-field__ctx-trigger\" aria-label=\"Mais op\u00E7\u00F5es\" tabindex=\"-1\">\n          <i class=\"fa-solid fa-ellipsis\" aria-hidden=\"true\"></i>\n        </button>\n      </app-dropdown-menu>\n      }\n      @if (showSuffixSlot) {\n      <ng-content select=\"[appFieldSuffix]\" />\n      }\n      @if (showClearTpl) {\n      <button type=\"button\" class=\"base-field__clear\" tabindex=\"-1\" [attr.aria-label]=\"clearAriaLabel\"\n        (click)=\"onClearClick()\">\n        <span class=\"base-field__clear-x\" aria-hidden=\"true\">&times;</span>\n      </button>\n      }\n      } @else if (loading && showSuffixSlot) {\n      <span class=\"base-field__suffix-reserve\" aria-hidden=\"true\"></span>\n      }\n    </div>\n    }\n  </div>\n\n  @if (!loading && showErrorTpl) {\n  <p class=\"base-field__error\" [id]=\"errorId || null\" role=\"alert\">\n    {{ errorMessage }}\n  </p>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;box-sizing:border-box}.base-field{display:flex;flex-direction:column;gap:.35rem;width:100%;max-width:100%;box-sizing:border-box}.base-field--loading .base-field__box{pointer-events:none}.base-field--loading .base-field__field{justify-content:center}.base-field--loading .base-field__control{display:flex;align-items:center;width:100%;min-height:0}.base-field__box{display:flex;align-items:stretch;width:100%;min-width:0;border:1px solid var(--ui-field-float-border);border-radius:var(--ui-field-float-border-radius);background:var(--ui-field-float-bg);transition:border-color .1s ease,box-shadow .1s ease;contain:layout}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}.base-field--readonly:not(.base-field--disabled) .base-field__box{background:var(--ui-field-readonly-bg);border-color:var(--ui-field-readonly-border)}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}.base-field--invalid .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--readonly.base-field--invalid:not(.base-field--disabled) .base-field__box{background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--invalid:not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--disabled .base-field__box{opacity:var(--ui-field-input-disabled-opacity)}.base-field__prefix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-left:.75rem;color:var(--ui-field-float-prefix-color);user-select:none;-webkit-user-select:none}.base-field__prefix:empty{display:none}.base-field__prefix-icon{font-style:normal;font-size:1rem;line-height:1;color:var(--ui-field-float-prefix-color)}.base-field__prefix-icon--loading-dim{opacity:.34;pointer-events:none}.base-field__suffix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-right:.4rem;padding-left:.1rem}.base-field__ctx-dropdown{display:inline-flex;flex-shrink:0;align-items:center;max-width:100%}.base-field__ctx-trigger{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__ctx-trigger:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-top-color)}.base-field__ctx-trigger:focus,.base-field__ctx-trigger:focus-visible{outline:none}.base-field__clear{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__clear:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-top-color)}.base-field__clear:focus,.base-field__clear:focus-visible{outline:none}.base-field__clear-x{font-size:1.35rem;line-height:1;font-weight:300}.base-field--invalid .base-field__prefix,.base-field--invalid .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__prefix-icon:before{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__suffix,.base-field--invalid .base-field__clear,.base-field--invalid .base-field__ctx-trigger{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__clear:hover,.base-field--invalid .base-field__ctx-trigger:hover{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));color:var(--ui-field-float-label-invalid-color)}.base-field__field{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;contain:layout style}.base-field__float-label{position:absolute;left:.75rem;right:.75rem;top:.45rem;transform:translate3d(0,calc((1.8rem + 1.35em)/2 - .45rem - .6em),0) scale(1);transform-origin:left top;font-size:1rem;font-weight:400;line-height:1.2;color:var(--ui-field-float-label-color);pointer-events:none;user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .11s cubic-bezier(.4,0,.2,1),color .11s ease}@media(prefers-reduced-motion:reduce){.base-field__float-label{transition:none}}.base-field__box:focus-within .base-field__float-label,.base-field--filled .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:500;color:var(--ui-field-float-label-top-color)}.base-field--invalid .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--filled .base-field__float-label,.base-field--invalid .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field__required{color:var(--ui-field-required-mark-color);margin-left:.15rem}.base-field--invalid .base-field__required{color:var(--ui-field-float-label-invalid-color)}.base-field__control{display:block;width:100%;min-width:0}.base-field__suffix-reserve{display:block;flex-shrink:0;width:2rem;height:2rem;margin:0 .1rem;box-sizing:border-box}.base-field__control--value-end :where(input){text-align:right}.base-field--readonly:not(.base-field--disabled) .base-field__float-label{color:var(--ui-field-readonly-label-color)}.base-field--readonly.base-field--filled .base-field__float-label,.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-readonly-label-top-color)}.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-readonly-prefix-color)}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea){color:var(--ui-field-readonly-input-text)}.base-field--invalid.base-field--readonly .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--filled .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field__error{margin:0;padding-left:.15rem;font-size:.75rem;color:var(--ui-field-error-text-color);user-select:none;-webkit-user-select:none}\n"] }]
+            args: [{ selector: 'app-base-field', imports: [SkeletonFieldShellComponent, DropdownMenuComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"base-field\" [class.base-field--invalid]=\"invalid\" [class.base-field--filled]=\"filled\"\n  [class.base-field--disabled]=\"disabled\" [class.base-field--readonly]=\"readonly\"\n  [class.base-field--loading]=\"loading\" [attr.aria-busy]=\"loading ? true : null\"\n  [attr.aria-label]=\"loading && showFloatTpl ? label : null\">\n  <div class=\"base-field__box\">\n    <div class=\"base-field__prefix\">\n      @if (!loading) {\n      <ng-content select=\"[appFieldPrefix]\" />\n      }\n      @if (showFaTpl) {\n      <i [attr.class]=\"prefixIconClassTpl + (loading ? ' base-field__prefix-icon--loading-dim' : '')\"\n        aria-hidden=\"true\"></i>\n      }\n    </div>\n\n    <div class=\"base-field__field\">\n      @if (showFloatTpl && !loading) {\n      <label class=\"base-field__float-label\" [attr.for]=\"inputId || null\">\n        {{ label }}\n        @if (required && showRequiredMark) {\n        <span class=\"base-field__required\" aria-hidden=\"true\">*</span>\n        }\n      </label>\n      }\n\n      <div class=\"base-field__control\" [class.base-field__control--value-end]=\"valueAlignEnd\">\n        @if (!loading) {\n        <ng-content />\n        } @else {\n        <app-skeleton-field-shell [variant]=\"skeletonVariant\" [showLeadingIcon]=\"!showFaTpl\" />\n        }\n      </div>\n    </div>\n\n    @if (showSuffixTpl) {\n    <div class=\"base-field__suffix\" [class.base-field__suffix--loading]=\"loading\">\n      @if (!loading) {\n      @if (showCtxMenuTpl) {\n      <app-dropdown-menu\n        class=\"base-field__ctx-dropdown\"\n        [items]=\"contextMenuItems\"\n        [minWidthPx]=\"200\"\n        [matchTriggerWidth]=\"false\"\n        [menuId]=\"resolvedContextMenuId\"\n        (itemSelect)=\"onContextMenuItemSelect($event)\"\n      >\n        <button type=\"button\" class=\"base-field__ctx-trigger\" aria-label=\"Mais op\u00E7\u00F5es\" tabindex=\"-1\">\n          <i class=\"fa-solid fa-ellipsis\" aria-hidden=\"true\"></i>\n        </button>\n      </app-dropdown-menu>\n      }\n      @if (showSuffixSlot) {\n      <ng-content select=\"[appFieldSuffix]\" />\n      }\n      @if (showClearTpl) {\n      <button type=\"button\" class=\"base-field__clear\" tabindex=\"-1\" [attr.aria-label]=\"clearAriaLabel\"\n        (click)=\"onClearClick()\">\n        <span class=\"base-field__clear-x\" aria-hidden=\"true\">&times;</span>\n      </button>\n      }\n      } @else if (loading && showSuffixSlot) {\n      <span class=\"base-field__suffix-reserve\" aria-hidden=\"true\"></span>\n      }\n    </div>\n    }\n  </div>\n\n  @if (!loading && showErrorTpl) {\n  <p class=\"base-field__error\" [id]=\"errorId || null\" role=\"alert\">\n    {{ errorMessage }}\n  </p>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;box-sizing:border-box}.base-field{display:flex;flex-direction:column;gap:.35rem;width:100%;max-width:100%;box-sizing:border-box}.base-field--loading .base-field__box{pointer-events:none}.base-field--loading .base-field__field{justify-content:center}.base-field--loading .base-field__control{display:flex;align-items:center;width:100%;min-height:0}.base-field__box{display:flex;align-items:stretch;width:100%;min-width:0;border:1px solid var(--ui-field-float-border);border-radius:var(--ui-field-float-border-radius);background:var(--ui-field-float-bg);transition:border-color .1s ease,box-shadow .1s ease;contain:layout}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}.base-field--readonly:not(.base-field--disabled) .base-field__box{background:var(--ui-field-readonly-bg);border-color:var(--ui-field-readonly-border)}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}.base-field--invalid .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--readonly.base-field--invalid:not(.base-field--disabled) .base-field__box{background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--invalid:not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--disabled .base-field__box{opacity:var(--ui-field-input-disabled-opacity)}.base-field__prefix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-left:.75rem;color:var(--ui-field-float-prefix-color);user-select:none;-webkit-user-select:none}.base-field__prefix:empty{display:none}.base-field__prefix-icon{font-style:normal;font-size:1rem;line-height:1;color:var(--ui-field-float-prefix-color)}.base-field__prefix-icon--loading-dim{opacity:.34;pointer-events:none}.base-field__suffix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-right:.4rem;padding-left:.1rem}.base-field__ctx-dropdown{display:inline-flex;flex-shrink:0;align-items:center;max-width:100%}.base-field__ctx-trigger{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__ctx-trigger:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-top-color)}.base-field__ctx-trigger:focus,.base-field__ctx-trigger:focus-visible{outline:none}.base-field__clear{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__clear:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-top-color)}.base-field__clear:focus,.base-field__clear:focus-visible{outline:none}.base-field__clear-x{font-size:1.35rem;line-height:1;font-weight:300}.base-field--invalid .base-field__prefix,.base-field--invalid .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__prefix-icon:before{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__suffix,.base-field--invalid .base-field__clear,.base-field--invalid .base-field__ctx-trigger{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__clear:hover,.base-field--invalid .base-field__ctx-trigger:hover{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));color:var(--ui-field-float-label-invalid-color)}.base-field__field{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;contain:layout style}.base-field__float-label{position:absolute;left:.75rem;right:.75rem;top:.45rem;transform:translate3d(0,calc((1.8rem + 1.35em)/2 - .45rem - .6em),0) scale(1);transform-origin:left top;font-size:1rem;font-weight:400;line-height:1.2;color:var(--ui-field-float-label-color);pointer-events:none;user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .11s cubic-bezier(.4,0,.2,1),color .11s ease}@media(prefers-reduced-motion:reduce){.base-field__float-label{transition:none}}.base-field__box:focus-within .base-field__float-label,.base-field--filled .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:500;color:var(--ui-field-float-label-top-color)}.base-field--invalid .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--filled .base-field__float-label,.base-field--invalid .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field__required{color:var(--ui-field-required-mark-color);margin-left:.15rem}.base-field--invalid .base-field__required{color:var(--ui-field-float-label-invalid-color)}.base-field__control{display:block;width:100%;min-width:0}.base-field__suffix-reserve{display:block;flex-shrink:0;width:2rem;height:2rem;margin:0 .1rem;box-sizing:border-box}.base-field__control--value-end :where(input){text-align:right}.base-field--readonly:not(.base-field--disabled) .base-field__float-label{color:var(--ui-field-readonly-label-color)}.base-field--readonly.base-field--filled .base-field__float-label,.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-readonly-label-top-color)}.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-readonly-prefix-color)}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea){color:var(--ui-field-readonly-input-text)}.base-field--invalid.base-field--readonly .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--filled .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field__error{margin:0;padding-left:.15rem;font-size:.75rem;color:var(--ui-field-error-text-color);user-select:none;-webkit-user-select:none}.base-field__control :where(input,textarea):-webkit-autofill,.base-field__control :where(input,textarea):-webkit-autofill:hover,.base-field__control :where(input,textarea):-webkit-autofill:focus,.base-field__control :where(input,textarea):-webkit-autofill:active{-webkit-text-fill-color:var(--ui-field-float-input-text);caret-color:var(--ui-field-float-input-text);box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset;transition:background-color 50000s ease-in-out 0s}.base-field--invalid:not(.base-field--readonly) .base-field__control :where(input,textarea):-webkit-autofill,.base-field--invalid:not(.base-field--readonly) .base-field__control :where(input,textarea):-webkit-autofill:hover,.base-field--invalid:not(.base-field--readonly) .base-field__control :where(input,textarea):-webkit-autofill:focus,.base-field--invalid:not(.base-field--readonly) .base-field__control :where(input,textarea):-webkit-autofill:active{-webkit-text-fill-color:var(--ui-field-float-input-text);box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea):-webkit-autofill,.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea):-webkit-autofill:hover,.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea):-webkit-autofill:focus,.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea):-webkit-autofill:active{-webkit-text-fill-color:var(--ui-field-readonly-input-text);box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset}\n"] }]
         }], propDecorators: { label: [{
                 type: Input
             }], errorMessage: [{
@@ -1728,7 +1729,10 @@ class PasswordFieldComponent extends NgControlFieldDirective {
         /** Por defeito `false`: o botão de limpar compete com o toggle de visibilidade. */
         this.clearable = false;
         this.maxLength = 500;
-        /** Atributo HTML `autocomplete` (senha actual vs. nova senha). */
+        /**
+         * Com o input `autocomplete` da base a `true`, define o atributo HTML
+         * (`current-password` / `new-password`). Com `autocomplete` a `false`, aplica-se `off`.
+         */
         this.autoComplete = 'current-password';
         /** `false` = caracteres ocultos (ícone olho aberto para revelar). */
         this.passwordVisible = false;
@@ -1823,7 +1827,7 @@ class PasswordFieldComponent extends NgControlFieldDirective {
                 useExisting: forwardRef(() => PasswordFieldComponent),
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"uiRequiredEffective\" [showRequiredMark]=\"showRequiredMark\"\n  [invalid]=\"uiInvalid\" [inputId]=\"controlId\" [errorId]=\"errorElementId\" [showPrefixIcon]=\"showPrefixIcon\"\n  [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"true\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <input class=\"password-field__input\" [type]=\"inputTypeUi\" [id]=\"controlId\" [attr.name]=\"name || null\"\n    [attr.placeholder]=\"''\" [attr.autocomplete]=\"autoComplete\" [attr.maxlength]=\"maxLength > 0 ? maxLength : null\"\n    [disabled]=\"disabled\" [readonly]=\"readonly\" [required]=\"uiRequiredEffective\" [attr.aria-invalid]=\"uiInvalid\"\n    [attr.aria-describedby]=\"uiAriaDescribedBy\" [value]=\"inputText\" (input)=\"onNativeInput($event)\"\n    (blur)=\"onBlur()\" />\n  <button type=\"button\" appFieldSuffix class=\"password-field__toggle\" tabindex=\"-1\"\n    [disabled]=\"disabled || readonly\" [attr.aria-label]=\"toggleAriaLabelUi\" [attr.aria-pressed]=\"passwordVisible\"\n    (click)=\"togglePasswordVisible($event)\">\n    <i [class]=\"toggleIconClassUi\" aria-hidden=\"true\"></i>\n  </button>\n</app-base-field>\n", styles: [":host{display:block;width:100%;box-sizing:border-box}.password-field__input{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0;padding:1.35rem .75rem .45rem;font-size:1rem;line-height:1.35;font-family:inherit;color:var(--ui-field-float-input-text);border:none;border-radius:0;background:transparent;box-shadow:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.password-field__input::placeholder{color:transparent}.password-field__input:focus,.password-field__input:focus-visible{outline:none}.password-field__input--invalid:not(:disabled)::placeholder{color:transparent}.password-field__input:disabled{opacity:var(--ui-field-input-disabled-opacity);cursor:not-allowed}.password-field__toggle{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;transition:background .15s ease,color .15s ease}.password-field__toggle:hover:not(:disabled){background:#5a7fa326;color:var(--ui-field-float-label-top-color)}.password-field__toggle:focus,.password-field__toggle:focus-visible{outline:none}.password-field__toggle:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}.password-field__toggle i{font-size:.95rem;line-height:1}:host.password-field--invalid .password-field__toggle{color:var(--ui-field-float-label-invalid-color)}:host.password-field--invalid .password-field__toggle:hover:not(:disabled){background:#b91c1c1f;color:var(--ui-field-float-label-invalid-color)}:host.password-field--invalid .password-field__toggle:focus,:host.password-field--invalid .password-field__toggle:focus-visible{outline:none}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "required", "showRequiredMark", "invalid", "filled", "disabled", "readonly", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"uiRequiredEffective\" [showRequiredMark]=\"showRequiredMark\"\n  [invalid]=\"uiInvalid\" [inputId]=\"controlId\" [errorId]=\"errorElementId\" [showPrefixIcon]=\"showPrefixIcon\"\n  [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"true\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <input class=\"password-field__input\" [type]=\"inputTypeUi\" [id]=\"controlId\" [attr.name]=\"name || null\"\n    [attr.placeholder]=\"''\" [attr.autocomplete]=\"autocomplete ? autoComplete : 'off'\" [attr.maxlength]=\"maxLength > 0 ? maxLength : null\"\n    [disabled]=\"disabled\" [readonly]=\"readonly\" [required]=\"uiRequiredEffective\" [attr.aria-invalid]=\"uiInvalid\"\n    [attr.aria-describedby]=\"uiAriaDescribedBy\" [value]=\"inputText\" (input)=\"onNativeInput($event)\"\n    (blur)=\"onBlur()\" />\n  <button type=\"button\" appFieldSuffix class=\"password-field__toggle\" tabindex=\"-1\"\n    [disabled]=\"disabled || readonly\" [attr.aria-label]=\"toggleAriaLabelUi\" [attr.aria-pressed]=\"passwordVisible\"\n    (click)=\"togglePasswordVisible($event)\">\n    <i [class]=\"toggleIconClassUi\" aria-hidden=\"true\"></i>\n  </button>\n</app-base-field>\n", styles: [":host{display:block;width:100%;box-sizing:border-box}.password-field__input{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0;padding:1.35rem .75rem .45rem;font-size:1rem;line-height:1.35;font-family:inherit;color:var(--ui-field-float-input-text);border:none;border-radius:0;background:transparent;box-shadow:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.password-field__input::placeholder{color:transparent}.password-field__input:focus,.password-field__input:focus-visible{outline:none}.password-field__input--invalid:not(:disabled)::placeholder{color:transparent}.password-field__input:disabled{opacity:var(--ui-field-input-disabled-opacity);cursor:not-allowed}.password-field__toggle{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;transition:background .15s ease,color .15s ease}.password-field__toggle:hover:not(:disabled){background:#5a7fa326;color:var(--ui-field-float-label-top-color)}.password-field__toggle:focus,.password-field__toggle:focus-visible{outline:none}.password-field__toggle:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}.password-field__toggle i{font-size:.95rem;line-height:1}:host.password-field--invalid .password-field__toggle{color:var(--ui-field-float-label-invalid-color)}:host.password-field--invalid .password-field__toggle:hover:not(:disabled){background:#b91c1c1f;color:var(--ui-field-float-label-invalid-color)}:host.password-field--invalid .password-field__toggle:focus,:host.password-field--invalid .password-field__toggle:focus-visible{outline:none}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "required", "showRequiredMark", "invalid", "filled", "disabled", "readonly", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: PasswordFieldComponent, decorators: [{
             type: Component,
@@ -1833,7 +1837,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                             useExisting: forwardRef(() => PasswordFieldComponent),
                             multi: true,
                         },
-                    ], template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"uiRequiredEffective\" [showRequiredMark]=\"showRequiredMark\"\n  [invalid]=\"uiInvalid\" [inputId]=\"controlId\" [errorId]=\"errorElementId\" [showPrefixIcon]=\"showPrefixIcon\"\n  [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"true\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <input class=\"password-field__input\" [type]=\"inputTypeUi\" [id]=\"controlId\" [attr.name]=\"name || null\"\n    [attr.placeholder]=\"''\" [attr.autocomplete]=\"autoComplete\" [attr.maxlength]=\"maxLength > 0 ? maxLength : null\"\n    [disabled]=\"disabled\" [readonly]=\"readonly\" [required]=\"uiRequiredEffective\" [attr.aria-invalid]=\"uiInvalid\"\n    [attr.aria-describedby]=\"uiAriaDescribedBy\" [value]=\"inputText\" (input)=\"onNativeInput($event)\"\n    (blur)=\"onBlur()\" />\n  <button type=\"button\" appFieldSuffix class=\"password-field__toggle\" tabindex=\"-1\"\n    [disabled]=\"disabled || readonly\" [attr.aria-label]=\"toggleAriaLabelUi\" [attr.aria-pressed]=\"passwordVisible\"\n    (click)=\"togglePasswordVisible($event)\">\n    <i [class]=\"toggleIconClassUi\" aria-hidden=\"true\"></i>\n  </button>\n</app-base-field>\n", styles: [":host{display:block;width:100%;box-sizing:border-box}.password-field__input{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0;padding:1.35rem .75rem .45rem;font-size:1rem;line-height:1.35;font-family:inherit;color:var(--ui-field-float-input-text);border:none;border-radius:0;background:transparent;box-shadow:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.password-field__input::placeholder{color:transparent}.password-field__input:focus,.password-field__input:focus-visible{outline:none}.password-field__input--invalid:not(:disabled)::placeholder{color:transparent}.password-field__input:disabled{opacity:var(--ui-field-input-disabled-opacity);cursor:not-allowed}.password-field__toggle{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;transition:background .15s ease,color .15s ease}.password-field__toggle:hover:not(:disabled){background:#5a7fa326;color:var(--ui-field-float-label-top-color)}.password-field__toggle:focus,.password-field__toggle:focus-visible{outline:none}.password-field__toggle:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}.password-field__toggle i{font-size:.95rem;line-height:1}:host.password-field--invalid .password-field__toggle{color:var(--ui-field-float-label-invalid-color)}:host.password-field--invalid .password-field__toggle:hover:not(:disabled){background:#b91c1c1f;color:var(--ui-field-float-label-invalid-color)}:host.password-field--invalid .password-field__toggle:focus,:host.password-field--invalid .password-field__toggle:focus-visible{outline:none}\n"] }]
+                    ], template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"uiRequiredEffective\" [showRequiredMark]=\"showRequiredMark\"\n  [invalid]=\"uiInvalid\" [inputId]=\"controlId\" [errorId]=\"errorElementId\" [showPrefixIcon]=\"showPrefixIcon\"\n  [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"true\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <input class=\"password-field__input\" [type]=\"inputTypeUi\" [id]=\"controlId\" [attr.name]=\"name || null\"\n    [attr.placeholder]=\"''\" [attr.autocomplete]=\"autocomplete ? autoComplete : 'off'\" [attr.maxlength]=\"maxLength > 0 ? maxLength : null\"\n    [disabled]=\"disabled\" [readonly]=\"readonly\" [required]=\"uiRequiredEffective\" [attr.aria-invalid]=\"uiInvalid\"\n    [attr.aria-describedby]=\"uiAriaDescribedBy\" [value]=\"inputText\" (input)=\"onNativeInput($event)\"\n    (blur)=\"onBlur()\" />\n  <button type=\"button\" appFieldSuffix class=\"password-field__toggle\" tabindex=\"-1\"\n    [disabled]=\"disabled || readonly\" [attr.aria-label]=\"toggleAriaLabelUi\" [attr.aria-pressed]=\"passwordVisible\"\n    (click)=\"togglePasswordVisible($event)\">\n    <i [class]=\"toggleIconClassUi\" aria-hidden=\"true\"></i>\n  </button>\n</app-base-field>\n", styles: [":host{display:block;width:100%;box-sizing:border-box}.password-field__input{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0;padding:1.35rem .75rem .45rem;font-size:1rem;line-height:1.35;font-family:inherit;color:var(--ui-field-float-input-text);border:none;border-radius:0;background:transparent;box-shadow:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.password-field__input::placeholder{color:transparent}.password-field__input:focus,.password-field__input:focus-visible{outline:none}.password-field__input--invalid:not(:disabled)::placeholder{color:transparent}.password-field__input:disabled{opacity:var(--ui-field-input-disabled-opacity);cursor:not-allowed}.password-field__toggle{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;transition:background .15s ease,color .15s ease}.password-field__toggle:hover:not(:disabled){background:#5a7fa326;color:var(--ui-field-float-label-top-color)}.password-field__toggle:focus,.password-field__toggle:focus-visible{outline:none}.password-field__toggle:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}.password-field__toggle i{font-size:.95rem;line-height:1}:host.password-field--invalid .password-field__toggle{color:var(--ui-field-float-label-invalid-color)}:host.password-field--invalid .password-field__toggle:hover:not(:disabled){background:#b91c1c1f;color:var(--ui-field-float-label-invalid-color)}:host.password-field--invalid .password-field__toggle:focus,:host.password-field--invalid .password-field__toggle:focus-visible{outline:none}\n"] }]
         }], propDecorators: { hostInvalidClass: [{
                 type: HostBinding,
                 args: ['class.password-field--invalid']
@@ -2154,7 +2158,7 @@ class IntegerFieldComponent extends NgControlFieldDirective {
                 useExisting: forwardRef(() => IntegerFieldComponent),
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"uiRequiredEffective\" [showRequiredMark]=\"showRequiredMark\"\n  [invalid]=\"uiInvalid\" [inputId]=\"controlId\"\n  [errorId]=\"errorElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\"\n  [clearAriaLabel]=\"clearAriaLabel\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <input class=\"integer-field__input\" type=\"text\" inputmode=\"numeric\" [id]=\"controlId\"\n    [attr.name]=\"name || null\" [attr.placeholder]=\"''\" [disabled]=\"disabled\" [readonly]=\"readonly\" [required]=\"uiRequiredEffective\"\n    [attr.aria-invalid]=\"uiInvalid\" [attr.aria-describedby]=\"uiAriaDescribedBy\" [value]=\"inputText\"\n    (beforeinput)=\"onBeforeInput($event)\" (input)=\"onNativeInput($event)\" (blur)=\"onBlur()\" />\n</app-base-field>\n", styles: [":host{display:block;width:100%;box-sizing:border-box}.integer-field__input{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0;padding:1.35rem .75rem .45rem;font-size:1rem;line-height:1.35;font-family:inherit;color:var(--ui-field-float-input-text);border:none;border-radius:0;background:transparent;box-shadow:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.integer-field__input::placeholder{color:transparent}.integer-field__input:focus,.integer-field__input:focus-visible{outline:none}.integer-field__input--invalid:not(:disabled)::placeholder{color:transparent}.integer-field__input:disabled{opacity:var(--ui-field-input-disabled-opacity);cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "required", "showRequiredMark", "invalid", "filled", "disabled", "readonly", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"uiRequiredEffective\" [showRequiredMark]=\"showRequiredMark\"\n  [invalid]=\"uiInvalid\" [inputId]=\"controlId\"\n  [errorId]=\"errorElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\"\n  [clearAriaLabel]=\"clearAriaLabel\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <input class=\"integer-field__input\" type=\"text\" inputmode=\"numeric\" [id]=\"controlId\"\n    [attr.name]=\"name || null\" [attr.placeholder]=\"''\" [attr.autocomplete]=\"autocompleteAttr\" [disabled]=\"disabled\" [readonly]=\"readonly\" [required]=\"uiRequiredEffective\"\n    [attr.aria-invalid]=\"uiInvalid\" [attr.aria-describedby]=\"uiAriaDescribedBy\" [value]=\"inputText\"\n    (beforeinput)=\"onBeforeInput($event)\" (input)=\"onNativeInput($event)\" (blur)=\"onBlur()\" />\n</app-base-field>\n", styles: [":host{display:block;width:100%;box-sizing:border-box}.integer-field__input{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0;padding:1.35rem .75rem .45rem;font-size:1rem;line-height:1.35;font-family:inherit;color:var(--ui-field-float-input-text);border:none;border-radius:0;background:transparent;box-shadow:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.integer-field__input::placeholder{color:transparent}.integer-field__input:focus,.integer-field__input:focus-visible{outline:none}.integer-field__input--invalid:not(:disabled)::placeholder{color:transparent}.integer-field__input:disabled{opacity:var(--ui-field-input-disabled-opacity);cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "required", "showRequiredMark", "invalid", "filled", "disabled", "readonly", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: IntegerFieldComponent, decorators: [{
             type: Component,
@@ -2164,7 +2168,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                             useExisting: forwardRef(() => IntegerFieldComponent),
                             multi: true,
                         },
-                    ], template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"uiRequiredEffective\" [showRequiredMark]=\"showRequiredMark\"\n  [invalid]=\"uiInvalid\" [inputId]=\"controlId\"\n  [errorId]=\"errorElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\"\n  [clearAriaLabel]=\"clearAriaLabel\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <input class=\"integer-field__input\" type=\"text\" inputmode=\"numeric\" [id]=\"controlId\"\n    [attr.name]=\"name || null\" [attr.placeholder]=\"''\" [disabled]=\"disabled\" [readonly]=\"readonly\" [required]=\"uiRequiredEffective\"\n    [attr.aria-invalid]=\"uiInvalid\" [attr.aria-describedby]=\"uiAriaDescribedBy\" [value]=\"inputText\"\n    (beforeinput)=\"onBeforeInput($event)\" (input)=\"onNativeInput($event)\" (blur)=\"onBlur()\" />\n</app-base-field>\n", styles: [":host{display:block;width:100%;box-sizing:border-box}.integer-field__input{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0;padding:1.35rem .75rem .45rem;font-size:1rem;line-height:1.35;font-family:inherit;color:var(--ui-field-float-input-text);border:none;border-radius:0;background:transparent;box-shadow:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.integer-field__input::placeholder{color:transparent}.integer-field__input:focus,.integer-field__input:focus-visible{outline:none}.integer-field__input--invalid:not(:disabled)::placeholder{color:transparent}.integer-field__input:disabled{opacity:var(--ui-field-input-disabled-opacity);cursor:not-allowed}\n"] }]
+                    ], template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"uiRequiredEffective\" [showRequiredMark]=\"showRequiredMark\"\n  [invalid]=\"uiInvalid\" [inputId]=\"controlId\"\n  [errorId]=\"errorElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\"\n  [clearAriaLabel]=\"clearAriaLabel\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <input class=\"integer-field__input\" type=\"text\" inputmode=\"numeric\" [id]=\"controlId\"\n    [attr.name]=\"name || null\" [attr.placeholder]=\"''\" [attr.autocomplete]=\"autocompleteAttr\" [disabled]=\"disabled\" [readonly]=\"readonly\" [required]=\"uiRequiredEffective\"\n    [attr.aria-invalid]=\"uiInvalid\" [attr.aria-describedby]=\"uiAriaDescribedBy\" [value]=\"inputText\"\n    (beforeinput)=\"onBeforeInput($event)\" (input)=\"onNativeInput($event)\" (blur)=\"onBlur()\" />\n</app-base-field>\n", styles: [":host{display:block;width:100%;box-sizing:border-box}.integer-field__input{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0;padding:1.35rem .75rem .45rem;font-size:1rem;line-height:1.35;font-family:inherit;color:var(--ui-field-float-input-text);border:none;border-radius:0;background:transparent;box-shadow:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.integer-field__input::placeholder{color:transparent}.integer-field__input:focus,.integer-field__input:focus-visible{outline:none}.integer-field__input--invalid:not(:disabled)::placeholder{color:transparent}.integer-field__input:disabled{opacity:var(--ui-field-input-disabled-opacity);cursor:not-allowed}\n"] }]
         }], propDecorators: { max: [{
                 type: Input,
                 args: [{ transform: numberAttribute }]
@@ -5079,11 +5083,11 @@ class LayoutStackComponent {
         return parts.join(' ');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutStackComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: LayoutStackComponent, isStandalone: true, selector: "app-layout-stack", inputs: { align: "align", direction: "direction", itemAlign: "itemAlign", stackOnMobile: ["stackOnMobile", "stackOnMobile", booleanAttribute], stackDivider: ["stackDivider", "stackDivider", booleanAttribute], stackFill: ["stackFill", "stackFill", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<div class=\"layout-stack__track\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.layout-stack__track{display:flex;flex-wrap:wrap;width:100%;min-width:0;box-sizing:border-box;align-items:stretch;gap:.5rem .75rem;padding-top:.25rem}:host(.layout-stack--dir-column) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch}:host(.layout-stack--align-start) .layout-stack__track{justify-content:flex-start}:host(.layout-stack--align-center) .layout-stack__track{justify-content:center}:host(.layout-stack--align-end) .layout-stack__track{justify-content:flex-end}:host(.layout-stack--align-space-between) .layout-stack__track{justify-content:space-between}:host(.layout-stack--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-layout-stack-divider-color, #e8eaed)}:host:not(.layout-stack--fill) .layout-stack__track{align-items:center}:host:not(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-width:0;max-width:100%}:host(.layout-stack--items-stretch) .layout-stack__track{align-items:stretch}:host(.layout-stack--items-start) .layout-stack__track{align-items:flex-start}:host(.layout-stack--items-center) .layout-stack__track{align-items:center}:host(.layout-stack--items-end) .layout-stack__track{align-items:flex-end}:host(.layout-stack--fill:not(.layout-stack--align-space-between)) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:1 1 0;min-width:0;max-width:100%;min-height:0;align-self:auto}:host(.layout-stack--fill.layout-stack--dir-column) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;max-width:100%;align-self:stretch}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>.base-button:not(.base-button--full-width){flex:0 0 auto;align-self:center}@media(max-width:39.98rem){:host(.layout-stack--stack-mobile) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:.45rem .6rem}:host(.layout-stack--stack-mobile.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;max-width:100%;align-self:stretch}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: LayoutStackComponent, isStandalone: true, selector: "app-layout-stack", inputs: { align: "align", direction: "direction", itemAlign: "itemAlign", stackOnMobile: ["stackOnMobile", "stackOnMobile", booleanAttribute], stackDivider: ["stackDivider", "stackDivider", booleanAttribute], stackFill: ["stackFill", "stackFill", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<div class=\"layout-stack__track\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.layout-stack__track{display:flex;flex-wrap:wrap;width:100%;min-width:0;box-sizing:border-box;align-items:flex-start;gap:.5rem .75rem;padding-top:.25rem}:host(.layout-stack--dir-column) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch}:host(.layout-stack--align-start) .layout-stack__track{justify-content:flex-start}:host(.layout-stack--align-center) .layout-stack__track{justify-content:center}:host(.layout-stack--align-end) .layout-stack__track{justify-content:flex-end}:host(.layout-stack--align-space-between) .layout-stack__track{justify-content:space-between}:host(.layout-stack--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-layout-stack-divider-color, #e8eaed)}:host:not(.layout-stack--fill) .layout-stack__track{align-items:center}:host:not(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-width:0;max-width:100%}:host(.layout-stack--items-stretch) .layout-stack__track{align-items:stretch}:host(.layout-stack--items-start) .layout-stack__track{align-items:flex-start}:host(.layout-stack--items-center) .layout-stack__track{align-items:center}:host(.layout-stack--items-end) .layout-stack__track{align-items:flex-end}:host(.layout-stack--fill:not(.layout-stack--align-space-between)) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:1 1 0;min-width:0;max-width:100%;min-height:0;align-self:auto}:host(.layout-stack--fill.layout-stack--dir-column) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;max-width:100%;align-self:stretch}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>.base-button:not(.base-button--full-width){flex:0 0 auto;align-self:center}@media(max-width:39.98rem){:host(.layout-stack--stack-mobile) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:.45rem .6rem}:host(.layout-stack--stack-mobile.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;max-width:100%;align-self:stretch}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutStackComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-layout-stack', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-stack__track\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.layout-stack__track{display:flex;flex-wrap:wrap;width:100%;min-width:0;box-sizing:border-box;align-items:stretch;gap:.5rem .75rem;padding-top:.25rem}:host(.layout-stack--dir-column) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch}:host(.layout-stack--align-start) .layout-stack__track{justify-content:flex-start}:host(.layout-stack--align-center) .layout-stack__track{justify-content:center}:host(.layout-stack--align-end) .layout-stack__track{justify-content:flex-end}:host(.layout-stack--align-space-between) .layout-stack__track{justify-content:space-between}:host(.layout-stack--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-layout-stack-divider-color, #e8eaed)}:host:not(.layout-stack--fill) .layout-stack__track{align-items:center}:host:not(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-width:0;max-width:100%}:host(.layout-stack--items-stretch) .layout-stack__track{align-items:stretch}:host(.layout-stack--items-start) .layout-stack__track{align-items:flex-start}:host(.layout-stack--items-center) .layout-stack__track{align-items:center}:host(.layout-stack--items-end) .layout-stack__track{align-items:flex-end}:host(.layout-stack--fill:not(.layout-stack--align-space-between)) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:1 1 0;min-width:0;max-width:100%;min-height:0;align-self:auto}:host(.layout-stack--fill.layout-stack--dir-column) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;max-width:100%;align-self:stretch}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>.base-button:not(.base-button--full-width){flex:0 0 auto;align-self:center}@media(max-width:39.98rem){:host(.layout-stack--stack-mobile) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:.45rem .6rem}:host(.layout-stack--stack-mobile.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;max-width:100%;align-self:stretch}}\n"] }]
+            args: [{ selector: 'app-layout-stack', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-stack__track\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.layout-stack__track{display:flex;flex-wrap:wrap;width:100%;min-width:0;box-sizing:border-box;align-items:flex-start;gap:.5rem .75rem;padding-top:.25rem}:host(.layout-stack--dir-column) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch}:host(.layout-stack--align-start) .layout-stack__track{justify-content:flex-start}:host(.layout-stack--align-center) .layout-stack__track{justify-content:center}:host(.layout-stack--align-end) .layout-stack__track{justify-content:flex-end}:host(.layout-stack--align-space-between) .layout-stack__track{justify-content:space-between}:host(.layout-stack--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-layout-stack-divider-color, #e8eaed)}:host:not(.layout-stack--fill) .layout-stack__track{align-items:center}:host:not(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-width:0;max-width:100%}:host(.layout-stack--items-stretch) .layout-stack__track{align-items:stretch}:host(.layout-stack--items-start) .layout-stack__track{align-items:flex-start}:host(.layout-stack--items-center) .layout-stack__track{align-items:center}:host(.layout-stack--items-end) .layout-stack__track{align-items:flex-end}:host(.layout-stack--fill:not(.layout-stack--align-space-between)) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:1 1 0;min-width:0;max-width:100%;min-height:0;align-self:auto}:host(.layout-stack--fill.layout-stack--dir-column) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;max-width:100%;align-self:stretch}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>.base-button:not(.base-button--full-width){flex:0 0 auto;align-self:center}@media(max-width:39.98rem){:host(.layout-stack--stack-mobile) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:.45rem .6rem}:host(.layout-stack--stack-mobile.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;max-width:100%;align-self:stretch}}\n"] }]
         }], propDecorators: { align: [{
                 type: Input
             }], direction: [{
@@ -5235,11 +5239,11 @@ class FormColComponent {
         return Math.min(12, Math.max(1, Math.round(n)));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FormColComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: FormColComponent, isStandalone: true, selector: "app-form-col", inputs: { xs: ["xs", "xs", numberAttribute], sm: "sm", md: "md", lg: "lg", xl: "xl", order: ["order", "order", numberAttribute], grow: ["grow", "grow", booleanAttribute], gap: "gap", align: "align", justify: "justify" }, host: { properties: { "class": "this.hostClass", "attr.style": "this.hostVars" } }, ngImport: i0, template: "<div class=\"form-col__inner\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;min-width:0;box-sizing:border-box;grid-column:span var(--form-col-xs, 12)}.form-col__inner{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;width:100%;min-width:0;min-height:0;box-sizing:border-box}:host(.form-col--gap-xs) .form-col__inner{gap:.35rem}:host(.form-col--gap-sm) .form-col__inner{gap:.5rem}:host(.form-col--gap-md) .form-col__inner{gap:.75rem}:host(.form-col--gap-lg) .form-col__inner{gap:1rem}:host(.form-col--align-start) .form-col__inner{align-items:flex-start}:host(.form-col--align-center) .form-col__inner{align-items:center}:host(.form-col--align-end) .form-col__inner{align-items:flex-end}:host(.form-col--align-stretch) .form-col__inner{align-items:stretch}:host(.form-col--justify-start) .form-col__inner{justify-content:flex-start}:host(.form-col--justify-center) .form-col__inner{justify-content:center}:host(.form-col--justify-end) .form-col__inner{justify-content:flex-end}:host(.form-col--justify-between) .form-col__inner{justify-content:space-between}@media(min-width:40rem){:host{grid-column:span var(--form-col-sm, var(--form-col-xs, 12))}}@media(min-width:48rem){:host{grid-column:span var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12)))}}@media(min-width:64rem){:host{grid-column:span var(--form-col-lg, var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12))))}}@media(min-width:80rem){:host{grid-column:span var(--form-col-xl, var(--form-col-lg, var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12)))))}}:host.form-col--grow{min-width:0;grid-column:auto/-1}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: FormColComponent, isStandalone: true, selector: "app-form-col", inputs: { xs: ["xs", "xs", numberAttribute], sm: "sm", md: "md", lg: "lg", xl: "xl", order: ["order", "order", numberAttribute], grow: ["grow", "grow", booleanAttribute], gap: "gap", align: "align", justify: "justify" }, host: { properties: { "class": "this.hostClass", "attr.style": "this.hostVars" } }, ngImport: i0, template: "<div class=\"form-col__inner\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;min-width:0;box-sizing:border-box;align-self:start;width:100%;max-width:100%;grid-column:span var(--form-col-xs, 12)}.form-col__inner{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;width:100%;min-width:0;min-height:0;box-sizing:border-box}:host(.form-col--gap-xs) .form-col__inner{gap:.35rem}:host(.form-col--gap-sm) .form-col__inner{gap:.5rem}:host(.form-col--gap-md) .form-col__inner{gap:.75rem}:host(.form-col--gap-lg) .form-col__inner{gap:1rem}:host(.form-col--align-start) .form-col__inner{align-items:flex-start}:host(.form-col--align-center) .form-col__inner{align-items:center}:host(.form-col--align-end) .form-col__inner{align-items:flex-end}:host(.form-col--align-stretch) .form-col__inner{align-items:stretch}:host(.form-col--justify-start) .form-col__inner{justify-content:flex-start}:host(.form-col--justify-center) .form-col__inner{justify-content:center}:host(.form-col--justify-end) .form-col__inner{justify-content:flex-end}:host(.form-col--justify-between) .form-col__inner{justify-content:space-between}@media(min-width:40rem){:host{grid-column:span var(--form-col-sm, var(--form-col-xs, 12))}}@media(min-width:48rem){:host{grid-column:span var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12)))}}@media(min-width:64rem){:host{grid-column:span var(--form-col-lg, var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12))))}}@media(min-width:80rem){:host{grid-column:span var(--form-col-xl, var(--form-col-lg, var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12)))))}}:host.form-col--grow{min-width:0;grid-column:auto/-1}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FormColComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-form-col', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-col__inner\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;min-width:0;box-sizing:border-box;grid-column:span var(--form-col-xs, 12)}.form-col__inner{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;width:100%;min-width:0;min-height:0;box-sizing:border-box}:host(.form-col--gap-xs) .form-col__inner{gap:.35rem}:host(.form-col--gap-sm) .form-col__inner{gap:.5rem}:host(.form-col--gap-md) .form-col__inner{gap:.75rem}:host(.form-col--gap-lg) .form-col__inner{gap:1rem}:host(.form-col--align-start) .form-col__inner{align-items:flex-start}:host(.form-col--align-center) .form-col__inner{align-items:center}:host(.form-col--align-end) .form-col__inner{align-items:flex-end}:host(.form-col--align-stretch) .form-col__inner{align-items:stretch}:host(.form-col--justify-start) .form-col__inner{justify-content:flex-start}:host(.form-col--justify-center) .form-col__inner{justify-content:center}:host(.form-col--justify-end) .form-col__inner{justify-content:flex-end}:host(.form-col--justify-between) .form-col__inner{justify-content:space-between}@media(min-width:40rem){:host{grid-column:span var(--form-col-sm, var(--form-col-xs, 12))}}@media(min-width:48rem){:host{grid-column:span var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12)))}}@media(min-width:64rem){:host{grid-column:span var(--form-col-lg, var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12))))}}@media(min-width:80rem){:host{grid-column:span var(--form-col-xl, var(--form-col-lg, var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12)))))}}:host.form-col--grow{min-width:0;grid-column:auto/-1}\n"] }]
+            args: [{ selector: 'app-form-col', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-col__inner\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;min-width:0;box-sizing:border-box;align-self:start;width:100%;max-width:100%;grid-column:span var(--form-col-xs, 12)}.form-col__inner{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;width:100%;min-width:0;min-height:0;box-sizing:border-box}:host(.form-col--gap-xs) .form-col__inner{gap:.35rem}:host(.form-col--gap-sm) .form-col__inner{gap:.5rem}:host(.form-col--gap-md) .form-col__inner{gap:.75rem}:host(.form-col--gap-lg) .form-col__inner{gap:1rem}:host(.form-col--align-start) .form-col__inner{align-items:flex-start}:host(.form-col--align-center) .form-col__inner{align-items:center}:host(.form-col--align-end) .form-col__inner{align-items:flex-end}:host(.form-col--align-stretch) .form-col__inner{align-items:stretch}:host(.form-col--justify-start) .form-col__inner{justify-content:flex-start}:host(.form-col--justify-center) .form-col__inner{justify-content:center}:host(.form-col--justify-end) .form-col__inner{justify-content:flex-end}:host(.form-col--justify-between) .form-col__inner{justify-content:space-between}@media(min-width:40rem){:host{grid-column:span var(--form-col-sm, var(--form-col-xs, 12))}}@media(min-width:48rem){:host{grid-column:span var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12)))}}@media(min-width:64rem){:host{grid-column:span var(--form-col-lg, var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12))))}}@media(min-width:80rem){:host{grid-column:span var(--form-col-xl, var(--form-col-lg, var(--form-col-md, var(--form-col-sm, var(--form-col-xs, 12)))))}}:host.form-col--grow{min-width:0;grid-column:auto/-1}\n"] }]
         }], propDecorators: { xs: [{
                 type: Input,
                 args: [{ transform: numberAttribute }]