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

package/fesm2022/slotted-angular-transfer.mjs

@@ -1,3 +1,4 @@
+import { writeSelectorKey } from '@slotted/core/selector-key';
 import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, Injectable, Directive, input, ElementRef, afterNextRender, model, booleanAttribute, numberAttribute, output, DestroyRef, HostAttributeToken, contentChild, TemplateRef, viewChildren, computed, signal, afterEveryRender, forwardRef, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
@@ -118,7 +119,7 @@ class SlTransferPart {
     part = input.required({ ...(ngDevMode ? { debugName: "part" } : /* istanbul ignore next */ {}), alias: 'slTransferPart' });
     host = inject(ElementRef);
     constructor() {
-        afterNextRender(() => this.host.nativeElement.setAttribute('data-part', this.part()));
+        afterNextRender(() => writeSelectorKey(this.host.nativeElement, 'part', this.part()));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTransferPart, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: SlTransferPart, isStandalone: true, selector: "[slTransferPart]", inputs: { part: { classPropertyName: "part", publicName: "slTransferPart", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
@@ -850,11 +851,11 @@ class SlTransfer {
         return (value ?? EMPTY).length === 0 ? { required: true } : null;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTransfer, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlTransfer, isStandalone: true, selector: "[slTransfer]", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, getKey: { classPropertyName: "getKey", publicName: "getKey", isSignal: true, isRequired: false, transformFunction: null }, getLabel: { classPropertyName: "getLabel", publicName: "getLabel", isSignal: true, isRequired: false, transformFunction: null }, getDescription: { classPropertyName: "getDescription", publicName: "getDescription", isSignal: true, isRequired: false, transformFunction: null }, isItemDisabled: { classPropertyName: "isItemDisabled", publicName: "isItemDisabled", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, targetKeys: { classPropertyName: "targetKeys", publicName: "targetKeys", isSignal: true, isRequired: false, transformFunction: null }, defaultTargetKeys: { classPropertyName: "defaultTargetKeys", publicName: "defaultTargetKeys", isSignal: true, isRequired: false, transformFunction: null }, selectedKeys: { classPropertyName: "selectedKeys", publicName: "selectedKeys", isSignal: true, isRequired: false, transformFunction: null }, defaultSelectedKeys: { classPropertyName: "defaultSelectedKeys", publicName: "defaultSelectedKeys", isSignal: true, isRequired: false, transformFunction: null }, sourceQuery: { classPropertyName: "sourceQuery", publicName: "sourceQuery", isSignal: true, isRequired: false, transformFunction: null }, defaultSourceQuery: { classPropertyName: "defaultSourceQuery", publicName: "defaultSourceQuery", isSignal: true, isRequired: false, transformFunction: null }, targetQuery: { classPropertyName: "targetQuery", publicName: "targetQuery", isSignal: true, isRequired: false, transformFunction: null }, defaultTargetQuery: { classPropertyName: "defaultTargetQuery", publicName: "defaultTargetQuery", isSignal: true, isRequired: false, transformFunction: null }, pane: { classPropertyName: "pane", publicName: "pane", isSignal: true, isRequired: false, transformFunction: null }, defaultPane: { classPropertyName: "defaultPane", publicName: "defaultPane", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, selectAll: { classPropertyName: "selectAll", publicName: "selectAll", isSignal: true, isRequired: false, transformFunction: null }, reorderable: { classPropertyName: "reorderable", publicName: "reorderable", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", 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 }, overscan: { classPropertyName: "overscan", publicName: "overscan", 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 }, hasMore: { classPropertyName: "hasMore", publicName: "hasMore", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { targetKeys: "targetKeysChange", selectedKeys: "selectedKeysChange", sourceQuery: "sourceQueryChange", targetQuery: "targetQueryChange", pane: "paneChange", targetKeysChangeRequest: "targetKeysChangeRequest", selectedKeysChangeRequest: "selectedKeysChangeRequest", sourceQueryChangeRequest: "sourceQueryChangeRequest", targetQueryChangeRequest: "targetQueryChangeRequest", paneChangeRequest: "paneChangeRequest", loadMore: "loadMore" }, host: { attributes: { "data-ui": "transfer", "data-part": "root" }, properties: { "attr.role": "writtenRole ?? \"group\"", "attr.data-layout": "resolvedLayout()", "attr.data-size": "resolvedSize()", "attr.data-pane": "currentPane()", "attr.data-disabled": "isDisabled() ? \"\" : null", "attr.aria-disabled": "isDisabled() ? \"true\" : null", "attr.data-readonly": "readOnly() ? \"\" : null", "attr.data-invalid": "isInvalid() ? \"\" : null", "attr.data-required": "required() ? \"\" : null", "attr.data-loading": "loading() ? \"\" : null", "style.--slotted-transfer-rows": "resolvedRows()" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlTransfer, isStandalone: true, selector: "[slTransfer]", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, getKey: { classPropertyName: "getKey", publicName: "getKey", isSignal: true, isRequired: false, transformFunction: null }, getLabel: { classPropertyName: "getLabel", publicName: "getLabel", isSignal: true, isRequired: false, transformFunction: null }, getDescription: { classPropertyName: "getDescription", publicName: "getDescription", isSignal: true, isRequired: false, transformFunction: null }, isItemDisabled: { classPropertyName: "isItemDisabled", publicName: "isItemDisabled", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, targetKeys: { classPropertyName: "targetKeys", publicName: "targetKeys", isSignal: true, isRequired: false, transformFunction: null }, defaultTargetKeys: { classPropertyName: "defaultTargetKeys", publicName: "defaultTargetKeys", isSignal: true, isRequired: false, transformFunction: null }, selectedKeys: { classPropertyName: "selectedKeys", publicName: "selectedKeys", isSignal: true, isRequired: false, transformFunction: null }, defaultSelectedKeys: { classPropertyName: "defaultSelectedKeys", publicName: "defaultSelectedKeys", isSignal: true, isRequired: false, transformFunction: null }, sourceQuery: { classPropertyName: "sourceQuery", publicName: "sourceQuery", isSignal: true, isRequired: false, transformFunction: null }, defaultSourceQuery: { classPropertyName: "defaultSourceQuery", publicName: "defaultSourceQuery", isSignal: true, isRequired: false, transformFunction: null }, targetQuery: { classPropertyName: "targetQuery", publicName: "targetQuery", isSignal: true, isRequired: false, transformFunction: null }, defaultTargetQuery: { classPropertyName: "defaultTargetQuery", publicName: "defaultTargetQuery", isSignal: true, isRequired: false, transformFunction: null }, pane: { classPropertyName: "pane", publicName: "pane", isSignal: true, isRequired: false, transformFunction: null }, defaultPane: { classPropertyName: "defaultPane", publicName: "defaultPane", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, selectAll: { classPropertyName: "selectAll", publicName: "selectAll", isSignal: true, isRequired: false, transformFunction: null }, reorderable: { classPropertyName: "reorderable", publicName: "reorderable", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", 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 }, overscan: { classPropertyName: "overscan", publicName: "overscan", 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 }, hasMore: { classPropertyName: "hasMore", publicName: "hasMore", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { targetKeys: "targetKeysChange", selectedKeys: "selectedKeysChange", sourceQuery: "sourceQueryChange", targetQuery: "targetQueryChange", pane: "paneChange", targetKeysChangeRequest: "targetKeysChangeRequest", selectedKeysChangeRequest: "selectedKeysChangeRequest", sourceQueryChangeRequest: "sourceQueryChangeRequest", targetQueryChangeRequest: "targetQueryChangeRequest", paneChangeRequest: "paneChangeRequest", loadMore: "loadMore" }, host: { attributes: { "data-ui": "transfer", "data-ui-transfer": "", "data-part": "root", "data-part-root": "" }, properties: { "attr.role": "writtenRole ?? \"group\"", "attr.data-layout": "resolvedLayout()", "attr.data-size": "resolvedSize()", "attr.data-pane": "currentPane()", "attr.data-disabled": "isDisabled() ? \"\" : null", "attr.aria-disabled": "isDisabled() ? \"true\" : null", "attr.data-readonly": "readOnly() ? \"\" : null", "attr.data-invalid": "isInvalid() ? \"\" : null", "attr.data-required": "required() ? \"\" : null", "attr.data-loading": "loading() ? \"\" : null", "style.--slotted-transfer-rows": "resolvedRows()" } }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SlTransfer), multi: true },
             { provide: NG_VALIDATORS, useExisting: forwardRef(() => SlTransfer), multi: true },
         ], queries: [{ propertyName: "itemTemplate", first: true, predicate: SlTransferItem, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "footerTemplate", first: true, predicate: SlTransferFooter, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "listboxes", predicate: SlListbox, descendants: true, isSignal: true }], exportAs: ["slTransfer"], ngImport: i0, template: `
-    <div data-part="switch">
+    <div data-part="switch" data-part-switch="">
       <div
         slSegmentedControl
         [attr.aria-label]="t('panes')"
@@ -869,12 +870,12 @@ class SlTransfer {
         }
       </div>
     </div>
-    <div data-part="body">
+    <div data-part="body" data-part-body="">
       <ng-container
         [ngTemplateOutlet]="paneTemplate"
         [ngTemplateOutletContext]="{ $implicit: 'source' }"
       />
-      <div data-part="actions" role="group" [attr.aria-label]="t('actions')">
+      <div data-part="actions" data-part-actions="" role="group" [attr.aria-label]="t('actions')">
         <button
           slButton
           slTransferPart="move-to-target"
@@ -936,7 +937,12 @@ class SlTransfer {
           >{{ t('moveAllToSource') }}
         </button>
         @if (resolvedReorderable()) {
-          <div data-part="reorder" role="group" [attr.aria-label]="t('reorder')">
+          <div
+            data-part="reorder"
+            data-part-reorder=""
+            role="group"
+            [attr.aria-label]="t('reorder')"
+          >
             <button
               slButton
               slTransferPart="move-up"
@@ -984,15 +990,16 @@ class SlTransfer {
     <ng-template #paneTemplate let-side>
       <div
         data-part="pane"
+        data-part-pane=""
         role="group"
         [attr.data-side]="side"
         [attr.aria-labelledby]="titleId(side)"
         [attr.data-current]="currentPane() === side ? '' : null"
         [attr.data-drop-target]="dropTarget(side) ? '' : null"
       >
-        <div data-part="pane-header">
+        <div data-part="pane-header" data-part-pane-header="">
           @if (resolvedSelectAll()) {
-            <span data-part="select-all">
+            <span data-part="select-all" data-part-select-all="">
               <div
                 slCheckbox
                 [size]="resolvedSize()"
@@ -1003,14 +1010,16 @@ class SlTransfer {
               ></div>
             </span>
           }
-          <span data-part="title" [attr.id]="titleId(side)">{{ title(side) }}</span>
-          <span data-part="count">{{ countText(side) }}</span>
+          <span data-part="title" data-part-title="" [attr.id]="titleId(side)">{{
+            title(side)
+          }}</span>
+          <span data-part="count" data-part-count="">{{ countText(side) }}</span>
         </div>
         @if (resolvedSearchable()) {
-          <div data-part="search">
+          <div data-part="search" data-part-search="">
             <div slTextField [clearable]="true" [size]="innerSize()">
               <span slTextFieldStart aria-hidden="true"
-                ><span data-part="search-icon"
+                ><span data-part="search-icon" data-part-search-icon=""
                   ><span slIcon><svg slGlyph name="search"></svg></span></span
               ></span>
               <input
@@ -1025,7 +1034,12 @@ class SlTransfer {
             </div>
           </div>
         }
-        <div data-part="list" [attr.data-side]="side" (focusin)="onListFocus(side, $event)">
+        <div
+          data-part="list"
+          data-part-list=""
+          [attr.data-side]="side"
+          (focusin)="onListFocus(side, $event)"
+        >
           <div
             slListbox
             variant="plain"
@@ -1073,7 +1087,11 @@ class SlTransfer {
             </ng-template>
             @if (isEmpty(side)) {
               <div slListboxEmpty>
-                <div data-part="empty" [attr.data-query]="typed(side) ? '' : null">
+                <div
+                  data-part="empty"
+                  data-part-empty=""
+                  [attr.data-query]="typed(side) ? '' : null"
+                >
                   <span slIcon
                     ><svg slGlyph [name]="typed(side) ? 'search-x' : 'inbox'"></svg
                   ></span>
@@ -1088,13 +1106,14 @@ class SlTransfer {
           @if (side === 'target' && dropOffset() !== null) {
             <div
               data-part="drop-indicator"
+              data-part-drop-indicator=""
               aria-hidden="true"
               [style.--_drop-offset]="dropOffset() + 'px'"
             ></div>
           }
         </div>
         @if (footerTemplate(); as footer) {
-          <div data-part="pane-footer">
+          <div data-part="pane-footer" data-part-pane-footer="">
             <ng-container
               [ngTemplateOutlet]="footer"
               [ngTemplateOutletContext]="{ $implicit: side }"
@@ -1103,7 +1122,7 @@ class SlTransfer {
         }
       </div>
     </ng-template>
-  `, isInline: true, styles: ["@layer slotted.components{[data-ui=transfer]{--_text: var(--slotted-text, CanvasText);--_muted: var(--slotted-text-muted, GrayText);--_rule: var(--slotted-border-subtle, ButtonBorder);--_edge: var(--slotted-control-border-color, ButtonBorder);--_surface: var(--slotted-control-surface, Field);--_shadow: var(--slotted-control-shadow, none);--_radius: var(--slotted-radius-md, 6px);--_pane-min: var(--slotted-transfer-pane-min-inline-size, 13rem);--_gap: var(--slotted-space-5, .75rem);--_rows: var(--slotted-transfer-rows, 8);--_duration: var(--slotted-control-transition-duration);--_easing: var(--slotted-control-transition-easing);--_option-height: var(--slotted-control-height-md, 34px);--_option-inset: var(--slotted-control-padding-inline-md, 13px);--_mark: var(--slotted-control-icon-size-md, 16px);--_box: var(--slotted-selection-size-md, 16px);--_font-size: var(--slotted-control-font-size-md, 13px);--_list-inset: var(--slotted-listbox-padding-block, var(--slotted-space-2, .25rem));box-sizing:border-box;color:var(--_text);display:grid;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);min-inline-size:0;row-gap:var(--_gap);text-align:start;container-name:transfer;container-type:inline-size}[data-ui=transfer][data-size=sm]{--_option-height: var(--slotted-control-height-sm, 30px);--_option-inset: var(--slotted-control-padding-inline-sm, 10px);--_mark: var(--slotted-control-icon-size-sm, 14px);--_box: var(--slotted-selection-size-sm, 14px);--_font-size: var(--slotted-control-font-size-sm, 12px)}[data-ui=transfer][data-size=lg]{--_option-height: var(--slotted-control-height-lg, 38px);--_option-inset: var(--slotted-control-padding-inline-lg, 16px);--_mark: var(--slotted-control-icon-size-lg, 18px);--_box: var(--slotted-selection-size-lg, 18px);--_font-size: var(--slotted-control-font-size-lg, 14px)}[data-ui=transfer]>[data-part=switch]{display:none}[data-ui=transfer]>[data-part=switch]>[data-ui=segmented-control]{inline-size:100%}[data-ui=transfer]>[data-part=body]{align-items:center;column-gap:var(--_gap);display:grid;grid-template-columns:minmax(var(--_pane-min),1fr) max-content minmax(var(--_pane-min),1fr);min-inline-size:0}[data-ui=transfer]>[data-part=body]>[data-part=pane]{align-self:stretch;background:var(--_surface);border:var(--slotted-border-width-thin, 1px) solid var(--_edge);border-radius:var(--_radius);box-shadow:var(--_shadow);box-sizing:border-box;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;min-inline-size:0;overflow:clip;transition:border-color var(--_duration) var(--_easing),box-shadow var(--_duration) var(--_easing)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]{align-items:center;column-gap:var(--slotted-space-4, .5rem);display:flex;min-block-size:var(--_option-height);padding-block:var(--slotted-space-3, .375rem);padding-inline-end:calc(var(--_list-inset) + var(--_option-inset));padding-inline-start:calc(var(--_list-inset) + var(--_option-inset) - (var(--_box) - var(--_mark)) / 2)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]>[data-part=select-all]{display:inline-flex;flex:none}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]>[data-part=select-all]>[data-ui=checkbox]{column-gap:0}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]>[data-part=title]{color:var(--_text);font-weight:var(--slotted-font-weight-semibold, 600);min-inline-size:0;overflow-wrap:anywhere}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]>[data-part=count]{color:var(--_muted);flex:none;font-size:var(--slotted-font-size-xs, .75rem);font-variant-numeric:tabular-nums;line-height:var(--slotted-line-height-xs, 1.4);margin-inline-start:auto;white-space:nowrap}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=search]{padding-block-end:var(--slotted-space-4, .5rem);padding-inline:var(--slotted-space-4, .5rem)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=search]>[data-ui=text-field]{inline-size:100%}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=search] [data-part=search-icon]{display:inline-flex;flex:none}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]{block-size:calc(var(--_rows) * var(--_option-height) + 2 * var(--_list-inset));border-block-start:var(--slotted-border-width-thin, 1px) solid var(--_rule);box-sizing:content-box;min-block-size:0;position:relative}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox]{--slotted-listbox-measure: none;block-size:100%;max-block-size:100%}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox]:has(>[data-part=empty]){align-content:center}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox]>[data-part=empty]>[data-part=empty]{--slotted-icon-size: var(--_mark);display:grid;justify-items:center;row-gap:var(--slotted-space-3, .375rem)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox] [data-part=option]:has(>[data-part=indicator][data-unresolved]){color:var(--_muted);font-family:var(--slotted-font-family-mono, ui-monospace, monospace)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-part=drop-indicator]{block-size:0;inset-block-start:var(--_drop-offset, 0);inset-inline:calc(var(--_list-inset) + var(--slotted-space-2, .25rem));pointer-events:none;position:absolute}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-part=drop-indicator]:before{background-color:var(--slotted-tone-accent-solid);block-size:var(--slotted-border-width-thick, 2px);border-radius:var(--slotted-radius-full, 9999px);content:\"\";inset-block-start:calc(var(--slotted-border-width-thick, 2px) / -2);inset-inline:0;position:absolute}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox] [data-part=option]:has(>[data-part=indicator][data-dragging]){opacity:.5}[data-ui=transfer]>[data-part=body]>[data-part=pane][data-drop-target]{border-color:var(--slotted-tone-accent-border, Highlight);box-shadow:0 0 0 var(--slotted-border-width-thin, 1px) var(--slotted-tone-accent-border, Highlight)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-footer]{border-block-start:var(--slotted-border-width-thin, 1px) solid var(--_rule);color:var(--_muted);font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--slotted-line-height-xs, 1.4);padding-block:var(--slotted-space-4, .5rem);padding-inline:calc(var(--_list-inset) + var(--_option-inset))}[data-ui=transfer][data-invalid]>[data-part=body]>[data-part=pane]{--_edge: var(--slotted-tone-danger-border, Mark);--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);--_shadow: inset 0 0 0 var(--_invalid-edge-width) var(--_edge)}[data-ui=transfer][data-disabled]{--_surface: var(--slotted-disabled-background, Canvas);--_edge: var(--slotted-disabled-border, GrayText);--_text: var(--slotted-disabled-foreground, GrayText);--_muted: var(--slotted-disabled-foreground, GrayText);--_shadow: none}[data-ui=transfer]>[data-part=body]>[data-part=actions]{display:grid;gap:var(--slotted-space-3, .375rem);grid-auto-rows:auto;min-inline-size:0}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=move-to-source],[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=reorder]{margin-block-start:var(--slotted-space-4, .5rem)}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-ui=button]{inline-size:100%}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=reorder]{display:grid;gap:var(--slotted-space-3, .375rem)}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=reorder]>[data-ui=button]{inline-size:100%}[data-ui=transfer]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=move-all-to-source])>[data-part=start]>[data-ui=icon],[data-ui=transfer]:dir(rtl)>[data-part=body]>[data-part=actions]>:is([data-part=move-to-target],[data-part=move-all-to-target])>[data-part=end]>[data-ui=icon]{scale:-1 1}[data-ui=transfer]:dir(rtl)>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=move-all-to-source])>[data-part=start]>[data-ui=icon]{scale:1 1}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=reorder]>[data-part=move-up]>[data-part=start]>[data-ui=icon]{scale:1 -1}[data-ui=transfer][data-layout=steps]>[data-part=switch]{display:block}[data-ui=transfer][data-layout=steps]>[data-part=body]{grid-template-columns:minmax(0,1fr);row-gap:var(--slotted-space-4, .5rem)}[data-ui=transfer][data-layout=steps]>[data-part=body]>[data-part=pane]:not([data-current]){display:none}[data-ui=transfer][data-layout=steps]>[data-part=body]>[data-part=actions]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-ui=transfer][data-layout=steps]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=reorder]){margin-block-start:0}[data-ui=transfer][data-layout=steps][data-pane=source]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=move-all-to-source],[data-part=reorder]),[data-ui=transfer][data-layout=steps][data-pane=target]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-target],[data-part=move-all-to-target]){display:none}[data-ui=transfer][data-layout=steps]>[data-part=body]>[data-part=actions]>[data-part=reorder]{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}@container transfer (inline-size < 36rem){[data-ui=transfer][data-layout=auto]>[data-part=switch]{display:block}[data-ui=transfer][data-layout=auto]>[data-part=body]{grid-template-columns:minmax(0,1fr);row-gap:var(--slotted-space-4, .5rem)}[data-ui=transfer][data-layout=auto]>[data-part=body]>[data-part=pane]:not([data-current]){display:none}[data-ui=transfer][data-layout=auto]>[data-part=body]>[data-part=actions]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-ui=transfer][data-layout=auto]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=reorder]){margin-block-start:0}[data-ui=transfer][data-layout=auto][data-pane=source]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=move-all-to-source],[data-part=reorder]),[data-ui=transfer][data-layout=auto][data-pane=target]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-target],[data-part=move-all-to-target]){display:none}[data-ui=transfer][data-layout=auto]>[data-part=body]>[data-part=actions]>[data-part=reorder]{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(forced-colors:active){[data-ui=transfer][data-invalid]>[data-part=body]>[data-part=pane]{outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--slotted-border-width-thin, 1px) + var(--_invalid-edge-width)))}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlButton, selector: "button[slButton]", inputs: ["disabled", "focusableWhenDisabled", "fullWidth", "justify", "loading", "loadingDelay", "messages", "size", "tone", "type", "variant"], exportAs: ["slButton"] }, { kind: "component", type: SlButtonEnd, selector: "[slButtonEnd]", exportAs: ["slButtonEnd"] }, { kind: "component", type: SlButtonStart, selector: "[slButtonStart]", exportAs: ["slButtonStart"] }, { kind: "component", type: SlCheckbox, selector: "[slCheckbox]", inputs: ["checked", "defaultChecked", "indeterminate", "parent", "value", "name", "tabIndex", "size", "labelPlacement", "variant", "disabled", "readOnly", "invalid"], outputs: ["checkedChange"], exportAs: ["slCheckbox"] }, { kind: "component", type: SlGlyph, selector: "svg[slGlyph]", inputs: ["name", "solid"] }, { kind: "component", type: SlIcon, selector: "[slIcon]", inputs: ["directional", "label", "size", "tone"], exportAs: ["slIcon"] }, { kind: "component", type: SlListbox, selector: "[slListbox]", inputs: ["value", "defaultValue", "activeKey", "defaultActiveKey", "selectionMode", "selectionBehavior", "size", "variant", "orientation", "focusMode", "indicator", "loop", "typeahead", "selectOnFocus", "navigateDisabled", "disallowEmptySelection", "disallowSelectAll", "rows", "columns", "pageSize", "typeaheadTimeout", "disabled", "readOnly", "required", "invalid", "loading", "items", "sections", "getKey", "getLabel", "isItemDisabled", "totalCount", "virtual", "itemSize", "sectionSize", "overscan", "hasMore", "loadMoreThreshold"], outputs: ["valueChange", "activeKeyChange", "loadMore"], exportAs: ["slListbox"] }, { kind: "directive", type: SlListboxDescription, selector: "[slListboxDescription]" }, { kind: "directive", type: SlListboxEmpty, selector: "[slListboxEmpty]" }, { kind: "component", type: SlListboxIndicator, selector: "[slListboxIndicator]" }, { kind: "directive", type: SlListboxLabel, selector: "[slListboxLabel]" }, { kind: "directive", type: SlListboxLoader, selector: "[slListboxLoader]" }, { kind: "directive", type: SlListboxOptionContent, selector: "[slListboxOptionContent]" }, { kind: "component", type: SlSegment, selector: "[slSegment]", inputs: ["value", "disabled"], exportAs: ["slSegment"] }, { kind: "component", type: SlSegmentedControl, selector: "[slSegmentedControl]", inputs: ["value", "defaultValue", "name", "size", "orientation", "condense", "variant", "fullWidth", "disabled", "readOnly", "invalid", "required"], outputs: ["valueChange"], exportAs: ["slSegmentedControl"] }, { kind: "component", type: SlTextField, selector: "[slTextField]", inputs: ["size", "variant", "mono", "clearable", "revealable", "copyable", "messages", "loading"], outputs: ["valueCopy"], exportAs: ["slTextField"] }, { kind: "directive", type: SlTextFieldInput, selector: "input[slTextFieldInput]", inputs: ["value", "defaultValue", "disabled", "readOnly", "invalid", "showCount", "countMax", "revealed", "defaultRevealed", "type"], outputs: ["valueChange", "revealedChange"], exportAs: ["slTextFieldInput"] }, { kind: "directive", type: SlTextFieldStart, selector: "[slTextFieldStart]", exportAs: ["slTextFieldStart"] }, { kind: "directive", type: SlTransferPart, selector: "[slTransferPart]", inputs: ["slTransferPart"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: ["@layer slotted.components{[data-ui-transfer]{--_text: var(--slotted-text, CanvasText);--_muted: var(--slotted-text-muted, GrayText);--_rule: var(--slotted-border-subtle, ButtonBorder);--_edge: var(--slotted-control-border-color, ButtonBorder);--_surface: var(--slotted-control-surface, Field);--_shadow: var(--slotted-control-shadow, none);--_radius: var(--slotted-radius-md, 6px);--_pane-min: var(--slotted-transfer-pane-min-inline-size, 13rem);--_gap: var(--slotted-space-5, .75rem);--_rows: var(--slotted-transfer-rows, 8);--_duration: var(--slotted-control-transition-duration);--_easing: var(--slotted-control-transition-easing);--_option-height: var(--slotted-control-height-md, 34px);--_option-inset: var(--slotted-control-padding-inline-md, 13px);--_mark: var(--slotted-control-icon-size-md, 16px);--_box: var(--slotted-selection-size-md, 16px);--_font-size: var(--slotted-control-font-size-md, 13px);--_list-inset: var(--slotted-listbox-padding-block, var(--slotted-space-2, .25rem));box-sizing:border-box;color:var(--_text);display:grid;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);min-inline-size:0;row-gap:var(--_gap);text-align:start;container-name:transfer;container-type:inline-size}[data-ui-transfer][data-size=sm]{--_option-height: var(--slotted-control-height-sm, 30px);--_option-inset: var(--slotted-control-padding-inline-sm, 10px);--_mark: var(--slotted-control-icon-size-sm, 14px);--_box: var(--slotted-selection-size-sm, 14px);--_font-size: var(--slotted-control-font-size-sm, 12px)}[data-ui-transfer][data-size=lg]{--_option-height: var(--slotted-control-height-lg, 38px);--_option-inset: var(--slotted-control-padding-inline-lg, 16px);--_mark: var(--slotted-control-icon-size-lg, 18px);--_box: var(--slotted-selection-size-lg, 18px);--_font-size: var(--slotted-control-font-size-lg, 14px)}[data-ui-transfer]>[data-part-switch]{display:none}[data-ui-transfer]>[data-part-switch]>[data-ui-segmented-control]{inline-size:100%}[data-ui-transfer]>[data-part-body]{align-items:center;column-gap:var(--_gap);display:grid;grid-template-columns:minmax(var(--_pane-min),1fr) max-content minmax(var(--_pane-min),1fr);min-inline-size:0}[data-ui-transfer]>[data-part-body]>[data-part-pane]{align-self:stretch;background:var(--_surface);border:var(--slotted-border-width-thin, 1px) solid var(--_edge);border-radius:var(--_radius);box-shadow:var(--_shadow);box-sizing:border-box;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;min-inline-size:0;overflow:clip;transition:border-color var(--_duration) var(--_easing),box-shadow var(--_duration) var(--_easing)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]{align-items:center;column-gap:var(--slotted-space-4, .5rem);display:flex;min-block-size:var(--_option-height);padding-block:var(--slotted-space-3, .375rem);padding-inline-end:calc(var(--_list-inset) + var(--_option-inset));padding-inline-start:calc(var(--_list-inset) + var(--_option-inset) - (var(--_box) - var(--_mark)) / 2)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]>[data-part-select-all]{display:inline-flex;flex:none}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]>[data-part-select-all]>[data-ui-checkbox]{column-gap:0}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]>[data-part-title]{color:var(--_text);font-weight:var(--slotted-font-weight-semibold, 600);min-inline-size:0;overflow-wrap:anywhere}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]>[data-part-count]{color:var(--_muted);flex:none;font-size:var(--slotted-font-size-xs, .75rem);font-variant-numeric:tabular-nums;line-height:var(--slotted-line-height-xs, 1.4);margin-inline-start:auto;white-space:nowrap}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-search]{padding-block-end:var(--slotted-space-4, .5rem);padding-inline:var(--slotted-space-4, .5rem)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-search]>[data-ui-text-field]{inline-size:100%}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-search] [data-part-search-icon]{display:inline-flex;flex:none}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]{block-size:calc(var(--_rows) * var(--_option-height) + 2 * var(--_list-inset));border-block-start:var(--slotted-border-width-thin, 1px) solid var(--_rule);box-sizing:content-box;min-block-size:0;position:relative}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox]{--slotted-listbox-measure: none;block-size:100%;max-block-size:100%}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox]:has(>[data-part-empty]){align-content:center}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox]>[data-part-empty]>[data-part-empty]{--slotted-icon-size: var(--_mark);display:grid;justify-items:center;row-gap:var(--slotted-space-3, .375rem)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox] [data-part-option]:has(>[data-part-indicator][data-unresolved]){color:var(--_muted);font-family:var(--slotted-font-family-mono, ui-monospace, monospace)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-part-drop-indicator]{block-size:0;inset-block-start:var(--_drop-offset, 0);inset-inline:calc(var(--_list-inset) + var(--slotted-space-2, .25rem));pointer-events:none;position:absolute}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-part-drop-indicator]:before{background-color:var(--slotted-tone-accent-solid);block-size:var(--slotted-border-width-thick, 2px);border-radius:var(--slotted-radius-full, 9999px);content:\"\";inset-block-start:calc(var(--slotted-border-width-thick, 2px) / -2);inset-inline:0;position:absolute}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox] [data-part-option]:has(>[data-part-indicator][data-dragging]){opacity:.5}[data-ui-transfer]>[data-part-body]>[data-part-pane][data-drop-target]{border-color:var(--slotted-tone-accent-border, Highlight);box-shadow:0 0 0 var(--slotted-border-width-thin, 1px) var(--slotted-tone-accent-border, Highlight)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-footer]{border-block-start:var(--slotted-border-width-thin, 1px) solid var(--_rule);color:var(--_muted);font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--slotted-line-height-xs, 1.4);padding-block:var(--slotted-space-4, .5rem);padding-inline:calc(var(--_list-inset) + var(--_option-inset))}[data-ui-transfer][data-invalid]>[data-part-body]>[data-part-pane]{--_edge: var(--slotted-tone-danger-border, Mark);--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);--_shadow: inset 0 0 0 var(--_invalid-edge-width) var(--_edge)}[data-ui-transfer][data-disabled]{--_surface: var(--slotted-disabled-background, Canvas);--_edge: var(--slotted-disabled-border, GrayText);--_text: var(--slotted-disabled-foreground, GrayText);--_muted: var(--slotted-disabled-foreground, GrayText);--_shadow: none}[data-ui-transfer]>[data-part-body]>[data-part-actions]{display:grid;gap:var(--slotted-space-3, .375rem);grid-auto-rows:auto;min-inline-size:0}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-move-to-source],[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-reorder]{margin-block-start:var(--slotted-space-4, .5rem)}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-ui-button]{inline-size:100%}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-reorder]{display:grid;gap:var(--slotted-space-3, .375rem)}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-reorder]>[data-ui-button]{inline-size:100%}[data-ui-transfer]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-move-all-to-source])>[data-part-start]>[data-ui-icon],[data-ui-transfer]:dir(rtl)>[data-part-body]>[data-part-actions]>:is([data-part-move-to-target],[data-part-move-all-to-target])>[data-part-end]>[data-ui-icon]{scale:-1 1}[data-ui-transfer]:dir(rtl)>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-move-all-to-source])>[data-part-start]>[data-ui-icon]{scale:1 1}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-reorder]>[data-part-move-up]>[data-part-start]>[data-ui-icon]{scale:1 -1}[data-ui-transfer][data-layout=steps]>[data-part-switch]{display:block}[data-ui-transfer][data-layout=steps]>[data-part-body]{grid-template-columns:minmax(0,1fr);row-gap:var(--slotted-space-4, .5rem)}[data-ui-transfer][data-layout=steps]>[data-part-body]>[data-part-pane]:not([data-current]){display:none}[data-ui-transfer][data-layout=steps]>[data-part-body]>[data-part-actions]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-ui-transfer][data-layout=steps]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-reorder]){margin-block-start:0}[data-ui-transfer][data-layout=steps][data-pane=source]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-move-all-to-source],[data-part-reorder]),[data-ui-transfer][data-layout=steps][data-pane=target]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-target],[data-part-move-all-to-target]){display:none}[data-ui-transfer][data-layout=steps]>[data-part-body]>[data-part-actions]>[data-part-reorder]{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}@container transfer (inline-size < 36rem){[data-ui-transfer][data-layout=auto]>[data-part-switch]{display:block}[data-ui-transfer][data-layout=auto]>[data-part-body]{grid-template-columns:minmax(0,1fr);row-gap:var(--slotted-space-4, .5rem)}[data-ui-transfer][data-layout=auto]>[data-part-body]>[data-part-pane]:not([data-current]){display:none}[data-ui-transfer][data-layout=auto]>[data-part-body]>[data-part-actions]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-ui-transfer][data-layout=auto]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-reorder]){margin-block-start:0}[data-ui-transfer][data-layout=auto][data-pane=source]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-move-all-to-source],[data-part-reorder]),[data-ui-transfer][data-layout=auto][data-pane=target]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-target],[data-part-move-all-to-target]){display:none}[data-ui-transfer][data-layout=auto]>[data-part-body]>[data-part-actions]>[data-part-reorder]{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(forced-colors:active){[data-ui-transfer][data-invalid]>[data-part-body]>[data-part-pane]{outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--slotted-border-width-thin, 1px) + var(--_invalid-edge-width)))}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlButton, selector: "button[slButton]", inputs: ["disabled", "focusableWhenDisabled", "fullWidth", "justify", "loading", "loadingDelay", "messages", "size", "tone", "type", "variant"], exportAs: ["slButton"] }, { kind: "component", type: SlButtonEnd, selector: "[slButtonEnd]", exportAs: ["slButtonEnd"] }, { kind: "component", type: SlButtonStart, selector: "[slButtonStart]", exportAs: ["slButtonStart"] }, { kind: "component", type: SlCheckbox, selector: "[slCheckbox]", inputs: ["checked", "defaultChecked", "indeterminate", "parent", "value", "name", "tabIndex", "size", "labelPlacement", "variant", "disabled", "readOnly", "invalid"], outputs: ["checkedChange"], exportAs: ["slCheckbox"] }, { kind: "component", type: SlGlyph, selector: "svg[slGlyph]", inputs: ["name", "solid"] }, { kind: "component", type: SlIcon, selector: "[slIcon]", inputs: ["directional", "label", "size", "tone"], exportAs: ["slIcon"] }, { kind: "component", type: SlListbox, selector: "[slListbox]", inputs: ["value", "defaultValue", "activeKey", "defaultActiveKey", "selectionMode", "selectionBehavior", "size", "variant", "orientation", "focusMode", "indicator", "loop", "typeahead", "selectOnFocus", "navigateDisabled", "disallowEmptySelection", "disallowSelectAll", "rows", "columns", "pageSize", "typeaheadTimeout", "disabled", "readOnly", "required", "invalid", "loading", "items", "sections", "getKey", "getLabel", "isItemDisabled", "totalCount", "virtual", "itemSize", "sectionSize", "overscan", "hasMore", "loadMoreThreshold"], outputs: ["valueChange", "activeKeyChange", "loadMore"], exportAs: ["slListbox"] }, { kind: "directive", type: SlListboxDescription, selector: "[slListboxDescription]" }, { kind: "directive", type: SlListboxEmpty, selector: "[slListboxEmpty]" }, { kind: "component", type: SlListboxIndicator, selector: "[slListboxIndicator]" }, { kind: "directive", type: SlListboxLabel, selector: "[slListboxLabel]" }, { kind: "directive", type: SlListboxLoader, selector: "[slListboxLoader]" }, { kind: "directive", type: SlListboxOptionContent, selector: "[slListboxOptionContent]" }, { kind: "component", type: SlSegment, selector: "[slSegment]", inputs: ["value", "disabled"], exportAs: ["slSegment"] }, { kind: "component", type: SlSegmentedControl, selector: "[slSegmentedControl]", inputs: ["value", "defaultValue", "name", "size", "orientation", "condense", "variant", "fullWidth", "disabled", "readOnly", "invalid", "required"], outputs: ["valueChange"], exportAs: ["slSegmentedControl"] }, { kind: "component", type: SlTextField, selector: "[slTextField]", inputs: ["size", "variant", "mono", "clearable", "revealable", "copyable", "messages", "loading"], outputs: ["valueCopy"], exportAs: ["slTextField"] }, { kind: "directive", type: SlTextFieldInput, selector: "input[slTextFieldInput]", inputs: ["value", "defaultValue", "disabled", "readOnly", "invalid", "showCount", "countMax", "revealed", "defaultRevealed", "type"], outputs: ["valueChange", "revealedChange"], exportAs: ["slTextFieldInput"] }, { kind: "directive", type: SlTextFieldStart, selector: "[slTextFieldStart]", exportAs: ["slTextFieldStart"] }, { kind: "directive", type: SlTransferPart, selector: "[slTransferPart]", inputs: ["slTransferPart"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTransfer, decorators: [{
             type: Component,
@@ -1129,7 +1148,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                         SlTextFieldStart,
                         SlTransferPart,
                     ], template: `
-    <div data-part="switch">
+    <div data-part="switch" data-part-switch="">
       <div
         slSegmentedControl
         [attr.aria-label]="t('panes')"
@@ -1144,12 +1163,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
         }
       </div>
     </div>
-    <div data-part="body">
+    <div data-part="body" data-part-body="">
       <ng-container
         [ngTemplateOutlet]="paneTemplate"
         [ngTemplateOutletContext]="{ $implicit: 'source' }"
       />
-      <div data-part="actions" role="group" [attr.aria-label]="t('actions')">
+      <div data-part="actions" data-part-actions="" role="group" [attr.aria-label]="t('actions')">
         <button
           slButton
           slTransferPart="move-to-target"
@@ -1211,7 +1230,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
           >{{ t('moveAllToSource') }}
         </button>
         @if (resolvedReorderable()) {
-          <div data-part="reorder" role="group" [attr.aria-label]="t('reorder')">
+          <div
+            data-part="reorder"
+            data-part-reorder=""
+            role="group"
+            [attr.aria-label]="t('reorder')"
+          >
             <button
               slButton
               slTransferPart="move-up"
@@ -1259,15 +1283,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
     <ng-template #paneTemplate let-side>
       <div
         data-part="pane"
+        data-part-pane=""
         role="group"
         [attr.data-side]="side"
         [attr.aria-labelledby]="titleId(side)"
         [attr.data-current]="currentPane() === side ? '' : null"
         [attr.data-drop-target]="dropTarget(side) ? '' : null"
       >
-        <div data-part="pane-header">
+        <div data-part="pane-header" data-part-pane-header="">
           @if (resolvedSelectAll()) {
-            <span data-part="select-all">
+            <span data-part="select-all" data-part-select-all="">
               <div
                 slCheckbox
                 [size]="resolvedSize()"
@@ -1278,14 +1303,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
               ></div>
             </span>
           }
-          <span data-part="title" [attr.id]="titleId(side)">{{ title(side) }}</span>
-          <span data-part="count">{{ countText(side) }}</span>
+          <span data-part="title" data-part-title="" [attr.id]="titleId(side)">{{
+            title(side)
+          }}</span>
+          <span data-part="count" data-part-count="">{{ countText(side) }}</span>
         </div>
         @if (resolvedSearchable()) {
-          <div data-part="search">
+          <div data-part="search" data-part-search="">
             <div slTextField [clearable]="true" [size]="innerSize()">
               <span slTextFieldStart aria-hidden="true"
-                ><span data-part="search-icon"
+                ><span data-part="search-icon" data-part-search-icon=""
                   ><span slIcon><svg slGlyph name="search"></svg></span></span
               ></span>
               <input
@@ -1300,7 +1327,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
             </div>
           </div>
         }
-        <div data-part="list" [attr.data-side]="side" (focusin)="onListFocus(side, $event)">
+        <div
+          data-part="list"
+          data-part-list=""
+          [attr.data-side]="side"
+          (focusin)="onListFocus(side, $event)"
+        >
           <div
             slListbox
             variant="plain"
@@ -1348,7 +1380,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
             </ng-template>
             @if (isEmpty(side)) {
               <div slListboxEmpty>
-                <div data-part="empty" [attr.data-query]="typed(side) ? '' : null">
+                <div
+                  data-part="empty"
+                  data-part-empty=""
+                  [attr.data-query]="typed(side) ? '' : null"
+                >
                   <span slIcon
                     ><svg slGlyph [name]="typed(side) ? 'search-x' : 'inbox'"></svg
                   ></span>
@@ -1363,13 +1399,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
           @if (side === 'target' && dropOffset() !== null) {
             <div
               data-part="drop-indicator"
+              data-part-drop-indicator=""
               aria-hidden="true"
               [style.--_drop-offset]="dropOffset() + 'px'"
             ></div>
           }
         </div>
         @if (footerTemplate(); as footer) {
-          <div data-part="pane-footer">
+          <div data-part="pane-footer" data-part-pane-footer="">
             <ng-container
               [ngTemplateOutlet]="footer"
               [ngTemplateOutletContext]="{ $implicit: side }"
@@ -1383,7 +1420,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                         { provide: NG_VALIDATORS, useExisting: forwardRef(() => SlTransfer), multi: true },
                     ], host: {
                         'data-ui': 'transfer',
+                        'data-ui-transfer': '',
                         'data-part': 'root',
+                        'data-part-root': '',
                         '[attr.role]': 'writtenRole ?? "group"',
                         '[attr.data-layout]': 'resolvedLayout()',
                         '[attr.data-size]': 'resolvedSize()',
@@ -1395,7 +1434,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                         '[attr.data-required]': 'required() ? "" : null',
                         '[attr.data-loading]': 'loading() ? "" : null',
                         '[style.--slotted-transfer-rows]': 'resolvedRows()',
-                    }, styles: ["@layer slotted.components{[data-ui=transfer]{--_text: var(--slotted-text, CanvasText);--_muted: var(--slotted-text-muted, GrayText);--_rule: var(--slotted-border-subtle, ButtonBorder);--_edge: var(--slotted-control-border-color, ButtonBorder);--_surface: var(--slotted-control-surface, Field);--_shadow: var(--slotted-control-shadow, none);--_radius: var(--slotted-radius-md, 6px);--_pane-min: var(--slotted-transfer-pane-min-inline-size, 13rem);--_gap: var(--slotted-space-5, .75rem);--_rows: var(--slotted-transfer-rows, 8);--_duration: var(--slotted-control-transition-duration);--_easing: var(--slotted-control-transition-easing);--_option-height: var(--slotted-control-height-md, 34px);--_option-inset: var(--slotted-control-padding-inline-md, 13px);--_mark: var(--slotted-control-icon-size-md, 16px);--_box: var(--slotted-selection-size-md, 16px);--_font-size: var(--slotted-control-font-size-md, 13px);--_list-inset: var(--slotted-listbox-padding-block, var(--slotted-space-2, .25rem));box-sizing:border-box;color:var(--_text);display:grid;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);min-inline-size:0;row-gap:var(--_gap);text-align:start;container-name:transfer;container-type:inline-size}[data-ui=transfer][data-size=sm]{--_option-height: var(--slotted-control-height-sm, 30px);--_option-inset: var(--slotted-control-padding-inline-sm, 10px);--_mark: var(--slotted-control-icon-size-sm, 14px);--_box: var(--slotted-selection-size-sm, 14px);--_font-size: var(--slotted-control-font-size-sm, 12px)}[data-ui=transfer][data-size=lg]{--_option-height: var(--slotted-control-height-lg, 38px);--_option-inset: var(--slotted-control-padding-inline-lg, 16px);--_mark: var(--slotted-control-icon-size-lg, 18px);--_box: var(--slotted-selection-size-lg, 18px);--_font-size: var(--slotted-control-font-size-lg, 14px)}[data-ui=transfer]>[data-part=switch]{display:none}[data-ui=transfer]>[data-part=switch]>[data-ui=segmented-control]{inline-size:100%}[data-ui=transfer]>[data-part=body]{align-items:center;column-gap:var(--_gap);display:grid;grid-template-columns:minmax(var(--_pane-min),1fr) max-content minmax(var(--_pane-min),1fr);min-inline-size:0}[data-ui=transfer]>[data-part=body]>[data-part=pane]{align-self:stretch;background:var(--_surface);border:var(--slotted-border-width-thin, 1px) solid var(--_edge);border-radius:var(--_radius);box-shadow:var(--_shadow);box-sizing:border-box;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;min-inline-size:0;overflow:clip;transition:border-color var(--_duration) var(--_easing),box-shadow var(--_duration) var(--_easing)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]{align-items:center;column-gap:var(--slotted-space-4, .5rem);display:flex;min-block-size:var(--_option-height);padding-block:var(--slotted-space-3, .375rem);padding-inline-end:calc(var(--_list-inset) + var(--_option-inset));padding-inline-start:calc(var(--_list-inset) + var(--_option-inset) - (var(--_box) - var(--_mark)) / 2)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]>[data-part=select-all]{display:inline-flex;flex:none}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]>[data-part=select-all]>[data-ui=checkbox]{column-gap:0}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]>[data-part=title]{color:var(--_text);font-weight:var(--slotted-font-weight-semibold, 600);min-inline-size:0;overflow-wrap:anywhere}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-header]>[data-part=count]{color:var(--_muted);flex:none;font-size:var(--slotted-font-size-xs, .75rem);font-variant-numeric:tabular-nums;line-height:var(--slotted-line-height-xs, 1.4);margin-inline-start:auto;white-space:nowrap}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=search]{padding-block-end:var(--slotted-space-4, .5rem);padding-inline:var(--slotted-space-4, .5rem)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=search]>[data-ui=text-field]{inline-size:100%}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=search] [data-part=search-icon]{display:inline-flex;flex:none}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]{block-size:calc(var(--_rows) * var(--_option-height) + 2 * var(--_list-inset));border-block-start:var(--slotted-border-width-thin, 1px) solid var(--_rule);box-sizing:content-box;min-block-size:0;position:relative}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox]{--slotted-listbox-measure: none;block-size:100%;max-block-size:100%}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox]:has(>[data-part=empty]){align-content:center}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox]>[data-part=empty]>[data-part=empty]{--slotted-icon-size: var(--_mark);display:grid;justify-items:center;row-gap:var(--slotted-space-3, .375rem)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox] [data-part=option]:has(>[data-part=indicator][data-unresolved]){color:var(--_muted);font-family:var(--slotted-font-family-mono, ui-monospace, monospace)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-part=drop-indicator]{block-size:0;inset-block-start:var(--_drop-offset, 0);inset-inline:calc(var(--_list-inset) + var(--slotted-space-2, .25rem));pointer-events:none;position:absolute}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-part=drop-indicator]:before{background-color:var(--slotted-tone-accent-solid);block-size:var(--slotted-border-width-thick, 2px);border-radius:var(--slotted-radius-full, 9999px);content:\"\";inset-block-start:calc(var(--slotted-border-width-thick, 2px) / -2);inset-inline:0;position:absolute}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=list]>[data-ui=listbox] [data-part=option]:has(>[data-part=indicator][data-dragging]){opacity:.5}[data-ui=transfer]>[data-part=body]>[data-part=pane][data-drop-target]{border-color:var(--slotted-tone-accent-border, Highlight);box-shadow:0 0 0 var(--slotted-border-width-thin, 1px) var(--slotted-tone-accent-border, Highlight)}[data-ui=transfer]>[data-part=body]>[data-part=pane]>[data-part=pane-footer]{border-block-start:var(--slotted-border-width-thin, 1px) solid var(--_rule);color:var(--_muted);font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--slotted-line-height-xs, 1.4);padding-block:var(--slotted-space-4, .5rem);padding-inline:calc(var(--_list-inset) + var(--_option-inset))}[data-ui=transfer][data-invalid]>[data-part=body]>[data-part=pane]{--_edge: var(--slotted-tone-danger-border, Mark);--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);--_shadow: inset 0 0 0 var(--_invalid-edge-width) var(--_edge)}[data-ui=transfer][data-disabled]{--_surface: var(--slotted-disabled-background, Canvas);--_edge: var(--slotted-disabled-border, GrayText);--_text: var(--slotted-disabled-foreground, GrayText);--_muted: var(--slotted-disabled-foreground, GrayText);--_shadow: none}[data-ui=transfer]>[data-part=body]>[data-part=actions]{display:grid;gap:var(--slotted-space-3, .375rem);grid-auto-rows:auto;min-inline-size:0}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=move-to-source],[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=reorder]{margin-block-start:var(--slotted-space-4, .5rem)}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-ui=button]{inline-size:100%}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=reorder]{display:grid;gap:var(--slotted-space-3, .375rem)}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=reorder]>[data-ui=button]{inline-size:100%}[data-ui=transfer]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=move-all-to-source])>[data-part=start]>[data-ui=icon],[data-ui=transfer]:dir(rtl)>[data-part=body]>[data-part=actions]>:is([data-part=move-to-target],[data-part=move-all-to-target])>[data-part=end]>[data-ui=icon]{scale:-1 1}[data-ui=transfer]:dir(rtl)>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=move-all-to-source])>[data-part=start]>[data-ui=icon]{scale:1 1}[data-ui=transfer]>[data-part=body]>[data-part=actions]>[data-part=reorder]>[data-part=move-up]>[data-part=start]>[data-ui=icon]{scale:1 -1}[data-ui=transfer][data-layout=steps]>[data-part=switch]{display:block}[data-ui=transfer][data-layout=steps]>[data-part=body]{grid-template-columns:minmax(0,1fr);row-gap:var(--slotted-space-4, .5rem)}[data-ui=transfer][data-layout=steps]>[data-part=body]>[data-part=pane]:not([data-current]){display:none}[data-ui=transfer][data-layout=steps]>[data-part=body]>[data-part=actions]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-ui=transfer][data-layout=steps]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=reorder]){margin-block-start:0}[data-ui=transfer][data-layout=steps][data-pane=source]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=move-all-to-source],[data-part=reorder]),[data-ui=transfer][data-layout=steps][data-pane=target]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-target],[data-part=move-all-to-target]){display:none}[data-ui=transfer][data-layout=steps]>[data-part=body]>[data-part=actions]>[data-part=reorder]{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}@container transfer (inline-size < 36rem){[data-ui=transfer][data-layout=auto]>[data-part=switch]{display:block}[data-ui=transfer][data-layout=auto]>[data-part=body]{grid-template-columns:minmax(0,1fr);row-gap:var(--slotted-space-4, .5rem)}[data-ui=transfer][data-layout=auto]>[data-part=body]>[data-part=pane]:not([data-current]){display:none}[data-ui=transfer][data-layout=auto]>[data-part=body]>[data-part=actions]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-ui=transfer][data-layout=auto]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=reorder]){margin-block-start:0}[data-ui=transfer][data-layout=auto][data-pane=source]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-source],[data-part=move-all-to-source],[data-part=reorder]),[data-ui=transfer][data-layout=auto][data-pane=target]>[data-part=body]>[data-part=actions]>:is([data-part=move-to-target],[data-part=move-all-to-target]){display:none}[data-ui=transfer][data-layout=auto]>[data-part=body]>[data-part=actions]>[data-part=reorder]{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(forced-colors:active){[data-ui=transfer][data-invalid]>[data-part=body]>[data-part=pane]{outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--slotted-border-width-thin, 1px) + var(--_invalid-edge-width)))}}}\n"] }]
+                    }, styles: ["@layer slotted.components{[data-ui-transfer]{--_text: var(--slotted-text, CanvasText);--_muted: var(--slotted-text-muted, GrayText);--_rule: var(--slotted-border-subtle, ButtonBorder);--_edge: var(--slotted-control-border-color, ButtonBorder);--_surface: var(--slotted-control-surface, Field);--_shadow: var(--slotted-control-shadow, none);--_radius: var(--slotted-radius-md, 6px);--_pane-min: var(--slotted-transfer-pane-min-inline-size, 13rem);--_gap: var(--slotted-space-5, .75rem);--_rows: var(--slotted-transfer-rows, 8);--_duration: var(--slotted-control-transition-duration);--_easing: var(--slotted-control-transition-easing);--_option-height: var(--slotted-control-height-md, 34px);--_option-inset: var(--slotted-control-padding-inline-md, 13px);--_mark: var(--slotted-control-icon-size-md, 16px);--_box: var(--slotted-selection-size-md, 16px);--_font-size: var(--slotted-control-font-size-md, 13px);--_list-inset: var(--slotted-listbox-padding-block, var(--slotted-space-2, .25rem));box-sizing:border-box;color:var(--_text);display:grid;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);min-inline-size:0;row-gap:var(--_gap);text-align:start;container-name:transfer;container-type:inline-size}[data-ui-transfer][data-size=sm]{--_option-height: var(--slotted-control-height-sm, 30px);--_option-inset: var(--slotted-control-padding-inline-sm, 10px);--_mark: var(--slotted-control-icon-size-sm, 14px);--_box: var(--slotted-selection-size-sm, 14px);--_font-size: var(--slotted-control-font-size-sm, 12px)}[data-ui-transfer][data-size=lg]{--_option-height: var(--slotted-control-height-lg, 38px);--_option-inset: var(--slotted-control-padding-inline-lg, 16px);--_mark: var(--slotted-control-icon-size-lg, 18px);--_box: var(--slotted-selection-size-lg, 18px);--_font-size: var(--slotted-control-font-size-lg, 14px)}[data-ui-transfer]>[data-part-switch]{display:none}[data-ui-transfer]>[data-part-switch]>[data-ui-segmented-control]{inline-size:100%}[data-ui-transfer]>[data-part-body]{align-items:center;column-gap:var(--_gap);display:grid;grid-template-columns:minmax(var(--_pane-min),1fr) max-content minmax(var(--_pane-min),1fr);min-inline-size:0}[data-ui-transfer]>[data-part-body]>[data-part-pane]{align-self:stretch;background:var(--_surface);border:var(--slotted-border-width-thin, 1px) solid var(--_edge);border-radius:var(--_radius);box-shadow:var(--_shadow);box-sizing:border-box;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;min-inline-size:0;overflow:clip;transition:border-color var(--_duration) var(--_easing),box-shadow var(--_duration) var(--_easing)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]{align-items:center;column-gap:var(--slotted-space-4, .5rem);display:flex;min-block-size:var(--_option-height);padding-block:var(--slotted-space-3, .375rem);padding-inline-end:calc(var(--_list-inset) + var(--_option-inset));padding-inline-start:calc(var(--_list-inset) + var(--_option-inset) - (var(--_box) - var(--_mark)) / 2)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]>[data-part-select-all]{display:inline-flex;flex:none}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]>[data-part-select-all]>[data-ui-checkbox]{column-gap:0}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]>[data-part-title]{color:var(--_text);font-weight:var(--slotted-font-weight-semibold, 600);min-inline-size:0;overflow-wrap:anywhere}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-header]>[data-part-count]{color:var(--_muted);flex:none;font-size:var(--slotted-font-size-xs, .75rem);font-variant-numeric:tabular-nums;line-height:var(--slotted-line-height-xs, 1.4);margin-inline-start:auto;white-space:nowrap}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-search]{padding-block-end:var(--slotted-space-4, .5rem);padding-inline:var(--slotted-space-4, .5rem)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-search]>[data-ui-text-field]{inline-size:100%}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-search] [data-part-search-icon]{display:inline-flex;flex:none}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]{block-size:calc(var(--_rows) * var(--_option-height) + 2 * var(--_list-inset));border-block-start:var(--slotted-border-width-thin, 1px) solid var(--_rule);box-sizing:content-box;min-block-size:0;position:relative}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox]{--slotted-listbox-measure: none;block-size:100%;max-block-size:100%}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox]:has(>[data-part-empty]){align-content:center}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox]>[data-part-empty]>[data-part-empty]{--slotted-icon-size: var(--_mark);display:grid;justify-items:center;row-gap:var(--slotted-space-3, .375rem)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox] [data-part-option]:has(>[data-part-indicator][data-unresolved]){color:var(--_muted);font-family:var(--slotted-font-family-mono, ui-monospace, monospace)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-part-drop-indicator]{block-size:0;inset-block-start:var(--_drop-offset, 0);inset-inline:calc(var(--_list-inset) + var(--slotted-space-2, .25rem));pointer-events:none;position:absolute}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-part-drop-indicator]:before{background-color:var(--slotted-tone-accent-solid);block-size:var(--slotted-border-width-thick, 2px);border-radius:var(--slotted-radius-full, 9999px);content:\"\";inset-block-start:calc(var(--slotted-border-width-thick, 2px) / -2);inset-inline:0;position:absolute}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-list]>[data-ui-listbox] [data-part-option]:has(>[data-part-indicator][data-dragging]){opacity:.5}[data-ui-transfer]>[data-part-body]>[data-part-pane][data-drop-target]{border-color:var(--slotted-tone-accent-border, Highlight);box-shadow:0 0 0 var(--slotted-border-width-thin, 1px) var(--slotted-tone-accent-border, Highlight)}[data-ui-transfer]>[data-part-body]>[data-part-pane]>[data-part-pane-footer]{border-block-start:var(--slotted-border-width-thin, 1px) solid var(--_rule);color:var(--_muted);font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--slotted-line-height-xs, 1.4);padding-block:var(--slotted-space-4, .5rem);padding-inline:calc(var(--_list-inset) + var(--_option-inset))}[data-ui-transfer][data-invalid]>[data-part-body]>[data-part-pane]{--_edge: var(--slotted-tone-danger-border, Mark);--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);--_shadow: inset 0 0 0 var(--_invalid-edge-width) var(--_edge)}[data-ui-transfer][data-disabled]{--_surface: var(--slotted-disabled-background, Canvas);--_edge: var(--slotted-disabled-border, GrayText);--_text: var(--slotted-disabled-foreground, GrayText);--_muted: var(--slotted-disabled-foreground, GrayText);--_shadow: none}[data-ui-transfer]>[data-part-body]>[data-part-actions]{display:grid;gap:var(--slotted-space-3, .375rem);grid-auto-rows:auto;min-inline-size:0}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-move-to-source],[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-reorder]{margin-block-start:var(--slotted-space-4, .5rem)}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-ui-button]{inline-size:100%}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-reorder]{display:grid;gap:var(--slotted-space-3, .375rem)}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-reorder]>[data-ui-button]{inline-size:100%}[data-ui-transfer]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-move-all-to-source])>[data-part-start]>[data-ui-icon],[data-ui-transfer]:dir(rtl)>[data-part-body]>[data-part-actions]>:is([data-part-move-to-target],[data-part-move-all-to-target])>[data-part-end]>[data-ui-icon]{scale:-1 1}[data-ui-transfer]:dir(rtl)>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-move-all-to-source])>[data-part-start]>[data-ui-icon]{scale:1 1}[data-ui-transfer]>[data-part-body]>[data-part-actions]>[data-part-reorder]>[data-part-move-up]>[data-part-start]>[data-ui-icon]{scale:1 -1}[data-ui-transfer][data-layout=steps]>[data-part-switch]{display:block}[data-ui-transfer][data-layout=steps]>[data-part-body]{grid-template-columns:minmax(0,1fr);row-gap:var(--slotted-space-4, .5rem)}[data-ui-transfer][data-layout=steps]>[data-part-body]>[data-part-pane]:not([data-current]){display:none}[data-ui-transfer][data-layout=steps]>[data-part-body]>[data-part-actions]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-ui-transfer][data-layout=steps]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-reorder]){margin-block-start:0}[data-ui-transfer][data-layout=steps][data-pane=source]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-move-all-to-source],[data-part-reorder]),[data-ui-transfer][data-layout=steps][data-pane=target]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-target],[data-part-move-all-to-target]){display:none}[data-ui-transfer][data-layout=steps]>[data-part-body]>[data-part-actions]>[data-part-reorder]{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}@container transfer (inline-size < 36rem){[data-ui-transfer][data-layout=auto]>[data-part-switch]{display:block}[data-ui-transfer][data-layout=auto]>[data-part-body]{grid-template-columns:minmax(0,1fr);row-gap:var(--slotted-space-4, .5rem)}[data-ui-transfer][data-layout=auto]>[data-part-body]>[data-part-pane]:not([data-current]){display:none}[data-ui-transfer][data-layout=auto]>[data-part-body]>[data-part-actions]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-ui-transfer][data-layout=auto]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-reorder]){margin-block-start:0}[data-ui-transfer][data-layout=auto][data-pane=source]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-source],[data-part-move-all-to-source],[data-part-reorder]),[data-ui-transfer][data-layout=auto][data-pane=target]>[data-part-body]>[data-part-actions]>:is([data-part-move-to-target],[data-part-move-all-to-target]){display:none}[data-ui-transfer][data-layout=auto]>[data-part-body]>[data-part-actions]>[data-part-reorder]{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(forced-colors:active){[data-ui-transfer][data-invalid]>[data-part-body]>[data-part-pane]{outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--slotted-border-width-thin, 1px) + var(--_invalid-edge-width)))}}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], getKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "getKey", required: false }] }], getLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "getLabel", required: false }] }], getDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "getDescription", required: false }] }], isItemDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isItemDisabled", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], targetKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "targetKeys", required: false }] }, { type: i0.Output, args: ["targetKeysChange"] }], defaultTargetKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultTargetKeys", required: false }] }], selectedKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedKeys", required: false }] }, { type: i0.Output, args: ["selectedKeysChange"] }], defaultSelectedKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultSelectedKeys", required: false }] }], sourceQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "sourceQuery", required: false }] }, { type: i0.Output, args: ["sourceQueryChange"] }], defaultSourceQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultSourceQuery", required: false }] }], targetQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "targetQuery", required: false }] }, { type: i0.Output, args: ["targetQueryChange"] }], defaultTargetQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultTargetQuery", required: false }] }], pane: [{ type: i0.Input, args: [{ isSignal: true, alias: "pane", required: false }] }, { type: i0.Output, args: ["paneChange"] }], defaultPane: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultPane", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], selectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAll", required: false }] }], reorderable: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderable", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], virtual: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtual", required: false }] }], itemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemSize", required: false }] }], overscan: [{ type: i0.Input, args: [{ isSignal: true, alias: "overscan", 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 }] }], hasMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasMore", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], targetKeysChangeRequest: [{ type: i0.Output, args: ["targetKeysChangeRequest"] }], selectedKeysChangeRequest: [{ type: i0.Output, args: ["selectedKeysChangeRequest"] }], sourceQueryChangeRequest: [{ type: i0.Output, args: ["sourceQueryChangeRequest"] }], targetQueryChangeRequest: [{ type: i0.Output, args: ["targetQueryChangeRequest"] }], paneChangeRequest: [{ type: i0.Output, args: ["paneChangeRequest"] }], loadMore: [{ type: i0.Output, args: ["loadMore"] }], itemTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SlTransferItem), { ...{ read: TemplateRef }, isSignal: true }] }], footerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SlTransferFooter), { ...{ read: TemplateRef }, isSignal: true }] }], listboxes: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => SlListbox), { isSignal: true }] }] } });
 
 /**