@slotted/angular 0.1.0-beta.7 → 0.1.0-beta.9

package/fesm2022/slotted-angular-listbox.mjs

@@ -154,7 +154,7 @@ class SlListboxOption {
         event.preventDefault();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxOption, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlListboxOption, isStandalone: true, selector: "[slListboxOption]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, textValue: { classPropertyName: "textValue", publicName: "textValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, pinned: { classPropertyName: "pinned", publicName: "pinned", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-part": "option", "role": "option" }, listeners: { "click": "onClick($event)", "pointerdown": "onPointerDown($event)" }, properties: { "attr.id": "id()", "attr.data-key": "value()", "attr.data-text-value": "textValue() ?? null", "attr.data-selected": "selected() ? '' : null", "attr.data-current": "current() ? '' : null", "attr.data-disabled": "resolvedDisabled() ? '' : null", "attr.data-pinned": "pinned() ? '' : null", "attr.aria-selected": "ariaSelected()", "attr.aria-disabled": "resolvedDisabled() ? 'true' : null", "attr.aria-setsize": "setSize()", "attr.aria-posinset": "posInSet()", "attr.tabindex": "tabIndex()" } }, exportAs: ["slListboxOption"], ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlListboxOption, isStandalone: true, selector: "[slListboxOption]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, textValue: { classPropertyName: "textValue", publicName: "textValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, pinned: { classPropertyName: "pinned", publicName: "pinned", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-part": "option", "data-part-option": "", "role": "option" }, listeners: { "click": "onClick($event)", "pointerdown": "onPointerDown($event)" }, properties: { "attr.id": "id()", "attr.data-key": "value()", "attr.data-text-value": "textValue() ?? null", "attr.data-selected": "selected() ? '' : null", "attr.data-current": "current() ? '' : null", "attr.data-disabled": "resolvedDisabled() ? '' : null", "attr.data-pinned": "pinned() ? '' : null", "attr.aria-selected": "ariaSelected()", "attr.aria-disabled": "resolvedDisabled() ? 'true' : null", "attr.aria-setsize": "setSize()", "attr.aria-posinset": "posInSet()", "attr.tabindex": "tabIndex()" } }, exportAs: ["slListboxOption"], ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxOption, decorators: [{
             type: Component,
@@ -167,6 +167,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                     encapsulation: ViewEncapsulation.None,
                     host: {
                         'data-part': 'option',
+                        'data-part-option': '',
                         role: 'option',
                         '[attr.id]': 'id()',
                         '[attr.data-key]': 'value()',
@@ -203,8 +204,8 @@ class SlListboxGroup {
     ariaLabel = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'groupLabel' });
     labelId = inject(SlListboxIdFactory).next();
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlListboxGroup, isStandalone: true, selector: "[slListboxGroup]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "groupLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-part": "group", "role": "group" }, properties: { "attr.aria-labelledby": "label() ? labelId : null", "attr.aria-label": "label() ? null : ariaLabel()" } }, exportAs: ["slListboxGroup"], ngImport: i0, template: `@if (label()) {
-      <div data-part="group-label" [attr.id]="labelId">{{ label() }}</div>
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlListboxGroup, isStandalone: true, selector: "[slListboxGroup]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "groupLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-part": "group", "data-part-group": "", "role": "group" }, properties: { "attr.aria-labelledby": "label() ? labelId : null", "attr.aria-label": "label() ? null : ariaLabel()" } }, exportAs: ["slListboxGroup"], ngImport: i0, template: `@if (label()) {
+      <div data-part="group-label" data-part-group-label="" [attr.id]="labelId">{{ label() }}</div>
     }
     <ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
@@ -215,13 +216,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                     standalone: true,
                     exportAs: 'slListboxGroup',
                     template: `@if (label()) {
-      <div data-part="group-label" [attr.id]="labelId">{{ label() }}</div>
+      <div data-part="group-label" data-part-group-label="" [attr.id]="labelId">{{ label() }}</div>
     }
     <ng-content />`,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     encapsulation: ViewEncapsulation.None,
                     host: {
                         'data-part': 'group',
+                        'data-part-group': '',
                         role: 'group',
                         '[attr.aria-labelledby]': 'label() ? labelId : null',
                         '[attr.aria-label]': 'label() ? null : ariaLabel()',
@@ -237,7 +239,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
  */
 class SlListboxIndicator {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxIndicator, isStandalone: true, selector: "[slListboxIndicator]", host: { attributes: { "data-part": "indicator", "aria-hidden": "true" } }, ngImport: i0, template: `<ng-content
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxIndicator, isStandalone: true, selector: "[slListboxIndicator]", host: { attributes: { "data-part": "indicator", "data-part-indicator": "", "aria-hidden": "true" } }, ngImport: i0, template: `<ng-content
     ><span slIcon><svg slGlyph name="check"></svg></span
   ></ng-content>`, isInline: true, dependencies: [{ kind: "component", type: SlGlyph, selector: "svg[slGlyph]", inputs: ["name", "solid"] }, { kind: "component", type: SlIcon, selector: "[slIcon]", inputs: ["directional", "label", "size", "tone"], exportAs: ["slIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
@@ -252,7 +254,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
   ></ng-content>`,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     encapsulation: ViewEncapsulation.None,
-                    host: { 'data-part': 'indicator', 'aria-hidden': 'true' },
+                    host: { 'data-part': 'indicator', 'data-part-indicator': '', 'aria-hidden': 'true' },
                 }]
         }] });
 /**
@@ -262,36 +264,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
  */
 class SlListboxIcon {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxIcon, isStandalone: true, selector: "[slListboxIcon]", host: { attributes: { "data-part": "icon", "aria-hidden": "true" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxIcon, isStandalone: true, selector: "[slListboxIcon]", host: { attributes: { "data-part": "icon", "data-part-icon": "", "aria-hidden": "true" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxIcon, decorators: [{
             type: Directive,
             args: [{
                     selector: '[slListboxIcon]',
                     standalone: true,
-                    host: { 'data-part': 'icon', 'aria-hidden': 'true' },
+                    host: { 'data-part': 'icon', 'data-part-icon': '', 'aria-hidden': 'true' },
                 }]
         }] });
 /** The option's primary text, and the only one of the three columns that gives way. */
 class SlListboxLabel {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxLabel, isStandalone: true, selector: "[slListboxLabel]", host: { attributes: { "data-part": "label" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxLabel, isStandalone: true, selector: "[slListboxLabel]", host: { attributes: { "data-part": "label", "data-part-label": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxLabel, decorators: [{
             type: Directive,
-            args: [{ selector: '[slListboxLabel]', standalone: true, host: { 'data-part': 'label' } }]
+            args: [{
+                    selector: '[slListboxLabel]',
+                    standalone: true,
+                    host: { 'data-part': 'label', 'data-part-label': '' },
+                }]
         }] });
 /** A second line under the label, for what the label cannot say on its own. */
 class SlListboxDescription {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxDescription, isStandalone: true, selector: "[slListboxDescription]", host: { attributes: { "data-part": "description" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxDescription, isStandalone: true, selector: "[slListboxDescription]", host: { attributes: { "data-part": "description", "data-part-description": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxDescription, decorators: [{
             type: Directive,
             args: [{
                     selector: '[slListboxDescription]',
                     standalone: true,
-                    host: { 'data-part': 'description' },
+                    host: { 'data-part': 'description', 'data-part-description': '' },
                 }]
         }] });
 /**
@@ -300,11 +306,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
  */
 class SlListboxMeta {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxMeta, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxMeta, isStandalone: true, selector: "[slListboxMeta]", host: { attributes: { "data-part": "meta" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxMeta, isStandalone: true, selector: "[slListboxMeta]", host: { attributes: { "data-part": "meta", "data-part-meta": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxMeta, decorators: [{
             type: Directive,
-            args: [{ selector: '[slListboxMeta]', standalone: true, host: { 'data-part': 'meta' } }]
+            args: [{
+                    selector: '[slListboxMeta]',
+                    standalone: true,
+                    host: { 'data-part': 'meta', 'data-part-meta': '' },
+                }]
         }] });
 /**
  * What the listbox says when it holds nothing. It lives inside the listbox for
@@ -317,11 +327,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
  */
 class SlListboxEmpty {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxEmpty, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxEmpty, isStandalone: true, selector: "[slListboxEmpty]", host: { attributes: { "data-part": "empty" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxEmpty, isStandalone: true, selector: "[slListboxEmpty]", host: { attributes: { "data-part": "empty", "data-part-empty": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxEmpty, decorators: [{
             type: Directive,
-            args: [{ selector: '[slListboxEmpty]', standalone: true, host: { 'data-part': 'empty' } }]
+            args: [{
+                    selector: '[slListboxEmpty]',
+                    standalone: true,
+                    host: { 'data-part': 'empty', 'data-part-empty': '' },
+                }]
         }] });
 /**
  * The row at the end of a page that has not arrived. It is an `option` by role
@@ -330,14 +344,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
  */
 class SlListboxLoader {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxLoader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxLoader, isStandalone: true, selector: "[slListboxLoader]", host: { attributes: { "data-part": "loader", "role": "option", "aria-disabled": "true" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlListboxLoader, isStandalone: true, selector: "[slListboxLoader]", host: { attributes: { "data-part": "loader", "data-part-loader": "", "role": "option", "aria-disabled": "true" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListboxLoader, decorators: [{
             type: Directive,
             args: [{
                     selector: '[slListboxLoader]',
                     standalone: true,
-                    host: { 'data-part': 'loader', role: 'option', 'aria-disabled': 'true' },
+                    host: { 'data-part': 'loader', 'data-part-loader': '', role: 'option', 'aria-disabled': 'true' },
                 }]
         }] });
 /**
@@ -1095,7 +1109,7 @@ class SlListbox {
         return toKeys(value).length === 0 ? { required: true } : null;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlListbox, isStandalone: true, selector: "[slListbox]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, defaultValue: { classPropertyName: "defaultValue", publicName: "defaultValue", isSignal: true, isRequired: false, transformFunction: null }, activeKey: { classPropertyName: "activeKey", publicName: "activeKey", isSignal: true, isRequired: false, transformFunction: null }, defaultActiveKey: { classPropertyName: "defaultActiveKey", publicName: "defaultActiveKey", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selectionBehavior: { classPropertyName: "selectionBehavior", publicName: "selectionBehavior", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, focusMode: { classPropertyName: "focusMode", publicName: "focusMode", isSignal: true, isRequired: false, transformFunction: null }, indicator: { classPropertyName: "indicator", publicName: "indicator", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null }, typeahead: { classPropertyName: "typeahead", publicName: "typeahead", isSignal: true, isRequired: false, transformFunction: null }, selectOnFocus: { classPropertyName: "selectOnFocus", publicName: "selectOnFocus", isSignal: true, isRequired: false, transformFunction: null }, navigateDisabled: { classPropertyName: "navigateDisabled", publicName: "navigateDisabled", isSignal: true, isRequired: false, transformFunction: null }, disallowEmptySelection: { classPropertyName: "disallowEmptySelection", publicName: "disallowEmptySelection", isSignal: true, isRequired: false, transformFunction: null }, disallowSelectAll: { classPropertyName: "disallowSelectAll", publicName: "disallowSelectAll", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, typeaheadTimeout: { classPropertyName: "typeaheadTimeout", publicName: "typeaheadTimeout", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, sections: { classPropertyName: "sections", publicName: "sections", isSignal: true, isRequired: false, transformFunction: null }, getKey: { classPropertyName: "getKey", publicName: "getKey", isSignal: true, isRequired: false, transformFunction: null }, getLabel: { classPropertyName: "getLabel", publicName: "getLabel", isSignal: true, isRequired: false, transformFunction: null }, isItemDisabled: { classPropertyName: "isItemDisabled", publicName: "isItemDisabled", isSignal: true, isRequired: false, transformFunction: null }, totalCount: { classPropertyName: "totalCount", publicName: "totalCount", isSignal: true, isRequired: false, transformFunction: null }, virtual: { classPropertyName: "virtual", publicName: "virtual", isSignal: true, isRequired: false, transformFunction: null }, itemSize: { classPropertyName: "itemSize", publicName: "itemSize", isSignal: true, isRequired: false, transformFunction: null }, sectionSize: { classPropertyName: "sectionSize", publicName: "sectionSize", isSignal: true, isRequired: false, transformFunction: null }, overscan: { classPropertyName: "overscan", publicName: "overscan", isSignal: true, isRequired: false, transformFunction: null }, hasMore: { classPropertyName: "hasMore", publicName: "hasMore", isSignal: true, isRequired: false, transformFunction: null }, loadMoreThreshold: { classPropertyName: "loadMoreThreshold", publicName: "loadMoreThreshold", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", activeKeyChange: "activeKeyChange", loadMore: "loadMore" }, host: { attributes: { "data-ui": "listbox", "data-part": "root" }, listeners: { "keydown": "handleKeyDown($event)", "focusin": "handleFocusIn($event)", "focusout": "handleFocusOut($event)", "scroll": "readViewport()" }, properties: { "attr.role": "writtenRole ?? \"listbox\"", "attr.data-size": "resolvedSize()", "attr.data-variant": "resolvedVariant()", "attr.data-orientation": "resolvedOrientation()", "attr.data-indicator": "indicatorMode()", "attr.data-focus-mode": "mode()", "attr.data-layout": "resolvedColumns() > 1 ? \"grid\" : null", "attr.data-disabled": "listboxDisabled() ? \"\" : null", "attr.data-readonly": "resolvedReadOnly() ? \"\" : null", "attr.data-invalid": "resolvedInvalid() ? \"\" : null", "attr.data-required": "resolvedRequired() ? \"\" : null", "attr.data-loading": "loading() ? \"\" : null", "attr.aria-multiselectable": "selection() === \"multiple\" ? \"true\" : null", "attr.aria-orientation": "resolvedOrientation() === \"horizontal\" ? \"horizontal\" : null", "attr.aria-activedescendant": "activeDescendant()", "attr.aria-disabled": "listboxDisabled() ? \"true\" : null", "attr.aria-readonly": "resolvedReadOnly() ? \"true\" : null", "attr.aria-required": "resolvedRequired() ? \"true\" : null", "attr.aria-invalid": "resolvedInvalid() ? \"true\" : null", "attr.aria-busy": "loading() ? \"true\" : null", "attr.tabindex": "rootTabIndex()", "style.--slotted-listbox-rows": "resolvedRows()", "style.--slotted-listbox-columns": "resolvedColumns()" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlListbox, isStandalone: true, selector: "[slListbox]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, defaultValue: { classPropertyName: "defaultValue", publicName: "defaultValue", isSignal: true, isRequired: false, transformFunction: null }, activeKey: { classPropertyName: "activeKey", publicName: "activeKey", isSignal: true, isRequired: false, transformFunction: null }, defaultActiveKey: { classPropertyName: "defaultActiveKey", publicName: "defaultActiveKey", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selectionBehavior: { classPropertyName: "selectionBehavior", publicName: "selectionBehavior", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, focusMode: { classPropertyName: "focusMode", publicName: "focusMode", isSignal: true, isRequired: false, transformFunction: null }, indicator: { classPropertyName: "indicator", publicName: "indicator", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null }, typeahead: { classPropertyName: "typeahead", publicName: "typeahead", isSignal: true, isRequired: false, transformFunction: null }, selectOnFocus: { classPropertyName: "selectOnFocus", publicName: "selectOnFocus", isSignal: true, isRequired: false, transformFunction: null }, navigateDisabled: { classPropertyName: "navigateDisabled", publicName: "navigateDisabled", isSignal: true, isRequired: false, transformFunction: null }, disallowEmptySelection: { classPropertyName: "disallowEmptySelection", publicName: "disallowEmptySelection", isSignal: true, isRequired: false, transformFunction: null }, disallowSelectAll: { classPropertyName: "disallowSelectAll", publicName: "disallowSelectAll", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, typeaheadTimeout: { classPropertyName: "typeaheadTimeout", publicName: "typeaheadTimeout", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, sections: { classPropertyName: "sections", publicName: "sections", isSignal: true, isRequired: false, transformFunction: null }, getKey: { classPropertyName: "getKey", publicName: "getKey", isSignal: true, isRequired: false, transformFunction: null }, getLabel: { classPropertyName: "getLabel", publicName: "getLabel", isSignal: true, isRequired: false, transformFunction: null }, isItemDisabled: { classPropertyName: "isItemDisabled", publicName: "isItemDisabled", isSignal: true, isRequired: false, transformFunction: null }, totalCount: { classPropertyName: "totalCount", publicName: "totalCount", isSignal: true, isRequired: false, transformFunction: null }, virtual: { classPropertyName: "virtual", publicName: "virtual", isSignal: true, isRequired: false, transformFunction: null }, itemSize: { classPropertyName: "itemSize", publicName: "itemSize", isSignal: true, isRequired: false, transformFunction: null }, sectionSize: { classPropertyName: "sectionSize", publicName: "sectionSize", isSignal: true, isRequired: false, transformFunction: null }, overscan: { classPropertyName: "overscan", publicName: "overscan", isSignal: true, isRequired: false, transformFunction: null }, hasMore: { classPropertyName: "hasMore", publicName: "hasMore", isSignal: true, isRequired: false, transformFunction: null }, loadMoreThreshold: { classPropertyName: "loadMoreThreshold", publicName: "loadMoreThreshold", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", activeKeyChange: "activeKeyChange", loadMore: "loadMore" }, host: { attributes: { "data-ui": "listbox", "data-ui-listbox": "", "data-part": "root", "data-part-root": "" }, listeners: { "keydown": "handleKeyDown($event)", "focusin": "handleFocusIn($event)", "focusout": "handleFocusOut($event)", "scroll": "readViewport()" }, properties: { "attr.role": "writtenRole ?? \"listbox\"", "attr.data-size": "resolvedSize()", "attr.data-variant": "resolvedVariant()", "attr.data-orientation": "resolvedOrientation()", "attr.data-indicator": "indicatorMode()", "attr.data-focus-mode": "mode()", "attr.data-layout": "resolvedColumns() > 1 ? \"grid\" : null", "attr.data-disabled": "listboxDisabled() ? \"\" : null", "attr.data-readonly": "resolvedReadOnly() ? \"\" : null", "attr.data-invalid": "resolvedInvalid() ? \"\" : null", "attr.data-required": "resolvedRequired() ? \"\" : null", "attr.data-loading": "loading() ? \"\" : null", "attr.aria-multiselectable": "selection() === \"multiple\" ? \"true\" : null", "attr.aria-orientation": "resolvedOrientation() === \"horizontal\" ? \"horizontal\" : null", "attr.aria-activedescendant": "activeDescendant()", "attr.aria-disabled": "listboxDisabled() ? \"true\" : null", "attr.aria-readonly": "resolvedReadOnly() ? \"true\" : null", "attr.aria-required": "resolvedRequired() ? \"true\" : null", "attr.aria-invalid": "resolvedInvalid() ? \"true\" : null", "attr.aria-busy": "loading() ? \"true\" : null", "attr.tabindex": "rootTabIndex()", "style.--slotted-listbox-rows": "resolvedRows()", "style.--slotted-listbox-columns": "resolvedColumns()" } }, providers: [
             { provide: SlListboxContext, useExisting: forwardRef(() => SlListbox) },
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SlListbox), multi: true },
             { provide: NG_VALIDATORS, useExisting: forwardRef(() => SlListbox), multi: true },
@@ -1103,6 +1117,7 @@ class SlListbox {
       @if (windowed()) {
         <div
           data-part="canvas"
+          data-part-canvas=""
           role="presentation"
           [style.--_canvas-size]="slice().totalSize + 'px'"
           [style.--_canvas-offset]="slice().startOffset + 'px'"
@@ -1161,7 +1176,7 @@ class SlListbox {
           />
         }
       </div>
-    </ng-template>`, isInline: true, styles: ["@layer slotted.components{[data-ui=listbox]{--_surface: var(--slotted-listbox-surface, var(--slotted-surface, #ffffff));--_text: var(--slotted-listbox-text, var(--slotted-text, #0f172a));--_muted: var(--slotted-listbox-text-muted, var(--slotted-text-muted, #5b6b7f));--_border-color: var(--slotted-listbox-border-color, var(--slotted-control-border-color));--_border-width: var(--slotted-border-width-thin, 1px);--_radius: var(--slotted-listbox-radius, var(--slotted-radius-md, 6px));--_shadow: var(--slotted-listbox-shadow, var(--slotted-control-shadow));--_highlight: var(--slotted-listbox-highlight, var(--slotted-tone-secondary-subtle-hover));--_highlight-active: var( --slotted-listbox-highlight-active, var(--slotted-tone-secondary-subtle-active) );--_selected-surface: var( --slotted-listbox-selected-surface, var(--slotted-tone-accent-surface) );--_selected-text: var(--slotted-listbox-selected-text, var(--slotted-tone-accent-text));--_inset-block: var(--slotted-listbox-padding-block, var(--slotted-space-2, .25rem));--_inset-inline: var(--slotted-listbox-padding-inline, var(--slotted-space-2, .25rem));--_option-inset: var(--slotted-control-padding-inline-md, .8125rem);--_option-height: var(--slotted-control-height-md, 34px);--_option-radius: var(--slotted-listbox-option-radius, var(--slotted-control-radius));--_font-size: var(--slotted-control-font-size-md, 13px);--_secondary-font-size: var(--slotted-control-font-size-sm, 12px);--_icon-size: var(--slotted-control-icon-size-md, 16px);--_column-gap: var(--slotted-control-gap-md, .5rem);--_rows: var(--slotted-listbox-rows, 7);--_columns: var(--slotted-listbox-columns, 1);--_measure: var(--slotted-listbox-measure, 24rem);box-sizing:border-box;color:var(--_text);display:grid;font-family:var(--slotted-font-family-sans);font-size:var(--_font-size);grid-auto-rows:min-content;grid-template-columns:auto minmax(0,1fr) auto;inline-size:100%;max-inline-size:var(--_measure);max-block-size:calc(var(--_rows) * var(--_option-height) + 2 * var(--_inset-block));outline:none;overflow-y:auto;overscroll-behavior:contain;padding-block:var(--_inset-block);padding-inline:var(--_inset-inline);scroll-behavior:auto}[data-ui=listbox][data-size=sm]{--_option-inset: var(--slotted-control-padding-inline-sm, .625rem);--_option-height: var(--slotted-control-height-sm, 30px);--_font-size: var(--slotted-control-font-size-sm, 12px);--_secondary-font-size: var(--slotted-font-size-xs, .75rem);--_icon-size: var(--slotted-control-icon-size-sm, 14px);--_column-gap: var(--slotted-control-gap-sm, .375rem)}[data-ui=listbox][data-size=lg]{--_option-inset: var(--slotted-control-padding-inline-lg, 1rem);--_option-height: var(--slotted-control-height-lg, 38px);--_font-size: var(--slotted-control-font-size-lg, 14px);--_secondary-font-size: var(--slotted-control-font-size-sm, 12px);--_icon-size: var(--slotted-control-icon-size-lg, 18px);--_column-gap: var(--slotted-control-gap-lg, .5rem)}[data-ui=listbox][data-variant=framed]{background:var(--_surface);border:var(--_border-width) solid var(--_border-color);border-radius:var(--_radius);box-shadow:var(--_shadow)}[data-ui=listbox][data-variant=plain]{background:transparent;border:0}[data-ui=listbox][data-focus-mode=activedescendant]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, #2563eb);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=listbox][data-focus-mode=roving]:focus{outline:none}[data-ui=listbox][data-invalid]{--_border-color: var(--slotted-tone-danger-border);--slotted-focus-ring-color: var(--slotted-focus-ring-color-invalid)}[data-ui=listbox][data-invalid]:not([data-disabled]){--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);--_shadow: inset 0 0 0 var(--_invalid-edge-width) var(--slotted-tone-danger-border)}[data-ui=listbox][data-disabled]{--_surface: var(--slotted-disabled-background, #e2e8f0);--_text: var(--slotted-disabled-foreground, #64748b);--_border-color: var(--slotted-disabled-border, #cbd5e1);cursor:not-allowed}[data-ui=listbox][data-loading]{cursor:progress}[data-ui=listbox][data-layout=grid]{column-gap:var(--_column-gap);grid-template-columns:repeat(var(--_columns),minmax(0,1fr));max-block-size:none}[data-ui=listbox][data-layout=grid] [data-part=option]{grid-column:auto;grid-template-columns:auto minmax(0,1fr) auto}[data-ui=listbox][data-layout=grid] :is([data-part=group],[data-part=canvas]){grid-template-columns:repeat(var(--_columns),minmax(0,1fr))}[data-ui=listbox][data-orientation=horizontal]{display:flex;flex-direction:row;max-block-size:none;overflow-x:auto;overflow-y:hidden}[data-ui=listbox][data-orientation=horizontal] [data-part=option]{flex:0 0 auto;grid-template-columns:auto auto auto}[data-ui=listbox]>[data-part=canvas]{align-content:start;block-size:var(--_canvas-size, auto);box-sizing:border-box;display:grid;grid-auto-rows:min-content;grid-column:1 / -1;grid-template-columns:subgrid;padding-block-start:var(--_canvas-offset, 0);position:relative}[data-ui=listbox] [data-part=option][data-pinned]{grid-template-columns:auto minmax(0,1fr) auto;inset-inline:0;position:absolute}[data-ui=listbox] [data-part=group]{display:grid;grid-column:1 / -1;grid-template-columns:subgrid}[data-ui=listbox] [data-part=group-label]{color:var(--_muted);font-size:var(--_secondary-font-size);font-weight:var(--slotted-font-weight-semibold, 600);grid-column:1 / -1;line-height:var(--slotted-line-height-sm, 1.45);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_option-inset)}[data-ui=listbox] [data-part=group]+[data-part=group]{border-block-start:var(--_border-width) solid var(--slotted-listbox-group-border-color, var(--slotted-border-subtle, #e2e8f0));margin-block-start:var(--slotted-space-2, .25rem);padding-block-start:var(--slotted-space-2, .25rem)}[data-ui=listbox] [data-part=option]{align-content:center;background:transparent;border-radius:var(--_option-radius);box-sizing:border-box;color:inherit;cursor:default;display:grid;grid-column:1 / -1;grid-template-columns:subgrid;line-height:var(--slotted-line-height-md, 1.5);min-block-size:var(--_option-height);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_option-inset);position:relative;row-gap:var(--slotted-space-1, .125rem);text-align:start;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui=listbox]:not([data-disabled]) [data-part=option]:not([data-disabled]):hover{background-color:var(--_highlight)}[data-ui=listbox]:not([data-disabled]) [data-part=option]:not([data-disabled]):active{background-color:var(--_highlight-active)}[data-ui=listbox][data-focus-mode=roving]:focus-within [data-part=option][data-current],[data-ui=listbox][data-focus-mode=activedescendant] [data-part=option][data-current]{background-color:var(--_highlight)}[data-ui=listbox]:focus-within [data-part=option][data-current]{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, #2563eb);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=listbox] [data-part=option]:focus{outline:none}[data-ui=listbox] [data-part=option][data-selected]{background-color:var(--_selected-surface);color:var(--_selected-text)}[data-ui=listbox] [data-part=option][data-selected]+[data-part=option][data-selected]{border-start-end-radius:0;border-start-start-radius:0}[data-ui=listbox] [data-part=option][data-selected]:has(+[data-part=option][data-selected]){border-end-end-radius:0;border-end-start-radius:0}[data-ui=listbox]:not([data-disabled]) [data-part=option][data-selected]:not([data-disabled]):hover{background-color:var(--slotted-tone-accent-subtle-hover)}[data-ui=listbox]:not([data-disabled]) [data-part=option][data-selected]:not([data-disabled]):active{background-color:var(--slotted-tone-accent-subtle-active)}[data-ui=listbox] [data-part=option][data-disabled]{color:var(--slotted-disabled-foreground, #64748b);cursor:not-allowed}[data-ui=listbox] [data-part=option][data-disabled]:is([data-selected],[data-current]){background-color:var(--slotted-disabled-background, #e2e8f0);color:var(--slotted-disabled-foreground, #64748b)}[data-ui=listbox][data-readonly] [data-part=option]{cursor:default}[data-ui=listbox] :is([data-part=indicator],[data-part=icon]){block-size:1lh;grid-column:1;grid-row:1;inline-size:var(--_icon-size);justify-self:center;margin-inline-end:var(--_column-gap)}[data-ui=listbox] [data-part=indicator]{--slotted-icon-size: var(--_icon-size);align-items:center;display:flex;justify-content:center;opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui=listbox] [data-part=option][data-selected]>[data-part=indicator]{opacity:1}[data-ui=listbox] [data-part=icon]{--slotted-icon-size: var(--_icon-size);align-items:center;display:flex;justify-content:center}[data-ui=listbox] [data-part=label]{grid-column:2;grid-row:1;min-inline-size:0;overflow-wrap:anywhere}[data-ui=listbox] [data-part=description]{color:var(--_muted);font-size:var(--_secondary-font-size);grid-column:2;grid-row:2;line-height:var(--slotted-line-height-sm, 1.45);min-inline-size:0;overflow-wrap:anywhere}[data-ui=listbox] [data-part=option]:is([data-disabled],[data-selected])>[data-part=description]{color:inherit}[data-ui=listbox] [data-part=meta]{color:var(--_muted);font-variant-numeric:tabular-nums;grid-column:3;grid-row:1;justify-self:end;margin-inline-start:var(--slotted-space-6, 1rem);white-space:nowrap}[data-ui=listbox] [data-part=option]:is([data-disabled],[data-selected])>[data-part=meta]{color:inherit}[data-ui=listbox] :is([data-part=empty],[data-part=loader]){align-content:center;color:var(--_muted);display:grid;grid-column:1 / -1;min-block-size:var(--_option-height);padding-block:var(--slotted-space-5, .75rem);padding-inline:var(--_option-inset);text-align:center}[data-ui=listbox] [data-part=loader]{animation:slotted-listbox-loader var(--slotted-duration-loop) ease-in-out infinite}@keyframes slotted-listbox-loader{0%,to{opacity:.45}50%{opacity:1}}@media(prefers-reduced-motion:reduce){[data-ui=listbox] [data-part=loader]{animation:none;opacity:.7}}@media(forced-colors:active){[data-ui=listbox] [data-part=option][data-selected]{background-color:Highlight;color:HighlightText;forced-color-adjust:none}[data-ui=listbox] [data-part=option][data-disabled]{color:GrayText}}@media(forced-colors:active){[data-ui=listbox][data-variant=framed][data-invalid]:not([data-disabled]){outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--_border-width) + var(--_invalid-edge-width)))}[data-ui=listbox][data-variant=framed][data-invalid]:not([data-disabled])[data-focus-mode=activedescendant]:focus-visible{outline:calc(var(--slotted-focus-ring-width, 2px) + var(--_invalid-edge-width)) double var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlListboxGroup, selector: "[slListboxGroup]", inputs: ["label", "groupLabel"], exportAs: ["slListboxGroup"] }, { kind: "component", type: SlListboxOption, selector: "[slListboxOption]", inputs: ["value", "textValue", "disabled", "pinned"], exportAs: ["slListboxOption"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    </ng-template>`, isInline: true, styles: ["@layer slotted.components{[data-ui-listbox]{--_surface: var(--slotted-listbox-surface, var(--slotted-surface, #ffffff));--_text: var(--slotted-listbox-text, var(--slotted-text, #0f172a));--_muted: var(--slotted-listbox-text-muted, var(--slotted-text-muted, #5b6b7f));--_border-color: var(--slotted-listbox-border-color, var(--slotted-control-border-color));--_border-width: var(--slotted-border-width-thin, 1px);--_radius: var(--slotted-listbox-radius, var(--slotted-radius-md, 6px));--_shadow: var(--slotted-listbox-shadow, var(--slotted-control-shadow));--_highlight: var(--slotted-listbox-highlight, var(--slotted-tone-secondary-subtle-hover));--_highlight-active: var( --slotted-listbox-highlight-active, var(--slotted-tone-secondary-subtle-active) );--_selected-surface: var( --slotted-listbox-selected-surface, var(--slotted-tone-accent-surface) );--_selected-text: var(--slotted-listbox-selected-text, var(--slotted-tone-accent-text));--_inset-block: var(--slotted-listbox-padding-block, var(--slotted-space-2, .25rem));--_inset-inline: var(--slotted-listbox-padding-inline, var(--slotted-space-2, .25rem));--_option-inset: var(--slotted-control-padding-inline-md, .8125rem);--_option-height: var(--slotted-control-height-md, 34px);--_option-radius: var(--slotted-listbox-option-radius, var(--slotted-control-radius));--_font-size: var(--slotted-control-font-size-md, 13px);--_secondary-font-size: var(--slotted-control-font-size-sm, 12px);--_icon-size: var(--slotted-control-icon-size-md, 16px);--_column-gap: var(--slotted-control-gap-md, .5rem);--_rows: var(--slotted-listbox-rows, 7);--_columns: var(--slotted-listbox-columns, 1);--_measure: var(--slotted-listbox-measure, 24rem);box-sizing:border-box;color:var(--_text);display:grid;font-family:var(--slotted-font-family-sans);font-size:var(--_font-size);grid-auto-rows:min-content;grid-template-columns:auto minmax(0,1fr) auto;inline-size:100%;max-inline-size:var(--_measure);max-block-size:calc(var(--_rows) * var(--_option-height) + 2 * var(--_inset-block));outline:none;overflow-y:auto;overscroll-behavior:contain;padding-block:var(--_inset-block);padding-inline:var(--_inset-inline);scroll-behavior:auto}[data-ui-listbox][data-size=sm]{--_option-inset: var(--slotted-control-padding-inline-sm, .625rem);--_option-height: var(--slotted-control-height-sm, 30px);--_font-size: var(--slotted-control-font-size-sm, 12px);--_secondary-font-size: var(--slotted-font-size-xs, .75rem);--_icon-size: var(--slotted-control-icon-size-sm, 14px);--_column-gap: var(--slotted-control-gap-sm, .375rem)}[data-ui-listbox][data-size=lg]{--_option-inset: var(--slotted-control-padding-inline-lg, 1rem);--_option-height: var(--slotted-control-height-lg, 38px);--_font-size: var(--slotted-control-font-size-lg, 14px);--_secondary-font-size: var(--slotted-control-font-size-sm, 12px);--_icon-size: var(--slotted-control-icon-size-lg, 18px);--_column-gap: var(--slotted-control-gap-lg, .5rem)}[data-ui-listbox][data-variant=framed]{background:var(--_surface);border:var(--_border-width) solid var(--_border-color);border-radius:var(--_radius);box-shadow:var(--_shadow)}[data-ui-listbox][data-variant=plain]{background:transparent;border:0}[data-ui-listbox][data-focus-mode=activedescendant]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, #2563eb);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui-listbox][data-focus-mode=roving]:focus{outline:none}[data-ui-listbox][data-invalid]{--_border-color: var(--slotted-tone-danger-border);--slotted-focus-ring-color: var(--slotted-focus-ring-color-invalid)}[data-ui-listbox][data-invalid]:not([data-disabled]){--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);--_shadow: inset 0 0 0 var(--_invalid-edge-width) var(--slotted-tone-danger-border)}[data-ui-listbox][data-disabled]{--_surface: var(--slotted-disabled-background, #e2e8f0);--_text: var(--slotted-disabled-foreground, #64748b);--_border-color: var(--slotted-disabled-border, #cbd5e1);cursor:not-allowed}[data-ui-listbox][data-loading]{cursor:progress}[data-ui-listbox][data-layout=grid]{column-gap:var(--_column-gap);grid-template-columns:repeat(var(--_columns),minmax(0,1fr));max-block-size:none}[data-ui-listbox][data-layout=grid] [data-part-option]{grid-column:auto;grid-template-columns:auto minmax(0,1fr) auto}[data-ui-listbox][data-layout=grid] :is([data-part-group],[data-part-canvas]){grid-template-columns:repeat(var(--_columns),minmax(0,1fr))}[data-ui-listbox][data-orientation=horizontal]{display:flex;flex-direction:row;max-block-size:none;overflow-x:auto;overflow-y:hidden}[data-ui-listbox][data-orientation=horizontal] [data-part-option]{flex:0 0 auto;grid-template-columns:auto auto auto}[data-ui-listbox]>[data-part-canvas]{align-content:start;block-size:var(--_canvas-size, auto);box-sizing:border-box;display:grid;grid-auto-rows:min-content;grid-column:1 / -1;grid-template-columns:subgrid;padding-block-start:var(--_canvas-offset, 0);position:relative}[data-ui-listbox] [data-part-option][data-pinned]{grid-template-columns:auto minmax(0,1fr) auto;inset-inline:0;position:absolute}[data-ui-listbox] [data-part-group]{display:grid;grid-column:1 / -1;grid-template-columns:subgrid}[data-ui-listbox] [data-part-group-label]{color:var(--_muted);font-size:var(--_secondary-font-size);font-weight:var(--slotted-font-weight-semibold, 600);grid-column:1 / -1;line-height:var(--slotted-line-height-sm, 1.45);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_option-inset)}[data-ui-listbox] [data-part-group]+[data-part-group]{border-block-start:var(--_border-width) solid var(--slotted-listbox-group-border-color, var(--slotted-border-subtle, #e2e8f0));margin-block-start:var(--slotted-space-2, .25rem);padding-block-start:var(--slotted-space-2, .25rem)}[data-ui-listbox] [data-part-option]{align-content:center;background:transparent;border-radius:var(--_option-radius);box-sizing:border-box;color:inherit;cursor:default;display:grid;grid-column:1 / -1;grid-template-columns:subgrid;line-height:var(--slotted-line-height-md, 1.5);min-block-size:var(--_option-height);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_option-inset);position:relative;row-gap:var(--slotted-space-1, .125rem);text-align:start;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui-listbox]:not([data-disabled]) [data-part-option]:not([data-disabled]):hover{background-color:var(--_highlight)}[data-ui-listbox]:not([data-disabled]) [data-part-option]:not([data-disabled]):active{background-color:var(--_highlight-active)}[data-ui-listbox][data-focus-mode=roving]:focus-within [data-part-option][data-current],[data-ui-listbox][data-focus-mode=activedescendant] [data-part-option][data-current]{background-color:var(--_highlight)}[data-ui-listbox]:focus-within [data-part-option][data-current]{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, #2563eb);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui-listbox] [data-part-option]:focus{outline:none}[data-ui-listbox] [data-part-option][data-selected]{background-color:var(--_selected-surface);color:var(--_selected-text)}[data-ui-listbox] [data-part-option][data-selected]+[data-part-option][data-selected]{border-start-end-radius:0;border-start-start-radius:0}[data-ui-listbox] [data-part-option][data-selected]:has(+[data-part-option][data-selected]){border-end-end-radius:0;border-end-start-radius:0}[data-ui-listbox]:not([data-disabled]) [data-part-option][data-selected]:not([data-disabled]):hover{background-color:var(--slotted-tone-accent-subtle-hover)}[data-ui-listbox]:not([data-disabled]) [data-part-option][data-selected]:not([data-disabled]):active{background-color:var(--slotted-tone-accent-subtle-active)}[data-ui-listbox] [data-part-option][data-disabled]{color:var(--slotted-disabled-foreground, #64748b);cursor:not-allowed}[data-ui-listbox] [data-part-option][data-disabled]:is([data-selected],[data-current]){background-color:var(--slotted-disabled-background, #e2e8f0);color:var(--slotted-disabled-foreground, #64748b)}[data-ui-listbox][data-readonly] [data-part-option]{cursor:default}[data-ui-listbox] :is([data-part-indicator],[data-part-icon]){block-size:1lh;grid-column:1;grid-row:1;inline-size:var(--_icon-size);justify-self:center;margin-inline-end:var(--_column-gap)}[data-ui-listbox] [data-part-indicator]{--slotted-icon-size: var(--_icon-size);align-items:center;display:flex;justify-content:center;opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui-listbox] [data-part-option][data-selected]>[data-part-indicator]{opacity:1}[data-ui-listbox] [data-part-icon]{--slotted-icon-size: var(--_icon-size);align-items:center;display:flex;justify-content:center}[data-ui-listbox] [data-part-label]{grid-column:2;grid-row:1;min-inline-size:0;overflow-wrap:anywhere}[data-ui-listbox] [data-part-description]{color:var(--_muted);font-size:var(--_secondary-font-size);grid-column:2;grid-row:2;line-height:var(--slotted-line-height-sm, 1.45);min-inline-size:0;overflow-wrap:anywhere}[data-ui-listbox] [data-part-option]:is([data-disabled],[data-selected])>[data-part-description]{color:inherit}[data-ui-listbox] [data-part-meta]{color:var(--_muted);font-variant-numeric:tabular-nums;grid-column:3;grid-row:1;justify-self:end;margin-inline-start:var(--slotted-space-6, 1rem);white-space:nowrap}[data-ui-listbox] [data-part-option]:is([data-disabled],[data-selected])>[data-part-meta]{color:inherit}[data-ui-listbox] :is([data-part-empty],[data-part-loader]){align-content:center;color:var(--_muted);display:grid;grid-column:1 / -1;min-block-size:var(--_option-height);padding-block:var(--slotted-space-5, .75rem);padding-inline:var(--_option-inset);text-align:center}[data-ui-listbox] [data-part-loader]{animation:slotted-listbox-loader var(--slotted-duration-loop) ease-in-out infinite}@keyframes slotted-listbox-loader{0%,to{opacity:.45}50%{opacity:1}}@media(prefers-reduced-motion:reduce){[data-ui-listbox] [data-part-loader]{animation:none;opacity:.7}}@media(forced-colors:active){[data-ui-listbox] [data-part-option][data-selected]{background-color:Highlight;color:HighlightText;forced-color-adjust:none}[data-ui-listbox] [data-part-option][data-disabled]{color:GrayText}}@media(forced-colors:active){[data-ui-listbox][data-variant=framed][data-invalid]:not([data-disabled]){outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--_border-width) + var(--_invalid-edge-width)))}[data-ui-listbox][data-variant=framed][data-invalid]:not([data-disabled])[data-focus-mode=activedescendant]:focus-visible{outline:calc(var(--slotted-focus-ring-width, 2px) + var(--_invalid-edge-width)) double var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlListboxGroup, selector: "[slListboxGroup]", inputs: ["label", "groupLabel"], exportAs: ["slListboxGroup"] }, { kind: "component", type: SlListboxOption, selector: "[slListboxOption]", inputs: ["value", "textValue", "disabled", "pinned"], exportAs: ["slListboxOption"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlListbox, decorators: [{
             type: Component,
@@ -1173,6 +1188,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
       @if (windowed()) {
         <div
           data-part="canvas"
+          data-part-canvas=""
           role="presentation"
           [style.--_canvas-size]="slice().totalSize + 'px'"
           [style.--_canvas-offset]="slice().startOffset + 'px'"
@@ -1233,7 +1249,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
       </div>
     </ng-template>`, host: {
                         'data-ui': 'listbox',
+                        'data-ui-listbox': '',
                         'data-part': 'root',
+                        'data-part-root': '',
                         '[attr.role]': 'writtenRole ?? "listbox"',
                         '[attr.data-size]': 'resolvedSize()',
                         '[attr.data-variant]': 'resolvedVariant()',
@@ -1261,7 +1279,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                         '(focusin)': 'handleFocusIn($event)',
                         '(focusout)': 'handleFocusOut($event)',
                         '(scroll)': 'readViewport()',
-                    }, styles: ["@layer slotted.components{[data-ui=listbox]{--_surface: var(--slotted-listbox-surface, var(--slotted-surface, #ffffff));--_text: var(--slotted-listbox-text, var(--slotted-text, #0f172a));--_muted: var(--slotted-listbox-text-muted, var(--slotted-text-muted, #5b6b7f));--_border-color: var(--slotted-listbox-border-color, var(--slotted-control-border-color));--_border-width: var(--slotted-border-width-thin, 1px);--_radius: var(--slotted-listbox-radius, var(--slotted-radius-md, 6px));--_shadow: var(--slotted-listbox-shadow, var(--slotted-control-shadow));--_highlight: var(--slotted-listbox-highlight, var(--slotted-tone-secondary-subtle-hover));--_highlight-active: var( --slotted-listbox-highlight-active, var(--slotted-tone-secondary-subtle-active) );--_selected-surface: var( --slotted-listbox-selected-surface, var(--slotted-tone-accent-surface) );--_selected-text: var(--slotted-listbox-selected-text, var(--slotted-tone-accent-text));--_inset-block: var(--slotted-listbox-padding-block, var(--slotted-space-2, .25rem));--_inset-inline: var(--slotted-listbox-padding-inline, var(--slotted-space-2, .25rem));--_option-inset: var(--slotted-control-padding-inline-md, .8125rem);--_option-height: var(--slotted-control-height-md, 34px);--_option-radius: var(--slotted-listbox-option-radius, var(--slotted-control-radius));--_font-size: var(--slotted-control-font-size-md, 13px);--_secondary-font-size: var(--slotted-control-font-size-sm, 12px);--_icon-size: var(--slotted-control-icon-size-md, 16px);--_column-gap: var(--slotted-control-gap-md, .5rem);--_rows: var(--slotted-listbox-rows, 7);--_columns: var(--slotted-listbox-columns, 1);--_measure: var(--slotted-listbox-measure, 24rem);box-sizing:border-box;color:var(--_text);display:grid;font-family:var(--slotted-font-family-sans);font-size:var(--_font-size);grid-auto-rows:min-content;grid-template-columns:auto minmax(0,1fr) auto;inline-size:100%;max-inline-size:var(--_measure);max-block-size:calc(var(--_rows) * var(--_option-height) + 2 * var(--_inset-block));outline:none;overflow-y:auto;overscroll-behavior:contain;padding-block:var(--_inset-block);padding-inline:var(--_inset-inline);scroll-behavior:auto}[data-ui=listbox][data-size=sm]{--_option-inset: var(--slotted-control-padding-inline-sm, .625rem);--_option-height: var(--slotted-control-height-sm, 30px);--_font-size: var(--slotted-control-font-size-sm, 12px);--_secondary-font-size: var(--slotted-font-size-xs, .75rem);--_icon-size: var(--slotted-control-icon-size-sm, 14px);--_column-gap: var(--slotted-control-gap-sm, .375rem)}[data-ui=listbox][data-size=lg]{--_option-inset: var(--slotted-control-padding-inline-lg, 1rem);--_option-height: var(--slotted-control-height-lg, 38px);--_font-size: var(--slotted-control-font-size-lg, 14px);--_secondary-font-size: var(--slotted-control-font-size-sm, 12px);--_icon-size: var(--slotted-control-icon-size-lg, 18px);--_column-gap: var(--slotted-control-gap-lg, .5rem)}[data-ui=listbox][data-variant=framed]{background:var(--_surface);border:var(--_border-width) solid var(--_border-color);border-radius:var(--_radius);box-shadow:var(--_shadow)}[data-ui=listbox][data-variant=plain]{background:transparent;border:0}[data-ui=listbox][data-focus-mode=activedescendant]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, #2563eb);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=listbox][data-focus-mode=roving]:focus{outline:none}[data-ui=listbox][data-invalid]{--_border-color: var(--slotted-tone-danger-border);--slotted-focus-ring-color: var(--slotted-focus-ring-color-invalid)}[data-ui=listbox][data-invalid]:not([data-disabled]){--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);--_shadow: inset 0 0 0 var(--_invalid-edge-width) var(--slotted-tone-danger-border)}[data-ui=listbox][data-disabled]{--_surface: var(--slotted-disabled-background, #e2e8f0);--_text: var(--slotted-disabled-foreground, #64748b);--_border-color: var(--slotted-disabled-border, #cbd5e1);cursor:not-allowed}[data-ui=listbox][data-loading]{cursor:progress}[data-ui=listbox][data-layout=grid]{column-gap:var(--_column-gap);grid-template-columns:repeat(var(--_columns),minmax(0,1fr));max-block-size:none}[data-ui=listbox][data-layout=grid] [data-part=option]{grid-column:auto;grid-template-columns:auto minmax(0,1fr) auto}[data-ui=listbox][data-layout=grid] :is([data-part=group],[data-part=canvas]){grid-template-columns:repeat(var(--_columns),minmax(0,1fr))}[data-ui=listbox][data-orientation=horizontal]{display:flex;flex-direction:row;max-block-size:none;overflow-x:auto;overflow-y:hidden}[data-ui=listbox][data-orientation=horizontal] [data-part=option]{flex:0 0 auto;grid-template-columns:auto auto auto}[data-ui=listbox]>[data-part=canvas]{align-content:start;block-size:var(--_canvas-size, auto);box-sizing:border-box;display:grid;grid-auto-rows:min-content;grid-column:1 / -1;grid-template-columns:subgrid;padding-block-start:var(--_canvas-offset, 0);position:relative}[data-ui=listbox] [data-part=option][data-pinned]{grid-template-columns:auto minmax(0,1fr) auto;inset-inline:0;position:absolute}[data-ui=listbox] [data-part=group]{display:grid;grid-column:1 / -1;grid-template-columns:subgrid}[data-ui=listbox] [data-part=group-label]{color:var(--_muted);font-size:var(--_secondary-font-size);font-weight:var(--slotted-font-weight-semibold, 600);grid-column:1 / -1;line-height:var(--slotted-line-height-sm, 1.45);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_option-inset)}[data-ui=listbox] [data-part=group]+[data-part=group]{border-block-start:var(--_border-width) solid var(--slotted-listbox-group-border-color, var(--slotted-border-subtle, #e2e8f0));margin-block-start:var(--slotted-space-2, .25rem);padding-block-start:var(--slotted-space-2, .25rem)}[data-ui=listbox] [data-part=option]{align-content:center;background:transparent;border-radius:var(--_option-radius);box-sizing:border-box;color:inherit;cursor:default;display:grid;grid-column:1 / -1;grid-template-columns:subgrid;line-height:var(--slotted-line-height-md, 1.5);min-block-size:var(--_option-height);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_option-inset);position:relative;row-gap:var(--slotted-space-1, .125rem);text-align:start;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui=listbox]:not([data-disabled]) [data-part=option]:not([data-disabled]):hover{background-color:var(--_highlight)}[data-ui=listbox]:not([data-disabled]) [data-part=option]:not([data-disabled]):active{background-color:var(--_highlight-active)}[data-ui=listbox][data-focus-mode=roving]:focus-within [data-part=option][data-current],[data-ui=listbox][data-focus-mode=activedescendant] [data-part=option][data-current]{background-color:var(--_highlight)}[data-ui=listbox]:focus-within [data-part=option][data-current]{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, #2563eb);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=listbox] [data-part=option]:focus{outline:none}[data-ui=listbox] [data-part=option][data-selected]{background-color:var(--_selected-surface);color:var(--_selected-text)}[data-ui=listbox] [data-part=option][data-selected]+[data-part=option][data-selected]{border-start-end-radius:0;border-start-start-radius:0}[data-ui=listbox] [data-part=option][data-selected]:has(+[data-part=option][data-selected]){border-end-end-radius:0;border-end-start-radius:0}[data-ui=listbox]:not([data-disabled]) [data-part=option][data-selected]:not([data-disabled]):hover{background-color:var(--slotted-tone-accent-subtle-hover)}[data-ui=listbox]:not([data-disabled]) [data-part=option][data-selected]:not([data-disabled]):active{background-color:var(--slotted-tone-accent-subtle-active)}[data-ui=listbox] [data-part=option][data-disabled]{color:var(--slotted-disabled-foreground, #64748b);cursor:not-allowed}[data-ui=listbox] [data-part=option][data-disabled]:is([data-selected],[data-current]){background-color:var(--slotted-disabled-background, #e2e8f0);color:var(--slotted-disabled-foreground, #64748b)}[data-ui=listbox][data-readonly] [data-part=option]{cursor:default}[data-ui=listbox] :is([data-part=indicator],[data-part=icon]){block-size:1lh;grid-column:1;grid-row:1;inline-size:var(--_icon-size);justify-self:center;margin-inline-end:var(--_column-gap)}[data-ui=listbox] [data-part=indicator]{--slotted-icon-size: var(--_icon-size);align-items:center;display:flex;justify-content:center;opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui=listbox] [data-part=option][data-selected]>[data-part=indicator]{opacity:1}[data-ui=listbox] [data-part=icon]{--slotted-icon-size: var(--_icon-size);align-items:center;display:flex;justify-content:center}[data-ui=listbox] [data-part=label]{grid-column:2;grid-row:1;min-inline-size:0;overflow-wrap:anywhere}[data-ui=listbox] [data-part=description]{color:var(--_muted);font-size:var(--_secondary-font-size);grid-column:2;grid-row:2;line-height:var(--slotted-line-height-sm, 1.45);min-inline-size:0;overflow-wrap:anywhere}[data-ui=listbox] [data-part=option]:is([data-disabled],[data-selected])>[data-part=description]{color:inherit}[data-ui=listbox] [data-part=meta]{color:var(--_muted);font-variant-numeric:tabular-nums;grid-column:3;grid-row:1;justify-self:end;margin-inline-start:var(--slotted-space-6, 1rem);white-space:nowrap}[data-ui=listbox] [data-part=option]:is([data-disabled],[data-selected])>[data-part=meta]{color:inherit}[data-ui=listbox] :is([data-part=empty],[data-part=loader]){align-content:center;color:var(--_muted);display:grid;grid-column:1 / -1;min-block-size:var(--_option-height);padding-block:var(--slotted-space-5, .75rem);padding-inline:var(--_option-inset);text-align:center}[data-ui=listbox] [data-part=loader]{animation:slotted-listbox-loader var(--slotted-duration-loop) ease-in-out infinite}@keyframes slotted-listbox-loader{0%,to{opacity:.45}50%{opacity:1}}@media(prefers-reduced-motion:reduce){[data-ui=listbox] [data-part=loader]{animation:none;opacity:.7}}@media(forced-colors:active){[data-ui=listbox] [data-part=option][data-selected]{background-color:Highlight;color:HighlightText;forced-color-adjust:none}[data-ui=listbox] [data-part=option][data-disabled]{color:GrayText}}@media(forced-colors:active){[data-ui=listbox][data-variant=framed][data-invalid]:not([data-disabled]){outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--_border-width) + var(--_invalid-edge-width)))}[data-ui=listbox][data-variant=framed][data-invalid]:not([data-disabled])[data-focus-mode=activedescendant]:focus-visible{outline:calc(var(--slotted-focus-ring-width, 2px) + var(--_invalid-edge-width)) double var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}}}\n"] }]
+                    }, styles: ["@layer slotted.components{[data-ui-listbox]{--_surface: var(--slotted-listbox-surface, var(--slotted-surface, #ffffff));--_text: var(--slotted-listbox-text, var(--slotted-text, #0f172a));--_muted: var(--slotted-listbox-text-muted, var(--slotted-text-muted, #5b6b7f));--_border-color: var(--slotted-listbox-border-color, var(--slotted-control-border-color));--_border-width: var(--slotted-border-width-thin, 1px);--_radius: var(--slotted-listbox-radius, var(--slotted-radius-md, 6px));--_shadow: var(--slotted-listbox-shadow, var(--slotted-control-shadow));--_highlight: var(--slotted-listbox-highlight, var(--slotted-tone-secondary-subtle-hover));--_highlight-active: var( --slotted-listbox-highlight-active, var(--slotted-tone-secondary-subtle-active) );--_selected-surface: var( --slotted-listbox-selected-surface, var(--slotted-tone-accent-surface) );--_selected-text: var(--slotted-listbox-selected-text, var(--slotted-tone-accent-text));--_inset-block: var(--slotted-listbox-padding-block, var(--slotted-space-2, .25rem));--_inset-inline: var(--slotted-listbox-padding-inline, var(--slotted-space-2, .25rem));--_option-inset: var(--slotted-control-padding-inline-md, .8125rem);--_option-height: var(--slotted-control-height-md, 34px);--_option-radius: var(--slotted-listbox-option-radius, var(--slotted-control-radius));--_font-size: var(--slotted-control-font-size-md, 13px);--_secondary-font-size: var(--slotted-control-font-size-sm, 12px);--_icon-size: var(--slotted-control-icon-size-md, 16px);--_column-gap: var(--slotted-control-gap-md, .5rem);--_rows: var(--slotted-listbox-rows, 7);--_columns: var(--slotted-listbox-columns, 1);--_measure: var(--slotted-listbox-measure, 24rem);box-sizing:border-box;color:var(--_text);display:grid;font-family:var(--slotted-font-family-sans);font-size:var(--_font-size);grid-auto-rows:min-content;grid-template-columns:auto minmax(0,1fr) auto;inline-size:100%;max-inline-size:var(--_measure);max-block-size:calc(var(--_rows) * var(--_option-height) + 2 * var(--_inset-block));outline:none;overflow-y:auto;overscroll-behavior:contain;padding-block:var(--_inset-block);padding-inline:var(--_inset-inline);scroll-behavior:auto}[data-ui-listbox][data-size=sm]{--_option-inset: var(--slotted-control-padding-inline-sm, .625rem);--_option-height: var(--slotted-control-height-sm, 30px);--_font-size: var(--slotted-control-font-size-sm, 12px);--_secondary-font-size: var(--slotted-font-size-xs, .75rem);--_icon-size: var(--slotted-control-icon-size-sm, 14px);--_column-gap: var(--slotted-control-gap-sm, .375rem)}[data-ui-listbox][data-size=lg]{--_option-inset: var(--slotted-control-padding-inline-lg, 1rem);--_option-height: var(--slotted-control-height-lg, 38px);--_font-size: var(--slotted-control-font-size-lg, 14px);--_secondary-font-size: var(--slotted-control-font-size-sm, 12px);--_icon-size: var(--slotted-control-icon-size-lg, 18px);--_column-gap: var(--slotted-control-gap-lg, .5rem)}[data-ui-listbox][data-variant=framed]{background:var(--_surface);border:var(--_border-width) solid var(--_border-color);border-radius:var(--_radius);box-shadow:var(--_shadow)}[data-ui-listbox][data-variant=plain]{background:transparent;border:0}[data-ui-listbox][data-focus-mode=activedescendant]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, #2563eb);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui-listbox][data-focus-mode=roving]:focus{outline:none}[data-ui-listbox][data-invalid]{--_border-color: var(--slotted-tone-danger-border);--slotted-focus-ring-color: var(--slotted-focus-ring-color-invalid)}[data-ui-listbox][data-invalid]:not([data-disabled]){--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);--_shadow: inset 0 0 0 var(--_invalid-edge-width) var(--slotted-tone-danger-border)}[data-ui-listbox][data-disabled]{--_surface: var(--slotted-disabled-background, #e2e8f0);--_text: var(--slotted-disabled-foreground, #64748b);--_border-color: var(--slotted-disabled-border, #cbd5e1);cursor:not-allowed}[data-ui-listbox][data-loading]{cursor:progress}[data-ui-listbox][data-layout=grid]{column-gap:var(--_column-gap);grid-template-columns:repeat(var(--_columns),minmax(0,1fr));max-block-size:none}[data-ui-listbox][data-layout=grid] [data-part-option]{grid-column:auto;grid-template-columns:auto minmax(0,1fr) auto}[data-ui-listbox][data-layout=grid] :is([data-part-group],[data-part-canvas]){grid-template-columns:repeat(var(--_columns),minmax(0,1fr))}[data-ui-listbox][data-orientation=horizontal]{display:flex;flex-direction:row;max-block-size:none;overflow-x:auto;overflow-y:hidden}[data-ui-listbox][data-orientation=horizontal] [data-part-option]{flex:0 0 auto;grid-template-columns:auto auto auto}[data-ui-listbox]>[data-part-canvas]{align-content:start;block-size:var(--_canvas-size, auto);box-sizing:border-box;display:grid;grid-auto-rows:min-content;grid-column:1 / -1;grid-template-columns:subgrid;padding-block-start:var(--_canvas-offset, 0);position:relative}[data-ui-listbox] [data-part-option][data-pinned]{grid-template-columns:auto minmax(0,1fr) auto;inset-inline:0;position:absolute}[data-ui-listbox] [data-part-group]{display:grid;grid-column:1 / -1;grid-template-columns:subgrid}[data-ui-listbox] [data-part-group-label]{color:var(--_muted);font-size:var(--_secondary-font-size);font-weight:var(--slotted-font-weight-semibold, 600);grid-column:1 / -1;line-height:var(--slotted-line-height-sm, 1.45);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_option-inset)}[data-ui-listbox] [data-part-group]+[data-part-group]{border-block-start:var(--_border-width) solid var(--slotted-listbox-group-border-color, var(--slotted-border-subtle, #e2e8f0));margin-block-start:var(--slotted-space-2, .25rem);padding-block-start:var(--slotted-space-2, .25rem)}[data-ui-listbox] [data-part-option]{align-content:center;background:transparent;border-radius:var(--_option-radius);box-sizing:border-box;color:inherit;cursor:default;display:grid;grid-column:1 / -1;grid-template-columns:subgrid;line-height:var(--slotted-line-height-md, 1.5);min-block-size:var(--_option-height);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_option-inset);position:relative;row-gap:var(--slotted-space-1, .125rem);text-align:start;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui-listbox]:not([data-disabled]) [data-part-option]:not([data-disabled]):hover{background-color:var(--_highlight)}[data-ui-listbox]:not([data-disabled]) [data-part-option]:not([data-disabled]):active{background-color:var(--_highlight-active)}[data-ui-listbox][data-focus-mode=roving]:focus-within [data-part-option][data-current],[data-ui-listbox][data-focus-mode=activedescendant] [data-part-option][data-current]{background-color:var(--_highlight)}[data-ui-listbox]:focus-within [data-part-option][data-current]{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, #2563eb);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui-listbox] [data-part-option]:focus{outline:none}[data-ui-listbox] [data-part-option][data-selected]{background-color:var(--_selected-surface);color:var(--_selected-text)}[data-ui-listbox] [data-part-option][data-selected]+[data-part-option][data-selected]{border-start-end-radius:0;border-start-start-radius:0}[data-ui-listbox] [data-part-option][data-selected]:has(+[data-part-option][data-selected]){border-end-end-radius:0;border-end-start-radius:0}[data-ui-listbox]:not([data-disabled]) [data-part-option][data-selected]:not([data-disabled]):hover{background-color:var(--slotted-tone-accent-subtle-hover)}[data-ui-listbox]:not([data-disabled]) [data-part-option][data-selected]:not([data-disabled]):active{background-color:var(--slotted-tone-accent-subtle-active)}[data-ui-listbox] [data-part-option][data-disabled]{color:var(--slotted-disabled-foreground, #64748b);cursor:not-allowed}[data-ui-listbox] [data-part-option][data-disabled]:is([data-selected],[data-current]){background-color:var(--slotted-disabled-background, #e2e8f0);color:var(--slotted-disabled-foreground, #64748b)}[data-ui-listbox][data-readonly] [data-part-option]{cursor:default}[data-ui-listbox] :is([data-part-indicator],[data-part-icon]){block-size:1lh;grid-column:1;grid-row:1;inline-size:var(--_icon-size);justify-self:center;margin-inline-end:var(--_column-gap)}[data-ui-listbox] [data-part-indicator]{--slotted-icon-size: var(--_icon-size);align-items:center;display:flex;justify-content:center;opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui-listbox] [data-part-option][data-selected]>[data-part-indicator]{opacity:1}[data-ui-listbox] [data-part-icon]{--slotted-icon-size: var(--_icon-size);align-items:center;display:flex;justify-content:center}[data-ui-listbox] [data-part-label]{grid-column:2;grid-row:1;min-inline-size:0;overflow-wrap:anywhere}[data-ui-listbox] [data-part-description]{color:var(--_muted);font-size:var(--_secondary-font-size);grid-column:2;grid-row:2;line-height:var(--slotted-line-height-sm, 1.45);min-inline-size:0;overflow-wrap:anywhere}[data-ui-listbox] [data-part-option]:is([data-disabled],[data-selected])>[data-part-description]{color:inherit}[data-ui-listbox] [data-part-meta]{color:var(--_muted);font-variant-numeric:tabular-nums;grid-column:3;grid-row:1;justify-self:end;margin-inline-start:var(--slotted-space-6, 1rem);white-space:nowrap}[data-ui-listbox] [data-part-option]:is([data-disabled],[data-selected])>[data-part-meta]{color:inherit}[data-ui-listbox] :is([data-part-empty],[data-part-loader]){align-content:center;color:var(--_muted);display:grid;grid-column:1 / -1;min-block-size:var(--_option-height);padding-block:var(--slotted-space-5, .75rem);padding-inline:var(--_option-inset);text-align:center}[data-ui-listbox] [data-part-loader]{animation:slotted-listbox-loader var(--slotted-duration-loop) ease-in-out infinite}@keyframes slotted-listbox-loader{0%,to{opacity:.45}50%{opacity:1}}@media(prefers-reduced-motion:reduce){[data-ui-listbox] [data-part-loader]{animation:none;opacity:.7}}@media(forced-colors:active){[data-ui-listbox] [data-part-option][data-selected]{background-color:Highlight;color:HighlightText;forced-color-adjust:none}[data-ui-listbox] [data-part-option][data-disabled]{color:GrayText}}@media(forced-colors:active){[data-ui-listbox][data-variant=framed][data-invalid]:not([data-disabled]){outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--_border-width) + var(--_invalid-edge-width)))}[data-ui-listbox][data-variant=framed][data-invalid]:not([data-disabled])[data-focus-mode=activedescendant]:focus-visible{outline:calc(var(--slotted-focus-ring-width, 2px) + var(--_invalid-edge-width)) double var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], defaultValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultValue", required: false }] }], activeKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeKey", required: false }] }], defaultActiveKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultActiveKey", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], selectionBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionBehavior", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], focusMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusMode", required: false }] }], indicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "indicator", required: false }] }], loop: [{ type: i0.Input, args: [{ isSignal: true, alias: "loop", required: false }] }], typeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeahead", required: false }] }], selectOnFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectOnFocus", required: false }] }], navigateDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "navigateDisabled", required: false }] }], disallowEmptySelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "disallowEmptySelection", required: false }] }], disallowSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "disallowSelectAll", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], typeaheadTimeout: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeaheadTimeout", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], sections: [{ type: i0.Input, args: [{ isSignal: true, alias: "sections", required: false }] }], getKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "getKey", required: false }] }], getLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "getLabel", required: false }] }], isItemDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isItemDisabled", required: false }] }], totalCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalCount", required: false }] }], virtual: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtual", required: false }] }], itemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemSize", required: false }] }], sectionSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "sectionSize", required: false }] }], overscan: [{ type: i0.Input, args: [{ isSignal: true, alias: "overscan", required: false }] }], hasMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasMore", required: false }] }], loadMoreThreshold: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadMoreThreshold", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], activeKeyChange: [{ type: i0.Output, args: ["activeKeyChange"] }], loadMore: [{ type: i0.Output, args: ["loadMore"] }], optionContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SlListboxOptionContent), { ...{
                             read: TemplateRef,
                         }, isSignal: true }] }] } });