@ds-mo/ui 15.4.1 → 15.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (106) hide show
  1. package/dist/.package-ready.json +1 -1
  2. package/dist/agent-patterns.json +1 -1
  3. package/dist/agent.json +51 -4
  4. package/dist/angular/ds-select.d.ts +1 -1
  5. package/dist/angular/ds-select.js +3 -3
  6. package/dist/angular/ds-table.d.ts +7 -1
  7. package/dist/angular/ds-table.js +11 -5
  8. package/dist/components/ds-agent-questionnaire.js +1 -1
  9. package/dist/components/ds-agent-response.js +1 -1
  10. package/dist/components/ds-bar-workflow.js +1 -1
  11. package/dist/components/ds-card-action-center.js +1 -1
  12. package/dist/components/ds-data-filter.js +1 -1
  13. package/dist/components/ds-data-group.js +1 -1
  14. package/dist/components/ds-data-preferences.js +1 -1
  15. package/dist/components/ds-data-saved-views.js +1 -1
  16. package/dist/components/ds-data-toolbar.js +1 -1
  17. package/dist/components/ds-divider.js +1 -1
  18. package/dist/components/ds-filter-menu.js +1 -1
  19. package/dist/components/ds-input-date.js +1 -1
  20. package/dist/components/ds-input-date.js.map +1 -1
  21. package/dist/components/ds-input-time.js +1 -1
  22. package/dist/components/ds-input-time.js.map +1 -1
  23. package/dist/components/ds-input.js +1 -1
  24. package/dist/components/ds-map-entity-marker.js +1 -1
  25. package/dist/components/ds-message-bubble.js +1 -1
  26. package/dist/components/ds-mobile-header.js +1 -1
  27. package/dist/components/ds-mobile-sheet-nav.js +1 -1
  28. package/dist/components/ds-modal.js +1 -1
  29. package/dist/components/ds-pagination.js +1 -1
  30. package/dist/components/ds-panel-sub-nav.js +1 -1
  31. package/dist/components/ds-panel-tool-search.js +1 -1
  32. package/dist/components/ds-panel-tools.js +1 -1
  33. package/dist/components/ds-radio-tile.js +1 -1
  34. package/dist/components/ds-radio.js +1 -1
  35. package/dist/components/ds-scroll-overlay.js +1 -1
  36. package/dist/components/ds-scroll-overlay.js.map +1 -1
  37. package/dist/components/ds-select.js +1 -1
  38. package/dist/components/ds-shell-app.js +1 -1
  39. package/dist/components/ds-shell-tools.js +1 -1
  40. package/dist/components/ds-tab-group.js +1 -1
  41. package/dist/components/ds-table.js +1 -1
  42. package/dist/components/ds-table.js.map +1 -1
  43. package/dist/components/ds-textarea.js +1 -1
  44. package/dist/components/ds-textarea.js.map +1 -1
  45. package/dist/components/{p-LENgfPDe.js → p-7MwoWtTJ.js} +2 -2
  46. package/dist/components/p-B95UP66y.js +2 -0
  47. package/dist/components/p-B95UP66y.js.map +1 -0
  48. package/dist/components/{p-jwVzQaTZ.js → p-BGSG6xIS.js} +2 -2
  49. package/dist/components/{p-CcZSzCfs.js → p-BO5URdZF.js} +2 -2
  50. package/dist/components/{p-dUti7zhW.js → p-Bq_ypMSy.js} +2 -2
  51. package/dist/components/{p-BkvAqrXg.js → p-C1ZfBbJ_.js} +2 -2
  52. package/dist/components/p-C1oczmAc.js +2 -0
  53. package/dist/components/p-C1oczmAc.js.map +1 -0
  54. package/dist/components/{p-BK_4OHJO.js → p-CA3iQ1ME.js} +2 -2
  55. package/dist/components/{p-DQfKS7dz.js → p-D9_iDlkT.js} +2 -2
  56. package/dist/components/{p-COD1C3Gj.js → p-DEYCF-oJ.js} +2 -2
  57. package/dist/components/p-DPFg5d4_.js +2 -0
  58. package/dist/components/p-DPFg5d4_.js.map +1 -0
  59. package/dist/components/{p-YYiDYQhS.js → p-DR_8IPn9.js} +2 -2
  60. package/dist/components/{p-B0BQCVkq.js → p-D_iZPukF.js} +2 -2
  61. package/dist/components/{p-DkxhNqT-.js → p-DjbT9kKm.js} +2 -2
  62. package/dist/components/{p-YDMY8T0d.js → p-PzYJqN8B.js} +2 -2
  63. package/dist/components/p-jp7hwRtC.js +2 -0
  64. package/dist/components/p-jp7hwRtC.js.map +1 -0
  65. package/dist/components/{p-D7wLvTHz.js → p-rmPIcWED.js} +2 -2
  66. package/dist/docs/components.json +416 -73
  67. package/dist/lint/index.js +1 -1
  68. package/dist/mcp-data/registry/registry.json +50 -3
  69. package/dist/mcp-data/registry/select.json +54 -3
  70. package/dist/mcp-data/registry/table.json +138 -12
  71. package/dist/react/ds-table.d.ts +3 -1
  72. package/dist/react/ds-table.js +2 -0
  73. package/dist/styles/table.css +399 -8
  74. package/dist/types/components/Select/Select.d.ts +6 -0
  75. package/dist/types/components/Table/Table.d.ts +35 -0
  76. package/dist/types/components/Table/index.d.ts +1 -1
  77. package/dist/types/components/Table/table-body-renderer.d.ts +1 -0
  78. package/dist/types/components/Table/table-cell-editor.d.ts +4 -0
  79. package/dist/types/components/Table/table-grid-model.d.ts +23 -0
  80. package/dist/types/components/Table/table-layout-controller.d.ts +1 -0
  81. package/dist/types/components/Table/table-review-fixtures.d.ts +10 -0
  82. package/dist/types/components/Table/table-row-view.d.ts +11 -2
  83. package/dist/types/components/Table/table-skeleton-view.d.ts +3 -1
  84. package/dist/types/components/Table/table-structure.d.ts +38 -0
  85. package/dist/types/components/Table/table-types.d.ts +71 -1
  86. package/dist/types/components/Table/table-virtual-controller.d.ts +1 -0
  87. package/dist/types/components.d.ts +78 -2
  88. package/dist/types/utils/select-controller.d.ts +1 -0
  89. package/dist/vue/ds-select.js +3 -0
  90. package/dist/vue/ds-table.js +8 -0
  91. package/package.json +1 -1
  92. package/dist/components/p-buM-T4vF.js +0 -2
  93. package/dist/components/p-buM-T4vF.js.map +0 -1
  94. /package/dist/components/{p-LENgfPDe.js.map → p-7MwoWtTJ.js.map} +0 -0
  95. /package/dist/components/{p-jwVzQaTZ.js.map → p-BGSG6xIS.js.map} +0 -0
  96. /package/dist/components/{p-CcZSzCfs.js.map → p-BO5URdZF.js.map} +0 -0
  97. /package/dist/components/{p-dUti7zhW.js.map → p-Bq_ypMSy.js.map} +0 -0
  98. /package/dist/components/{p-BkvAqrXg.js.map → p-C1ZfBbJ_.js.map} +0 -0
  99. /package/dist/components/{p-BK_4OHJO.js.map → p-CA3iQ1ME.js.map} +0 -0
  100. /package/dist/components/{p-DQfKS7dz.js.map → p-D9_iDlkT.js.map} +0 -0
  101. /package/dist/components/{p-COD1C3Gj.js.map → p-DEYCF-oJ.js.map} +0 -0
  102. /package/dist/components/{p-YYiDYQhS.js.map → p-DR_8IPn9.js.map} +0 -0
  103. /package/dist/components/{p-B0BQCVkq.js.map → p-D_iZPukF.js.map} +0 -0
  104. /package/dist/components/{p-DkxhNqT-.js.map → p-DjbT9kKm.js.map} +0 -0
  105. /package/dist/components/{p-YDMY8T0d.js.map → p-PzYJqN8B.js.map} +0 -0
  106. /package/dist/components/{p-D7wLvTHz.js.map → p-rmPIcWED.js.map} +0 -0
@@ -1,7 +1,16 @@
1
1
  import type { TableRenderModel } from './table-render-model';
2
2
  import { type TableHighlightMatcher } from './table-highlight';
3
3
  import type { TableCellActionDetail, TableColumn, TableRow } from './table-types';
