@caribeng/ui 22.2.0 → 22.5.0

package/fesm2022/caribeng-ui-dataview.mjs

@@ -1,7 +1,7 @@
 import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
 import { inject, TemplateRef, Directive, input, model, contentChild, linkedSignal, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
-import { injectCbTranslation } from '@caribeng/ui';
+import { injectCbTranslation, cbFormat } from '@caribeng/ui';
 import { CbPaginator } from '@caribeng/ui/paginator';
 
 /** Plantilla de cada elemento de un `<cb-dataview>`. */
@@ -47,6 +47,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
 class CbDataView {
     constructor() {
         this.t = injectCbTranslation();
+        this.fmt = cbFormat;
         /** Colección a mostrar. */
         this.value = input([], /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
@@ -138,6 +139,7 @@ class CbDataView {
                 type="button"
                 class="cb-dataview__select"
                 [attr.aria-pressed]="isSelected(item)"
+                [attr.aria-label]="fmt(t().selectItem, asItem(item).title)"
                 (click)="selection.set(asItem(item))"
               >
                 {{ t().select }}
@@ -153,7 +155,7 @@ class CbDataView {
     @if (rows() > 0 && value().length > rows()) {
       <cb-paginator class="cb-dataview__paginator" [totalRecords]="value().length" [rows]="rows()" [(first)]="first" />
     }
-  `, isInline: true, styles: [":host{display:block;color:var(--cb-color-text)}.cb-dataview__header{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);margin-bottom:var(--cb-space-3, .75rem)}.cb-dataview__title{min-width:0}.cb-dataview__layouts{display:inline-flex;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);overflow:hidden}.cb-dataview__layout-btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;background:transparent;color:var(--cb-color-text-muted);cursor:pointer}.cb-dataview__layout-btn+.cb-dataview__layout-btn{border-inline-start:1px solid var(--cb-color-border)}.cb-dataview__layout-btn[aria-pressed=true]{color:var(--cb-color-primary-600);background:color-mix(in srgb,var(--cb-color-primary-500) 12%,transparent)}.cb-dataview__layout-btn:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500));outline-offset:-2px}.cb-dataview{display:grid;gap:var(--cb-space-3, .75rem)}.cb-dataview[data-layout=grid]{grid-template-columns:repeat(auto-fill,minmax(min(14rem,100%),1fr))}.cb-dataview__item{height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cb-space-1, .25rem);padding:var(--cb-space-4, 1rem);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, .75rem);background:var(--cb-color-surface-raised)}.cb-dataview[data-layout=list] .cb-dataview__item{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:var(--cb-space-3, .75rem)}.cb-dataview__item-title{color:var(--cb-color-text-strong)}.cb-dataview__item small{color:var(--cb-color-text-muted)}.cb-dataview__item p{margin:0;color:var(--cb-color-text-muted);font-size:var(--cb-text-sm, .875rem)}.cb-dataview[data-layout=list] .cb-dataview__item p{flex:1 1 12rem}.cb-dataview__select{align-self:flex-start;margin-top:auto;padding:.35rem .75rem;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);background:transparent;color:var(--cb-color-text);font:inherit;font-size:var(--cb-text-sm, .875rem);cursor:pointer}.cb-dataview[data-layout=list] .cb-dataview__select{margin-top:0;margin-inline-start:auto}.cb-dataview__select[aria-pressed=true]{border-color:var(--cb-color-primary-500);color:var(--cb-color-primary-700);background:color-mix(in srgb,var(--cb-color-primary-500) 12%,transparent)}.cb-dataview__empty{grid-column:1 / -1;margin:0;padding:var(--cb-space-6, 1.5rem);text-align:center;color:var(--cb-color-text-muted)}.cb-dataview__paginator{margin-top:var(--cb-space-3, .75rem)}:host-context([data-theme=\"dark\"]) .cb-dataview__select[aria-pressed=true]{color:var(--cb-color-primary-300)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CbPaginator, selector: "cb-paginator", inputs: ["totalRecords", "rows", "first", "rowsPerPageOptions", "showReport", "maxPageLinks"], outputs: ["rowsChange", "firstChange", "pageChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:block;color:var(--cb-color-text)}.cb-dataview__header{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);margin-bottom:var(--cb-space-3, .75rem)}.cb-dataview__title{min-width:0}.cb-dataview__layouts{display:inline-flex;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);overflow:hidden}.cb-dataview__layout-btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;background:transparent;color:var(--cb-color-text-muted);cursor:pointer}.cb-dataview__layout-btn+.cb-dataview__layout-btn{border-inline-start:1px solid var(--cb-color-border)}.cb-dataview__layout-btn[aria-pressed=true]{color:var(--cb-color-primary-text);background:color-mix(in srgb,var(--cb-color-primary-500) 12%,transparent)}.cb-dataview__layout-btn:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500));outline-offset:-2px}.cb-dataview{display:grid;gap:var(--cb-space-3, .75rem)}.cb-dataview[data-layout=grid]{grid-template-columns:repeat(auto-fill,minmax(min(14rem,100%),1fr))}.cb-dataview__item{height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cb-space-1, .25rem);padding:var(--cb-space-4, 1rem);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, .75rem);background:var(--cb-color-surface-raised)}.cb-dataview[data-layout=list] .cb-dataview__item{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:var(--cb-space-3, .75rem)}.cb-dataview__item-title{color:var(--cb-color-text-strong)}.cb-dataview__item small{color:var(--cb-color-text-muted)}.cb-dataview__item p{margin:0;color:var(--cb-color-text-muted);font-size:var(--cb-text-sm, .875rem)}.cb-dataview[data-layout=list] .cb-dataview__item p{flex:1 1 12rem}.cb-dataview__select{align-self:flex-start;margin-top:auto;padding:.35rem .75rem;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);background:transparent;color:var(--cb-color-text);font:inherit;font-size:var(--cb-text-sm, .875rem);cursor:pointer}.cb-dataview[data-layout=list] .cb-dataview__select{margin-top:0;margin-inline-start:auto}.cb-dataview__select[aria-pressed=true]{border-color:var(--cb-color-primary-500);color:var(--cb-color-primary-700);background:color-mix(in srgb,var(--cb-color-primary-500) 12%,transparent)}.cb-dataview__empty{grid-column:1 / -1;margin:0;padding:var(--cb-space-6, 1.5rem);text-align:center;color:var(--cb-color-text-muted)}.cb-dataview__paginator{margin-top:var(--cb-space-3, .75rem)}:host-context([data-theme=\"dark\"]) .cb-dataview__select[aria-pressed=true]{color:var(--cb-color-primary-300)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CbPaginator, selector: "cb-paginator", inputs: ["totalRecords", "rows", "first", "rowsPerPageOptions", "showReport", "maxPageLinks"], outputs: ["rowsChange", "firstChange", "pageChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbDataView, decorators: [{
             type: Component,
@@ -204,6 +206,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                 type="button"
                 class="cb-dataview__select"
                 [attr.aria-pressed]="isSelected(item)"
+                [attr.aria-label]="fmt(t().selectItem, asItem(item).title)"
                 (click)="selection.set(asItem(item))"
               >
                 {{ t().select }}
@@ -219,7 +222,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
     @if (rows() > 0 && value().length > rows()) {
       <cb-paginator class="cb-dataview__paginator" [totalRecords]="value().length" [rows]="rows()" [(first)]="first" />
     }
-  `, styles: [":host{display:block;color:var(--cb-color-text)}.cb-dataview__header{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);margin-bottom:var(--cb-space-3, .75rem)}.cb-dataview__title{min-width:0}.cb-dataview__layouts{display:inline-flex;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);overflow:hidden}.cb-dataview__layout-btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;background:transparent;color:var(--cb-color-text-muted);cursor:pointer}.cb-dataview__layout-btn+.cb-dataview__layout-btn{border-inline-start:1px solid var(--cb-color-border)}.cb-dataview__layout-btn[aria-pressed=true]{color:var(--cb-color-primary-600);background:color-mix(in srgb,var(--cb-color-primary-500) 12%,transparent)}.cb-dataview__layout-btn:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500));outline-offset:-2px}.cb-dataview{display:grid;gap:var(--cb-space-3, .75rem)}.cb-dataview[data-layout=grid]{grid-template-columns:repeat(auto-fill,minmax(min(14rem,100%),1fr))}.cb-dataview__item{height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cb-space-1, .25rem);padding:var(--cb-space-4, 1rem);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, .75rem);background:var(--cb-color-surface-raised)}.cb-dataview[data-layout=list] .cb-dataview__item{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:var(--cb-space-3, .75rem)}.cb-dataview__item-title{color:var(--cb-color-text-strong)}.cb-dataview__item small{color:var(--cb-color-text-muted)}.cb-dataview__item p{margin:0;color:var(--cb-color-text-muted);font-size:var(--cb-text-sm, .875rem)}.cb-dataview[data-layout=list] .cb-dataview__item p{flex:1 1 12rem}.cb-dataview__select{align-self:flex-start;margin-top:auto;padding:.35rem .75rem;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);background:transparent;color:var(--cb-color-text);font:inherit;font-size:var(--cb-text-sm, .875rem);cursor:pointer}.cb-dataview[data-layout=list] .cb-dataview__select{margin-top:0;margin-inline-start:auto}.cb-dataview__select[aria-pressed=true]{border-color:var(--cb-color-primary-500);color:var(--cb-color-primary-700);background:color-mix(in srgb,var(--cb-color-primary-500) 12%,transparent)}.cb-dataview__empty{grid-column:1 / -1;margin:0;padding:var(--cb-space-6, 1.5rem);text-align:center;color:var(--cb-color-text-muted)}.cb-dataview__paginator{margin-top:var(--cb-space-3, .75rem)}:host-context([data-theme=\"dark\"]) .cb-dataview__select[aria-pressed=true]{color:var(--cb-color-primary-300)}\n"] }]
+  `, styles: [":host{display:block;color:var(--cb-color-text)}.cb-dataview__header{display:flex;align-items:center;justify-content:space-between;gap:var(--cb-space-3, .75rem);margin-bottom:var(--cb-space-3, .75rem)}.cb-dataview__title{min-width:0}.cb-dataview__layouts{display:inline-flex;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);overflow:hidden}.cb-dataview__layout-btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;background:transparent;color:var(--cb-color-text-muted);cursor:pointer}.cb-dataview__layout-btn+.cb-dataview__layout-btn{border-inline-start:1px solid var(--cb-color-border)}.cb-dataview__layout-btn[aria-pressed=true]{color:var(--cb-color-primary-text);background:color-mix(in srgb,var(--cb-color-primary-500) 12%,transparent)}.cb-dataview__layout-btn:focus-visible{outline:2px solid var(--cb-color-focus-ring, var(--cb-color-primary-500));outline-offset:-2px}.cb-dataview{display:grid;gap:var(--cb-space-3, .75rem)}.cb-dataview[data-layout=grid]{grid-template-columns:repeat(auto-fill,minmax(min(14rem,100%),1fr))}.cb-dataview__item{height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:var(--cb-space-1, .25rem);padding:var(--cb-space-4, 1rem);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-lg, .75rem);background:var(--cb-color-surface-raised)}.cb-dataview[data-layout=list] .cb-dataview__item{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:var(--cb-space-3, .75rem)}.cb-dataview__item-title{color:var(--cb-color-text-strong)}.cb-dataview__item small{color:var(--cb-color-text-muted)}.cb-dataview__item p{margin:0;color:var(--cb-color-text-muted);font-size:var(--cb-text-sm, .875rem)}.cb-dataview[data-layout=list] .cb-dataview__item p{flex:1 1 12rem}.cb-dataview__select{align-self:flex-start;margin-top:auto;padding:.35rem .75rem;border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md, .5rem);background:transparent;color:var(--cb-color-text);font:inherit;font-size:var(--cb-text-sm, .875rem);cursor:pointer}.cb-dataview[data-layout=list] .cb-dataview__select{margin-top:0;margin-inline-start:auto}.cb-dataview__select[aria-pressed=true]{border-color:var(--cb-color-primary-500);color:var(--cb-color-primary-700);background:color-mix(in srgb,var(--cb-color-primary-500) 12%,transparent)}.cb-dataview__empty{grid-column:1 / -1;margin:0;padding:var(--cb-space-6, 1.5rem);text-align:center;color:var(--cb-color-text-muted)}.cb-dataview__paginator{margin-top:var(--cb-space-3, .75rem)}:host-context([data-theme=\"dark\"]) .cb-dataview__select[aria-pressed=true]{color:var(--cb-color-primary-300)}\n"] }]
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }, { type: i0.Output, args: ["layoutChange"] }], showLayoutToggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLayoutToggle", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], itemTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CbDataViewItemTemplate), { isSignal: true }] }], header: [{ type: i0.ContentChild, args: [i0.forwardRef(() => CbDataViewHeader), { isSignal: true }] }] } });
 function toBoolean(value) {
     return value !== false && value != null && `${value}` !== 'false';

package/fesm2022/caribeng-ui-datepicker.mjs

@@ -1464,7 +1464,7 @@ class CbDatepicker {
         {{ hint() }}
       </p>
     }
-  `, isInline: true, styles: [":host{display:block}.cb-datepicker__label{display:block;margin-bottom:var(--cb-space-1);font-family:var(--cb-font-sans);font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-text)}.cb-datepicker__required{color:var(--cb-color-danger);margin-left:2px}.cb-datepicker{position:relative;display:flex;align-items:stretch;box-sizing:border-box;width:100%;background-color:var(--cb-color-bg);border:var(--cb-border-width) solid var(--cb-color-border-strong);border-radius:var(--cb-radius-md);transition:border-color var(--cb-duration-fast) var(--cb-ease),box-shadow var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker:hover:not(.cb-is-disabled):not(:focus-within){border-color:var(--cb-color-text-muted)}.cb-datepicker:focus-within,.cb-datepicker.cb-is-open{border-color:var(--cb-color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--cb-color-primary-500) 25%,transparent)}.cb-datepicker.cb-is-invalid{border-color:var(--cb-color-danger)}.cb-datepicker.cb-is-invalid:focus-within,.cb-datepicker.cb-is-invalid.cb-is-open{box-shadow:0 0 0 3px color-mix(in srgb,var(--cb-color-danger) 25%,transparent)}.cb-datepicker.cb-is-disabled{background-color:var(--cb-color-surface);opacity:.8}.cb-datepicker__field{flex:1 1 auto;min-width:0;box-sizing:border-box;font-family:var(--cb-font-sans);color:var(--cb-color-text);background:transparent;border:none;border-radius:inherit;cursor:pointer}.cb-datepicker__field::placeholder{color:var(--cb-color-text-muted)}.cb-datepicker__field:focus{outline:none}.cb-datepicker__field:disabled{color:var(--cb-color-text-muted);cursor:not-allowed}.cb-datepicker--sm .cb-datepicker__field{min-height:2rem;padding:var(--cb-space-1) var(--cb-space-2);font-size:var(--cb-text-sm)}.cb-datepicker--md .cb-datepicker__field{min-height:2.5rem;padding:var(--cb-space-2) var(--cb-space-3);font-size:var(--cb-text-base)}.cb-datepicker--lg .cb-datepicker__field{min-height:3rem;padding:var(--cb-space-3) var(--cb-space-4);font-size:var(--cb-text-lg)}.cb-datepicker__btn{display:flex;flex:none;align-items:center;justify-content:center;width:2.5rem;padding:0;color:var(--cb-color-text-muted);background:transparent;border:none;border-left:var(--cb-border-width) solid var(--cb-color-border);cursor:pointer}.cb-datepicker__btn:hover:not(:disabled){color:var(--cb-color-text)}.cb-datepicker__btn:disabled{cursor:not-allowed;opacity:.5}.cb-datepicker__btn cb-icon{color:currentColor}.cb-datepicker__panel{padding:var(--cb-space-3);background-color:var(--cb-color-surface-raised);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md);box-shadow:var(--cb-shadow-md);font-family:var(--cb-font-sans)}.cb-datepicker__panel:focus{outline:none}.cb-datepicker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--cb-space-2)}.cb-datepicker__title{padding:.25rem .5rem;font:inherit;font-size:var(--cb-text-base);font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-strong);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__title:hover:not(.cb-datepicker__title--static){background-color:var(--cb-color-surface-hover)}.cb-datepicker__title:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__title--static{cursor:default}.cb-datepicker__nav-spacer{width:2rem}.cb-datepicker__panel--presets{display:flex;gap:var(--cb-space-3)}.cb-datepicker__presets{display:flex;flex-direction:column;gap:2px;min-width:9rem;padding-right:var(--cb-space-3);border-right:1px solid var(--cb-color-border)}.cb-datepicker__preset{padding:.4rem .65rem;font:inherit;font-size:var(--cb-text-sm);text-align:left;white-space:nowrap;color:var(--cb-color-text);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__preset:hover:not(:disabled){background-color:var(--cb-color-surface-hover)}.cb-datepicker__preset:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__preset.cb-is-selected{font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-strong);background-color:color-mix(in srgb,var(--cb-color-primary-500) 18%,transparent);box-shadow:inset 3px 0 0 var(--cb-color-primary-500)}.cb-datepicker__preset:disabled{opacity:.45;cursor:not-allowed}@media(max-width:40rem){.cb-datepicker__panel--presets{flex-direction:column}.cb-datepicker__presets{flex-direction:row;flex-wrap:wrap;padding:0 0 var(--cb-space-2);border-right:none;border-bottom:1px solid var(--cb-color-border)}}@media(forced-colors:active){.cb-datepicker__preset.cb-is-selected{outline:2px solid Highlight}}.cb-datepicker__months{display:flex;flex-wrap:wrap;gap:var(--cb-space-4)}.cb-datepicker__panel--multi .cb-datepicker__month+.cb-datepicker__month{padding-left:var(--cb-space-4);border-left:1px solid var(--cb-color-border)}@media(max-width:40rem){.cb-datepicker__panel--multi .cb-datepicker__month+.cb-datepicker__month{padding-left:0;border-left:none}}.cb-datepicker__units{display:grid;gap:var(--cb-space-1);min-width:16.5rem}.cb-datepicker__unit-row{display:grid;grid-template-columns:repeat(3,1fr)}.cb-datepicker__unit-cell{padding:2px 0}.cb-datepicker__unit{display:flex;align-items:center;justify-content:center;width:100%;height:2.5rem;font:inherit;font-size:var(--cb-text-sm);color:var(--cb-color-text);text-transform:capitalize;background:transparent;border:none;border-radius:var(--cb-radius-full);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker__unit:hover:not(.cb-is-disabled):not(.cb-is-selected){background-color:var(--cb-color-surface-hover)}.cb-datepicker__unit:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__unit.cb-is-other-month{color:var(--cb-color-text-muted)}.cb-datepicker__unit.cb-is-today:not(.cb-is-selected){font-weight:var(--cb-font-weight-semibold);box-shadow:inset 0 0 0 1px var(--cb-color-primary-500)}.cb-datepicker__unit.cb-is-selected{color:var(--cb-color-primary-contrast);background-color:var(--cb-color-primary-500);font-weight:var(--cb-font-weight-semibold)}.cb-datepicker__unit.cb-is-disabled{color:var(--cb-color-text-muted);opacity:.45;cursor:not-allowed}.cb-datepicker__time+.cb-datepicker__time{margin-top:0;padding-top:var(--cb-space-1);border-top:none}.cb-datepicker__time-caption{min-width:6.5rem;margin-right:var(--cb-space-2);font-size:var(--cb-text-xs);color:var(--cb-color-text-muted)}.cb-datepicker__nav{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;color:var(--cb-color-text-muted);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__nav:hover{background-color:var(--cb-color-surface-hover);color:var(--cb-color-text)}.cb-datepicker__nav:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent)}.cb-datepicker__nav cb-icon{color:currentColor}.cb-datepicker__grid{border-collapse:collapse;width:100%}.cb-datepicker__weekday{padding:var(--cb-space-1);font-size:var(--cb-text-xs);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-text-muted);text-align:center;text-transform:capitalize}.cb-datepicker__cell{padding:1px;text-align:center}.cb-datepicker__day{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;margin:0 auto;font-size:var(--cb-text-sm);color:var(--cb-color-text);background:transparent;border:none;border-radius:var(--cb-radius-full);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker__day:hover:not(.cb-is-disabled):not(.cb-is-selected){background-color:var(--cb-color-surface-hover)}.cb-datepicker__day:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 45%,transparent)}.cb-datepicker__day.cb-is-other-month{color:var(--cb-color-text-muted);opacity:.6}.cb-datepicker__day.cb-is-today:not(.cb-is-selected){font-weight:var(--cb-font-weight-bold);color:var(--cb-color-primary-600)}.cb-datepicker__day.cb-is-selected{color:var(--cb-color-primary-contrast);background-color:var(--cb-color-primary-500);font-weight:var(--cb-font-weight-semibold)}.cb-datepicker__day.cb-is-disabled{color:var(--cb-color-text-muted);opacity:.35;cursor:not-allowed}.cb-datepicker__cell.cb-is-in-range{background-color:color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent)}.cb-datepicker__cell.cb-is-range-start{background:linear-gradient(to right,transparent 50%,color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent) 50%)}.cb-datepicker__cell.cb-is-range-end{background:linear-gradient(to left,transparent 50%,color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent) 50%)}.cb-datepicker__cell.cb-is-range-start.cb-is-range-end{background:none}.cb-datepicker__time{display:flex;align-items:center;justify-content:center;gap:var(--cb-space-1);margin-top:var(--cb-space-2);padding-top:var(--cb-space-2);border-top:1px solid var(--cb-color-border)}.cb-datepicker__time-input{box-sizing:border-box;width:3.25rem;padding:var(--cb-space-1);font-family:inherit;font-size:var(--cb-text-base);font-variant-numeric:tabular-nums;text-align:center;color:var(--cb-color-text);background-color:var(--cb-color-bg);border:1px solid var(--cb-color-border-strong);border-radius:var(--cb-radius-sm)}.cb-datepicker__time-input:focus-visible,.cb-datepicker__period:focus-visible{outline:none;border-color:var(--cb-color-primary-500);box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent)}.cb-datepicker__time-sep{font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-muted)}.cb-datepicker__period{margin-left:var(--cb-space-1);padding:var(--cb-space-1) var(--cb-space-2);font-family:inherit;font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text);background-color:var(--cb-color-surface-hover);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.cb-datepicker__footer{display:flex;justify-content:space-between;margin-top:var(--cb-space-2);padding-top:var(--cb-space-2);border-top:1px solid var(--cb-color-border)}.cb-datepicker__today,.cb-datepicker__clear{padding:var(--cb-space-1) var(--cb-space-2);font-family:inherit;font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-primary-600);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__today:hover,.cb-datepicker__clear:hover{background-color:var(--cb-color-surface-hover)}.cb-datepicker__clear{color:var(--cb-color-text-muted)}.cb-datepicker__message{margin:var(--cb-space-1) 0 0;font-size:var(--cb-text-sm);line-height:var(--cb-line-height-normal)}.cb-datepicker__message--hint{color:var(--cb-color-text-muted)}.cb-datepicker__message--error{color:var(--cb-color-danger)}.cb-datepicker__required--required,.cb-datepicker__required--optional{margin-left:.25rem;color:var(--cb-color-text-muted);font-size:.85em;font-weight:var(--cb-font-weight-normal, 400)}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: CbIcon, selector: "cb-icon", inputs: ["name", "size", "spin", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:block}.cb-datepicker__label{display:block;margin-bottom:var(--cb-space-1);font-family:var(--cb-font-sans);font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-text)}.cb-datepicker__required{color:var(--cb-color-danger);margin-left:2px}.cb-datepicker{position:relative;display:flex;align-items:stretch;box-sizing:border-box;width:100%;background-color:var(--cb-color-bg);border:var(--cb-border-width) solid var(--cb-color-border-strong);border-radius:var(--cb-radius-md);transition:border-color var(--cb-duration-fast) var(--cb-ease),box-shadow var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker:hover:not(.cb-is-disabled):not(:focus-within){border-color:var(--cb-color-text-muted)}.cb-datepicker:focus-within,.cb-datepicker.cb-is-open{border-color:var(--cb-color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--cb-color-primary-500) 25%,transparent)}.cb-datepicker.cb-is-invalid{border-color:var(--cb-color-danger)}.cb-datepicker.cb-is-invalid:focus-within,.cb-datepicker.cb-is-invalid.cb-is-open{box-shadow:0 0 0 3px color-mix(in srgb,var(--cb-color-danger) 25%,transparent)}.cb-datepicker.cb-is-disabled{background-color:var(--cb-color-surface);opacity:.8}.cb-datepicker__field{flex:1 1 auto;min-width:0;box-sizing:border-box;font-family:var(--cb-font-sans);color:var(--cb-color-text);background:transparent;border:none;border-radius:inherit;cursor:pointer}.cb-datepicker__field::placeholder{color:var(--cb-color-text-muted)}.cb-datepicker__field:focus{outline:none}.cb-datepicker__field:disabled{color:var(--cb-color-text-muted);cursor:not-allowed}.cb-datepicker--sm .cb-datepicker__field{min-height:2rem;padding:var(--cb-space-1) var(--cb-space-2);font-size:var(--cb-text-sm)}.cb-datepicker--md .cb-datepicker__field{min-height:2.5rem;padding:var(--cb-space-2) var(--cb-space-3);font-size:var(--cb-text-base)}.cb-datepicker--lg .cb-datepicker__field{min-height:3rem;padding:var(--cb-space-3) var(--cb-space-4);font-size:var(--cb-text-lg)}.cb-datepicker__btn{display:flex;flex:none;align-items:center;justify-content:center;width:2.5rem;padding:0;color:var(--cb-color-text-muted);background:transparent;border:none;border-left:var(--cb-border-width) solid var(--cb-color-border);cursor:pointer}.cb-datepicker__btn:hover:not(:disabled){color:var(--cb-color-text)}.cb-datepicker__btn:disabled{cursor:not-allowed;opacity:.5}.cb-datepicker__btn cb-icon{color:currentColor}.cb-datepicker__panel{padding:var(--cb-space-3);background-color:var(--cb-color-surface-raised);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md);box-shadow:var(--cb-shadow-md);font-family:var(--cb-font-sans)}.cb-datepicker__panel:focus{outline:none}.cb-datepicker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--cb-space-2)}.cb-datepicker__title{padding:.25rem .5rem;font:inherit;font-size:var(--cb-text-base);font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-strong);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__title:hover:not(.cb-datepicker__title--static){background-color:var(--cb-color-surface-hover)}.cb-datepicker__title:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__title--static{cursor:default}.cb-datepicker__nav-spacer{width:2rem}.cb-datepicker__panel--presets{display:flex;gap:var(--cb-space-3)}.cb-datepicker__presets{display:flex;flex-direction:column;gap:2px;min-width:9rem;padding-right:var(--cb-space-3);border-right:1px solid var(--cb-color-border)}.cb-datepicker__preset{padding:.4rem .65rem;font:inherit;font-size:var(--cb-text-sm);text-align:left;white-space:nowrap;color:var(--cb-color-text);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__preset:hover:not(:disabled){background-color:var(--cb-color-surface-hover)}.cb-datepicker__preset:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__preset.cb-is-selected{font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-strong);background-color:color-mix(in srgb,var(--cb-color-primary-500) 18%,transparent);box-shadow:inset 3px 0 0 var(--cb-color-primary-500)}.cb-datepicker__preset:disabled{opacity:.45;cursor:not-allowed}@media(max-width:40rem){.cb-datepicker__panel--presets{flex-direction:column}.cb-datepicker__presets{flex-direction:row;flex-wrap:wrap;padding:0 0 var(--cb-space-2);border-right:none;border-bottom:1px solid var(--cb-color-border)}}@media(forced-colors:active){.cb-datepicker__preset.cb-is-selected{outline:2px solid Highlight}}.cb-datepicker__months{display:flex;flex-wrap:wrap;gap:var(--cb-space-4)}.cb-datepicker__panel--multi .cb-datepicker__month+.cb-datepicker__month{padding-left:var(--cb-space-4);border-left:1px solid var(--cb-color-border)}@media(max-width:40rem){.cb-datepicker__panel--multi .cb-datepicker__month+.cb-datepicker__month{padding-left:0;border-left:none}}.cb-datepicker__units{display:grid;gap:var(--cb-space-1);min-width:16.5rem}.cb-datepicker__unit-row{display:grid;grid-template-columns:repeat(3,1fr)}.cb-datepicker__unit-cell{padding:2px 0}.cb-datepicker__unit{display:flex;align-items:center;justify-content:center;width:100%;height:2.5rem;font:inherit;font-size:var(--cb-text-sm);color:var(--cb-color-text);text-transform:capitalize;background:transparent;border:none;border-radius:var(--cb-radius-full);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker__unit:hover:not(.cb-is-disabled):not(.cb-is-selected){background-color:var(--cb-color-surface-hover)}.cb-datepicker__unit:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__unit.cb-is-other-month{color:var(--cb-color-text-muted)}.cb-datepicker__unit.cb-is-today:not(.cb-is-selected){font-weight:var(--cb-font-weight-semibold);box-shadow:inset 0 0 0 1px var(--cb-color-primary-500)}.cb-datepicker__unit.cb-is-selected{color:var(--cb-color-primary-contrast);background-color:var(--cb-color-primary-500);font-weight:var(--cb-font-weight-semibold)}.cb-datepicker__unit.cb-is-disabled{color:var(--cb-color-text-muted);opacity:.45;cursor:not-allowed}.cb-datepicker__time+.cb-datepicker__time{margin-top:0;padding-top:var(--cb-space-1);border-top:none}.cb-datepicker__time-caption{min-width:6.5rem;margin-right:var(--cb-space-2);font-size:var(--cb-text-xs);color:var(--cb-color-text-muted)}.cb-datepicker__nav{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;color:var(--cb-color-text-muted);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__nav:hover{background-color:var(--cb-color-surface-hover);color:var(--cb-color-text)}.cb-datepicker__nav:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent)}.cb-datepicker__nav cb-icon{color:currentColor}.cb-datepicker__grid{border-collapse:collapse;width:100%}.cb-datepicker__weekday{padding:var(--cb-space-1);font-size:var(--cb-text-xs);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-text-muted);text-align:center;text-transform:capitalize}.cb-datepicker__cell{padding:1px;text-align:center}.cb-datepicker__day{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;margin:0 auto;font-size:var(--cb-text-sm);color:var(--cb-color-text);background:transparent;border:none;border-radius:var(--cb-radius-full);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker__day:hover:not(.cb-is-disabled):not(.cb-is-selected){background-color:var(--cb-color-surface-hover)}.cb-datepicker__day:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 45%,transparent)}.cb-datepicker__day.cb-is-other-month{color:var(--cb-color-text-muted);opacity:.6}.cb-datepicker__day.cb-is-today:not(.cb-is-selected){font-weight:var(--cb-font-weight-bold);color:var(--cb-color-primary-text)}.cb-datepicker__day.cb-is-selected{color:var(--cb-color-primary-contrast);background-color:var(--cb-color-primary-500);font-weight:var(--cb-font-weight-semibold)}.cb-datepicker__day.cb-is-disabled{color:var(--cb-color-text-muted);opacity:.35;cursor:not-allowed}.cb-datepicker__cell.cb-is-in-range{background-color:color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent)}.cb-datepicker__cell.cb-is-range-start{background:linear-gradient(to right,transparent 50%,color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent) 50%)}.cb-datepicker__cell.cb-is-range-end{background:linear-gradient(to left,transparent 50%,color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent) 50%)}.cb-datepicker__cell.cb-is-range-start.cb-is-range-end{background:none}.cb-datepicker__time{display:flex;align-items:center;justify-content:center;gap:var(--cb-space-1);margin-top:var(--cb-space-2);padding-top:var(--cb-space-2);border-top:1px solid var(--cb-color-border)}.cb-datepicker__time-input{box-sizing:border-box;width:3.25rem;padding:var(--cb-space-1);font-family:inherit;font-size:var(--cb-text-base);font-variant-numeric:tabular-nums;text-align:center;color:var(--cb-color-text);background-color:var(--cb-color-bg);border:1px solid var(--cb-color-border-strong);border-radius:var(--cb-radius-sm)}.cb-datepicker__time-input:focus-visible,.cb-datepicker__period:focus-visible{outline:none;border-color:var(--cb-color-primary-500);box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent)}.cb-datepicker__time-sep{font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-muted)}.cb-datepicker__period{margin-left:var(--cb-space-1);padding:var(--cb-space-1) var(--cb-space-2);font-family:inherit;font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text);background-color:var(--cb-color-surface-hover);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.cb-datepicker__footer{display:flex;justify-content:space-between;margin-top:var(--cb-space-2);padding-top:var(--cb-space-2);border-top:1px solid var(--cb-color-border)}.cb-datepicker__today,.cb-datepicker__clear{padding:var(--cb-space-1) var(--cb-space-2);font-family:inherit;font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-primary-text);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__today:hover,.cb-datepicker__clear:hover{background-color:var(--cb-color-surface-hover)}.cb-datepicker__clear{color:var(--cb-color-text-muted)}.cb-datepicker__message{margin:var(--cb-space-1) 0 0;font-size:var(--cb-text-sm);line-height:var(--cb-line-height-normal)}.cb-datepicker__message--hint{color:var(--cb-color-text-muted)}.cb-datepicker__message--error{color:var(--cb-color-danger)}.cb-datepicker__required--required,.cb-datepicker__required--optional{margin-left:.25rem;color:var(--cb-color-text-muted);font-size:.85em;font-weight:var(--cb-font-weight-normal, 400)}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: CbIcon, selector: "cb-icon", inputs: ["name", "size", "spin", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbDatepicker, decorators: [{
             type: Component,
@@ -1786,7 +1786,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
         {{ hint() }}
       </p>
     }
-  `, styles: [":host{display:block}.cb-datepicker__label{display:block;margin-bottom:var(--cb-space-1);font-family:var(--cb-font-sans);font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-text)}.cb-datepicker__required{color:var(--cb-color-danger);margin-left:2px}.cb-datepicker{position:relative;display:flex;align-items:stretch;box-sizing:border-box;width:100%;background-color:var(--cb-color-bg);border:var(--cb-border-width) solid var(--cb-color-border-strong);border-radius:var(--cb-radius-md);transition:border-color var(--cb-duration-fast) var(--cb-ease),box-shadow var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker:hover:not(.cb-is-disabled):not(:focus-within){border-color:var(--cb-color-text-muted)}.cb-datepicker:focus-within,.cb-datepicker.cb-is-open{border-color:var(--cb-color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--cb-color-primary-500) 25%,transparent)}.cb-datepicker.cb-is-invalid{border-color:var(--cb-color-danger)}.cb-datepicker.cb-is-invalid:focus-within,.cb-datepicker.cb-is-invalid.cb-is-open{box-shadow:0 0 0 3px color-mix(in srgb,var(--cb-color-danger) 25%,transparent)}.cb-datepicker.cb-is-disabled{background-color:var(--cb-color-surface);opacity:.8}.cb-datepicker__field{flex:1 1 auto;min-width:0;box-sizing:border-box;font-family:var(--cb-font-sans);color:var(--cb-color-text);background:transparent;border:none;border-radius:inherit;cursor:pointer}.cb-datepicker__field::placeholder{color:var(--cb-color-text-muted)}.cb-datepicker__field:focus{outline:none}.cb-datepicker__field:disabled{color:var(--cb-color-text-muted);cursor:not-allowed}.cb-datepicker--sm .cb-datepicker__field{min-height:2rem;padding:var(--cb-space-1) var(--cb-space-2);font-size:var(--cb-text-sm)}.cb-datepicker--md .cb-datepicker__field{min-height:2.5rem;padding:var(--cb-space-2) var(--cb-space-3);font-size:var(--cb-text-base)}.cb-datepicker--lg .cb-datepicker__field{min-height:3rem;padding:var(--cb-space-3) var(--cb-space-4);font-size:var(--cb-text-lg)}.cb-datepicker__btn{display:flex;flex:none;align-items:center;justify-content:center;width:2.5rem;padding:0;color:var(--cb-color-text-muted);background:transparent;border:none;border-left:var(--cb-border-width) solid var(--cb-color-border);cursor:pointer}.cb-datepicker__btn:hover:not(:disabled){color:var(--cb-color-text)}.cb-datepicker__btn:disabled{cursor:not-allowed;opacity:.5}.cb-datepicker__btn cb-icon{color:currentColor}.cb-datepicker__panel{padding:var(--cb-space-3);background-color:var(--cb-color-surface-raised);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md);box-shadow:var(--cb-shadow-md);font-family:var(--cb-font-sans)}.cb-datepicker__panel:focus{outline:none}.cb-datepicker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--cb-space-2)}.cb-datepicker__title{padding:.25rem .5rem;font:inherit;font-size:var(--cb-text-base);font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-strong);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__title:hover:not(.cb-datepicker__title--static){background-color:var(--cb-color-surface-hover)}.cb-datepicker__title:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__title--static{cursor:default}.cb-datepicker__nav-spacer{width:2rem}.cb-datepicker__panel--presets{display:flex;gap:var(--cb-space-3)}.cb-datepicker__presets{display:flex;flex-direction:column;gap:2px;min-width:9rem;padding-right:var(--cb-space-3);border-right:1px solid var(--cb-color-border)}.cb-datepicker__preset{padding:.4rem .65rem;font:inherit;font-size:var(--cb-text-sm);text-align:left;white-space:nowrap;color:var(--cb-color-text);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__preset:hover:not(:disabled){background-color:var(--cb-color-surface-hover)}.cb-datepicker__preset:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__preset.cb-is-selected{font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-strong);background-color:color-mix(in srgb,var(--cb-color-primary-500) 18%,transparent);box-shadow:inset 3px 0 0 var(--cb-color-primary-500)}.cb-datepicker__preset:disabled{opacity:.45;cursor:not-allowed}@media(max-width:40rem){.cb-datepicker__panel--presets{flex-direction:column}.cb-datepicker__presets{flex-direction:row;flex-wrap:wrap;padding:0 0 var(--cb-space-2);border-right:none;border-bottom:1px solid var(--cb-color-border)}}@media(forced-colors:active){.cb-datepicker__preset.cb-is-selected{outline:2px solid Highlight}}.cb-datepicker__months{display:flex;flex-wrap:wrap;gap:var(--cb-space-4)}.cb-datepicker__panel--multi .cb-datepicker__month+.cb-datepicker__month{padding-left:var(--cb-space-4);border-left:1px solid var(--cb-color-border)}@media(max-width:40rem){.cb-datepicker__panel--multi .cb-datepicker__month+.cb-datepicker__month{padding-left:0;border-left:none}}.cb-datepicker__units{display:grid;gap:var(--cb-space-1);min-width:16.5rem}.cb-datepicker__unit-row{display:grid;grid-template-columns:repeat(3,1fr)}.cb-datepicker__unit-cell{padding:2px 0}.cb-datepicker__unit{display:flex;align-items:center;justify-content:center;width:100%;height:2.5rem;font:inherit;font-size:var(--cb-text-sm);color:var(--cb-color-text);text-transform:capitalize;background:transparent;border:none;border-radius:var(--cb-radius-full);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker__unit:hover:not(.cb-is-disabled):not(.cb-is-selected){background-color:var(--cb-color-surface-hover)}.cb-datepicker__unit:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__unit.cb-is-other-month{color:var(--cb-color-text-muted)}.cb-datepicker__unit.cb-is-today:not(.cb-is-selected){font-weight:var(--cb-font-weight-semibold);box-shadow:inset 0 0 0 1px var(--cb-color-primary-500)}.cb-datepicker__unit.cb-is-selected{color:var(--cb-color-primary-contrast);background-color:var(--cb-color-primary-500);font-weight:var(--cb-font-weight-semibold)}.cb-datepicker__unit.cb-is-disabled{color:var(--cb-color-text-muted);opacity:.45;cursor:not-allowed}.cb-datepicker__time+.cb-datepicker__time{margin-top:0;padding-top:var(--cb-space-1);border-top:none}.cb-datepicker__time-caption{min-width:6.5rem;margin-right:var(--cb-space-2);font-size:var(--cb-text-xs);color:var(--cb-color-text-muted)}.cb-datepicker__nav{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;color:var(--cb-color-text-muted);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__nav:hover{background-color:var(--cb-color-surface-hover);color:var(--cb-color-text)}.cb-datepicker__nav:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent)}.cb-datepicker__nav cb-icon{color:currentColor}.cb-datepicker__grid{border-collapse:collapse;width:100%}.cb-datepicker__weekday{padding:var(--cb-space-1);font-size:var(--cb-text-xs);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-text-muted);text-align:center;text-transform:capitalize}.cb-datepicker__cell{padding:1px;text-align:center}.cb-datepicker__day{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;margin:0 auto;font-size:var(--cb-text-sm);color:var(--cb-color-text);background:transparent;border:none;border-radius:var(--cb-radius-full);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker__day:hover:not(.cb-is-disabled):not(.cb-is-selected){background-color:var(--cb-color-surface-hover)}.cb-datepicker__day:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 45%,transparent)}.cb-datepicker__day.cb-is-other-month{color:var(--cb-color-text-muted);opacity:.6}.cb-datepicker__day.cb-is-today:not(.cb-is-selected){font-weight:var(--cb-font-weight-bold);color:var(--cb-color-primary-600)}.cb-datepicker__day.cb-is-selected{color:var(--cb-color-primary-contrast);background-color:var(--cb-color-primary-500);font-weight:var(--cb-font-weight-semibold)}.cb-datepicker__day.cb-is-disabled{color:var(--cb-color-text-muted);opacity:.35;cursor:not-allowed}.cb-datepicker__cell.cb-is-in-range{background-color:color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent)}.cb-datepicker__cell.cb-is-range-start{background:linear-gradient(to right,transparent 50%,color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent) 50%)}.cb-datepicker__cell.cb-is-range-end{background:linear-gradient(to left,transparent 50%,color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent) 50%)}.cb-datepicker__cell.cb-is-range-start.cb-is-range-end{background:none}.cb-datepicker__time{display:flex;align-items:center;justify-content:center;gap:var(--cb-space-1);margin-top:var(--cb-space-2);padding-top:var(--cb-space-2);border-top:1px solid var(--cb-color-border)}.cb-datepicker__time-input{box-sizing:border-box;width:3.25rem;padding:var(--cb-space-1);font-family:inherit;font-size:var(--cb-text-base);font-variant-numeric:tabular-nums;text-align:center;color:var(--cb-color-text);background-color:var(--cb-color-bg);border:1px solid var(--cb-color-border-strong);border-radius:var(--cb-radius-sm)}.cb-datepicker__time-input:focus-visible,.cb-datepicker__period:focus-visible{outline:none;border-color:var(--cb-color-primary-500);box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent)}.cb-datepicker__time-sep{font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-muted)}.cb-datepicker__period{margin-left:var(--cb-space-1);padding:var(--cb-space-1) var(--cb-space-2);font-family:inherit;font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text);background-color:var(--cb-color-surface-hover);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.cb-datepicker__footer{display:flex;justify-content:space-between;margin-top:var(--cb-space-2);padding-top:var(--cb-space-2);border-top:1px solid var(--cb-color-border)}.cb-datepicker__today,.cb-datepicker__clear{padding:var(--cb-space-1) var(--cb-space-2);font-family:inherit;font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-primary-600);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__today:hover,.cb-datepicker__clear:hover{background-color:var(--cb-color-surface-hover)}.cb-datepicker__clear{color:var(--cb-color-text-muted)}.cb-datepicker__message{margin:var(--cb-space-1) 0 0;font-size:var(--cb-text-sm);line-height:var(--cb-line-height-normal)}.cb-datepicker__message--hint{color:var(--cb-color-text-muted)}.cb-datepicker__message--error{color:var(--cb-color-danger)}.cb-datepicker__required--required,.cb-datepicker__required--optional{margin-left:.25rem;color:var(--cb-color-text-muted);font-size:.85em;font-weight:var(--cb-font-weight-normal, 400)}\n"] }]
+  `, styles: [":host{display:block}.cb-datepicker__label{display:block;margin-bottom:var(--cb-space-1);font-family:var(--cb-font-sans);font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-text)}.cb-datepicker__required{color:var(--cb-color-danger);margin-left:2px}.cb-datepicker{position:relative;display:flex;align-items:stretch;box-sizing:border-box;width:100%;background-color:var(--cb-color-bg);border:var(--cb-border-width) solid var(--cb-color-border-strong);border-radius:var(--cb-radius-md);transition:border-color var(--cb-duration-fast) var(--cb-ease),box-shadow var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker:hover:not(.cb-is-disabled):not(:focus-within){border-color:var(--cb-color-text-muted)}.cb-datepicker:focus-within,.cb-datepicker.cb-is-open{border-color:var(--cb-color-primary-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--cb-color-primary-500) 25%,transparent)}.cb-datepicker.cb-is-invalid{border-color:var(--cb-color-danger)}.cb-datepicker.cb-is-invalid:focus-within,.cb-datepicker.cb-is-invalid.cb-is-open{box-shadow:0 0 0 3px color-mix(in srgb,var(--cb-color-danger) 25%,transparent)}.cb-datepicker.cb-is-disabled{background-color:var(--cb-color-surface);opacity:.8}.cb-datepicker__field{flex:1 1 auto;min-width:0;box-sizing:border-box;font-family:var(--cb-font-sans);color:var(--cb-color-text);background:transparent;border:none;border-radius:inherit;cursor:pointer}.cb-datepicker__field::placeholder{color:var(--cb-color-text-muted)}.cb-datepicker__field:focus{outline:none}.cb-datepicker__field:disabled{color:var(--cb-color-text-muted);cursor:not-allowed}.cb-datepicker--sm .cb-datepicker__field{min-height:2rem;padding:var(--cb-space-1) var(--cb-space-2);font-size:var(--cb-text-sm)}.cb-datepicker--md .cb-datepicker__field{min-height:2.5rem;padding:var(--cb-space-2) var(--cb-space-3);font-size:var(--cb-text-base)}.cb-datepicker--lg .cb-datepicker__field{min-height:3rem;padding:var(--cb-space-3) var(--cb-space-4);font-size:var(--cb-text-lg)}.cb-datepicker__btn{display:flex;flex:none;align-items:center;justify-content:center;width:2.5rem;padding:0;color:var(--cb-color-text-muted);background:transparent;border:none;border-left:var(--cb-border-width) solid var(--cb-color-border);cursor:pointer}.cb-datepicker__btn:hover:not(:disabled){color:var(--cb-color-text)}.cb-datepicker__btn:disabled{cursor:not-allowed;opacity:.5}.cb-datepicker__btn cb-icon{color:currentColor}.cb-datepicker__panel{padding:var(--cb-space-3);background-color:var(--cb-color-surface-raised);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-md);box-shadow:var(--cb-shadow-md);font-family:var(--cb-font-sans)}.cb-datepicker__panel:focus{outline:none}.cb-datepicker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--cb-space-2)}.cb-datepicker__title{padding:.25rem .5rem;font:inherit;font-size:var(--cb-text-base);font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-strong);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__title:hover:not(.cb-datepicker__title--static){background-color:var(--cb-color-surface-hover)}.cb-datepicker__title:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__title--static{cursor:default}.cb-datepicker__nav-spacer{width:2rem}.cb-datepicker__panel--presets{display:flex;gap:var(--cb-space-3)}.cb-datepicker__presets{display:flex;flex-direction:column;gap:2px;min-width:9rem;padding-right:var(--cb-space-3);border-right:1px solid var(--cb-color-border)}.cb-datepicker__preset{padding:.4rem .65rem;font:inherit;font-size:var(--cb-text-sm);text-align:left;white-space:nowrap;color:var(--cb-color-text);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__preset:hover:not(:disabled){background-color:var(--cb-color-surface-hover)}.cb-datepicker__preset:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__preset.cb-is-selected{font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-strong);background-color:color-mix(in srgb,var(--cb-color-primary-500) 18%,transparent);box-shadow:inset 3px 0 0 var(--cb-color-primary-500)}.cb-datepicker__preset:disabled{opacity:.45;cursor:not-allowed}@media(max-width:40rem){.cb-datepicker__panel--presets{flex-direction:column}.cb-datepicker__presets{flex-direction:row;flex-wrap:wrap;padding:0 0 var(--cb-space-2);border-right:none;border-bottom:1px solid var(--cb-color-border)}}@media(forced-colors:active){.cb-datepicker__preset.cb-is-selected{outline:2px solid Highlight}}.cb-datepicker__months{display:flex;flex-wrap:wrap;gap:var(--cb-space-4)}.cb-datepicker__panel--multi .cb-datepicker__month+.cb-datepicker__month{padding-left:var(--cb-space-4);border-left:1px solid var(--cb-color-border)}@media(max-width:40rem){.cb-datepicker__panel--multi .cb-datepicker__month+.cb-datepicker__month{padding-left:0;border-left:none}}.cb-datepicker__units{display:grid;gap:var(--cb-space-1);min-width:16.5rem}.cb-datepicker__unit-row{display:grid;grid-template-columns:repeat(3,1fr)}.cb-datepicker__unit-cell{padding:2px 0}.cb-datepicker__unit{display:flex;align-items:center;justify-content:center;width:100%;height:2.5rem;font:inherit;font-size:var(--cb-text-sm);color:var(--cb-color-text);text-transform:capitalize;background:transparent;border:none;border-radius:var(--cb-radius-full);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker__unit:hover:not(.cb-is-disabled):not(.cb-is-selected){background-color:var(--cb-color-surface-hover)}.cb-datepicker__unit:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:1px}.cb-datepicker__unit.cb-is-other-month{color:var(--cb-color-text-muted)}.cb-datepicker__unit.cb-is-today:not(.cb-is-selected){font-weight:var(--cb-font-weight-semibold);box-shadow:inset 0 0 0 1px var(--cb-color-primary-500)}.cb-datepicker__unit.cb-is-selected{color:var(--cb-color-primary-contrast);background-color:var(--cb-color-primary-500);font-weight:var(--cb-font-weight-semibold)}.cb-datepicker__unit.cb-is-disabled{color:var(--cb-color-text-muted);opacity:.45;cursor:not-allowed}.cb-datepicker__time+.cb-datepicker__time{margin-top:0;padding-top:var(--cb-space-1);border-top:none}.cb-datepicker__time-caption{min-width:6.5rem;margin-right:var(--cb-space-2);font-size:var(--cb-text-xs);color:var(--cb-color-text-muted)}.cb-datepicker__nav{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;color:var(--cb-color-text-muted);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__nav:hover{background-color:var(--cb-color-surface-hover);color:var(--cb-color-text)}.cb-datepicker__nav:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent)}.cb-datepicker__nav cb-icon{color:currentColor}.cb-datepicker__grid{border-collapse:collapse;width:100%}.cb-datepicker__weekday{padding:var(--cb-space-1);font-size:var(--cb-text-xs);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-text-muted);text-align:center;text-transform:capitalize}.cb-datepicker__cell{padding:1px;text-align:center}.cb-datepicker__day{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;margin:0 auto;font-size:var(--cb-text-sm);color:var(--cb-color-text);background:transparent;border:none;border-radius:var(--cb-radius-full);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-datepicker__day:hover:not(.cb-is-disabled):not(.cb-is-selected){background-color:var(--cb-color-surface-hover)}.cb-datepicker__day:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 45%,transparent)}.cb-datepicker__day.cb-is-other-month{color:var(--cb-color-text-muted);opacity:.6}.cb-datepicker__day.cb-is-today:not(.cb-is-selected){font-weight:var(--cb-font-weight-bold);color:var(--cb-color-primary-text)}.cb-datepicker__day.cb-is-selected{color:var(--cb-color-primary-contrast);background-color:var(--cb-color-primary-500);font-weight:var(--cb-font-weight-semibold)}.cb-datepicker__day.cb-is-disabled{color:var(--cb-color-text-muted);opacity:.35;cursor:not-allowed}.cb-datepicker__cell.cb-is-in-range{background-color:color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent)}.cb-datepicker__cell.cb-is-range-start{background:linear-gradient(to right,transparent 50%,color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent) 50%)}.cb-datepicker__cell.cb-is-range-end{background:linear-gradient(to left,transparent 50%,color-mix(in srgb,var(--cb-color-primary-500) 14%,transparent) 50%)}.cb-datepicker__cell.cb-is-range-start.cb-is-range-end{background:none}.cb-datepicker__time{display:flex;align-items:center;justify-content:center;gap:var(--cb-space-1);margin-top:var(--cb-space-2);padding-top:var(--cb-space-2);border-top:1px solid var(--cb-color-border)}.cb-datepicker__time-input{box-sizing:border-box;width:3.25rem;padding:var(--cb-space-1);font-family:inherit;font-size:var(--cb-text-base);font-variant-numeric:tabular-nums;text-align:center;color:var(--cb-color-text);background-color:var(--cb-color-bg);border:1px solid var(--cb-color-border-strong);border-radius:var(--cb-radius-sm)}.cb-datepicker__time-input:focus-visible,.cb-datepicker__period:focus-visible{outline:none;border-color:var(--cb-color-primary-500);box-shadow:0 0 0 2px color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent)}.cb-datepicker__time-sep{font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text-muted)}.cb-datepicker__period{margin-left:var(--cb-space-1);padding:var(--cb-space-1) var(--cb-space-2);font-family:inherit;font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-semibold);color:var(--cb-color-text);background-color:var(--cb-color-surface-hover);border:1px solid var(--cb-color-border);border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.cb-datepicker__footer{display:flex;justify-content:space-between;margin-top:var(--cb-space-2);padding-top:var(--cb-space-2);border-top:1px solid var(--cb-color-border)}.cb-datepicker__today,.cb-datepicker__clear{padding:var(--cb-space-1) var(--cb-space-2);font-family:inherit;font-size:var(--cb-text-sm);font-weight:var(--cb-font-weight-medium);color:var(--cb-color-primary-text);background:transparent;border:none;border-radius:var(--cb-radius-sm);cursor:pointer}.cb-datepicker__today:hover,.cb-datepicker__clear:hover{background-color:var(--cb-color-surface-hover)}.cb-datepicker__clear{color:var(--cb-color-text-muted)}.cb-datepicker__message{margin:var(--cb-space-1) 0 0;font-size:var(--cb-text-sm);line-height:var(--cb-line-height-normal)}.cb-datepicker__message--hint{color:var(--cb-color-text-muted)}.cb-datepicker__message--error{color:var(--cb-color-danger)}.cb-datepicker__required--required,.cb-datepicker__required--optional{margin-left:.25rem;color:var(--cb-color-text-muted);font-size:.85em;font-weight:var(--cb-font-weight-normal, 400)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }, { type: i0.Output, args: ["rangeChange"] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], requiredIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "requiredIndicator", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], firstDayOfWeek: [{ type: i0.Input, args: [{ isSignal: true, alias: "firstDayOfWeek", required: false }] }], minDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDate", required: false }] }], maxDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDate", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], view: [{ type: i0.Input, args: [{ isSignal: true, alias: "view", required: false }] }], numberOfMonths: [{ type: i0.Input, args: [{ isSignal: true, alias: "numberOfMonths", required: false }] }], showTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTime", required: false }] }], hourFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "hourFormat", required: false }] }], stepMinute: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepMinute", required: false }] }], dateFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFormat", required: false }] }], editable: [{ type: i0.Input, args: [{ isSignal: true, alias: "editable", required: false }] }], presets: [{ type: i0.Input, args: [{ isSignal: true, alias: "presets", required: false }] }], fieldRef: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }], panelRef: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });
 /** Rango de un atajo predefinido, relativo a hoy. */
 function presetRange(key) {

package/fesm2022/caribeng-ui-dock.mjs

@@ -1,11 +1,17 @@
 import * as i0 from '@angular/core';
-import { input, output, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { inject, ElementRef, input, output, computed, signal, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
 import { CbIcon } from '@caribeng/ui/icon';
 import { injectCbTranslation } from '@caribeng/ui';
 
-/** Compact application launcher with configurable orientation. */
+/**
+ * Compact application launcher with configurable orientation.
+ *
+ * Sigue el patrón WAI-ARIA *toolbar*: un solo elemento entra en el orden de
+ * tabulación y las flechas (según la orientación), Inicio y Fin recorren el resto.
+ */
 class CbDock {
     constructor() {
+        this.host = inject(ElementRef);
         /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
         this.t = injectCbTranslation();
         this.items = input([], /* @ts-ignore */
@@ -15,19 +21,53 @@ class CbDock {
         this.ariaLabel = input(undefined, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
         this.itemSelect = output();
+        this.vertical = computed(() => this.position() === 'left' || this.position() === 'right', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "vertical" }] : /* istanbul ignore next */ []));
+        /** Último elemento enfocado (el que recibe Tab al volver). */
+        this.active = signal(0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+        /** Elemento con `tabindex="0"`: el activo si se puede enfocar, si no el primero habilitado. */
+        this.tabStop = computed(() => {
+            const items = this.items();
+            if (items[this.active()] && !items[this.active()].disabled)
+                return this.active();
+            return items.findIndex((item) => !item.disabled);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "tabStop" }] : /* istanbul ignore next */ []));
     }
     select(item) { if (!item.disabled)
         this.itemSelect.emit(item); }
+    onKeydown(event) {
+        const [prev, next] = this.vertical() ? ['ArrowUp', 'ArrowDown'] : ['ArrowLeft', 'ArrowRight'];
+        const enabled = this.items().flatMap((item, i) => (item.disabled ? [] : [i]));
+        if (!enabled.length)
+            return;
+        const at = enabled.indexOf(this.tabStop());
+        let target;
+        if (event.key === next)
+            target = enabled[(at + 1) % enabled.length];
+        else if (event.key === prev)
+            target = enabled[(at - 1 + enabled.length) % enabled.length];
+        else if (event.key === 'Home')
+            target = enabled[0];
+        else if (event.key === 'End')
+            target = enabled[enabled.length - 1];
+        else
+            return;
+        event.preventDefault();
+        this.active.set(target);
+        this.host.nativeElement.querySelectorAll('.cb-dock__item')[target]?.focus();
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbDock, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbDock, isStandalone: true, selector: "cb-dock", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelect: "itemSelect" }, host: { properties: { "class.cb-dock--top": "position() === \"top\"", "class.cb-dock--right": "position() === \"right\"", "class.cb-dock--bottom": "position() === \"bottom\"", "class.cb-dock--left": "position() === \"left\"" }, classAttribute: "cb-dock" }, ngImport: i0, template: `
     <nav [attr.aria-label]="(ariaLabel() ?? t().appDock)">
-      <ul class="cb-dock__list" role="toolbar" [attr.aria-orientation]="position() === 'left' || position() === 'right' ? 'vertical' : 'horizontal'">
-        @for (item of items(); track $index) {
-          <li>
+      <ul class="cb-dock__list" role="toolbar" [attr.aria-orientation]="vertical() ? 'vertical' : 'horizontal'" (keydown)="onKeydown($event)">
+        @for (item of items(); track $index; let i = $index) {
+          <li role="none">
             @if (item.url && !item.disabled) {
-              <a class="cb-dock__item" [href]="item.url" [attr.aria-label]="item.label" [title]="item.label" (click)="select(item)"><cb-icon [name]="item.icon" [size]="22" aria-hidden="true" /></a>
+              <a class="cb-dock__item" [href]="item.url" [attr.tabindex]="i === tabStop() ? 0 : -1" [attr.aria-label]="item.label" [title]="item.label" (click)="select(item)" (focus)="active.set(i)"><cb-icon [name]="item.icon" [size]="22" aria-hidden="true" /></a>
             } @else {
-              <button class="cb-dock__item" type="button" [disabled]="item.disabled" [attr.aria-label]="item.label" [title]="item.label" (click)="select(item)"><cb-icon [name]="item.icon" [size]="22" aria-hidden="true" /></button>
+              <button class="cb-dock__item" type="button" [disabled]="item.disabled" [attr.tabindex]="i === tabStop() ? 0 : -1" [attr.aria-label]="item.label" [title]="item.label" (click)="select(item)" (focus)="active.set(i)"><cb-icon [name]="item.icon" [size]="22" aria-hidden="true" /></button>
             }
           </li>
         }
@@ -45,13 +85,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                         '[class.cb-dock--left]': 'position() === "left"',
                     }, template: `
     <nav [attr.aria-label]="(ariaLabel() ?? t().appDock)">
-      <ul class="cb-dock__list" role="toolbar" [attr.aria-orientation]="position() === 'left' || position() === 'right' ? 'vertical' : 'horizontal'">
-        @for (item of items(); track $index) {
-          <li>
+      <ul class="cb-dock__list" role="toolbar" [attr.aria-orientation]="vertical() ? 'vertical' : 'horizontal'" (keydown)="onKeydown($event)">
+        @for (item of items(); track $index; let i = $index) {
+          <li role="none">
             @if (item.url && !item.disabled) {
-              <a class="cb-dock__item" [href]="item.url" [attr.aria-label]="item.label" [title]="item.label" (click)="select(item)"><cb-icon [name]="item.icon" [size]="22" aria-hidden="true" /></a>
+              <a class="cb-dock__item" [href]="item.url" [attr.tabindex]="i === tabStop() ? 0 : -1" [attr.aria-label]="item.label" [title]="item.label" (click)="select(item)" (focus)="active.set(i)"><cb-icon [name]="item.icon" [size]="22" aria-hidden="true" /></a>
             } @else {
-              <button class="cb-dock__item" type="button" [disabled]="item.disabled" [attr.aria-label]="item.label" [title]="item.label" (click)="select(item)"><cb-icon [name]="item.icon" [size]="22" aria-hidden="true" /></button>
+              <button class="cb-dock__item" type="button" [disabled]="item.disabled" [attr.tabindex]="i === tabStop() ? 0 : -1" [attr.aria-label]="item.label" [title]="item.label" (click)="select(item)" (focus)="active.set(i)"><cb-icon [name]="item.icon" [size]="22" aria-hidden="true" /></button>
             }
           </li>
         }