4
+ import type { TableColumnLayout, TableSpanCell } from './table-structure';
4
5
  export interface TableRowViewOptions {
6
+ pins?: Map<string, TableColumnLayout>;
7
+ spans?: Map<string, TableSpanCell>;
8
+ headerId?: (id: string) => string;
9
+ responsiveCards?: boolean;
10
+ cellAttributes?: (row: TableRow, column: TableColumn) => Record<string, unknown>;
11
+ renderEditor?: (row: TableRow, column: TableColumn) => unknown;
12
+ renderEditTrigger?: (row: TableRow, column: TableColumn) => unknown;
13
+ grid?: boolean;
5
14
  row: TableRow;
6
15
  model: TableRenderModel;
7
16
  visibleColumns: TableColumn[];
@@ -23,7 +32,7 @@ export interface TableRowViewOptions {
23
32
  intrinsicBlockSize?: number;
24
33
  rowKey?: string;
25
34
  renderSelectionControl: (label: string, checked: boolean, indeterminate: boolean, disabled: boolean, onActivate: () => void) => unknown;
26
- renderStickyEdge: (sticky: TableColumn['sticky']) => unknown;
35
+ renderStickyEdge: (sticky: TableColumn['sticky'], shadow?: boolean) => unknown;
27
36
  onRowActivate: (row: TableRow, event: Event) => void;
28
37
  onRowKeyDown: (row: TableRow, event: KeyboardEvent) => void;
29
38
  onRowSelection: (row: TableRow) => void;
@@ -31,5 +40,5 @@ export interface TableRowViewOptions {
31
40
  onActionMenuToggle: (row: TableRow, column: TableColumn, event: MouseEvent) => void;
32
41
  }
33
42
  /** Render one semantic body row and the complete declarative table-cell vocabulary. */
34
- export declare function renderTableRow({ row, model, visibleColumns, emptyCellLabel, actionMenuElementId, actionMenu, actionMenuSurface, highlightMatcher, highlightFieldIds, surfaceOpenRowId, ariaRowIndex, variableVirtualSize, intrinsicBlockSize, rowKey, renderSelectionControl, renderStickyEdge, onRowActivate, onRowKeyDown, onRowSelection, onCellAction, onActionMenuToggle, }: TableRowViewOptions): any;
43
+ export declare function renderTableRow({ pins, spans, headerId, responsiveCards, cellAttributes, renderEditor, renderEditTrigger, grid, row, model, visibleColumns, emptyCellLabel, actionMenuElementId, actionMenu, actionMenuSurface, highlightMatcher, highlightFieldIds, surfaceOpenRowId, ariaRowIndex, variableVirtualSize, intrinsicBlockSize, rowKey, renderSelectionControl, renderStickyEdge, onRowActivate, onRowKeyDown, onRowSelection, onCellAction, onActionMenuToggle, }: TableRowViewOptions): any;
35
44
  //# sourceMappingURL=table-row-view.d.ts.map
@@ -1,10 +1,12 @@
1
1
  import type { TableRenderModel } from './table-render-model';
2
2
  import type { TableColumn } from './table-types';
3
+ import type { TableColumnLayout } from './table-structure';
3
4
  interface TableSkeletonViewOptions {
5
+ pins?: Map<string, TableColumnLayout>;
4
6
  model: TableRenderModel;
5
7
  visibleColumns: TableColumn[];
6
8
  skeletonRows: number;
7
- renderStickyEdge: (sticky: TableColumn['sticky']) => unknown;
9
+ renderStickyEdge: (sticky: TableColumn['sticky'], shadow?: boolean) => unknown;
8
10
  }
9
11
  /** Render the loading body from the same cell recipes used by loaded rows. */
10
12
  export declare function renderTableSkeletonBody(options: TableSkeletonViewOptions): any;
@@ -0,0 +1,38 @@
1
+ import type { TableCellSpan, TableColumn, TableRow } from './table-types';
2
+ export interface TableColumnLayout {
3
+ style: Record<string, string>;
4
+ edge?: 'start' | 'end';
5
+ }
6
+ /** Column-only work. Never measure cells or scan rows while scrolling. */
7
+ export declare function tablePinnedColumns(columns: TableColumn[], selectable: boolean): Map<string, TableColumnLayout>;
8
+ export interface TableHeaderBand {
9
+ key: string;
10
+ label?: string;
11
+ start: number;
12
+ span: number;
13
+ firstColumnId?: string;
14
+ lastColumnId?: string;
15
+ sticky?: 'start' | 'end';
16
+ }
17
+ /** Split at visibility, reorder, selection, spacer and pin boundaries. Never span an unrelated column. */
18
+ export declare function tableHeaderBands(columns: TableColumn[], selectable: boolean, spacer?: number): TableHeaderBand[];
19
+ export type TableSpanCell = {
20
+ rowSpan: number;
21
+ colSpan: number;
22
+ columnStart: number;
23
+ columnIds: string[];
24
+ } | 'covered';
25
+ export interface TableSpanModel {
26
+ cells: Map<string, Map<string, TableSpanCell>>;
27
+ issues: string[];
28
+ hasRowSpans: boolean;
29
+ }
30
+ /** Validate the complete rectangle before covering any cells. Invalid spans leave all data visible. */
31
+ export declare function tableSpanModel(spans: TableCellSpan[], rows: TableRow[], columns: TableColumn[], options: {
32
+ windowed: boolean;
33
+ grouped: boolean;
34
+ grid: boolean;
35
+ selectable: boolean;
36
+ spacer?: number;
37
+ }): TableSpanModel;
38
+ //# sourceMappingURL=table-structure.d.ts.map
@@ -4,6 +4,7 @@ import type { IconColor } from '../Icon/Icon';
4
4
  import type { SafetyScoreLevel } from '../Score/score-types';
5
5
  import type { TextColor } from '../Text/text-types';
6
6
  import type { PaginationState } from '../Pagination/pagination-types';
7
+ import type { SelectOption } from '../Select/Select';
7
8
  export type DataSortDirection = 'asc' | 'desc';
8
9
  export type TableSelectionMode = 'none' | 'multiple';
9
10
  export type TableCellAlign = 'start' | 'center' | 'end';
@@ -293,7 +294,42 @@ export type TableCellSkeleton = {
293
294
  } | {
294
295
  kind: 'blank';
295
296
  };
297
+ /** Scalar editors compose the shared borderless controls; the cell owns interaction chrome. */
298
+ export type TableCellEditor = {
299
+ required?: boolean;
300
+ } & ({
301
+ type: 'text' | 'textarea';
302
+ minLength?: number;
303
+ maxLength?: number;
304
+ } | {
305
+ type: 'number';
306
+ min?: number;
307
+ max?: number;
308
+ step?: number;
309
+ showStepper?: boolean;
310
+ } | {
311
+ type: 'select';
312
+ options: SelectOption[];
313
+ searchable?: boolean;
314
+ } | {
315
+ type: 'date';
316
+ min?: string;
317
+ max?: string;
318
+ } | {
319
+ type: 'time';
320
+ min?: string;
321
+ max?: string;
322
+ step?: number;
323
+ hourFormat?: '12' | '24';
324
+ });
296
325
  export interface TableColumn extends DataField {
326
+ /** Optional super-header identity and label. Adjacent matching identities form one band. */
327
+ group?: {
328
+ id: string;
329
+ label: string;
330
+ };
331
+ /** Opt-in scalar editor used in edit (pencil) or grid (worksheet) interaction modes. */
332
+ editor?: TableCellEditor;
297
333
  segments?: TableHeaderSegment[];
298
334
  /** Supplementary header help. Does not replace the visible or accessible column name. */
299
335
  help?: string;
@@ -310,7 +346,7 @@ export interface TableColumn extends DataField {
310
346
  wrap?: boolean;
311
347
  /** Clamp wrapping text after 1, 2, or 3 lines. Omit with wrap for unlimited wrap. */
312
348
  maxLines?: TableCellMaxLines;
313
- /** Pin one application column to either inline edge during horizontal scrolling. */
349
+ /** Pin an explicitly sized column. Visible pinned columns accumulate in display order. */
314
350
  sticky?: TableColumnSticky;
315
351
  /**
316
352
  * Declare a trailing application-action lane. Action columns keep fixed
@@ -324,6 +360,8 @@ export interface TableRow {
324
360
  /** Stable identity, unique across all groups. */
325
361
  id: string;
326
362
  cells: Record<string, TableCellValue>;
363
+ /** Presentation is separate from cell values; omitted alignment preserves first-track alignment. */
364
+ cellPresentation?: Record<string, TableCellDecoration>;
327
365
  /** Accessible row name used by its selection control. Falls back to the first cell. */
328
366
  selectionLabel?: string;
329
367
  /** Exclude this row from selection without muting its content. */
@@ -333,6 +371,38 @@ export interface TableRow {
333
371
  /** Make the complete row a keyboard- and pointer-activatable application target. */
334
372
  interactive?: boolean;
335
373
  }
374
+ export interface TableCellDecoration {
375
+ verticalAlign?: 'top' | 'middle' | 'bottom';
376
+ /** Left-edge intent outline with an accessible, non-color-only explanation. */
377
+ highlight?: {
378
+ intent: TableGroupIntent;
379
+ label: string;
380
+ };
381
+ borders?: Array<'start' | 'end' | 'top' | 'bottom'>;
382
+ flag?: {
383
+ label: string;
384
+ icon?: string;
385
+ };
386
+ }
387
+ /** A rectangular merge anchored at the first row/column. Covered values remain in application data. */
388
+ export interface TableCellSpan {
389
+ rowIds: string[];
390
+ columnIds: string[];
391
+ }
392
+ export interface TableCellAddress {
393
+ rowId: string;
394
+ columnId: string;
395
+ }
396
+ export interface TableCellRange {
397
+ anchor: TableCellAddress;
398
+ focus: TableCellAddress;
399
+ }
400
+ export interface TableCellsChangeDetail {
401
+ changes: Array<TableCellAddress & {
402
+ value: string | number | null;
403
+ }>;
404
+ reason: 'edit' | 'paste';
405
+ }
336
406
  /** Supporting copy on a group section header's second track. */
337
407
  export interface TableGroupAccessory {
338
408
  text: string;
@@ -30,6 +30,7 @@ export declare class TableVirtualController {
30
30
  private indexedItems;
31
31
  private indexDirty;
32
32
  private scrollOffset;
33
+ private scrollAtEnd;
33
34
  private scrollDirection;
34
35
  private pendingReset;
35
36
  private readonly raf;
@@ -40,7 +40,7 @@ import { MenuItemData, MenuReorderDetail, MenuSection } from "./components/Menu/
40
40
  import { DataCustomizeChangeDetail } from "./components/DataCustomize/DataCustomize";
41
41
  import { FilterMenuChangeDetail, FilterMenuFilter, FilterMenuMatchModeChangeDetail, FilterMenuMatchModes, FilterMenuValues } from "./components/FilterMenu/FilterMenu";
42
42
  import { DataGroupOption } from "./components/DataGroup/DataGroup";
43
- import { DataFieldsConfigChangeDetail, DataGroup, DataGroupingState, DataSortChangeDetail, DataSortState, TableCaptionVisibility, TableCellActionDetail, TableColumn, TableDataMode, TableDataModeChangeDetail, TableGroupCollapseChangeDetail, TableGroupLoadMoreDetail, TableLoadMoreDetail, TableLoadMoreMode, TablePaginationState, TableRow, TableRowActivateDetail, TableSelectionChangeDetail, TableSelectionMode } from "./components/Table/table-types";
43
+ import { DataFieldsConfigChangeDetail, DataGroup, DataGroupingState, DataSortChangeDetail, DataSortState, TableCaptionVisibility, TableCellActionDetail, TableCellRange, TableCellsChangeDetail, TableCellSpan, TableColumn, TableDataMode, TableDataModeChangeDetail, TableGroupCollapseChangeDetail, TableGroupLoadMoreDetail, TableLoadMoreDetail, TableLoadMoreMode, TablePaginationState, TableRow, TableRowActivateDetail, TableSelectionChangeDetail, TableSelectionMode } from "./components/Table/table-types";
44
44
  import { DataGroupOption as DataGroupOption1 } from "./components/DataGroup/DataGroup";
45
45
  import { PreferencesTab } from "./components/DataPreferences/DataPreferences";
46
46
  import { DataSavedView, DataSavedViewChangeDetail, DataSavedViewCreateDetail, DataSavedViewDiscardDetail, DataSavedViewRemoveDetail, DataSavedViewRenameDetail, DataSavedViewSaveDetail } from "./components/DataSavedViews/data-saved-views-types";
@@ -128,7 +128,7 @@ export { MenuItemData, MenuReorderDetail, MenuSection } from "./components/Menu/
128
128
  export { DataCustomizeChangeDetail } from "./components/DataCustomize/DataCustomize";
129
129
  export { FilterMenuChangeDetail, FilterMenuFilter, FilterMenuMatchModeChangeDetail, FilterMenuMatchModes, FilterMenuValues } from "./components/FilterMenu/FilterMenu";
130
130
  export { DataGroupOption } from "./components/DataGroup/DataGroup";
131
- export { DataFieldsConfigChangeDetail, DataGroup, DataGroupingState, DataSortChangeDetail, DataSortState, TableCaptionVisibility, TableCellActionDetail, TableColumn, TableDataMode, TableDataModeChangeDetail, TableGroupCollapseChangeDetail, TableGroupLoadMoreDetail, TableLoadMoreDetail, TableLoadMoreMode, TablePaginationState, TableRow, TableRowActivateDetail, TableSelectionChangeDetail, TableSelectionMode } from "./components/Table/table-types";
131
+ export { DataFieldsConfigChangeDetail, DataGroup, DataGroupingState, DataSortChangeDetail, DataSortState, TableCaptionVisibility, TableCellActionDetail, TableCellRange, TableCellsChangeDetail, TableCellSpan, TableColumn, TableDataMode, TableDataModeChangeDetail, TableGroupCollapseChangeDetail, TableGroupLoadMoreDetail, TableLoadMoreDetail, TableLoadMoreMode, TablePaginationState, TableRow, TableRowActivateDetail, TableSelectionChangeDetail, TableSelectionMode } from "./components/Table/table-types";
132
132
  export { DataGroupOption as DataGroupOption1 } from "./components/DataGroup/DataGroup";
133
133
  export { PreferencesTab } from "./components/DataPreferences/DataPreferences";
134
134
  export { DataSavedView, DataSavedViewChangeDetail, DataSavedViewCreateDetail, DataSavedViewDiscardDetail, DataSavedViewRemoveDetail, DataSavedViewRenameDetail, DataSavedViewSaveDetail } from "./components/DataSavedViews/data-saved-views-types";
@@ -3595,6 +3595,10 @@ export namespace Components {
3595
3595
  * @default true
3596
3596
  */
3597
3597
  "allowClear": boolean;
3598
+ /**
3599
+ * Optional popup positioning anchor; the trigger still owns focus and accessibility.
3600
+ */
3601
+ "anchor": HTMLElement | undefined;
3598
3602
  /**
3599
3603
  * Additional IDs that describe the combobox.
3600
3604
  */
@@ -3658,6 +3662,16 @@ export namespace Components {
3658
3662
  * @default true
3659
3663
  */
3660
3664
  "hasBorder": boolean;
3665
+ /**
3666
+ * Disable only when a containing surface supplies a visible focus indicator.
3667
+ * @default true
3668
+ */
3669
+ "hasFocusRing": boolean;
3670
+ /**
3671
+ * Disable only when a containing surface owns hover and press feedback.
3672
+ * @default true
3673
+ */
3674
+ "hasInteractionFill": boolean;
3661
3675
  /**
3662
3676
  * Optional trigger prefix icon name.
3663
3677
  */
@@ -4342,6 +4356,16 @@ export namespace Components {
4342
4356
  * @default 'hidden'
4343
4357
  */
4344
4358
  "captionVisibility": TableCaptionVisibility;
4359
+ /**
4360
+ * Controlled rectangular cell selection, independent of row checkbox selection.
4361
+ * @default null
4362
+ */
4363
+ "cellRange": TableCellRange | null;
4364
+ /**
4365
+ * Explicit report merges; invalid combinations leave the original cells visible.
4366
+ * @default []
4367
+ */
4368
+ "cellSpans": TableCellSpan[];
4345
4369
  /**
4346
4370
  * Replace opted-in table-owned caption controls with same-size visual skeletons.
4347
4371
  * @default false
@@ -4498,6 +4522,11 @@ export namespace Components {
4498
4522
  * @default 'Infinite scroll'
4499
4523
  */
4500
4524
  "infiniteModeLabel": string;
4525
+ /**
4526
+ * Table is read-only; edit uses per-cell pencil buttons; grid adds cell selection and keyboard navigation. Grouped tables remain read-only.
4527
+ * @default 'table'
4528
+ */
4529
+ "interactionMode": 'table' | 'edit' | 'grid';
4501
4530
  /**
4502
4531
  * Reset key for a new query/group/sort dataset.
4503
4532
  * @default 'default'
@@ -4543,6 +4572,11 @@ export namespace Components {
4543
4572
  * @default 'Pagination + Infinite groups'
4544
4573
  */
4545
4574
  "paginationModeLabel": string;
4575
+ /**
4576
+ * Opt-in native card presentation below the 768px table container breakpoint.
4577
+ * @default 'scroll'
4578
+ */
4579
+ "responsiveLayout": 'scroll' | 'cards';
4546
4580
  /**
4547
4581
  * Supports {displayed} and {total} placeholders.
4548
4582
  * @default 'Displaying {displayed} of {total}'
@@ -6697,6 +6731,8 @@ declare global {
6697
6731
  new (): HTMLDsTabGroupElement;
6698
6732
  };
6699
6733
  interface HTMLDsTableElementEventMap {
6734
+ "dsCellRangeChange": TableCellRange;
6735
+ "dsCellsChange": TableCellsChangeDetail;
6700
6736
  "dsCustomizeOptionChange": string;
6701
6737
  "dsSortChange": DataSortChangeDetail;
6702
6738
  "dsGroupCollapseChange": TableGroupCollapseChangeDetail;
@@ -10659,6 +10695,10 @@ declare namespace LocalJSX {
10659
10695
  * @default true
10660
10696
  */
10661
10697
  "allowClear"?: boolean;
10698
+ /**
10699
+ * Optional popup positioning anchor; the trigger still owns focus and accessibility.
10700
+ */
10701
+ "anchor"?: HTMLElement | undefined;
10662
10702
  /**
10663
10703
  * Additional IDs that describe the combobox.
10664
10704
  */
@@ -10722,6 +10762,16 @@ declare namespace LocalJSX {
10722
10762
  * @default true
10723
10763
  */
10724
10764
  "hasBorder"?: boolean;
10765
+ /**
10766
+ * Disable only when a containing surface supplies a visible focus indicator.
10767
+ * @default true
10768
+ */
10769
+ "hasFocusRing"?: boolean;
10770
+ /**
10771
+ * Disable only when a containing surface owns hover and press feedback.
10772
+ * @default true
10773
+ */
10774
+ "hasInteractionFill"?: boolean;
10725
10775
  /**
10726
10776
  * Optional trigger prefix icon name.
10727
10777
  */
@@ -11498,6 +11548,16 @@ declare namespace LocalJSX {
11498
11548
  * @default 'hidden'
11499
11549
  */
11500
11550
  "captionVisibility"?: TableCaptionVisibility;
11551
+ /**
11552
+ * Controlled rectangular cell selection, independent of row checkbox selection.
11553
+ * @default null
11554
+ */
11555
+ "cellRange"?: TableCellRange | null;
11556
+ /**
11557
+ * Explicit report merges; invalid combinations leave the original cells visible.
11558
+ * @default []
11559
+ */
11560
+ "cellSpans"?: TableCellSpan[];
11501
11561
  /**
11502
11562
  * Replace opted-in table-owned caption controls with same-size visual skeletons.
11503
11563
  * @default false
@@ -11654,6 +11714,11 @@ declare namespace LocalJSX {
11654
11714
  * @default 'Infinite scroll'
11655
11715
  */
11656
11716
  "infiniteModeLabel"?: string;
11717
+ /**
11718
+ * Table is read-only; edit uses per-cell pencil buttons; grid adds cell selection and keyboard navigation. Grouped tables remain read-only.
11719
+ * @default 'table'
11720
+ */
11721
+ "interactionMode"?: 'table' | 'edit' | 'grid';
11657
11722
  /**
11658
11723
  * Reset key for a new query/group/sort dataset.
11659
11724
  * @default 'default'
@@ -11691,6 +11756,8 @@ declare namespace LocalJSX {
11691
11756
  */
11692
11757
  "maxHeight"?: string | number | undefined;
11693
11758
  "onDsCellAction"?: (event: DsTableCustomEvent<TableCellActionDetail>) => void;
11759
+ "onDsCellRangeChange"?: (event: DsTableCustomEvent<TableCellRange>) => void;
11760
+ "onDsCellsChange"?: (event: DsTableCustomEvent<TableCellsChangeDetail>) => void;
11694
11761
  "onDsCustomizeOptionChange"?: (event: DsTableCustomEvent<string>) => void;
11695
11762
  "onDsDataModeChange"?: (event: DsTableCustomEvent<TableDataModeChangeDetail>) => void;
11696
11763
  "onDsFieldsConfigChange"?: (event: DsTableCustomEvent<DataFieldsConfigChangeDetail>) => void;
@@ -11710,6 +11777,11 @@ declare namespace LocalJSX {
11710
11777
  * @default 'Pagination + Infinite groups'
11711
11778
  */
11712
11779
  "paginationModeLabel"?: string;
11780
+ /**
11781
+ * Opt-in native card presentation below the 768px table container breakpoint.
11782
+ * @default 'scroll'
11783
+ */
11784
+ "responsiveLayout"?: 'scroll' | 'cards';
11713
11785
  /**
11714
11786
  * Supports {displayed} and {total} placeholders.
11715
11787
  * @default 'Displaying {displayed} of {total}'
@@ -13018,6 +13090,8 @@ declare namespace LocalJSX {
13018
13090
  "collapseLabel": boolean;
13019
13091
  "iconOnly": boolean;
13020
13092
  "hasBorder": boolean;
13093
+ "hasInteractionFill": boolean;
13094
+ "hasFocusRing": boolean;
13021
13095
  "rounded": boolean;
13022
13096
  "icon": string | undefined;
13023
13097
  "indicator": SelectIndicator;
@@ -13156,6 +13230,8 @@ declare namespace LocalJSX {
13156
13230
  "ariaLabelledby": string | undefined;
13157
13231
  }
13158
13232
  interface DsTableAttributes {
13233
+ "responsiveLayout": 'scroll' | 'cards';
13234
+ "interactionMode": 'table' | 'edit' | 'grid';
13159
13235
  "caption": string;
13160
13236
  "captionVisibility": TableCaptionVisibility;
13161
13237
  "columnCustomizer": boolean;
@@ -13,6 +13,7 @@ export interface SelectControllerState<T extends ChoiceOption> {
13
13
  readonly preferredIndex: number;
14
14
  readonly popupAlign: 'start' | 'end';
15
15
  readonly boundary: HTMLElement | undefined;
16
+ readonly anchor?: HTMLElement;
16
17
  open: boolean;
17
18
  activeIndex: number;
18
19
  searchTerm: string;
@@ -24,6 +24,7 @@ export const DsSelect = /*@__PURE__*/ defineContainer('ds-select', defineDsSelec
24
24
  'width',
25
25
  'popupAlign',
26
26
  'boundary',
27
+ 'anchor',
27
28
  'isInactive',
28
29
  'isLoading',
29
30
  'neutralTrigger',
@@ -31,6 +32,8 @@ export const DsSelect = /*@__PURE__*/ defineContainer('ds-select', defineDsSelec
31
32
  'collapseLabel',
32
33
  'iconOnly',
33
34
  'hasBorder',
35
+ 'hasInteractionFill',
36
+ 'hasFocusRing',
34
37
  'rounded',
35
38
  'icon',
36
39
  'indicator',
@@ -5,6 +5,10 @@ import { defineContainer } from './vue-runtime.js';
5
5
  import { defineCustomElement as defineDsTable } from '@ds-mo/ui/components/ds-table.js';
6
6
  export const DsTable = /*@__PURE__*/ defineContainer('ds-table', defineDsTable, [
7
7
  'columns',
8
+ 'responsiveLayout',
9
+ 'cellSpans',
10
+ 'interactionMode',
11
+ 'cellRange',
8
12
  'customizeOptions',
9
13
  'rows',
10
14
  'groups',
@@ -68,6 +72,8 @@ export const DsTable = /*@__PURE__*/ defineContainer('ds-table', defineDsTable,
68
72
  'groupLoadingMoreLabel',
69
73
  'groupEndOfResultsLabel',
70
74
  'groupRowsLoadedLabel',
75
+ 'dsCellRangeChange',
76
+ 'dsCellsChange',
71
77
  'dsCustomizeOptionChange',
72
78
  'dsSortChange',
73
79
  'dsGroupCollapseChange',
@@ -80,6 +86,8 @@ export const DsTable = /*@__PURE__*/ defineContainer('ds-table', defineDsTable,
80
86
  'dsFieldsConfigChange',
81
87
  'dsDataModeChange'
82
88
  ], [
89
+ 'dsCellRangeChange',
90
+ 'dsCellsChange',
83
91
  'dsCustomizeOptionChange',
84
92
  'dsSortChange',
85
93
  'dsGroupCollapseChange',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ds-mo/ui",
3
- "version": "15.4.1",
3
+ "version": "15.5.0",
4
4
  "description": "CompoMo — composable web components styled with TokoMo design tokens",
5
5
  "keywords": [
6
6
  "web-components",
@@ -1,2 +0,0 @@
1
- import{p as e,H as s,c as t,h as i,a as o,t as r}from"./index.js";import{C as n,a as c,c as d,e as a,d as l}from"./p-COD1C3Gj.js";import{e as h,m as p,f as g,r as u,a as f,b as v,d as m,c as b,g as x}from"./p-Cxr0IQjC.js";import{A as y,r as w}from"./p-CE6MaXBg.js";import{c as k,r as _}from"./p-DhKvqh5G.js";import{r as z}from"./p-ioGH5SoA.js";import{T as C,r as F}from"./p-CeXf9-X3.js";import{e as A}from"./p-CwUXroLs.js";import{o as T,d as j}from"./p-D-J7GgjY.js";import{d as L}from"./p-CwdRaJER.js";import{d as O}from"./p--pJyciTI.js";import{d as I}from"./p-DfMTDFcE.js";import{d as V}from"./p-B0BQCVkq.js";import{d as D}from"./p-5-gQbIIz.js";import{d as $}from"./p-pPtjNRqC.js";import{d as R}from"./p-0XTyQNRG.js";import{d as S}from"./p-D8OWhnID.js";import{d as E}from"./p-DvGrsLgt.js";import{D as P,s as q}from"./p-DOUk4KoT.js";import{a as B,s as H,r as M,b as G}from"./p-DGVZhrMd.js";import{a as N,C as K}from"./p-CuwopElg.js";import{c as U}from"./p-DuFm-ieS.js";class X{constructor(e){this.state=e;this.triggerEl=null;this.popupEl=null;this.searchEl=null;this.typeahead="";this.typeaheadTimer=null;this.outsideHandler=null;this.setTriggerElement=e=>{this.triggerEl=e};this.setPopupElement=e=>{this.popupEl=e};this.setSearchElement=e=>{this.searchEl=e};this.handleTriggerKeyDown=e=>{if(!this.state.open){if(["ArrowDown","ArrowUp","Enter"," "].includes(e.key)){e.preventDefault();this.openPopup(true,e.key==="ArrowUp"?"last":"first")}else if(this.isTypeaheadKey(e)){e.preventDefault();this.openPopup(true);if(this.state.searchable)this.state.searchTerm=e.key;else this.handleTypeahead(e.key)}return}this.handleListKeyDown(e)};this.handleListKeyDown=e=>{switch(e.key){case"ArrowDown":e.preventDefault();this.state.focusRingVisible=true;this.state.activeIndex=p(this.state.options,this.state.activeIndex,1);break;case"ArrowUp":e.preventDefault();this.state.focusRingVisible=true;this.state.activeIndex=p(this.state.options,this.state.activeIndex,-1);break;case"Home":e.preventDefault();this.state.focusRingVisible=true;this.state.activeIndex=h(this.state.options)[0]??-1;break;case"End":{e.preventDefault();this.state.focusRingVisible=true;const s=h(this.state.options);this.state.activeIndex=s[s.length-1]??-1;break}case"Enter":case" ":{if(e.key===" "&&this.state.searchable&&e.target instanceof Node&&this.searchEl?.contains(e.target))break;e.preventDefault();const s=this.state.options[this.state.activeIndex];if(s)this.state.selectOption(s);break}case"Escape":e.preventDefault();this.closePopup(true);break;case"Tab":this.closePopup();break;default:if(!this.state.searchable&&this.isTypeaheadKey(e)){this.handleTypeahead(e.key)}}};this.position=new y({getAnchor:()=>this.triggerEl,getPopup:()=>this.popupEl,measure:(e,s)=>{if(!this.state.open||!s.isConnected||!this.state.host.contains(s))return null;const t=z(C.space050,C.space050);s.style.minWidth=`max(var(--ds-choice-popup-min-inline-size, ${C.menuWidthXs}), ${k(e.offsetWidth,t)}px)`;const i=this.state.popupAlign;return{anchorRect:e.getBoundingClientRect(),popupWidth:s.offsetWidth,popupHeight:s.offsetHeight,side:"bottom",align:i,sideOffsetPx:t,alignOffsetPx:_({align:i,alignOffsetPx:0,sectionInsetPx:t}),viewportPadPx:t,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight,collisionRect:w(e,this.state.boundary)}},apply:({x:e,y:s})=>{this.state.position={x:e,y:s};this.state.positionReady=true},topLayer:true})}get activeOptionId(){return!this.state.isLoading&&this.state.activeIndex>=0?`${this.state.generatedId}-option-${this.state.activeIndex}`:undefined}connect(){if(this.state.open)this.openChanged(true)}disconnect(){this.cancelPositionRetry();this.unbindPopupListeners();if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer)}setFocus(){this.triggerEl?.focus()}optionsChanged(){if(!this.state.open)return;const e=h(this.state.options);if(!e.includes(this.state.activeIndex))this.state.activeIndex=e[0]??-1;requestAnimationFrame((()=>this.updatePosition()))}loadingChanged(){if(this.state.open)requestAnimationFrame((()=>this.updatePosition()))}positionChanged(){if(this.state.open)requestAnimationFrame((()=>this.updatePosition()))}openChanged(e){if(e){this.bindPopupListeners();this.schedulePositionUpdate((()=>{this.scrollActiveOptionIntoView();if(this.state.searchable)void this.searchEl?.setFocus()}));return}this.cancelPositionRetry();this.unbindPopupListeners();this.state.searchTerm="";this.state.positionReady=false}searchChanged(){this.state.activeIndex=h(this.state.options)[0]??-1;requestAnimationFrame((()=>{this.updatePosition();this.scrollActiveOptionIntoView()}))}activeIndexChanged(){requestAnimationFrame((()=>this.scrollActiveOptionIntoView()))}openPopup(e,s){if(this.state.isDisabled||!this.state.options.length&&!this.state.isLoading)return;const t=h(this.state.options);this.state.activeIndex=s==="last"?t[t.length-1]??-1:this.state.preferredIndex>=0?this.state.preferredIndex:t[0]??-1;this.state.focusRingVisible=e;this.state.open=true}closePopup(e=false){if(!this.state.open)return;this.state.open=false;if(e)requestAnimationFrame((()=>this.triggerEl?.focus()))}focusSearchOrTrigger(){requestAnimationFrame((()=>{if(this.state.searchable)void this.searchEl?.setFocus();else this.triggerEl?.focus()}))}isTypeaheadKey(e){return e.key.length===1&&!e.metaKey&&!e.ctrlKey&&!e.altKey}handleTypeahead(e){if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer);this.state.focusRingVisible=true;const s=e.toLocaleLowerCase();const t=this.typeahead.length>0&&[...this.typeahead].every((e=>e===s));this.typeahead=t?s:`${this.typeahead}${s}`;const i=g(this.state.options,this.typeahead,this.state.activeIndex);if(i>=0)this.state.activeIndex=i;const o=F(C.animationDurationMedium1,C.animationDurationMedium1);this.typeaheadTimer=setTimeout((()=>{this.typeahead="";this.typeaheadTimer=null}),o)}scrollActiveOptionIntoView(){if(!this.state.open||!this.activeOptionId)return;this.state.host.querySelector(`#${this.activeOptionId}`)?.scrollIntoView({block:"nearest",inline:"nearest"})}bindPopupListeners(){this.unbindPopupListeners();this.outsideHandler=e=>{if(A(e,this.state.host))return;this.closePopup()};document.addEventListener("mousedown",this.outsideHandler,true);this.position.observe()}unbindPopupListeners(){if(this.outsideHandler){document.removeEventListener("mousedown",this.outsideHandler,true);this.outsideHandler=null}this.position.unobserve()}cancelPositionRetry(){this.position.cancel()}schedulePositionUpdate(e){if(!this.state.open)return;this.state.positionReady=false;this.position.schedule(e)}updatePosition(){return this.position.update()}}const J=()=>`.sc-ds-select-h,.sc-ds-select:where(.ds-table),.sc-ds-select:where(.tooltip-popup),.sc-ds-select:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}@media (forced-colors: active){.sc-ds-select:root,.sc-ds-select-h,.ds-forced-colors-scope.sc-ds-select{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-select-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-select-h,.ds-focus-ring.sc-ds-select,.ds-focus-ring-inset.sc-ds-select-h,.ds-focus-ring-inset.sc-ds-select{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-select-h:focus-visible,.ds-focus-ring.sc-ds-select:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-select-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-select{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-select-h:focus-visible,.ds-focus-ring-inset.sc-ds-select:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-select-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-select:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-select-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-select:root,.sc-ds-select-h,.ds-forced-colors-scope.sc-ds-select{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}@media (forced-colors: active){.sc-ds-select:root,.sc-ds-select-h,.ds-forced-colors-scope.sc-ds-select{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-select-h,.ds-interaction-fill.sc-ds-select{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-select-h::before,.ds-interaction-fill.sc-ds-select::before,.ds-interaction-fill.sc-ds-select-h::after,.ds-interaction-fill.sc-ds-select::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-select-h::before,.ds-interaction-fill.sc-ds-select::before{z-index:1}.ds-interaction-fill.sc-ds-select-h::after,.ds-interaction-fill.sc-ds-select::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-select-h,.ds-interaction-fill--bordered.sc-ds-select{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-select-h::before,.ds-interaction-fill--selected.sc-ds-select::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-select-h,.ds-interaction-fill--selected.sc-ds-select{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-select-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-select:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-select-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-select:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-select-h::after,.ds-interaction-fill--grouped.sc-ds-select::after,.ds-interaction-fill--grouped.sc-ds-select-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-select:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-select-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-select:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-select-h,.ds-interaction-fill--grouped.sc-ds-select{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-select-h>.ds-interaction-fill__content.sc-ds-select,.ds-interaction-fill.sc-ds-select>.ds-interaction-fill__content.sc-ds-select,.ds-interaction-fill__content.sc-ds-select{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-select-h,.ds-interaction-fill--on-faint.sc-ds-select{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-select-h,.ds-interaction-fill--on-medium.sc-ds-select{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-select-h,.ds-interaction-fill--on-bold.sc-ds-select{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-select-h,.ds-interaction-fill--on-strong.sc-ds-select{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-select-h,.ds-interaction-fill--on-translucent.sc-ds-select{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-select-h,.ds-interaction-fill--on-inverted.sc-ds-select{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-select-h,.ds-interaction-fill--on-media.sc-ds-select{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-select-h,.ds-interaction-fill--on-always-dark.sc-ds-select{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-chrome.sc-ds-select-h,.ds-interaction-fill--on-chrome.sc-ds-select{--ds-interaction-hover:var(--color-chrome-interaction-hover);--ds-interaction-pressed:var(--color-chrome-interaction-pressed);--ds-interaction-active:var(--color-chrome-interaction-active);--ds-focus-ring-color:var(--color-chrome-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-select-h,.ds-interaction-fill--on-navigation.sc-ds-select{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-select-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-select:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-select-h::after,.ds-interaction-fill.sc-ds-select::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--surface-open.sc-ds-select-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-select:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-select-h::before,.ds-interaction-fill--selected.sc-ds-select::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-select-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-select:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-select:root,.sc-ds-select-h,.ds-forced-colors-scope.sc-ds-select{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-select-h,.ds-control-inactive.sc-ds-select{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-select-h,.ds-control-inactive.sc-ds-select{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-select,.ds-control--lg.sc-ds-select-h,.ds-control--md.sc-ds-select-h,.ds-control--md.sc-ds-select,.ds-control--sm.sc-ds-select-h,.ds-control--sm.sc-ds-select,.ds-control--xs.sc-ds-select-h,.ds-control--xs.sc-ds-select{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-select-h,.ds-control--lg.sc-ds-select{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-select-h,.ds-control--md.sc-ds-select{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-select-h,.ds-control--sm.sc-ds-select{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-select-h,.ds-control--xs.sc-ds-select{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-select-h,.ds-chrome-space--sm.sc-ds-select{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-select-h,.ds-chrome-space--md.sc-ds-select{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-select-h,.ds-chrome-space--lg.sc-ds-select{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-select-h,.ds-chrome-row.sc-ds-select,.ds-chrome-column.sc-ds-select-h,.ds-chrome-column.sc-ds-select,.ds-chrome-grid.sc-ds-select-h,.ds-chrome-grid.sc-ds-select{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-select-h,.ds-chrome-row.sc-ds-select{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-select-h,.ds-chrome-column.sc-ds-select{flex-direction:column}.ds-chrome-grid.sc-ds-select-h,.ds-chrome-grid.sc-ds-select{display:grid;align-items:center}.ds-control-frame.sc-ds-select{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-select{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-select{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-select{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-select{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-select{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-empty-region.sc-ds-select{display:flex;flex:1 1 auto;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;min-height:0}.ds-empty-region--padded.sc-ds-select{padding:var(--dimension-space-200)}.sc-ds-select:where(.ds-text-decoration,.ds-text-action).sc-ds-select{text-decoration-color:var(--ds-text-decoration-color, var(--color-foreground-tertiary));text-decoration-thickness:var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));text-underline-offset:var(--ds-text-decoration-offset, var(--dimension-space-025))}.ds-text-action.sc-ds-select{--ds-text-action-foreground:var(--color-foreground-bold-brand);--ds-text-decoration-color:var(--ds-text-action-foreground);color:var(--ds-text-action-foreground);text-decoration-line:none}.ds-text-action--on-medium.sc-ds-select{--ds-text-action-foreground:var(--color-foreground-on-medium-background-primary);--ds-text-decoration-color:var(--color-foreground-on-medium-background-secondary);text-decoration-line:underline}.ds-text-action--on-strong.sc-ds-select{--ds-text-action-foreground:var(--color-foreground-on-strong-background-primary);--ds-text-decoration-color:var(--color-foreground-on-strong-background-secondary);text-decoration-line:underline}.ds-text-action--on-bold.sc-ds-select{--ds-text-action-foreground:var(--color-foreground-on-bold-background-primary);--ds-text-decoration-color:var(--color-foreground-on-bold-background-secondary);text-decoration-line:underline}@media (hover: hover) and (pointer: fine){.ds-text-action.sc-ds-select:hover{text-decoration-line:underline}}@media (forced-colors: active){.ds-text-action.sc-ds-select{text-decoration-line:underline;text-decoration-color:currentcolor}}.ds-choice-popup.sc-ds-select{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--ds-choice-popup-min-inline-size, var(--dimension-menu-width-xs));max-width:min(var(--dimension-panel-width-lg), calc(100vw - var(--dimension-space-200)));max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--ds-radius-menu);box-shadow:var(--effect-shadow-elevated-floating);color:var(--color-foreground-secondary);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-select::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-select{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-select{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-select{opacity:0}}@media (forced-colors: active){.ds-choice-popup.sc-ds-select{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.ds-choice-popup.sc-ds-select::after{box-shadow:none}}.ds-choice-list.sc-ds-select{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section--divided.sc-ds-select{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-select{text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-section--headed-after-first.sc-ds-select{margin-block-start:var(--dimension-space-050)}.select-option-row.sc-ds-select{display:flex;flex-direction:column;min-width:0}.ds-choice-item.sc-ds-select{width:100%;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:default;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-select:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item.ds-control--xs.sc-ds-select:has(.ds-choice-item__subtext){padding-block:0}.ds-choice-item__content.sc-ds-select{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-select{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-select{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-select,.ds-choice-item__suffix.sc-ds-select{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-item.ds-interaction-fill--selected.sc-ds-select .ds-choice-item__icon.sc-ds-select{color:var(--color-foreground-primary)}.ds-choice-item__tag.sc-ds-select{flex-shrink:0;pointer-events:none}.ds-choice-empty.sc-ds-select,.ds-choice-loading.sc-ds-select{min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-select{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-select::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-select{display:flex;align-items:center;justify-content:space-between;column-gap:var(--dimension-space-050);box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400))}.ds-choice-footer__summary.sc-ds-select,.ds-choice-footer__summary-measure.sc-ds-select,.ds-choice-footer__clear.sc-ds-select ds-text.sc-ds-select,.ds-choice-footer__action.sc-ds-select ds-text.sc-ds-select{padding-inline:calc( var(--dimension-space-050) + var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-choice-footer__summary.sc-ds-select,.ds-choice-footer__summary-measure.sc-ds-select,.ds-choice-footer__clear.sc-ds-select,.ds-choice-footer__action.sc-ds-select{white-space:nowrap}.ds-choice-footer__summary-measure.sc-ds-select{position:absolute;visibility:hidden;pointer-events:none}.ds-choice-footer__clear.sc-ds-select,.ds-choice-footer__action.sc-ds-select{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;cursor:default}@media (forced-colors: active){.ds-choice-section--divided.sc-ds-select{border-bottom-color:var(--ds-forced-color-content)}.ds-choice-footer.sc-ds-select::before{background-color:var(--ds-forced-color-content)}}.ds-control--lg.ds-control--inset.sc-ds-select-h,.ds-control--lg.ds-control--inset.sc-ds-select{--ds-control-height:calc(var(--dimension-size-500) - var(--dimension-space-050));--ds-control-padding-inline:calc(var(--dimension-space-100) - var(--dimension-space-025))}.ds-control--md.ds-control--inset.sc-ds-select-h,.ds-control--md.ds-control--inset.sc-ds-select{--ds-control-height:calc(var(--dimension-size-400) - var(--dimension-space-050));--ds-control-padding-inline:calc(var(--dimension-space-075) - var(--dimension-space-025))}.ds-control--sm.ds-control--inset.sc-ds-select-h,.ds-control--sm.ds-control--inset.sc-ds-select{--ds-control-height:calc(var(--dimension-size-300) - var(--dimension-space-050));--ds-control-padding-inline:calc(var(--dimension-space-050) - var(--dimension-space-025))}.ds-control--xs.ds-control--inset.sc-ds-select-h,.ds-control--xs.ds-control--inset.sc-ds-select{--ds-control-height:calc(var(--dimension-size-200) - var(--dimension-space-050));--ds-control-padding-inline:calc(var(--dimension-space-025) - var(--dimension-space-025))}.ds-control--lg.ds-control--inset-double.sc-ds-select-h,.ds-control--lg.ds-control--inset-double.sc-ds-select{--ds-control-height:calc(var(--dimension-size-500) - var(--dimension-space-100));--ds-control-padding-inline:calc(var(--dimension-space-100) - var(--dimension-space-050))}.ds-control--md.ds-control--inset-double.sc-ds-select-h,.ds-control--md.ds-control--inset-double.sc-ds-select{--ds-control-height:calc(var(--dimension-size-400) - var(--dimension-space-100));--ds-control-padding-inline:calc(var(--dimension-space-075) - var(--dimension-space-050))}.ds-control--sm.ds-control--inset-double.sc-ds-select-h,.ds-control--sm.ds-control--inset-double.sc-ds-select{--ds-control-height:calc(var(--dimension-size-300) - var(--dimension-space-100));--ds-control-padding-inline:calc(var(--dimension-space-050) - var(--dimension-space-050))}.ds-control-frame.sc-ds-select{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-select{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-select{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-select{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-select{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-select{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-control-width--hug.sc-ds-select-h,.ds-control-width--hug.sc-ds-select{width:fit-content;max-width:100%;flex:0 0 auto}.ds-control-width--fill.sc-ds-select-h,.ds-control-width--fill.sc-ds-select{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.ds-field-stack.sc-ds-select-h,.ds-field-stack.sc-ds-select{display:flex;flex-direction:column;gap:var(--dimension-space-050)}.ds-field-stack.ds-field-stack--supporting-inset.sc-ds-select-h .error-text.sc-ds-select,.ds-field-stack.ds-field-stack--supporting-inset.sc-ds-select .error-text.sc-ds-select,.ds-field-stack.ds-field-stack--supporting-inset.sc-ds-select .field__description.sc-ds-select,.ds-field-stack.ds-field-stack--supporting-inset.sc-ds-select .field__error.sc-ds-select{padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.select-search.sc-ds-select{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.select-search.sc-ds-select::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-select:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search--without-focus-boundary.sc-ds-select::after{display:none}.select-search__control.sc-ds-select{display:flex;width:100%;min-width:0}.ds-select-trigger-host.sc-ds-select-h{display:inline-flex;position:relative;min-inline-size:0;outline:none;--ds-select-fg:var(--color-foreground-secondary);--ds-select-fg-active:var(--color-foreground-primary);--ds-select-prefix-fg:var(--ds-select-fg);--ds-select-chevron-fg:var(--ds-select-fg);--ds-select-border:var(--color-border-secondary)}.ds-control-width--fill.sc-ds-select-h .trigger.sc-ds-select{width:100%}.trigger.sc-ds-select{justify-content:flex-start;box-sizing:border-box;inline-size:100%;max-inline-size:100%;min-inline-size:0;background:transparent;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));color:var(--ds-select-fg);cursor:default;font-family:inherit;-webkit-user-select:none;user-select:none;overflow:hidden;transition:color var(--effect-motion-short-2)}.trigger--bordered.sc-ds-select{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--ds-select-border)}.trigger--rounded.sc-ds-select{--ds-control-radius:var(--dimension-radius-half)}.trigger--has-value.sc-ds-select .trigger__label-box.sc-ds-select{color:var(--ds-select-fg-active)}.trigger--label-placeholder.sc-ds-select .trigger__label-box.sc-ds-select{color:var(--ds-select-fg)}.trigger__prefix.sc-ds-select,.trigger__chevron.sc-ds-select{position:relative;z-index:2}.trigger__prefix.sc-ds-select{color:var(--ds-select-prefix-fg)}.trigger__chevron.sc-ds-select{color:var(--ds-select-chevron-fg)}.trigger__label-box.sc-ds-select{position:relative;z-index:2;display:flex;align-items:center;flex:1 1 auto;overflow:hidden;text-align:left;color:inherit;transition:color var(--effect-motion-short-2)}.trigger__label-content.sc-ds-select{display:inline-flex;align-items:center;flex:1 1 auto;max-width:100%;min-width:0;overflow:hidden}.trigger__label.sc-ds-select{flex:1 1 auto;min-width:0;max-width:100%;overflow:hidden}.ds-select-trigger-host--background-medium.sc-ds-select-h{--ds-select-fg:var(--color-foreground-on-medium-background-secondary);--ds-select-fg-active:var(--color-foreground-on-medium-background-primary);--ds-select-border:var(--color-border-on-medium-background-secondary)}.ds-select-trigger-host--background-bold.sc-ds-select-h{--ds-select-fg:var(--color-foreground-on-bold-background-secondary);--ds-select-fg-active:var(--color-foreground-on-bold-background-primary);--ds-select-border:var(--color-border-on-bold-background-secondary)}.ds-select-trigger-host--background-strong.sc-ds-select-h{--ds-select-fg:var(--color-foreground-on-strong-background-secondary);--ds-select-fg-active:var(--color-foreground-on-strong-background-primary);--ds-select-border:var(--color-border-on-strong-background-secondary)}.ds-select-trigger-host--background-translucent.sc-ds-select-h{--ds-select-fg:var(--color-translucent-foreground-secondary);--ds-select-fg-active:var(--color-translucent-foreground-primary);--ds-select-border:var(--color-translucent-border-secondary)}.ds-select-trigger-host--background-inverted.sc-ds-select-h{--ds-select-fg:var(--color-inverted-foreground-secondary);--ds-select-fg-active:var(--color-inverted-foreground-primary);--ds-select-border:var(--color-inverted-border-secondary)}.ds-select-trigger-host--background-media.sc-ds-select-h{--ds-select-fg:var(--color-media-foreground-secondary);--ds-select-fg-active:var(--color-media-foreground-primary);--ds-select-border:var(--color-media-border-secondary)}.ds-select-trigger-host--background-always-dark.sc-ds-select-h{--ds-select-fg:var(--color-always-dark-foreground-secondary);--ds-select-fg-active:var(--color-always-dark-foreground-primary);--ds-select-border:var(--color-always-dark-border-secondary)}.ds-table-caption-control.sc-ds-select-h{--ds-choice-popup-min-inline-size:var(--dimension-menu-width-xs)}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-select-h{flex:0 0 auto;width:var(--ds-control-height, var(--dimension-size-400));height:var(--ds-control-height, var(--dimension-size-400));min-width:var(--ds-control-height, var(--dimension-size-400));min-height:var(--ds-control-height, var(--dimension-size-400));max-width:var(--ds-control-height, var(--dimension-size-400));inline-size:var(--ds-control-height, var(--dimension-size-400));min-inline-size:var(--ds-control-height, var(--dimension-size-400));max-inline-size:var(--ds-control-height, var(--dimension-size-400))}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-select-h .trigger.sc-ds-select{justify-content:center;inline-size:100%;min-inline-size:100%;height:100%;padding-inline:0}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-select-h .trigger--has-value.sc-ds-select:not(.trigger--label-placeholder){--ds-select-prefix-fg:var(--ds-select-fg-active)}@container ds-table (max-width: 899px){.sc-ds-select-h.ds-table-caption-control{flex:0 0 auto;inline-size:var(--ds-control-height, var(--dimension-size-400));min-inline-size:var(--ds-control-height, var(--dimension-size-400));max-inline-size:var(--ds-control-height, var(--dimension-size-400))}.sc-ds-select-h.ds-table-caption-control .trigger{justify-content:center;inline-size:100%;min-inline-size:100%;padding-inline:0}.sc-ds-select-h.ds-table-caption-control .trigger--has-value:not(.trigger--label-placeholder){--ds-select-prefix-fg:var(--ds-select-fg-active)}}.ds-text--display-medium.sc-ds-select-h,.ds-text--display-medium.sc-ds-select{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-select-h,.ds-text--display-small.sc-ds-select{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-select-h,.ds-text--title-large.sc-ds-select{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-select-h,.ds-text--title-medium.sc-ds-select{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-select-h,.ds-text--title-small.sc-ds-select{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-select-h,.ds-text--body-large.sc-ds-select{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-select-h,.ds-text--body-medium.sc-ds-select{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-select-h,.ds-text--body-small.sc-ds-select{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-select-h,.ds-text--caption.sc-ds-select{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-select-h,.ds-text--display-small.ds-text--emphasis.sc-ds-select-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-select,.ds-text--display-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-select-h,.ds-text--display-small.ds-text--regular.sc-ds-select-h,.ds-text--display-medium.ds-text--regular.sc-ds-select,.ds-text--display-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-select-h,.ds-text--title-large.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-select-h,.ds-text--title-large.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-select-h,.ds-text--title-small.ds-text--emphasis.sc-ds-select-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-select,.ds-text--title-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-select-h,.ds-text--title-small.ds-text--regular.sc-ds-select-h,.ds-text--title-medium.ds-text--regular.sc-ds-select,.ds-text--title-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-select-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-select-h,.ds-text--body-large.ds-text--emphasis.sc-ds-select,.ds-text--body-medium.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-select-h,.ds-text--body-medium.ds-text--regular.sc-ds-select-h,.ds-text--body-large.ds-text--regular.sc-ds-select,.ds-text--body-medium.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-select-h,.ds-text--body-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-select-h,.ds-text--body-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-select-h,.ds-text--caption.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-select-h,.ds-text--caption.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.ds-control-elevation.sc-ds-select-h,.ds-control-elevation.sc-ds-select{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-select-h::after,.ds-control-elevation.sc-ds-select::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-select-h,.ds-control-elevation--sm.sc-ds-select{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-select-h,.ds-control-elevation--md.sc-ds-select{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-select-h,.ds-control-elevation--floating.sc-ds-select{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-select{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-select{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-select,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-select{scale:none;transition:none}}.wrapper--error.sc-ds-select{--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-negative)}.select-popup.sc-ds-select{color:var(--color-foreground-secondary)}.select-option[aria-selected='true'].sc-ds-select .ds-choice-item__icon.sc-ds-select{color:var(--color-foreground-primary)}.select-option-row.sc-ds-select{position:relative;isolation:isolate}.select-option-row__action.sc-ds-select{position:absolute;top:50%;right:var(--dimension-space-050);z-index:var(--dimension-z-index-floating);display:flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-half);background:var(--color-background-transparent);-webkit-backdrop-filter:blur(var(--effect-blur-sm));backdrop-filter:blur(var(--effect-blur-sm));opacity:0;pointer-events:none;transform:translateY(-50%)}.select-option-row.sc-ds-select:has(:focus-visible) .select-option-row__action.sc-ds-select,.select-option-row--action-open.sc-ds-select .select-option-row__action.sc-ds-select,.select-option-row--keyboard-active.sc-ds-select .select-option-row__action.sc-ds-select{opacity:1;pointer-events:auto}.select-option-row--action-open.sc-ds-select .select-option.sc-ds-select::after{background:var(--ds-interaction-hover)}.select-option__subtext-actions.sc-ds-select{display:flex;align-items:center;gap:var(--dimension-space-050);min-inline-size:0;color:var(--color-foreground-secondary)}.select-option__subtext-action.sc-ds-select{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;cursor:pointer}.select-option__subtext-action--negative.sc-ds-select{--ds-text-action-foreground:var(--color-foreground-bold-negative)}.select-option__subtext-action-separator.sc-ds-select{color:var(--color-foreground-tertiary);pointer-events:none}@media (hover: hover) and (pointer: fine){.select-option-row.sc-ds-select:hover .select-option-row__action.sc-ds-select{opacity:1;pointer-events:auto}.select-option-row.sc-ds-select:hover .select-option.sc-ds-select::after{background:var(--ds-interaction-hover)}}@media (hover: none){.select-option-row__action.sc-ds-select{opacity:1;pointer-events:auto}.select-option-row--has-action.sc-ds-select .ds-choice-item__content.sc-ds-select{padding-inline-end:var(--dimension-size-400)}}.error-text.sc-ds-select{width:100%}`;const Q={lg:"lg",md:"md",sm:"sm",xs:"xs"};const W={lg:"md",md:"sm",sm:"xs",xs:"xs"};let Y=0;const Z=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange",7);this.dsClear=t(this,"dsClear",7);this.dsOpenChange=t(this,"dsOpenChange",7);this.dsFooterAction=t(this,"dsFooterAction",7);this.dsOptionAction=t(this,"dsOptionAction",7);this.dsOptionSubtextAction=t(this,"dsOptionSubtextAction",7);this.internals=this.attachInternals();this.options=[];this.sections=[];this.multiple=false;this.value="";this.open=false;this.disabled=false;this.required=false;this.requiredMessage=P;this.placeholder="Select";this.triggerLabelPlaceholder=false;this.dot=false;this.size="md";this.isInset=false;this.insetDepth="single";this.width="hug";this.popupAlign="start";this.isInactive=false;this.isLoading=false;this.neutralTrigger=false;this.activeFill=false;this.collapseLabel=false;this.iconOnly=false;this.hasBorder=true;this.rounded=false;this.indicator="down";this.allowClear=true;this.clearLabel="Clear";this.selectedLabel="selected";this.searchable=false;this.searchPlaceholder="Search";this.noResultsText="No results found";this.loadingLabel="Loading";this.error=false;this.ariaLabel=null;this.activeIndex=-1;this.searchTerm="";this.formDisabled=false;this.position={x:0,y:0};this.positionReady=false;this.focusRingVisible=false;this.compactFooterSummary=false;this.captionCompact=false;this.generatedId=`ds-select-${++Y}`;this.listboxId=`${this.generatedId}-listbox`;this.errorId=`${this.generatedId}-error`;this.initialValue="";this.controller=this.createController();this.hasLoaded=false;this.clearSelection=e=>{e.preventDefault();e.stopPropagation();this.value=this.multiple?[]:"";this.dsChange.emit(this.multiple?[]:"");this.dsClear.emit();if(!this.multiple){const e=h(this.visibleOptions);this.activeIndex=e[0]??-1}this.controller.focusSearchOrTrigger()};this.activateFooterAction=e=>{e.preventDefault();e.stopPropagation();this.dsFooterAction.emit();this.closePopup()};this.handleListKeyDown=this.controller.handleListKeyDown;this.handleTriggerKeyDown=this.controller.handleTriggerKeyDown}createController(){const e=this;return new X({get host(){return e.el},generatedId:e.generatedId,get options(){return e.visibleOptions},get searchable(){return e.searchable},get isLoading(){return e.isLoading},get isDisabled(){return e.isDisabled},get preferredIndex(){if(e.multiple)return-1;return e.visibleOptions.findIndex((s=>s.value===e.scalarValue&&!s.isInactive))},get popupAlign(){return e.popupAlign},get boundary(){return e.boundary},get open(){return e.open},set open(s){e.open=s},get activeIndex(){return e.activeIndex},set activeIndex(s){e.activeIndex=s},get searchTerm(){return e.searchTerm},set searchTerm(s){e.searchTerm=s},get focusRingVisible(){return e.focusRingVisible},set focusRingVisible(s){e.focusRingVisible=s},get position(){return e.position},set position(s){e.position=s},get positionReady(){return e.positionReady},set positionReady(s){e.positionReady=s},selectOption:s=>e.selectOption(s)})}componentWillLoad(){this.value=this.normalizeValueForMode(this.value);this.initialValue=Array.isArray(this.value)?[...this.value]:this.value;this.syncFormValue()}componentDidLoad(){this.hasLoaded=true;this.controller.connect();this.observeFooterContent();this.syncCaptionCompactObserver()}connectedCallback(){if(!this.hasLoaded)return;this.controller.connect();this.observeFooterContent();this.syncCaptionCompactObserver()}componentDidRender(){this.observeFooterContent();this.scheduleFooterSummaryMeasurement()}disconnectedCallback(){this.controller.disconnect();this.footerResizeObserver?.disconnect();this.observedFooterContentElement=undefined;if(this.footerMeasurementFrame!==undefined){cancelAnimationFrame(this.footerMeasurementFrame);this.footerMeasurementFrame=undefined}this.disconnectCaptionCompactObserver()}onCollapseLabelChange(){this.syncCaptionCompactObserver()}syncFormValue(){if(this.multiple&&!Array.isArray(this.value)||!this.multiple&&Array.isArray(this.value)){this.value=this.normalizeValueForMode(this.value)}const e=this.isDisabled;if(this.multiple){const s=this.resolvedValues;B(this.internals,this.name,s,{inactive:e,state:JSON.stringify(this.value)})}else{const s=this.hasSelection?this.scalarValue:"";H(this.internals,s,{inactive:e,state:this.scalarValue})}const s=this.required&&!e&&!this.hasSelection;q(this.internals,s,this.requiredMessage);this.controller.optionsChanged()}onLoadingChange(){this.controller.loadingChanged()}onPopupAlignChange(){this.controller.positionChanged()}onOpenChange(e){this.dsOpenChange.emit(e);this.controller.openChanged(e)}onSearchTermChange(){this.controller.searchChanged()}onActiveIndexChange(){this.controller.activeIndexChanged()}formDisabledCallback(e){this.formDisabled=e;this.syncFormValue()}formResetCallback(){this.value=this.normalizeValueForMode(this.initialValue);this.closePopup()}formStateRestoreCallback(e){if(!this.multiple){this.value=M(e);return}this.value=G(e)}async setFocus(){this.controller.setFocus()}get isDisabled(){return this.disabled||this.isInactive||this.formDisabled}normalizeValueForMode(e){if(this.multiple){return Array.isArray(e)?[...e]:e?[e]:[]}return Array.isArray(e)?e[0]??"":e}get allSections(){return u(this.options,this.sections)}get allOptions(){return f(this.allSections)}get visibleSections(){return this.searchable?v(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return f(this.visibleSections)}get scalarValue(){return typeof this.value==="string"?this.value:""}get resolvedValues(){if(!this.multiple||!Array.isArray(this.value))return[];const e=new Set(this.allOptions.map((e=>e.value)));return[...new Set(this.value.filter((s=>e.has(s))))]}get selectedOption(){if(this.multiple)return undefined;return this.allOptions.find((e=>e.value===this.scalarValue))}get hasSelection(){return this.multiple?this.resolvedValues.length>0:Boolean(this.selectedOption)}get activeOptionId(){return this.controller.activeOptionId}get popupRole(){return this.allOptions.some((e=>Boolean(e.action)))?"grid":"listbox"}observeFooterContent(){const e=this.open&&this.multiple&&this.hasSelection?this.footerContentElement:undefined;if(!e?.isConnected){this.footerResizeObserver?.disconnect();this.observedFooterContentElement=undefined;return}if(this.observedFooterContentElement===e)return;this.footerResizeObserver?.disconnect();if(typeof ResizeObserver!=="undefined"){this.footerResizeObserver=new ResizeObserver((()=>this.scheduleFooterSummaryMeasurement()));this.footerResizeObserver.observe(e)}this.observedFooterContentElement=e}scheduleFooterSummaryMeasurement(){if(!this.open||!this.multiple||!this.hasSelection||this.footerMeasurementFrame!==undefined){return}this.footerMeasurementFrame=requestAnimationFrame((()=>{this.footerMeasurementFrame=undefined;this.measureFooterSummary()}))}measureFooterSummary(){const e=this.footerContentElement;const s=this.footerSummaryMeasureElement;const t=this.footerClearElement;if(!e?.isConnected||!s?.isConnected||!t?.isConnected)return;const i=getComputedStyle(e);const o=e.clientWidth-Number.parseFloat(i.paddingInlineStart||"0")-Number.parseFloat(i.paddingInlineEnd||"0");const r=s.getBoundingClientRect().width+t.getBoundingClientRect().width+Number.parseFloat(i.columnGap||"0");const n=r>o+.5;if(n!==this.compactFooterSummary){this.compactFooterSummary=n}}closePopup(e=false){this.controller.closePopup(e)}openPopup(e,s){this.controller.openPopup(e,s)}selectOption(e){if(e.isInactive||this.isLoading)return;if(this.multiple){const s=this.resolvedValues;const t=s.includes(e.value)?s.filter((s=>s!==e.value)):[...s,e.value];this.value=t;this.dsChange.emit([...t]);return}this.value=e.value;this.dsChange.emit(e.value);this.controller.closePopup(true)}renderOption(e,s,t,o){const r=this.multiple?this.resolvedValues.includes(e.value):e.value===this.scalarValue;const c=s===this.activeIndex;const d=`${this.generatedId}-option-action-${s}`;return i(n,{size:this.size,id:`${this.generatedId}-option-${s}`,option:e,selected:r,active:c,focusRingVisible:this.focusRingVisible,usesSubtext:o,actionOpen:e.action?.surfaceOpen??e.action?.expanded,popupRole:this.popupRole,leading:this.multiple?i("span",{class:"ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content","aria-hidden":"true"},i("ds-checkbox",{class:"select-option__checkbox",label:"",size:this.size,checked:r,presentation:true})):t&&e.icon?i("span",{class:"ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{name:e.icon,size:this.size,color:"inherit"})):undefined,supporting:e.subtextActions?.length?i("span",{class:"ds-choice-item__subtext ds-control-label-box select-option__subtext-actions"},e.subtextActions.map(((s,t)=>[t>0?i("ds-text",{class:"select-option__subtext-action-separator",as:"span",variant:N[this.size],color:"inherit","aria-hidden":"true"},"·"):null,i("button",{type:"button",class:{"select-option__subtext-action":true,"select-option__subtext-action--negative":s.tone==="negative","ds-text-action":true,"ds-focus-ring":true},onKeyDown:e=>e.stopPropagation(),onClick:t=>{t.preventDefault();t.stopPropagation();this.dsOptionSubtextAction.emit({value:e.value,actionValue:s.value,originalEvent:t})}},i("ds-text",{as:"span",variant:N[this.size],color:"inherit"},s.label))]))):undefined,action:e.action?i("ds-tooltip",{label:e.action.label,side:"left",size:"sm"},i("ds-button-unfilled",{id:d,variant:"icon",size:W[this.size],icon:"Ellipses",rounded:true,hasBorder:false,activeFill:false,ariaLabel:e.action.label,haspopup:"menu",controls:e.action.controls,expanded:e.action.expanded,surfaceOpen:e.action.surfaceOpen,onKeyDown:e=>{e.stopPropagation();if(e.key==="Escape"||e.key==="ArrowLeft"){e.preventDefault();this.controller.focusSearchOrTrigger()}},onDsClick:s=>{s.stopPropagation();this.dsOptionAction.emit({value:e.value,anchorId:d,originalEvent:s.detail})}})):undefined,onHover:()=>{this.focusRingVisible=false;this.activeIndex=s},onSelect:()=>this.selectOption(e)})}get captionIconOnly(){return(this.iconOnly||this.collapseLabel&&this.captionCompact)&&Boolean(this.icon||this.isLoading)}get doubleInset(){return this.isInset&&this.insetDepth==="double"&&this.size!=="xs"}syncCaptionCompactObserver(){this.disconnectCaptionCompactObserver();if(!this.collapseLabel){if(this.captionCompact)this.captionCompact=false;return}this.captionCompactDisconnect=T(this.el,(e=>{if(this.captionCompact!==e)this.captionCompact=e}))}disconnectCaptionCompactObserver(){this.captionCompactDisconnect?.();this.captionCompactDisconnect=undefined}renderCaptionTooltip(e,s){if(!this.collapseLabel)return e;return i("ds-tooltip",{label:s,side:"top",size:"sm"},e)}render(){const e=this.isDisabled;const s=!this.hasSelection;const t=this.resolvedValues.length;const r=this.multiple?`${this.placeholder}${t>0?` · ${t}`:""}`:s?this.placeholder:this.triggerLabel??this.selectedOption?.label;const n=K[this.size];const l=Q[this.size];const h=!this.multiple&&m(this.allOptions);const p=b(this.allOptions);const g=this.error&&Boolean(this.errorMessage);const u=[this.ariaDescribedby,g?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const f={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.position.x)}px, ${Math.round(this.position.y)}px)`,zIndex:"var(--dimension-z-index-floating)",visibility:this.positionReady?"visible":"hidden"};let v=0;return i(o,{key:"7935028c0c7a429682c34d2b38a7b264c0c976a7",class:{"select-host":true,"ds-select-trigger-host":true,"select-host--multiple":this.multiple,"ds-field-stack":true,"ds-field-stack--supporting-inset":!this.hasBorder,"ds-control-inactive":e,[`ds-control--${this.size}`]:true,"ds-table-caption-control":this.collapseLabel,"ds-table-caption-control--compact":this.captionIconOnly,...U(this.width),[`select-host--background-${this.background}`]:!!this.background,[`ds-select-trigger-host--background-${this.background}`]:!!this.background}},this.renderCaptionTooltip(i("button",{ref:e=>{this.controller.setTriggerElement(e??null)},id:this.inputId??this.generatedId,type:"button",class:{trigger:true,"ds-control-frame":true,"ds-focus-ring-inset":true,"ds-interaction-fill":true,"ds-interaction-fill--selected":!e&&this.activeFill&&this.hasSelection,"trigger--expanded":!e&&this.open,"ds-interaction-fill--surface-open":!e&&this.open,"trigger--bordered":this.hasBorder,"trigger--rounded":this.rounded,"trigger--placeholder":s&&!this.multiple,"trigger--has-value":this.hasSelection&&!this.neutralTrigger,"trigger--label-placeholder":!this.multiple&&Boolean(this.triggerLabel)&&this.triggerLabelPlaceholder,"wrapper--error":this.hasBorder&&this.error,[`ds-control--${this.size}`]:true,"ds-control--inset":this.isInset&&!this.doubleInset,"ds-control--inset-double":this.doubleInset,...x(this.background)},disabled:e,role:"combobox","aria-haspopup":this.popupRole,"aria-expanded":String(this.open),"aria-controls":this.open?this.listboxId:undefined,"aria-activedescendant":this.open&&!this.searchable?this.activeOptionId:undefined,"aria-label":this.ariaLabel??(this.captionIconOnly?r:undefined),"aria-labelledby":this.ariaLabelledby,"aria-describedby":u,"aria-invalid":this.error?"true":undefined,"aria-required":this.required||undefined,"aria-busy":this.isLoading?"true":undefined,onClick:()=>this.open?this.closePopup():this.openPopup(false),onKeyDown:e=>{const s=this.visibleOptions[this.activeIndex]?.action;if(this.open&&s&&(e.key==="ArrowRight"||e.key==="F10"&&e.shiftKey)){e.preventDefault();document.getElementById(`${this.generatedId}-option-action-${this.activeIndex}`)?.querySelector("button")?.focus();return}this.handleTriggerKeyDown(e)}},(this.icon||this.isLoading)&&i("span",{class:"trigger__prefix ds-control-icon-box ds-interaction-fill__content","aria-hidden":"true"},this.isLoading?i("ds-loader",{size:l,color:"inherit"}):i("ds-icon",{name:this.icon,size:l,color:"inherit"})),this.captionIconOnly?null:i("span",{class:{"trigger__label-box":true,"ds-interaction-fill__content":true}},i("span",{class:{"trigger__label-content":true,"ds-control-label-box":true,"ds-control-label-dot":this.dot,"trigger__label-content--dot":this.dot}},i("ds-text",{class:"trigger__label",as:"span",variant:n,color:"inherit",lineTruncation:1},r),this.dot&&i("ds-badge",{class:"trigger__dot ds-control-label-dot__badge",variant:"dot",hasRing:false,label:"","aria-hidden":"true"}))),this.captionIconOnly||this.indicator==="none"?null:i("span",{class:"trigger__chevron ds-control-icon-box ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{name:this.indicator==="up-down"?"ChevronUpDown":"ChevronDown",size:l,color:"inherit"}))),this.captionIconOnly?this.ariaLabel?.trim()||this.placeholder:""),this.open&&i("div",{key:"6db10e7c5f30a96e3277a87cb3e85af0217e6124",popover:"manual",ref:e=>{this.controller.setPopupElement(e??null)},class:"select-popup ds-choice-popup",style:f},this.searchable&&i(c,{key:"6d7d95273c9bc514155b2b7b9afce322cfae5034",size:this.size,value:this.searchTerm,placeholder:this.searchPlaceholder,controls:this.listboxId,activeDescendant:this.activeOptionId,inputRef:this.controller.setSearchElement,clearLabel:this.clearLabel,onValueChange:e=>{this.searchTerm=e},onKeyDown:e=>this.handleListKeyDown(e)}),i("div",{key:"016db79a5fa7de91997e4b4fb205b80659312b07",id:this.listboxId,class:"ds-choice-list",role:this.popupRole,"aria-multiselectable":this.multiple?"true":undefined,"aria-label":this.ariaLabel??this.placeholder,"aria-busy":this.isLoading?"true":undefined},this.isLoading?i("div",{class:"ds-choice-loading ds-empty-region",role:this.popupRole==="grid"?"row":"option","aria-selected":"false","aria-disabled":"true","aria-label":this.loadingLabel,"aria-live":"polite"},this.popupRole==="grid"?i("span",{role:"gridcell"},i("ds-loader",{size:this.size,color:"inherit"})):i("ds-loader",{size:this.size,color:"inherit"})):this.visibleOptions.length===0?i("div",{class:"ds-choice-empty ds-empty-region",role:this.popupRole==="grid"?"row":"option","aria-selected":"false","aria-disabled":"true","aria-label":this.noResultsText,"aria-live":"polite"},this.popupRole==="grid"?i("span",{role:"gridcell"},i("ds-empty-state",{body:this.noResultsText})):i("ds-empty-state",{body:this.noResultsText})):this.visibleSections.map(((e,s)=>i("div",{class:{"ds-choice-section":true,"ds-chrome-column":true,"ds-chrome-space--sm":true,"ds-choice-section--divided":!!e.divider,"ds-choice-section--headed-after-first":s>0&&Boolean(e.header)},role:this.popupRole==="grid"?"rowgroup":e.header?"group":undefined,"aria-label":e.header},e.header&&this.popupRole==="grid"?i("ds-text",{class:`ds-choice-section__header ds-control-section-heading ds-control--${this.size}`,as:"span",variant:N[this.size],emphasis:true,color:"primary",role:"row"},i("span",{class:"ds-choice-section__header-label",role:"gridcell"},e.header)):e.header?i("ds-text",{class:`ds-choice-section__header ds-control-section-heading ds-control--${this.size}`,as:"span",variant:N[this.size],emphasis:true,color:"primary","aria-hidden":"true"},i("span",{class:"ds-choice-section__header-label"},e.header)):null,e.options.map((e=>this.renderOption(e,v++,h,p))))))),this.footerActionLabel&&!this.isLoading?i(d,{size:this.size,label:this.footerActionLabel,onAction:this.activateFooterAction}):this.allowClear&&this.hasSelection&&!this.isLoading?i(a,{size:this.size,summary:this.multiple?`${t} ${this.selectedLabel}`:undefined,compactSummary:this.multiple?String(t):undefined,useCompactSummary:this.compactFooterSummary,contentRef:e=>{this.footerContentElement=e??undefined},summaryMeasureRef:e=>{this.footerSummaryMeasureElement=e??undefined},clearRef:e=>{this.footerClearElement=e??undefined},clearLabel:this.clearLabel,onClear:this.clearSelection}):null),g&&i("ds-text",{key:"6deca4b319f902c4b3351f4866e172e22930dc5a",class:"error-text",as:"div",variant:"text-body-small",color:"negative",textId:this.errorId,role:"alert"},this.errorMessage))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{collapseLabel:[{onCollapseLabelChange:0}],value:[{syncFormValue:0}],multiple:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],requiredMessage:[{syncFormValue:0}],name:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],popupAlign:[{onPopupAlignChange:0}],boundary:[{onPopupAlignChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}}static get style(){return J()}},[66,"ds-select",{options:[16],sections:[16],multiple:[516],value:[1025],open:[1540],name:[513],form:[513],disabled:[516],required:[516],requiredMessage:[1,"required-message"],placeholder:[1],triggerLabel:[1,"trigger-label"],triggerLabelPlaceholder:[4,"trigger-label-placeholder"],dot:[4],size:[1],isInset:[4,"is-inset"],insetDepth:[1,"inset-depth"],width:[1],popupAlign:[1,"popup-align"],boundary:[16],isInactive:[4,"is-inactive"],isLoading:[4,"is-loading"],neutralTrigger:[4,"neutral-trigger"],activeFill:[4,"active-fill"],collapseLabel:[516,"collapse-label"],iconOnly:[4,"icon-only"],hasBorder:[4,"has-border"],rounded:[4],icon:[1],indicator:[1],allowClear:[4,"allow-clear"],clearLabel:[1,"clear-label"],selectedLabel:[1,"selected-label"],footerActionLabel:[1,"footer-action-label"],searchable:[4],searchPlaceholder:[1,"search-placeholder"],noResultsText:[1,"no-results-text"],loadingLabel:[1,"loading-label"],background:[1],error:[4],errorMessage:[1,"error-message"],inputId:[1,"input-id"],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],ariaDescribedby:[1,"aria-describedby"],activeIndex:[32],searchTerm:[32],formDisabled:[32],position:[32],positionReady:[32],focusRingVisible:[32],compactFooterSummary:[32],captionCompact:[32],setFocus:[64]},undefined,{collapseLabel:[{onCollapseLabelChange:0}],value:[{syncFormValue:0}],multiple:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],requiredMessage:[{syncFormValue:0}],name:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],popupAlign:[{onPopupAlignChange:0}],boundary:[{onPopupAlignChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}]);function ee(){if(typeof customElements==="undefined"){return}const e=["ds-select","ds-badge","ds-button-unfilled","ds-checkbox","ds-chip","ds-divider","ds-empty-state","ds-icon","ds-input","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-select":if(!customElements.get(r(e))){customElements.define(r(e),Z)}break;case"ds-badge":if(!customElements.get(r(e))){L()}break;case"ds-button-unfilled":if(!customElements.get(r(e))){j()}break;case"ds-checkbox":if(!customElements.get(r(e))){O()}break;case"ds-chip":if(!customElements.get(r(e))){I()}break;case"ds-divider":if(!customElements.get(r(e))){V()}break;case"ds-empty-state":if(!customElements.get(r(e))){D()}break;case"ds-icon":if(!customElements.get(r(e))){$()}break;case"ds-input":if(!customElements.get(r(e))){l()}break;case"ds-loader":if(!customElements.get(r(e))){R()}break;case"ds-text":if(!customElements.get(r(e))){S()}break;case"ds-tooltip":if(!customElements.get(r(e))){E()}break}}))}ee();export{Z as S,ee as d};
2
- //# sourceMappingURL=p-buM-T4vF.js.map