@aceshooting/lyra-ui 17.0.0 → 18.1.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 (107) hide show
  1. package/CHANGELOG.md +483 -0
  2. package/README.md +2 -2
  3. package/custom-elements.json +1 -1
  4. package/design-tokens.json +1 -1
  5. package/dist/cli/migration-contract.json +1 -1
  6. package/dist/components/conversation/message-actions/message-actions.class.d.ts +2 -1
  7. package/dist/components/conversation/streaming-text/streaming-text-core.class.d.ts +22 -0
  8. package/dist/components/conversation/streaming-text/streaming-text-core.class.js +1 -0
  9. package/dist/components/conversation/streaming-text/streaming-text.class.d.ts +22 -0
  10. package/dist/components/conversation/streaming-text/streaming-text.class.js +1 -0
  11. package/dist/components/conversation/thread-list/thread-list.class.js +1 -1
  12. package/dist/components/data/table/table.styles.js +1 -1
  13. package/dist/components/forms/combobox/combobox.class.d.ts +12 -2
  14. package/dist/components/forms/combobox/combobox.class.js +2 -2
  15. package/dist/components/forms/combobox/combobox.styles.js +1 -1
  16. package/dist/components/forms/icon-button/icon-button.class.d.ts +18 -9
  17. package/dist/components/forms/select/select.class.d.ts +63 -8
  18. package/dist/components/forms/select/select.class.js +4 -4
  19. package/dist/components/forms/select/select.styles.js +1 -1
  20. package/dist/components/layout/filter-bar/filter-bar.class.d.ts +148 -14
  21. package/dist/components/layout/filter-bar/filter-bar.class.js +12 -4
  22. package/dist/components/layout/filter-bar/filter-bar.styles.js +1 -1
  23. package/dist/components/layout/reorder-list/reorder-list.class.js +1 -1
  24. package/dist/components/layout/virtual-list/virtual-list.class.d.ts +154 -18
  25. package/dist/components/layout/virtual-list/virtual-list.class.js +12 -7
  26. package/dist/components/media/map/map.class.d.ts +269 -14
  27. package/dist/components/media/map/map.class.js +62 -30
  28. package/dist/components/media/map/map.styles.js +1 -1
  29. package/dist/components/utility/copy-button/copy-button.class.d.ts +4 -3
  30. package/dist/custom-elements-jsx.d.ts +1 -1
  31. package/dist/events.d.ts +13 -1
  32. package/dist/internal/package-metadata.d.ts +1 -1
  33. package/dist/internal/package-metadata.js +1 -1
  34. package/dist/internal/tokens.styles.js +1 -1
  35. package/dist/lyra.d.ts +1 -1
  36. package/dist/lyra.js +1 -1
  37. package/dist/styles/tokens-root.css +1 -1
  38. package/dist/svelte.d.ts +1 -1
  39. package/dist/testing/lyra-tag-event-map.js +1 -1
  40. package/dist/translations/ar/retrieval.js +1 -1
  41. package/dist/translations/ar/shared.js +1 -1
  42. package/dist/translations/de/retrieval.js +1 -1
  43. package/dist/translations/de/shared.js +1 -1
  44. package/dist/translations/es/retrieval.js +1 -1
  45. package/dist/translations/es/shared.js +1 -1
  46. package/dist/translations/fa/retrieval.js +1 -1
  47. package/dist/translations/fa/shared.js +1 -1
  48. package/dist/translations/fr/retrieval.js +1 -1
  49. package/dist/translations/fr/shared.js +1 -1
  50. package/dist/translations/he/retrieval.js +1 -1
  51. package/dist/translations/he/shared.js +1 -1
  52. package/dist/translations/it/retrieval.js +1 -1
  53. package/dist/translations/it/shared.js +1 -1
  54. package/dist/translations/ja/retrieval.js +1 -1
  55. package/dist/translations/ja/shared.js +1 -1
  56. package/dist/translations/pt-BR/retrieval.js +1 -1
  57. package/dist/translations/pt-BR/shared.js +1 -1
  58. package/dist/translations/ro/agent-tools.d.ts +1 -0
  59. package/dist/translations/ro/agent-tools.js +1 -0
  60. package/dist/translations/ro/charts.d.ts +1 -0
  61. package/dist/translations/ro/charts.js +1 -0
  62. package/dist/translations/ro/conversation.d.ts +1 -0
  63. package/dist/translations/ro/conversation.js +1 -0
  64. package/dist/translations/ro/data.d.ts +1 -0
  65. package/dist/translations/ro/data.js +1 -0
  66. package/dist/translations/ro/forms.d.ts +1 -0
  67. package/dist/translations/ro/forms.js +1 -0
  68. package/dist/translations/ro/layout.d.ts +1 -0
  69. package/dist/translations/ro/layout.js +1 -0
  70. package/dist/translations/ro/media.d.ts +1 -0
  71. package/dist/translations/ro/media.js +1 -0
  72. package/dist/translations/ro/overlays.d.ts +1 -0
  73. package/dist/translations/ro/overlays.js +1 -0
  74. package/dist/translations/ro/retrieval.d.ts +1 -0
  75. package/dist/translations/ro/retrieval.js +1 -0
  76. package/dist/translations/ro/shared.d.ts +1 -0
  77. package/dist/translations/ro/shared.js +1 -0
  78. package/dist/translations/ro/utility.d.ts +1 -0
  79. package/dist/translations/ro/utility.js +1 -0
  80. package/dist/translations/ro/viewers.d.ts +1 -0
  81. package/dist/translations/ro/viewers.js +5 -0
  82. package/dist/translations/ro.d.ts +1 -0
  83. package/dist/translations/ro.js +1 -0
  84. package/dist/translations/ru/retrieval.js +1 -1
  85. package/dist/translations/ru/shared.js +1 -1
  86. package/dist/translations/zh-CN/retrieval.js +1 -1
  87. package/dist/translations/zh-CN/shared.js +1 -1
  88. package/dist/vue.d.ts +1 -1
  89. package/llms/components/lr-button.md +5 -4
  90. package/llms/components/lr-card.md +2 -1
  91. package/llms/components/lr-combobox.md +11 -0
  92. package/llms/components/lr-filter-bar.md +123 -7
  93. package/llms/components/lr-icon-button.md +17 -8
  94. package/llms/components/lr-map.md +127 -8
  95. package/llms/components/lr-option.md +11 -0
  96. package/llms/components/lr-select.md +45 -3
  97. package/llms/components/lr-streaming-text-core.md +7 -3
  98. package/llms/components/lr-streaming-text.md +7 -2
  99. package/llms/components/lr-virtual-list.md +53 -0
  100. package/llms/shared.md +47 -3
  101. package/llms/tokens.md +7 -4
  102. package/llms-full.txt +465 -36
  103. package/package.json +28 -2
  104. package/registrations.json +1 -1
  105. package/vscode-css-data.json +1 -1
  106. package/vscode-html-data.json +1 -1
  107. package/web-types.json +1 -1
@@ -30,7 +30,8 @@ import type{LyraEventDetailSnapshot}from'../../../internal/lyra-element.js';impo
30
30
  * `<lr-icon-button>` (the embedded `lr-copy-button` does the same one level deeper), so each one's
31
31
  * hit area is that component's shared `--lr-icon-button-size` floor (2.5rem/40px), same as
32
32
  * everywhere else in the library. For a dense action row where 40px per action is more than the
33
- * layout can afford, lower `--lr-theme-icon-button-size` -- NOT `--lr-icon-button-size` itself,
33
+ * layout can afford, lower `--lr-icon-button-size-scope` (the subtree-scoped input) or
34
+ * `--lr-theme-icon-button-size` (the application-wide one) -- NOT `--lr-icon-button-size` itself,
34
35
  * which every `LyraElement` re-declares on its own `:host` and so never reaches a composed child
35
36
  * (`internal/tokens.test.ts` proves this) -- on this element or any ancestor of it;
36
37
  * `::part(regenerate-button__control)`/`::part(edit-button__control)` also reach the built-ins'
@@ -22,6 +22,28 @@ export interface LyraStreamingTextCoreEventMap extends StreamingTextRuntimeEvent
22
22
  * DOM (plain-text mode only -- see `<lr-streaming-text>`'s class doc). `detail: null`.
23
23
  * @csspart base - The root container.
24
24
  * @csspart cursor - The blinking (or, under reduced motion, static) cursor bar. Only rendered while `streaming` is `true`.
25
+ * @csspart content - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- the
26
+ * wrapper around its rendered (or plain-text fallback) output; respects `max-height`.
27
+ * @csspart heading - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
28
+ * rendered `<h1>`–`<h6>` (shifted by `heading-offset`).
29
+ * @csspart paragraph - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
30
+ * rendered `<p>`.
31
+ * @csspart list - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
32
+ * rendered `<ul>`/`<ol>`.
33
+ * @csspart code-block - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
34
+ * rendered fenced/indented `<pre>`.
35
+ * @csspart inline-code - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
36
+ * rendered inline `<code>` span (backtick spans, not fenced blocks).
37
+ * @csspart link - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
38
+ * rendered `<a>`.
39
+ * @csspart table - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
40
+ * rendered `<table>`.
41
+ * @csspart blockquote - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
42
+ * rendered `<blockquote>`.
43
+ * @csspart img - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- every
44
+ * rendered `<img>`.
45
+ * @csspart math - Forwarded from the composed `<lr-markdown-core>` in Markdown mode -- a rendered
46
+ * inline or block math span (`data-display="inline"|"block"`).
25
47
  * @cssprop [--lr-inline-cursor-width=var(--lr-size-0-125rem)] - Shared width of the inline cursor
26
48
  * bar (also its border radius).
27
49
  * @cssprop [--lr-inline-cursor-height=var(--lr-size-1em)] - Shared height of the inline cursor bar.
@@ -1,4 +1,5 @@
1
1
  import{html}from"lit";import{StreamingTextRuntimeBase}from"./streaming-text-base.class.js";import{looksLikeMarkdown}from"./streaming-text-base.class.js";class LyraStreamingTextCore extends StreamingTextRuntimeBase{renderMarkdown(){return html`<lr-markdown-core
2
+ exportparts="content, heading, paragraph, list, code-block, inline-code, link, table, blockquote, img, math"
2
3
  .content=${this.displayedContent}
3
4
  .streaming=${this.streaming}
4
5
  .languages=${this.languages??{}}
@@ -89,6 +89,28 @@ import{type TemplateResult}from'lit';import{StreamingTextRuntimeBase}from'./stre
89
89
  * DOM (plain-text mode only -- see the class doc). `detail: null`.
90
90
  * @csspart base - The root container.
91
91
  * @csspart cursor - The blinking (or, under reduced motion, static) cursor bar. Only rendered while `streaming` is `true`.
92
+ * @csspart content - Forwarded from the composed `<lr-markdown>` in Markdown mode -- the wrapper
93
+ * around its rendered (or plain-text fallback) output; respects `max-height`.
94
+ * @csspart heading - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every
95
+ * rendered `<h1>`–`<h6>` (shifted by `heading-offset`).
96
+ * @csspart paragraph - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every
97
+ * rendered `<p>`.
98
+ * @csspart list - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every rendered
99
+ * `<ul>`/`<ol>`.
100
+ * @csspart code-block - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every
101
+ * rendered fenced/indented `<pre>`.
102
+ * @csspart inline-code - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every
103
+ * rendered inline `<code>` span (backtick spans, not fenced blocks).
104
+ * @csspart link - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every rendered
105
+ * `<a>`.
106
+ * @csspart table - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every rendered
107
+ * `<table>`.
108
+ * @csspart blockquote - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every
109
+ * rendered `<blockquote>`.
110
+ * @csspart img - Forwarded from the composed `<lr-markdown>` in Markdown mode -- every rendered
111
+ * `<img>`.
112
+ * @csspart math - Forwarded from the composed `<lr-markdown>` in Markdown mode -- a rendered
113
+ * inline or block math span (`data-display="inline"|"block"`).
92
114
  * @cssprop [--lr-inline-cursor-width=var(--lr-size-0-125rem)] - Shared width of the inline cursor
93
115
  * bar (also its border radius).
94
116
  * @cssprop [--lr-inline-cursor-height=var(--lr-size-1em)] - Shared height of the inline cursor bar.
@@ -1,4 +1,5 @@
1
1
  import{html}from"lit";import{StreamingTextRuntimeBase}from"./streaming-text-base.class.js";import{looksLikeMarkdown}from"./streaming-text-base.class.js";class LyraStreamingText extends StreamingTextRuntimeBase{renderMarkdown(){return html`<lr-markdown
2
+ exportparts="content, heading, paragraph, list, code-block, inline-code, link, table, blockquote, img, math"
2
3
  .content=${this.displayedContent}
3
4
  .streaming=${this.streaming}
4
5
  .languages=${this.languages}
@@ -27,7 +27,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
27
27
  ?active=${thread.id===this.activeConversationId}
28
28
  ?compact=${this.compact}
29
29
  .renamable=${this.renamable}
30
- @lr-select=${e=>{e.stopPropagation(),this.emit("lr-select",{conversationId:thread.id})}}
30
+ @lr-select=${e=>{e.stopPropagation(),e.target===e.currentTarget&&this.emit("lr-select",{conversationId:thread.id})}}
31
31
  @lr-rename=${e=>{e.stopPropagation(),this.emit("lr-thread-rename",{conversationId:thread.id,label:e.detail.label})}}
32
32
  >
33
33
  ${this.renderStart?html`<span slot="start" part="row-start" inert
@@ -1 +1 @@
1
- import{css}from"lit";const styles=css`:host{--_lr-table-heat-tint-lo-default:var(--lr-color-brand-quiet);--_lr-table-heat-tint-hi-default:var(--lr-color-brand);--_lr-table-resize-min-width-default:var(--lr-size-3rem);--_lr-table-resize-handle-opacity-default:.12;inline-size:100%;display:block}[part=base]{max-block-size:var(--lr-table-max-height,none);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);scrollbar-width:var(--lr-theme-scrollbar-width,auto);scrollbar-gutter:var(--lr-theme-scrollbar-gutter,auto);overflow:auto}:host([scroll-mode=page]) [part=base],:host([scroll-mode=auto]) [part=base]:not([data-scroll-overflow]){max-block-size:none;overflow:visible}[part=filter-label]{align-items:center;gap:var(--lr-space-s);padding:var(--lr-space-s);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-md-sm);display:flex}[part=filter]{min-inline-size:0;padding:var(--lr-space-xs) var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius-xs);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;flex:1}[part=filter]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}:where([part=filter]):hover{background:var(--lr-color-brand-quiet)}:where([part=filter]):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=filter]::placeholder{color:var(--lr-color-text-quiet);opacity:1}[part=filter][type=search]::-webkit-search-cancel-button,[part=filter][type=search]::-webkit-search-decoration{appearance:none}[part=filter-clear]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border-radius:var(--lr-radius-xs);cursor:pointer;color:var(--lr-color-text-quiet);padding:var(--lr-space-xs);transition:background-color var(--lr-transition-fast), color var(--lr-transition-fast);background:0 0;border:0;flex:none;justify-content:center;align-items:center;display:inline-flex}[part=filter-clear]:hover{color:var(--lr-color-text)}[part=filter-clear]:active{color:var(--lr-color-text);background:color-mix(in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=filter-clear]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(-1 * var(--lr-focus-ring-width))}[part=loading]:not(.sr-only){min-block-size:var(--lr-size-8rem);padding:var(--lr-space-l);place-items:center;display:grid}[part=pagination]{border-block-start:var(--lr-border-width-thin) solid var(--lr-color-border);display:block}[part=base][data-hide-priority-low]:not([data-force-visible]) [data-priority=low],[part=base][data-hide-priority-medium]:not([data-force-visible]) [data-priority=medium]{display:none}[part=table]{border-collapse:collapse;inline-size:100%;font:inherit;font-size:var(--lr-table-font-size,inherit)}[part=table][data-layout=fixed]{table-layout:fixed}[part=header-cell]{background:var(--_lr-table-header-bg,var(--lr-color-surface));text-align:start;font-weight:var(--lr-font-weight-semibold);padding:var(--lr-table-cell-padding,var(--lr-space-s));border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);cursor:default;white-space:nowrap;position:sticky;inset-block-start:0}[part=header-cell][data-resizable]{padding-inline-end:calc(var(--lr-space-s) + var(--lr-size-0-5rem))}[part=resize-handle]{inline-size:var(--lr-size-0-5rem);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);cursor:col-resize;touch-action:none;position:absolute;inset-block:0;inset-inline-end:0}[part=resize-handle]:hover,[part=resize-handle]:focus-visible{background:var(--lr-table-resize-handle-hover-bg,var(--lr-color-brand));opacity:var(--lr-table-resize-handle-hover-opacity,var(--lr-table-resize-handle-opacity,var(--_lr-table-resize-handle-opacity-default)))}[part=resize-handle]:active,[part=resize-handle][data-resizing]{background:var(--lr-table-resize-handle-active-bg,var(--lr-table-resize-handle-hover-bg,var(--lr-color-brand)));opacity:var(--lr-table-resize-handle-active-opacity,calc(var(--lr-table-resize-handle-hover-opacity,var(--lr-table-resize-handle-opacity,var(--_lr-table-resize-handle-opacity-default))) * 2))}[part=resize-handle]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(-1 * var(--lr-focus-ring-offset))}:where([part=header-cell][aria-sort]:not([aria-sort=none])),:where([part=header-cell][data-sortable]){cursor:pointer}[part=header-cell]:where([aria-sort]:not([aria-sort=none])){--_lr-table-header-bg:var(--lr-table-header-sorted-bg,var(--lr-color-surface));background:var(--_lr-table-header-bg);color:var(--lr-table-header-sorted-color,inherit)}[part=header-cell][data-sortable]:hover{background:var(--lr-color-brand-quiet)}[part=header-cell][data-sortable]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=header-cell]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=header-cell][data-align=end]{text-align:end}[part~=sort-icon]{vertical-align:middle;transition:transform var(--lr-transition-fast);margin-inline-start:var(--lr-space-xs);display:inline-block}[part~=sort-icon-inactive]{color:var(--lr-color-text-quiet)}@media (forced-colors:active){[part~=sort-icon-inactive]{color:canvastext!important}}[part~=sort-icon] svg{display:block}[part~=sort-icon][data-dir=asc]{transform:rotate(-90deg)}[part~=sort-icon][data-dir=desc]{transform:rotate(90deg)}@media (prefers-reduced-motion:reduce){[part~=sort-icon]{transition:none!important}}[part=row][data-stripe]{background:var(--lr-table-row-stripe-bg,transparent);--_lr-table-row-bg:var(--lr-table-row-stripe-bg,var(--lr-color-surface))}[part=row][aria-selected=true]{--_lr-table-row-bg:var(--lr-table-row-selected-bg,var(--lr-color-brand-quiet));background:var(--_lr-table-row-bg)}[part=row]:hover{--_lr-table-row-bg:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-hover));background:var(--_lr-table-row-bg)}[part=row]:active{--_lr-table-row-bg:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active));background:var(--_lr-table-row-bg)}@media (forced-colors:active){:where([part~=row][aria-selected=true]){outline:var(--lr-border-width-medium) solid Highlight;outline-offset:calc(-1 * var(--lr-border-width-medium))}:where([part~=row]:hover:not([aria-selected=true])){outline:var(--lr-border-width-thin) dashed Highlight;outline-offset:calc(-1 * var(--lr-border-width-thin))}}[part=group-cell]{padding:var(--lr-table-cell-padding-compact,var(--lr-space-xs) var(--lr-space-s));border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);background:var(--lr-color-surface-raised);color:var(--lr-color-text-quiet);font-weight:var(--lr-font-weight-semibold);text-align:start}[part=row]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=cell]{padding:var(--lr-table-cell-padding,var(--lr-space-s));border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);color:var(--lr-table-cell-color,inherit)}[part=cell][data-editable]{transition:var(--lr-transition-interactive)}:where([part=cell][data-editable]):hover{cursor:pointer;background:var(--lr-color-brand-quiet)}:where([part=cell][data-editable]):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=cell][data-editable]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=cell] a:where(:any-link){color:var(--lr-table-cell-link-color,var(--lr-color-brand))}[part=cell] a:where(:any-link):hover,[part=cell] a:where(:any-link):focus-visible,[part=cell] a:where(:any-link):active{color:var(--lr-table-cell-link-hover-color,var(--lr-table-cell-link-color,var(--lr-color-brand)));text-decoration-thickness:var(--lr-border-width-medium)}[part=cell-editor]{box-sizing:border-box;inline-size:100%;min-inline-size:0;padding:var(--lr-space-xs) var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-brand);border-radius:var(--lr-radius-xs);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit}[part=cell-editor]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}:where([part=cell-editor]):hover{background:var(--lr-color-brand-quiet)}:where([part=cell-editor]):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=cell-editor][type=number]{appearance:textfield}[part=cell-editor][type=number]::-webkit-inner-spin-button,[part=cell-editor][type=number]::-webkit-outer-spin-button{appearance:none;margin:0}select[part=cell-editor]{appearance:none;cursor:pointer}select[part=cell-editor] option{background:var(--lr-color-surface);color:var(--lr-color-text)}[part=cell][data-align=end]{text-align:end}[part=row-total-cell]{padding:var(--lr-table-cell-padding,var(--lr-space-s));border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);font-weight:var(--lr-font-weight-semibold);text-align:end}[part=cell][data-heat]{background:color-mix(in srgb, var(--lr-table-heat-tint-hi,var(--_lr-table-heat-tint-hi-default)) var(--lr-table-heat-t), var(--lr-table-heat-tint-lo,var(--_lr-table-heat-tint-lo-default)))}[part=expand-toggle-cell]{padding:var(--lr-space-s);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);text-align:center}[part=row-expand-toggle]{font:inherit;padding:var(--lr-space-xs);cursor:pointer;color:inherit;min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex}[part=row-expand-toggle]:hover{background:var(--lr-color-brand-quiet)}[part=row-expand-toggle]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=row-expand-toggle]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=row-expand-icon]{transition:transform var(--lr-transition-fast);display:inline-block}[part=row-expand-icon] svg{display:block}[part=row-expand-toggle][aria-expanded=true] [part=row-expand-icon]{transform:rotate(90deg)}:host(:dir(rtl)) [part=row-expand-icon]{transform:rotate(180deg)}:host(:dir(rtl)) [part=row-expand-toggle][aria-expanded=true] [part=row-expand-icon]{transform:rotate(90deg)}@media (prefers-reduced-motion:reduce){[part=row-expand-icon]{transition:none!important}}[part=expanded-row] [part=expanded-cell]{padding:var(--lr-space-s);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);background:var(--lr-color-surface)}[part=header-cell][data-sticky],[part=cell][data-sticky]{z-index:var(--lr-layer-content);box-shadow:var(--lr-size-1px) 0 0 0 var(--lr-color-border);position:sticky;inset-inline-start:var(--lr-table-sticky-offset,0)}[part=cell][data-sticky]{background:var(--_lr-table-row-bg,var(--lr-color-surface))}[part=header-cell][data-sticky]{background:var(--_lr-table-header-bg,var(--lr-color-surface))}[part=header-cell][data-sticky=end],[part=cell][data-sticky=end]{box-shadow:calc(-1 * var(--lr-size-1px)) 0 0 0 var(--lr-color-border);inset-inline-start:auto;inset-inline-end:var(--lr-table-sticky-offset,0)}:host(:dir(rtl)) [part=header-cell][data-sticky],:host(:dir(rtl)) [part=cell][data-sticky]{box-shadow:calc(-1 * var(--lr-size-1px)) 0 0 0 var(--lr-color-border)}:host(:dir(rtl)) [part=header-cell][data-sticky=end],:host(:dir(rtl)) [part=cell][data-sticky=end]{box-shadow:var(--lr-size-1px) 0 0 0 var(--lr-color-border)}[part=foot]{background:var(--lr-color-surface);position:sticky;inset-block-end:0}[part=footer-cell]{padding:var(--lr-table-cell-padding-compact,var(--lr-space-xs) var(--lr-space-s));border-block-start:var(--lr-border-width-thin) solid var(--lr-color-border);font-weight:var(--lr-font-weight-semibold);text-align:start}[part=footer-cell][data-align=end]{text-align:end}[part=more-button],[part=reveal-columns-button]{inline-size:100%;padding:var(--lr-space-s);color:var(--lr-color-brand);font:inherit;cursor:pointer;border:none;border-block-start:var(--lr-border-width-thin) solid var(--lr-color-border);background:0 0;display:block}[part=more-button]:hover,[part=reveal-columns-button]:hover{background:var(--lr-color-brand-quiet)}[part=more-button]:active,[part=reveal-columns-button]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=more-button]:focus-visible,[part=reveal-columns-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=error-row] [part=error-cell]{padding:var(--lr-space-s);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);background:var(--lr-color-surface)}[part=retry-button]{padding:var(--lr-space-2xs) var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius-xs);color:var(--lr-color-brand);font:inherit;cursor:pointer;background:0 0;justify-content:center;align-items:center;display:inline-flex}[part=retry-button]:hover{background:var(--lr-color-brand-quiet)}[part=retry-button]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=retry-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}`;export{styles};
1
+ import{css}from"lit";const styles=css`:host{--_lr-table-heat-tint-lo-default:var(--lr-color-brand-quiet);--_lr-table-heat-tint-hi-default:var(--lr-color-brand);--_lr-table-resize-min-width-default:var(--lr-size-3rem);--_lr-table-resize-handle-opacity-default:.12;inline-size:100%;display:block}[part=base]{max-block-size:var(--lr-table-max-height,none);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);scrollbar-width:var(--lr-theme-scrollbar-width,auto);scrollbar-gutter:var(--lr-theme-scrollbar-gutter,auto);overflow:auto}:host([scroll-mode=page]) [part=base],:host([scroll-mode=auto]) [part=base]:not([data-scroll-overflow]){max-block-size:none;overflow:visible}[part=filter-label]{align-items:center;gap:var(--lr-space-s);padding:var(--lr-space-s);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-md-sm);display:flex}[part=filter]{min-inline-size:0;padding:var(--lr-space-xs) var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius-xs);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;flex:1}[part=filter]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}:where([part=filter]):hover{background:var(--lr-color-brand-quiet)}:where([part=filter]):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=filter]::placeholder{color:var(--lr-color-text-quiet);opacity:1}[part=filter][type=search]::-webkit-search-cancel-button,[part=filter][type=search]::-webkit-search-decoration{appearance:none}[part=filter-clear]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border-radius:var(--lr-radius-xs);cursor:pointer;color:var(--lr-color-text-quiet);padding:var(--lr-space-xs);transition:background-color var(--lr-transition-fast), color var(--lr-transition-fast);background:0 0;border:0;flex:none;justify-content:center;align-items:center;display:inline-flex}[part=filter-clear]:hover{color:var(--lr-color-text)}[part=filter-clear]:active{color:var(--lr-color-text);background:color-mix(in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=filter-clear]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(-1 * var(--lr-focus-ring-width))}[part=loading]:not(.sr-only){min-block-size:var(--lr-size-8rem);padding:var(--lr-space-l);place-items:center;display:grid}[part=pagination]{border-block-start:var(--lr-border-width-thin) solid var(--lr-color-border);display:block}[part=base][data-hide-priority-low]:not([data-force-visible]) [data-priority=low],[part=base][data-hide-priority-medium]:not([data-force-visible]) [data-priority=medium]{display:none}[part=table]{border-collapse:collapse;inline-size:100%;font:inherit;font-size:var(--lr-table-font-size,inherit)}[part=table][data-layout=fixed]{table-layout:fixed}[part=header-cell]{background:var(--_lr-table-header-bg,var(--lr-color-surface));text-align:start;font-weight:var(--lr-font-weight-semibold);padding:var(--lr-table-cell-padding,var(--lr-space-s));border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);cursor:default;white-space:nowrap;position:sticky;inset-block-start:0}[part=header-cell][data-resizable]{padding-inline-end:calc(var(--lr-space-s) + var(--lr-size-0-5rem))}[part=resize-handle]{inline-size:var(--lr-size-0-5rem);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);cursor:col-resize;touch-action:none;position:absolute;inset-block:0;inset-inline-end:0}[part=resize-handle]:hover,[part=resize-handle]:focus-visible{background:var(--lr-table-resize-handle-hover-bg,var(--lr-color-brand));opacity:var(--lr-table-resize-handle-hover-opacity,var(--lr-table-resize-handle-opacity,var(--_lr-table-resize-handle-opacity-default)))}[part=resize-handle]:active,[part=resize-handle][data-resizing]{background:var(--lr-table-resize-handle-active-bg,var(--lr-table-resize-handle-hover-bg,var(--lr-color-brand)));opacity:var(--lr-table-resize-handle-active-opacity,calc(var(--lr-table-resize-handle-hover-opacity,var(--lr-table-resize-handle-opacity,var(--_lr-table-resize-handle-opacity-default))) * 2))}[part=resize-handle]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(-1 * var(--lr-focus-ring-offset))}:where([part=header-cell][aria-sort]:not([aria-sort=none])),:where([part=header-cell][data-sortable]){cursor:pointer}[part=header-cell]:where([aria-sort]:not([aria-sort=none])){--_lr-table-header-bg:var(--lr-table-header-sorted-bg,var(--lr-color-surface));background:var(--_lr-table-header-bg);color:var(--lr-table-header-sorted-color,inherit)}[part=header-cell][data-sortable]:hover{background:var(--lr-color-brand-quiet)}[part=header-cell][data-sortable]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=header-cell]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=header-cell][data-align=end]{text-align:end}[part~=sort-icon]{vertical-align:middle;transition:transform var(--lr-transition-fast);margin-inline-start:var(--lr-space-xs);display:inline-block}[part~=sort-icon-inactive]{color:var(--lr-color-text-quiet)}@media (forced-colors:active){[part~=sort-icon-inactive]{color:canvastext!important}}[part~=sort-icon] svg{display:block}[part~=sort-icon][data-dir=asc]{transform:rotate(-90deg)}[part~=sort-icon][data-dir=desc]{transform:rotate(90deg)}@media (prefers-reduced-motion:reduce){[part~=sort-icon]{transition:none!important}}[part=row][data-stripe]{background:var(--lr-table-row-stripe-bg,transparent);--_lr-table-row-bg:var(--lr-table-row-stripe-bg,var(--lr-color-surface))}[part=row][aria-selected=true]{--_lr-table-row-bg:var(--lr-table-row-selected-bg,var(--lr-color-brand-quiet));background:var(--_lr-table-row-bg)}[part=row]:hover{--_lr-table-row-bg:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-hover));background:var(--_lr-table-row-bg)}[part=row]:active{--_lr-table-row-bg:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active));background:var(--_lr-table-row-bg)}@media (forced-colors:active){:where([part~=row][aria-selected=true]){outline:var(--lr-border-width-medium) solid Highlight;outline-offset:calc(-1 * var(--lr-border-width-medium))}:where([part~=row]:hover:not([aria-selected=true])){outline:var(--lr-border-width-thin) dashed Highlight;outline-offset:calc(-1 * var(--lr-border-width-thin))}}[part=group-cell]{padding:var(--lr-table-cell-padding-compact,var(--lr-space-xs) var(--lr-space-s));border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);background:var(--lr-color-surface-raised);color:var(--lr-color-text-quiet);font-weight:var(--lr-font-weight-semibold);text-align:start}[part=row]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=cell]{padding:var(--lr-table-cell-padding,var(--lr-space-s));border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);color:var(--lr-table-cell-color,inherit)}[part=cell][data-editable]{transition:var(--lr-transition-interactive)}:where([part=cell][data-editable]):hover{cursor:pointer;background:var(--lr-color-brand-quiet)}:where([part=cell][data-editable]):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=cell][data-editable]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=cell] a:where(:any-link){color:var(--lr-table-cell-link-color,var(--lr-color-brand))}[part=cell] a:where(:any-link):hover,[part=cell] a:where(:any-link):focus-visible,[part=cell] a:where(:any-link):active{color:var(--lr-table-cell-link-hover-color,var(--lr-table-cell-link-color,var(--lr-color-brand)));text-decoration-thickness:var(--lr-border-width-medium)}[part=cell-editor]{box-sizing:border-box;inline-size:100%;min-inline-size:0;padding:var(--lr-space-xs) var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-brand);border-radius:var(--lr-radius-xs);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit}[part=cell-editor]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}:where([part=cell-editor]):hover{background:var(--lr-color-brand-quiet)}:where([part=cell-editor]):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=cell-editor][type=number]{appearance:textfield}[part=cell-editor][type=number]::-webkit-inner-spin-button,[part=cell-editor][type=number]::-webkit-outer-spin-button{appearance:none;margin:0}select[part=cell-editor]{appearance:none;cursor:pointer;padding-inline-end:calc(var(--lr-space-s) + var(--lr-size-0-75rem))}select[part=cell-editor] option{background:var(--lr-color-surface);color:var(--lr-color-text)}[part=cell]:has(>select[part=cell-editor]){position:relative}[part=cell]:has(>select[part=cell-editor]):after{content:"";inline-size:var(--lr-size-0-75rem);block-size:var(--lr-size-0-75rem);color:var(--lr-color-text-quiet);pointer-events:none;background:currentColor;position:absolute;inset-block-start:50%;inset-inline-end:var(--lr-space-s);transform:translateY(-50%)rotate(90deg);mask:url("data:image/svg+xml,%3Csvg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"1.75\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\"%3E%3Cpolyline points=\\"9 6 15 12 9 18\\"%3E%3C/polyline%3E%3C/svg%3E") 50%/contain no-repeat}@media (forced-colors:active){[part=cell]:has(>select[part=cell-editor]):after{forced-color-adjust:none;color:buttontext}}[part=cell][data-align=end]{text-align:end}[part=row-total-cell]{padding:var(--lr-table-cell-padding,var(--lr-space-s));border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);font-weight:var(--lr-font-weight-semibold);text-align:end}[part=cell][data-heat]{background:color-mix(in srgb, var(--lr-table-heat-tint-hi,var(--_lr-table-heat-tint-hi-default)) var(--lr-table-heat-t), var(--lr-table-heat-tint-lo,var(--_lr-table-heat-tint-lo-default)))}[part=expand-toggle-cell]{padding:var(--lr-space-s);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);text-align:center}[part=row-expand-toggle]{font:inherit;padding:var(--lr-space-xs);cursor:pointer;color:inherit;min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex}[part=row-expand-toggle]:hover{background:var(--lr-color-brand-quiet)}[part=row-expand-toggle]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=row-expand-toggle]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=row-expand-icon]{transition:transform var(--lr-transition-fast);display:inline-block}[part=row-expand-icon] svg{display:block}[part=row-expand-toggle][aria-expanded=true] [part=row-expand-icon]{transform:rotate(90deg)}:host(:dir(rtl)) [part=row-expand-icon]{transform:rotate(180deg)}:host(:dir(rtl)) [part=row-expand-toggle][aria-expanded=true] [part=row-expand-icon]{transform:rotate(90deg)}@media (prefers-reduced-motion:reduce){[part=row-expand-icon]{transition:none!important}}[part=expanded-row] [part=expanded-cell]{padding:var(--lr-space-s);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);background:var(--lr-color-surface)}[part=header-cell][data-sticky],[part=cell][data-sticky]{z-index:var(--lr-layer-content);box-shadow:var(--lr-size-1px) 0 0 0 var(--lr-color-border);position:sticky;inset-inline-start:var(--lr-table-sticky-offset,0)}[part=cell][data-sticky]{background:var(--_lr-table-row-bg,var(--lr-color-surface))}[part=header-cell][data-sticky]{background:var(--_lr-table-header-bg,var(--lr-color-surface))}[part=header-cell][data-sticky=end],[part=cell][data-sticky=end]{box-shadow:calc(-1 * var(--lr-size-1px)) 0 0 0 var(--lr-color-border);inset-inline-start:auto;inset-inline-end:var(--lr-table-sticky-offset,0)}:host(:dir(rtl)) [part=header-cell][data-sticky],:host(:dir(rtl)) [part=cell][data-sticky]{box-shadow:calc(-1 * var(--lr-size-1px)) 0 0 0 var(--lr-color-border)}:host(:dir(rtl)) [part=header-cell][data-sticky=end],:host(:dir(rtl)) [part=cell][data-sticky=end]{box-shadow:var(--lr-size-1px) 0 0 0 var(--lr-color-border)}[part=foot]{background:var(--lr-color-surface);position:sticky;inset-block-end:0}[part=footer-cell]{padding:var(--lr-table-cell-padding-compact,var(--lr-space-xs) var(--lr-space-s));border-block-start:var(--lr-border-width-thin) solid var(--lr-color-border);font-weight:var(--lr-font-weight-semibold);text-align:start}[part=footer-cell][data-align=end]{text-align:end}[part=more-button],[part=reveal-columns-button]{inline-size:100%;padding:var(--lr-space-s);color:var(--lr-color-brand);font:inherit;cursor:pointer;border:none;border-block-start:var(--lr-border-width-thin) solid var(--lr-color-border);background:0 0;display:block}[part=more-button]:hover,[part=reveal-columns-button]:hover{background:var(--lr-color-brand-quiet)}[part=more-button]:active,[part=reveal-columns-button]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=more-button]:focus-visible,[part=reveal-columns-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=error-row] [part=error-cell]{padding:var(--lr-space-s);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);background:var(--lr-color-surface)}[part=retry-button]{padding:var(--lr-space-2xs) var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius-xs);color:var(--lr-color-brand);font:inherit;cursor:pointer;background:0 0;justify-content:center;align-items:center;display:inline-flex}[part=retry-button]:hover{background:var(--lr-color-brand-quiet)}[part=retry-button]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=retry-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}`;export{styles};
@@ -1,4 +1,4 @@
1
- import{type TemplateResult,type PropertyValues}from'lit';import{LyraElement,type LyraEventDetailSnapshot}from'../../../internal/lyra-element.js';import type{LyraSize}from'../../../internal/variants.js';import type{LyraSelectionDirection}from'../../../internal/shared-unions.js';import type{LyraOption}from'./option.class.js';import'./option.class.js';import type{PlaceStrategy}from'../../../internal/positioner.js';import{type FormOwnerValue}from'../../../internal/form-associated.js';import type{LyraPickerDetailValue,LyraPickerValue}from'../../../internal/picker-value.js';export type OptionFilter=(option:LyraOption,query:string)=>boolean;export type LyraComboboxPlacement='top'|'bottom';export type LyraComboboxTagRenderer=(option:LyraOption,index:number)=>unknown;
1
+ import{type TemplateResult,type PropertyValues}from'lit';import{LyraElement,type LyraEventDetailSnapshot}from'../../../internal/lyra-element.js';import type{LyraSize}from'../../../internal/variants.js';import type{LyraSelectionDirection}from'../../../internal/shared-unions.js';import type{LyraOption}from'./option.class.js';import'./option.class.js';import type{PlaceStrategy,PlaceSync}from'../../../internal/positioner.js';import{type FormOwnerValue}from'../../../internal/form-associated.js';import type{LyraPickerDetailValue,LyraPickerValue}from'../../../internal/picker-value.js';export type OptionFilter=(option:LyraOption,query:string)=>boolean;export type LyraComboboxPlacement='top'|'bottom';export type LyraComboboxTagRenderer=(option:LyraOption,index:number)=>unknown;
2
2
  /** What a `validators` entry may return: nothing/`true` passes, a string is the message, `false` is
3
3
  * a generic failure, and an object of {@linkcode ValidityStateFlags} names the flags to raise. */
4
4
  export type LyraComboboxValidatorResult=void|boolean|string|ValidityStateFlags;
@@ -343,7 +343,17 @@ getUnknownLabel?:(value:string)=>string;
343
343
  /** Visual treatment shared with other Lyra form controls. */
344
344
  appearance:'filled'|'outlined'|'filled-outlined';
345
345
  /** Preferred vertical side for the floating listbox. */
346
- placement:LyraComboboxPlacement;private _positioningStrategy?;
346
+ placement:LyraComboboxPlacement;
347
+ /**
348
+ * Copies the trigger's width, height, or both onto the listbox -- the same property
349
+ * `<lr-dropdown>`/`<lr-popup>` spell. Unset (the default), the listbox sizes to its own content,
350
+ * clamped between `--lr-size-12rem` and `--lr-size-28rem`, exactly as before. Set `sync="width"`
351
+ * so a full-width trigger with short option labels gets a listbox that aligns to its own edges
352
+ * instead of floating narrower in the middle -- the width clamp described above no longer
353
+ * applies while this is set, since the anchor's own width is now the intentional bound.
354
+ * @default undefined
355
+ */
356
+ sync?:PlaceSync;private _positioningStrategy?;
347
357
  /**
348
358
  * CSS positioning scheme the listbox is laid out with -- the property `<lr-select>`,
349
359
  * `<lr-popover>`, `<lr-dropdown>`, `<lr-tooltip>` and `<lr-color-picker>` all spell the same way.
@@ -1,4 +1,4 @@
1
- var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{acquireNativeControlDescription}from"../../../internal/native-control-description.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{installFormControlLabelSupport}from"../../../internal/form-control-labels.js";installFormControlLabelSupport();import{loadAnchoredOverlayRuntime}from"../../../internal/anchored-overlay-runtime.js";import{hostAriaLabel,nextId}from"../../../internal/a11y.js";import{chevronIcon,closeIcon}from"../../../internal/icons.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{setCustomState,syncValidityStates}from"../../../internal/custom-states.js";import{submitOnEnter}from"../../../internal/submit-on-enter.js";import{finiteCount,finiteDuration}from"../../../internal/numbers.js";import{DebounceController}from"../../../internal/debounce-controller.js";import{sizes}from"../../../internal/sizes.styles.js";import{styles}from"./combobox.styles.js";import"./option.class.js";import{autocorrectConverter,omittedEmptyStringConverter,optionalLiteralSetConverter,spellcheckConverter}from"../../../internal/converters.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{sanitizeCssColor}from"../../../internal/safe-css.js";import{attachInternalsSafely,getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{installInteractionOnInvalid,installInvalidEventAlias,withStaticValidityCheck}from"../../../internal/invalid-event-alias.js";import{tag}from"../../../internal/prefix.js";import{renderInertPresentation}from"../../../internal/inert-presentation.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{renderDataState}from"../../../internal/data-state-renderer.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{activateNonmodalOverlay}from"../../../internal/nonmodal-overlay-manager.js";import{isOptionSelectedDirty,isOptionSelectedWrite,wasOptionInitiallySelected,RESET_OPTION_SELECTED_FROM_OWNER,SET_OPTION_SELECTED_FROM_OWNER}from"../../../internal/option-selection.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{LYRA_DEFAULT_clear,LYRA_DEFAULT_collapse,LYRA_DEFAULT_comboboxCreate,LYRA_DEFAULT_comboboxLabel,LYRA_DEFAULT_comboboxLoadError,LYRA_DEFAULT_comboboxOverflow,LYRA_DEFAULT_comboboxRequired,LYRA_DEFAULT_comboboxSelectedOverflow,LYRA_DEFAULT_date,LYRA_DEFAULT_details,LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_loading,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_noData,LYRA_DEFAULT_noMatches,LYRA_DEFAULT_notInCatalog,LYRA_DEFAULT_open,LYRA_DEFAULT_popover,LYRA_DEFAULT_progress,LYRA_DEFAULT_removeWithContext,LYRA_DEFAULT_restore,LYRA_DEFAULT_retry,LYRA_DEFAULT_search,LYRA_DEFAULT_select,LYRA_DEFAULT_tableLoadFailed,LYRA_DEFAULT_valueInvalid}from"../../../internal/default-strings.generated.js";function isLyraOptionElement(value){return isHtmlElement(value)&&value.localName===tag("option")}function normalizeSelectionValues(next){return Array.isArray(next)?next.filter(value=>typeof value=="string"):typeof next=="string"?[next]:[]}const POSITIONING_STRATEGY=optionalLiteralSetConverter(["absolute","fixed"]),VALIDITY_FLAG_KEYS=new Set(["badInput","customError","patternMismatch","rangeOverflow","rangeUnderflow","stepMismatch","tooLong","tooShort","typeMismatch","valueMissing"]),comboboxSpellcheckConverter={...spellcheckConverter,fromAttribute:(value,type)=>value===null?void 0:spellcheckConverter.fromAttribute?.(value,type)};function isValidityFlagKey(value){return typeof value=="string"&&VALIDITY_FLAG_KEYS.has(value)}const MAX_SOURCE_ROWS=2e3,MAX_SOURCE_TEXT_UNITS=25e4,MAX_SOURCE_FIELD_UNITS=4096,MAX_RENDER_ROWS=1e3;function normalizeSourceResult(input){let candidateRows,candidateTotal;try{Array.isArray(input)?candidateRows=input:typeof input=="object"&&input!==null&&(candidateRows=input.rows,candidateTotal=input.total)}catch{throw new TypeError("Invalid combobox source result")}if(!Array.isArray(candidateRows))throw new TypeError("Invalid combobox source result");const providerTotal=typeof candidateTotal=="number"&&Number.isFinite(candidateTotal)&&candidateTotal>=0?Math.trunc(candidateTotal):candidateRows.length,rows=[];let textUnits=0;const limit=Math.min(candidateRows.length,MAX_SOURCE_ROWS);for(let index=0;index<limit;index++)try{const value=candidateRows[index]?.value,label=candidateRows[index]?.label;if(typeof value!="string"||typeof label!="string"||value.length>MAX_SOURCE_FIELD_UNITS||label.length>MAX_SOURCE_FIELD_UNITS)continue;const source=candidateRows[index],optionalText=key=>{const candidate=source[key];return typeof candidate=="string"&&candidate.length<=MAX_SOURCE_FIELD_UNITS?candidate:void 0},sub=optionalText("sub"),accessibleLabel=optionalText("accessibleLabel"),dotColor=optionalText("dotColor"),group=optionalText("group"),badgeCandidate=source.badge,badge=typeof badgeCandidate=="string"&&badgeCandidate.length<=MAX_SOURCE_FIELD_UNITS||typeof badgeCandidate=="number"&&Number.isFinite(badgeCandidate)?badgeCandidate:void 0,units=value.length+label.length+(sub?.length??0)+(accessibleLabel?.length??0)+(dotColor?.length??0)+(group?.length??0)+(typeof badge=="string"?badge.length:0);if(textUnits+units>MAX_SOURCE_TEXT_UNITS)break;textUnits+=units,rows.push({value,label,...sub===void 0?{}:{sub},...source.icon===void 0?{}:{icon:source.icon},...source.start===void 0?{}:{start:source.start},...source.end===void 0?{}:{end:source.end},...badge===void 0?{}:{badge},...accessibleLabel===void 0?{}:{accessibleLabel},...source.data===void 0?{}:{data:source.data},...dotColor===void 0?{}:{dotColor},...group===void 0?{}:{group},...typeof source.disabled=="boolean"?{disabled:source.disabled}:{}})}catch{}const total=Math.max(providerTotal,candidateRows.length);return{rows,total,truncated:total>rows.length}}class LyraCombobox extends LyraElement{static{this.defaultStrings={...super.defaultStrings,clear:LYRA_DEFAULT_clear,collapse:LYRA_DEFAULT_collapse,comboboxCreate:LYRA_DEFAULT_comboboxCreate,comboboxLabel:LYRA_DEFAULT_comboboxLabel,comboboxLoadError:LYRA_DEFAULT_comboboxLoadError,comboboxOverflow:LYRA_DEFAULT_comboboxOverflow,comboboxRequired:LYRA_DEFAULT_comboboxRequired,comboboxSelectedOverflow:LYRA_DEFAULT_comboboxSelectedOverflow,date:LYRA_DEFAULT_date,details:LYRA_DEFAULT_details,fieldRequired:LYRA_DEFAULT_fieldRequired,loading:LYRA_DEFAULT_loading,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,noData:LYRA_DEFAULT_noData,noMatches:LYRA_DEFAULT_noMatches,notInCatalog:LYRA_DEFAULT_notInCatalog,open:LYRA_DEFAULT_open,popover:LYRA_DEFAULT_popover,progress:LYRA_DEFAULT_progress,removeWithContext:LYRA_DEFAULT_removeWithContext,restore:LYRA_DEFAULT_restore,retry:LYRA_DEFAULT_retry,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select,tableLoadFailed:LYRA_DEFAULT_tableLoadFailed,valueInvalid:LYRA_DEFAULT_valueInvalid}}static{this.immutableEventDetails=Object.freeze(["lr-change","input","change"])}static{this.identityEventDetailCollectionItems=Object.freeze({"lr-change":Object.freeze(["data"]),input:Object.freeze(["data"]),change:Object.freeze(["data"])})}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},multiple:{type:Boolean,reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0},required:{type:Boolean,reflect:!0,noAccessor:!0},value:{noAccessor:!0},name:{reflect:!0,noAccessor:!0,converter:omittedEmptyStringConverter},maxOptionsVisible:{type:Number,attribute:"max-options-visible",noAccessor:!0},maxRender:{type:Number,attribute:"max-render",noAccessor:!0},sourceDelay:{type:Number,attribute:"source-delay",noAccessor:!0}}}get open(){return this._open}set open(next){const old=this._open,liveDisabled=this.effectiveDisabled||typeof this.matches=="function"&&this.matches(":disabled");if(this._open=!!next&&!liveDisabled,this._open===old){next&&!this._open&&this.hasAttribute("open")&&this.removeAttribute("open");return}this.requestUpdate("open",old)}get positioningStrategy(){return this._positioningStrategy??"fixed"}set positioningStrategy(next){const normalized=POSITIONING_STRATEGY.normalize(next)??"fixed",old=this.positioningStrategy;this._positioningStrategy=normalized,normalized!==old&&this.requestUpdate("positioningStrategy",old)}get autocorrect(){return this.autocorrectValue}set autocorrect(next){this.autocorrectValue=!!next,this.requestUpdate()}get inputmode(){return this.inputMode}set inputmode(next){this.inputMode=next??""}get enterkeyhint(){return this.enterKeyHint}set enterkeyhint(next){this.enterKeyHint=next??""}get inputValue(){return this.query}set inputValue(next){this.explicitInputValue=!0,this.query=next??"",this.activeIndex=-1,this.source&&this.runSource(this.query),this.requestUpdate()}constructor(){super(),this.placeholder="",this.label="",this.hint="",this.errorText="",this.allowCreate=!1,this.allowCustomValue=!1,this.showUnknownOption=!1,this.appearance="outlined",this.placement="bottom",this.size="m",this.pill=!1,this.clearable=!1,this.withClear=!1,this.withLabel=!1,this.withHint=!1,this.validators=[],this.autocomplete="off",this.inputMode="",this.enterKeyHint="",this.spellcheck=!1,this.autocapitalize="",this.autocorrectValue=!0,this.filter=null,this.source=null,this.query="",this.explicitInputValue=!1,this.activeIndex=-1,this.options=[],this.touched=!1,this.validityRevision=0,this.slotPresence=new SlotPresenceController(this),this.loading=!1,this.sourceFailed=!1,this.sourceEverSettled=!1,this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.sourceDebounce=new DebounceController(0,request=>this.runSourceRequest(request),()=>this.ownerDocument.defaultView),this.sourceToken=0,this.refreshQueued=!1,this._sourceWarmed=!1,this._selectedLabelCache=new Map,this._selectedRowCache=new Map,this._rowsByValue=new Map,this._open=!1,this._fieldsetDisabled=!1,this.listId=nextId("combobox-list"),this.inputId=nextId("combobox-input"),this.listboxPositioned=!1,this.positioningGeneration=0,this.positioningReady=Promise.resolve(!1),this.restoreFocusOnClose=!0,this.restoringOverlayFocus=!1,this._isFirstUpdate=!0,this.openVetoed=!1,this.closeCleanupPending=!1,this.transitionToken=0,this.transitionWaiters=new Map,this._selected=[],this.sourceOptionsByRow=new WeakMap,this._valueDirty=!1,this._multiple=!1,this._disabled=!1,this._required=!1,this._defaultSelected=[],this._defaultCaptured=!1,this._restoredStateActive=!1,this._name="",this._maxOptionsVisible=3,this._maxRender=200,this._sourceDelay=200,this.localDescriptionIds="",this.markInteracted=()=>{this.touched||(this.touched=!0,this.updateValidity(),this.syncCustomStates())},this.collectOptions=e=>{this.collectOptionsFromSlot(e.target)},this.onOptionChange=e=>{e.stopPropagation();const option=e.composedPath().find(isLyraOptionElement);if(isLyraOptionElement(option)&&this.options.includes(option)&&isOptionSelectedWrite(e)){if(this.multiple){const next=option.selected?this._selected.includes(option.value)?this._selected:[...this._selected,option.value]:this._selected.filter(value=>value!==option.value);this.assignValue(next)}else{if(this._valueDirty=!0,this._restoredStateActive=!1,!option.selected&&this.singleSelectedOption!==option)return;this.setValue(option.selected?option.value:[],!0,option.selected?option:void 0)}return}isLyraOptionElement(option)&&this.adornmentClones.get(option)?.markup!==this.adornmentMarkup(option)&&this.adornmentClones.delete(option),queueMicrotask(()=>{this.refreshOptionDefaults(),this.reflectSelected(),this.options=[...this.options],this.normalizeActiveIndex()})},this.adornmentClones=new WeakMap,this.onDocPointer=e=>{if(!e.composedPath().includes(this)){if(this.overlayHandle?.isActive()){this.overlayHandle.dismissBackdrop();return}this.restoreFocusOnClose=!1,this.hide()}},this.onInput=e=>{this.liveDisabled||(this.explicitInputValue=!1,this.query=e.target.value,this.activeIndex=-1,this.show(),this.source&&this.runSource(this.query),this.emit("lr-filter",{value:this.query}))},this.onInputBlur=event=>{this.liveDisabled||(this.touched=!0),this.syncCustomStates(),this.restoreFocusOnClose=!1,this.hide(),relayNativeEvent(this,event)},this.onInputFocus=event=>{if(this.liveDisabled){event.stopPropagation();return}this.restoringOverlayFocus||this.show(),relayNativeEvent(this,event)},this.onKeyDown=e=>{if(e.isComposing||e.keyCode===229||this.liveDisabled)return;const navigable=this.renderedRows.rows.filter(r=>!r.disabled);switch(e.key){case"ArrowDown":if(e.preventDefault(),!this.open){this.show();return}this.activeIndex=Math.min(navigable.length-1,this.activeIndex+1);break;case"ArrowUp":if(e.preventDefault(),!this.open){this.show();return}this.activeIndex=Math.max(0,this.activeIndex-1);break;case"Enter":{const activeRow=navigable[this.activeIndex];if(this.open&&this.activeIndex>=0&&activeRow){e.preventDefault(),this.pickRow(activeRow);break}const create=this.createRow;if(this.open&&create){e.preventDefault(),this.createOption(create.createInput);break}if(this.open&&this.allowCustomValue&&!this.multiple&&this.query.trim()){e.preventDefault(),this.commitCustomValue(this.query.trim());break}submitOnEnter(this,e);break}case"Escape":this.open&&(!this.overlayHandle?.isActive()||this.overlayHandle.isTopmost())&&(e.preventDefault(),this.hide());break;case"Home":this.open&&(e.preventDefault(),this.activeIndex=0);break;case"End":this.open&&(e.preventDefault(),this.activeIndex=navigable.length-1);break;case"Backspace":this.multiple&&!this.query&&this._selected.length&&this.removeValue(this._selected[this._selected.length-1]);break}},this.onComboMouseDown=e=>{this.liveDisabled||e.composedPath()[0]!==this.inputEl&&(e.target.closest("button")||(e.preventDefault(),this.inputEl?.focus(),this.show()))},this.onListboxMouseDown=e=>{e.preventDefault()},this.onListboxClick=e=>{const value=e.target.closest('[part="option"]')?.dataset.value;if(value===void 0)return;const row=this._rowsByValue.get(value);row&&this.pickRow(row)},this.internals=attachInternalsSafely(this),this.validityController=new AnchoredValidityController(this,this.internals,()=>this[VALIDITY_ANCHOR]()),installCustomErrorProperty(this,()=>this.validityController.customValidityMessage),installInvalidEventAlias(this,init=>this.emit("lr-invalid",null,init)),installInteractionOnInvalid(this,this.markInteracted)}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}getForm(){return getFormOwner(this.internals)}get labels(){return this.internals.labels}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}get validationTarget(){return this.validationTargetOverride??this.inputEl??void 0}set validationTarget(next){this.validationTargetOverride=next??void 0,this.validityController.refreshAnchor()}resetValidity(){this.validityController.setCustomValidity(""),this.updateValidity()}get input(){return this.inputEl??null}get selectionStart(){return this.inputEl?.selectionStart??null}set selectionStart(value){this.inputEl&&(this.inputEl.selectionStart=value)}get selectionEnd(){return this.inputEl?.selectionEnd??null}set selectionEnd(value){this.inputEl&&(this.inputEl.selectionEnd=value)}get selectionDirection(){return this.inputEl?.selectionDirection}set selectionDirection(value){this.inputEl&&(this.inputEl.selectionDirection=value)}get liveDisabled(){return this.effectiveDisabled||this.matches(":disabled")}focus(options){this.liveDisabled||this.inputEl?.focus(options)}blur(){this.inputEl?.blur()}click(){this.liveDisabled||(this.inputEl?.focus(),this.show())}select(){this.inputEl?.select()}setSelectionRange(start,end,direction){this.inputEl?.setSelectionRange(start,end,direction)}setRangeText(replacement,start,end,selectMode){const input=this.inputEl;input&&(start===void 0||end===void 0?input.setRangeText(replacement):input.setRangeText(replacement,start,end,selectMode),this.explicitInputValue=!0,this.query=input.value,this.activeIndex=-1,this.source&&this.runSource(this.query))}[VALIDITY_ANCHOR](){return this.validationTarget}syncExternalDescription(){if(!this.isConnected)return;const target=this.renderRoot.querySelector('[part="combobox-input"]');target&&(this.externalDescriptionLease?this.externalDescriptionLease.update(target):this.externalDescriptionLease=acquireNativeControlDescription(this,target,()=>this.localDescriptionIds))}releaseExternalDescription(){this.externalDescriptionLease?.release(),this.externalDescriptionLease=void 0}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.syncExternalDescription(),this.syncSourceErrorAnnouncementSink(),this.updateValidity(),this.hasUpdated&&this.syncValidatorAttributeObserver(),this.hasUpdated&&queueMicrotask(()=>{this.open?this.reconnectOpenPopup():this.source&&this._selected.length&&this.asyncRows.length===0&&this.runSource("")})}adoptedCallback(){super.adoptedCallback(),this.releaseExternalDescription(),this.hasUpdated&&this.syncExternalDescription(),this.listboxPositioned=!1,this.invalidateListboxPositioning(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.unbindDocumentPointer(),this.clearSourceTimer(),this.sourceToken+=1,this.sourceAbort?.abort(),this.sourceAbort=void 0,this.releaseSourceErrorAnnouncementSink(),this.syncSourceErrorAnnouncementSink()}syncSourceErrorAnnouncementSink(){this.isConnected&&this.sourceErrorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseSourceErrorAnnouncementSink(),this.sourceErrorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseSourceErrorAnnouncementSink(){this.sourceErrorAnnouncementSink?.release(),this.sourceErrorAnnouncementSink=void 0}willUpdate(changed){super.willUpdate(changed),this._isFirstUpdate=!this.hasUpdated,this.announceOpenTransition(changed),changed.has("open")&&!this.openVetoed&&(this.listboxPositioned=!1),changed.has("open")&&this.openVetoed?this.closeCleanupPending=!1:changed.has("open")&&!this.open&&this.finalizeCloseState(),changed.has("source")&&(this.clearSourceTimer(),this.sourceAbort?.abort(),this.sourceAbort=void 0,this.sourceToken++,this.loading=!1,this.sourceFailed=!1,this.sourceEverSettled=!1,this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.activeIndex=-1,this._sourceWarmed=!1,this.source&&this.open&&this.runSource(this.query)),!this._sourceWarmed&&this.source&&(this._selected.length>0||(this.pendingSelectedRowValues?.length??0)>0)&&this.asyncRows.length===0&&(this._sourceWarmed=!0,this.runSource(""))}firstUpdated(changed){super.firstUpdated(changed);const slot=this.optionsSlot;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>{s.assignedElements({flatten:!0}).some(isLyraOptionElement)&&this.collectOptionsFromSlot(s)})})}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",this._name?this.setAttribute("name",this._name):this.removeAttribute("name"),this.syncFormValue(),this.requestUpdate("name",old)}get multiple(){return this._multiple}set multiple(next){const old=this._multiple;this._multiple=!!next,this.toggleAttribute("multiple",this._multiple),this.reflectSelected(),this.syncFormValue(),this.requestUpdate("multiple",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled;this._disabled=!!next,this.toggleAttribute("disabled",this._disabled),this._disabled&&this.hide(),this.updateValidity(),this.requestUpdate("disabled",old)}get required(){return this._required}set required(next){const old=this._required;this._required=!!next,this.toggleAttribute("required",this._required),this.updateValidity(),this.requestUpdate("required",old)}get value(){return this.multiple?[...this._selected]:this._selected[0]??""}set value(next){this.setValue(next,!0)}setValue(next,dirty,preferred){const old=this._selected;this.singleSelectedOption=preferred,dirty&&(this._restoredStateActive=!1,this._valueDirty=!0),this._selected=normalizeSelectionValues(next);const selected=new Set(this._selected);for(const value of selected){const row=this.effectiveRows.find(candidate=>candidate.value===value)??this.asyncRows.find(candidate=>candidate.value===value);row&&this._selectedRowCache.set(value,row)}for(const value of this._selectedRowCache.keys())selected.has(value)||this._selectedRowCache.delete(value);for(const value of this._selectedLabelCache.keys())selected.has(value)||this._selectedLabelCache.delete(value);this.syncFormValue(),this.reflectSelected(),this.updateValidity(),this.requestUpdate("value",old)}get maxOptionsVisible(){return this._maxOptionsVisible}set maxOptionsVisible(next){const old=this._maxOptionsVisible;this._maxOptionsVisible=finiteCount(next,3),this.requestUpdate("maxOptionsVisible",old)}get maxRender(){return this._maxRender}get sourceDelay(){return this._sourceDelay}set sourceDelay(next){const old=this._sourceDelay;this._sourceDelay=finiteDuration(next,200),this.requestUpdate("sourceDelay",old)}set maxRender(next){const old=this._maxRender;this._maxRender=Math.min(finiteCount(next,200),MAX_RENDER_ROWS),this.requestUpdate("maxRender",old)}get sourceTotal(){return this._sourceTotal}get sourceTruncated(){return this._sourceTruncated}get selectedRows(){return this.resolveSelectedRowSlots().filter(row=>row!=null).map(row=>({...row}))}resolveSelectedRowSlots(){return this._selected.map(value=>this._selectedRowCache.get(value)??this.effectiveRows.find(row=>row.value===value)??this.asyncRows.find(row=>row.value===value))}set selectedRows(next){const values=[],seen=new Set;if(Array.isArray(next))for(const candidate of next){let value;try{value=candidate?.value}catch{continue}typeof value!="string"||seen.has(value)||(seen.add(value),values.push(value))}if(values.length>0&&this.selectionSourceRows.length===0){this.pendingSelectedRowValues=values,this.source&&this.isConnected&&(this._sourceWarmed=!0,this.runSource(""));return}this.pendingSelectedRowValues=void 0,this.applySelectedRowValues(values)}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}validatorResult(){const self=this,current=self.value;for(const validator of Array.isArray(this.validators)?this.validators:[]){let result;try{if(typeof validator=="object"&&validator!==null&&"checkValidity"in validator){const checked=validator.checkValidity(this);if(checked?.isValid===!0)continue;const flags={};for(const key of Array.isArray(checked?.invalidKeys)?checked.invalidKeys:[])isValidityFlagKey(key)&&(flags[key]=!0);Object.values(flags).some(Boolean)||(flags.customError=!0);let message=typeof checked?.message=="string"?checked.message:"";return!message&&typeof validator.message=="string"&&(message=validator.message),!message&&typeof validator.message=="function"&&(message=validator.message(this)),{flags,message:message||this.localize("valueInvalid")}}result=typeof validator=="function"?validator(current,self):validator?.validate(current,self)}catch{return{flags:{customError:!0},message:this.localize("valueInvalid")}}if(!(result===void 0||result===!0)){if(typeof result=="string")return{flags:{customError:!0},message:result};if(result===!1)return{flags:{customError:!0},message:this.localize("valueInvalid")};if(result&&typeof result=="object"&&Object.values(result).some(Boolean))return{flags:result,message:this.localize("valueInvalid")}}}return{}}syncValidatorAttributeObserver(){this.disconnectValidatorAttributeObserver();const owner=this.ownerDocument.defaultView,MutationObserverCtor=owner?.MutationObserver;if(!this.isConnected||!owner||typeof MutationObserverCtor!="function")return;const attributes=new Set;for(const validator of Array.isArray(this.validators)?this.validators:[]){if(typeof validator!="object"||validator===null||!("checkValidity"in validator))continue;let observed;try{observed=validator.observedAttributes}catch{continue}if(Array.isArray(observed))for(const name of observed)typeof name=="string"&&name.length>0&&attributes.add(name)}if(attributes.size===0)return;const binding={},observer=new MutationObserverCtor(()=>{this.validatorAttributeObserver!==binding||!this.isConnected||this.ownerDocument.defaultView!==owner||(this.updateValidity(),this.validityRevision++)});binding.observer=observer,binding.owner=owner;try{observer.observe(this,{attributes:!0,attributeFilter:[...attributes]}),this.validatorAttributeObserver=binding}catch{observer.disconnect()}}disconnectValidatorAttributeObserver(){const binding=this.validatorAttributeObserver;this.validatorAttributeObserver=void 0,binding?.observer.disconnect()}updateValidity(){if(this.barredFromValidation){this.validityController.setValidity({}),this.syncCustomStates();return}const flags={};let message="";this.required&&this._selected.length===0&&(flags.valueMissing=!0,message=this.localize("comboboxRequired"));const configured=this.validatorResult();configured.flags&&Object.assign(flags,configured.flags),configured.message&&(message=configured.message),this.validityController.setValidity(flags,message),this.syncCustomStates()}syncCustomStates(){syncValidityStates(this.internals,{required:this.required,hasInteracted:this.touched,barred:this.barredFromValidation}),setCustomState(this.internals,"blank",this._selected.length===0),setCustomState(this.internals,"disabled",this.effectiveDisabled)}syncFormValue(){const state2=JSON.stringify(this._selected);if(this.multiple){if(!this.name){this.internals.setFormValue(null,state2);return}const fd=new FormData;for(const v of this._selected)fd.append(this.name,v);this.internals.setFormValue(fd,state2)}else this.internals.setFormValue(this._selected[0]??"",state2)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}formResetCallback(){this.touched=!1,this._restoredStateActive=!1,this._valueDirty=!1;const resetValues=this._defaultSelected.length>0?this._defaultSelected:this.options.filter(option=>wasOptionInitiallySelected(option)).map(option=>option.value);this._defaultSelected.length===0&&resetValues.length>0&&(this._defaultSelected=[...resetValues]);const defaults=new Set(resetValues);for(const option of this.options)option[RESET_OPTION_SELECTED_FROM_OWNER](defaults.has(option.value));this.setValue(this.multiple?[...resetValues]:resetValues.slice(0,1),!1),this.query="",this.explicitInputValue=!1}formStateRestoreCallback(state2,reason){let selected=[];if(typeof state2=="string")try{const parsed=JSON.parse(state2);Array.isArray(parsed)&&parsed.every(value=>typeof value=="string")&&(selected=parsed)}catch{}this.assignValue(this.multiple?selected:selected.slice(0,1)),this._restoredStateActive=!0}formDisabledCallback(disabled){this._fieldsetDisabled=disabled,disabled&&this.hide(),this.updateValidity(),this.requestUpdate()}checkValidity(){return this.updateValidity(),withStaticValidityCheck(this,()=>this.internals.checkValidity())}reportValidity(){return this.touched=!0,this.updateValidity(),this.syncCustomStates(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncCustomStates()}disconnectedCallback(){this.releaseExternalDescription(),this.transitionToken++,this.listboxPositioned=!1,this.releaseSourceErrorAnnouncementSink(),this.disconnectValidatorAttributeObserver(),super.disconnectedCallback(),this.invalidateListboxPositioning(),this.clearSourceTimer(),this.sourceToken+=1,this.sourceAbort?.abort(),this.sourceAbort=void 0,this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.unbindDocumentPointer(),this.resolveTransitionWaiters("lr-after-show"),this.resolveTransitionWaiters("lr-after-hide"),this.open=!1}collectOptionsFromSlot(slot){const previous=new Set(this.options);if(this.options=slot.assignedElements({flatten:!0}).filter(isLyraOptionElement),this.adornmentClones=new WeakMap,this.normalizeActiveIndex(),this.applyPendingSelectedRows(),this._defaultCaptured){const newDefaults=this.options.filter(option=>!previous.has(option)&&option.defaultSelected),newLive=this.options.filter(option=>!previous.has(option)&&option.selected&&!option.defaultSelected);this.refreshOptionDefaults();const eligible=[...!this._restoredStateActive&&!this._valueDirty?newDefaults:[],...this._restoredStateActive?[]:newLive];if(eligible.length){const values=eligible.map(option=>option.value),next=this.multiple?[...new Set([...this._selected,...values])]:values[values.length-1];newLive.length>0?this.assignValue(next):this.setValue(next,!1);return}}else{this._defaultCaptured=!0;const allDefaults=this.options.filter(option=>option.defaultSelected).map(option=>option.value),allLive=this.options.filter(option=>option.selected).map(option=>option.value),defaults=this.multiple?allDefaults:allDefaults.slice(0,1),live=this.multiple?allLive:allLive.slice(0,1),initialLive=this.options.filter(option=>wasOptionInitiallySelected(option)).map(option=>option.value),optionDirty=this.options.some(option=>isOptionSelectedDirty(option)),dirtyValues=this.options.filter(option=>isOptionSelectedDirty(option)&&option.selected).map(option=>option.value);this._defaultSelected=[...defaults.length>0?defaults:initialLive.length>0?initialLive:live];const fromDefaults=defaults.length>0,initial=optionDirty?this.multiple?allLive:dirtyValues.slice(-1)[0]?dirtyValues.slice(-1):live:fromDefaults?defaults:live;if(initial.length&&!this._restoredStateActive&&!this._valueDirty){const next=this.multiple?initial:initial[0];fromDefaults&&!optionDirty?this.setValue(next,!1):this.assignValue(next);return}optionDirty&&(this._valueDirty=!0)}this.reflectSelected()}refreshOptionDefaults(){const declared=this.options.filter(option=>option.defaultSelected).map(option=>option.value);this._defaultSelected=this.multiple?declared:declared.slice(0,1),!this._valueDirty&&!this._restoredStateActive&&this.setValue([...this._defaultSelected],!1)}reflectSelected(){const value=this._selected[0];(!this.singleSelectedOption||!this.options.includes(this.singleSelectedOption)||this.singleSelectedOption.value!==value)&&(this.singleSelectedOption=this.options.find(option=>option.value===value));const selected=new Set(this._selected);for(const option of this.options)option[SET_OPTION_SELECTED_FROM_OWNER](this.multiple?selected.has(option.value):option===this.singleSelectedOption)}labelFor(value){const nonBlank=label=>label!==void 0&&label.trim().length>0?label:void 0;if(this.getUnknownLabel&&this.isUnknownValue(value)){const override=nonBlank(this.getUnknownLabel(value));if(override!==void 0)return override}return(!this.source&&!this.multiple&&this.singleSelectedOption?.value===value?nonBlank(this.singleSelectedOption.label):void 0)??nonBlank(this._selectedLabelCache.get(value))??nonBlank(this.options.find(o=>o.value===value)?.label)??nonBlank(this.asyncRows.find(r=>r.value===value)?.label)??(this.source&&!this.sourceEverSettled?this.statusText("loading",this.loadingText):void 0)??value}isUnknownValue(value){return this.source&&!this.sourceEverSettled?!1:!(!this.source&&!this.multiple&&this.singleSelectedOption?.value===value||this._selectedLabelCache.has(value)||this.options.some(option=>option.value===value)||this.asyncRows.some(row=>row.value===value))}adornmentMarkup(option){return Array.from(option.children).filter(child=>["start","end","prefix","suffix"].includes(child.getAttribute("slot")??"")).map(child=>child.outerHTML).join("")}adornmentsFor(option){const cached=this.adornmentClones.get(option);if(cached)return cached;const cloneSlot=selector=>{const nodes=Array.from(option.querySelectorAll(selector));if(nodes.length!==0)return nodes.map(node=>node.cloneNode(!0))},resolved={markup:this.adornmentMarkup(option),start:cloneSlot(':scope > [slot="start"], :scope > [slot="prefix"]'),end:cloneSlot(':scope > [slot="end"], :scope > [slot="suffix"]')};return this.adornmentClones.set(option,resolved),resolved}rowForOption(option){const adornments=this.adornmentsFor(option),row={value:option.value,label:option.label,sub:option.sub||void 0,dotColor:option.dotColor||void 0,group:option.group||void 0,disabled:option.disabled||option.inert||option.closest("[inert]")!==null,data:option.data,...adornments.start===void 0?{}:{start:adornments.start},...adornments.end===void 0?{}:{end:adornments.end}};return this.sourceOptionsByRow.set(row,option),row}get selectionSourceRows(){return this.source?this.asyncRows:this.options.map(option=>this.rowForOption(option))}applySelectedRowValues(values){const rowsByValue=new Map;for(const row of this.selectionSourceRows)rowsByValue.has(row.value)||rowsByValue.set(row.value,row);const rows=values.map(value=>rowsByValue.get(value)).filter(row=>row!==void 0),limited=this.multiple?rows:rows.slice(0,1);this.assignValue(limited.map(row=>row.value));for(const row of limited)this._selectedRowCache.set(row.value,row)}applyPendingSelectedRows(acceptEmptySource=!1){if(this.pendingSelectedRowValues===void 0||!acceptEmptySource&&this.selectionSourceRows.length===0)return!1;const values=this.pendingSelectedRowValues;return this.pendingSelectedRowValues=void 0,this.applySelectedRowValues(values),!0}get effectiveRows(){return this.source?this.asyncRows:this.filtered.map(option=>this.rowForOption(option))}get unknownRows(){if(!this.showUnknownOption)return[];const locale=this.effectiveLocale,query2=this.query.trim().toLocaleLowerCase(locale);return this._selected.filter(value=>this.isUnknownValue(value)).map(value=>({value,label:this.labelFor(value),badge:this.localize("notInCatalog"),unknownValue:value})).filter(row=>!query2||row.label.toLocaleLowerCase(locale).includes(query2)||row.value.toLocaleLowerCase(locale).includes(query2))}get createRow(){if(!this.allowCreate)return;const inputValue=this.query.trim();if(!inputValue)return;const locale=this.effectiveLocale,folded=inputValue.toLocaleLowerCase(locale);if(!(this.source?this.asyncRows:this.options.map(option=>({value:option.value,label:option.label}))).some(row=>row.value.toLocaleLowerCase(locale)===folded||row.label.toLocaleLowerCase(locale)===folded))return{value:inputValue,label:this.localize("comboboxCreate",void 0,{value:inputValue}),createInput:inputValue}}get renderedRows(){const all=this.effectiveRows,create=this.createRow,sourceOverflow=this.source?Math.max(0,this._sourceTotal-all.length):0,unknown=this.unknownRows;if(all.length<=this.maxRender)return{rows:[...all,...unknown,...create?[create]:[]],overflow:sourceOverflow};const originalIndex=new Map(all.map((r,i)=>[r,i])),capped=all.slice(0,this.maxRender),cappedValues=new Set(capped.map(r=>r.value));let appendedOutOfCap=!1;for(const v of this._selected)if(!cappedValues.has(v)){const selectedRow=all.find(r=>r.value===v);selectedRow&&(capped.push(selectedRow),appendedOutOfCap=!0)}return appendedOutOfCap&&capped.sort((a,b)=>originalIndex.get(a)-originalIndex.get(b)),capped.push(...unknown),create&&capped.push(create),{rows:capped,overflow:all.length-capped.length+unknown.length+(create?1:0)+sourceOverflow}}normalizeActiveIndex(){if(this.activeIndex<0)return;const navigableCount=this.renderedRows.rows.filter(row=>!row.disabled).length,next=navigableCount>0?Math.min(this.activeIndex,navigableCount-1):-1;next!==this.activeIndex&&(this.activeIndex=next)}get filtered(){const locale=this.effectiveLocale,q=this.query.trim().toLocaleLowerCase(locale),selectedLabel=this.multiple?"":this.labelFor(this._selected[0]??"")??"",effective=q&&q===selectedLabel.toLocaleLowerCase(locale)?"":q;if(!effective)return this.options;const fn=this.filter??((o,query2)=>o.label.toLocaleLowerCase(locale).includes(query2)||o.searchText.toLocaleLowerCase(locale).includes(query2));return this.options.filter(o=>fn(o,effective))}get displayValue(){return this.multiple||this.open||this.explicitInputValue?this.query:this._selected[0]?this.labelFor(this._selected[0]):""}announceOpenTransition(changed){if(this.openVetoed=!1,!changed.has("open")||this._isFirstUpdate)return;const name=this.open?"lr-show":"lr-hide";if(!this.isConnected){this.emit("lr-hide");return}this.emit(name,null,{cancelable:!0}).defaultPrevented&&(this.openVetoed=!0,this.open=!this.open,this.resolveTransitionWaiters(this.open?"lr-after-hide":"lr-after-show"))}show(){if(this.open||this.liveDisabled)return Promise.resolve();this.resolveTransitionWaiters("lr-after-hide");const settled=this.waitForTransition("lr-after-show");return this.open=!0,settled}hide(){if(!this.open)return Promise.resolve();this.resolveTransitionWaiters("lr-after-show");const settled=this.waitForTransition("lr-after-hide");return this.closeCleanupPending=!0,this.open=!1,settled}finalizeCloseState(){if(this.closeCleanupPending&&(this.closeCleanupPending=!1,this.activeIndex=-1,!this.multiple)){const queryChanged=this.query!=="";this.query="",this.explicitInputValue=!1,queryChanged&&this.source&&(this.asyncRows=[],this.sourceFailed=!1,this._sourceTotal=0,this._sourceTruncated=!1)}}activateListboxOverlay(){this.invalidateListboxPositioning(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.restoreFocusOnClose=!0,this.overlayHandle=activateNonmodalOverlay({host:this,panel:()=>this.renderRoot.querySelector('[part="listbox"]'),onEscape:()=>{this.hide()},onBackdrop:()=>{this.restoreFocusOnClose=!1,this.hide()},restoreFocusTo:this.inputEl??null}),this.bindDocumentPointer();const anchor=this.renderRoot.querySelector('[part="combobox"]'),listbox=this.renderRoot.querySelector('[part="listbox"]');if(anchor&&listbox){const generation=this.positioningGeneration;this.positioningReady=new Promise(resolve=>{this.resolvePositioningReady=resolve}),this.startListboxPositioning(generation,anchor,listbox)}}invalidateListboxPositioning(){this.positioningGeneration++,this.cleanup?.(),this.cleanup=void 0,this.resolvePositioningReady?.(!1),this.resolvePositioningReady=void 0}resolveCurrentPositioning(positioned){const resolve=this.resolvePositioningReady;this.resolvePositioningReady=void 0,resolve?.(positioned)}async startListboxPositioning(generation,anchor,listbox){try{const{place}=await loadAnchoredOverlayRuntime();if(generation!==this.positioningGeneration||!this.open||!this.isConnected||this.renderRoot.querySelector('[part="combobox"]')!==anchor||this.renderRoot.querySelector('[part="listbox"]')!==listbox)return;const cleanup=place(anchor,listbox,{placement:`${this.placement}-start`,strategy:resolveEffectivePositioningStrategy(this,this._positioningStrategy,"fixed"),onPlaced:()=>{generation===this.positioningGeneration&&(this.listboxPositioned=!0,this.updateComplete.then(()=>{generation!==this.positioningGeneration||!this.open||this.resolveCurrentPositioning(!0)}))}});generation!==this.positioningGeneration?cleanup():this.cleanup=cleanup}catch{if(generation!==this.positioningGeneration)return;this.resolveCurrentPositioning(!1),this.hide()}}teardownListboxOverlay(restoreFocus=this.restoreFocusOnClose){this.invalidateListboxPositioning(),this.restoringOverlayFocus=restoreFocus;try{this.overlayHandle?.deactivate({restoreFocus})}finally{this.restoringOverlayFocus=!1}this.overlayHandle=void 0,this.unbindDocumentPointer(),this.restoreFocusOnClose=!0}bindDocumentPointer(){if(!this.isConnected)return;const ownerDocument=this.ownerDocument;if(this.pointerListenerDocument===ownerDocument&&this.pointerListener)return;this.unbindDocumentPointer();const listener=event=>{this.pointerListener!==listener||this.pointerListenerDocument!==ownerDocument||!this.isConnected||this.ownerDocument!==ownerDocument||this.onDocPointer(event)};this.pointerListenerDocument=ownerDocument,this.pointerListener=listener,ownerDocument.addEventListener("pointerdown",listener,!0)}unbindDocumentPointer(){this.pointerListenerDocument&&this.pointerListener&&this.pointerListenerDocument.removeEventListener("pointerdown",this.pointerListener,!0),this.pointerListenerDocument=void 0,this.pointerListener=void 0}reconnectOpenPopup(){!this.isConnected||!this.open||(this.activateListboxOverlay(),this.source&&this.asyncRows.length===0&&this.runSource(this.query))}syncVisibleOptionsCap(){const listbox=this.renderRoot?.querySelector('[part="listbox"]');if(!listbox)return;const clear=()=>{listbox.style.removeProperty("max-block-size")},requested=typeof this.visibleOptions=="number"?finiteCount(this.visibleOptions,0):0;if(requested<=0)return clear();const rows=listbox.querySelectorAll('[part="option"]');if(rows.length<=requested)return clear();const boundary=rows[requested];if(!boundary)return clear();const cap=boundary.getBoundingClientRect().top-listbox.getBoundingClientRect().top;if(!Number.isFinite(cap)||cap<=0)return clear();listbox.style.setProperty("max-block-size",`min(${Math.ceil(cap)}px, var(--lr-positioner-available-block-size, var(--lr-size-18rem)))`)}updated(changed){super.updated(changed),this.syncExternalDescription(),this.syncVisibleOptionsCap(),changed.has("open")&&!this.openVetoed?this.open&&this.isConnected?(this.activateListboxOverlay(),this._isFirstUpdate||this.settleTransition("lr-after-show"),this.refreshQueued?(this.refreshQueued=!1,this.runSource(this.query)):this.source&&this.asyncRows.length===0&&this.runSource(this.query)):this.open?this.teardownListboxOverlay(!1):(this.teardownListboxOverlay(),this._isFirstUpdate||this.settleTransition("lr-after-hide")):changed.has("open")&&this.openVetoed&&(this.restoreFocusOnClose=!0),changed.has("name")&&this.syncFormValue(),changed.has("validators")&&(this.updateValidity(),this.syncValidatorAttributeObserver()),(changed.has("touched")||changed.has("required")||changed.has("value")||changed.has("validators")||changed.has("validityRevision"))&&this.toggleAttribute("data-invalid",this.touched&&!this.internals.validity.valid),changed.has("activeIndex")&&this.renderRoot.querySelector('[part="option"][data-active]')?.scrollIntoView({block:"nearest"})}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(event==="lr-after-show"){for(;this.open&&!this.listboxPositioned;){const readiness=this.positioningReady,positioned=await readiness;if(this.transitionToken!==token)return;if(positioned)break;if(readiness===this.positioningReady)return}if(await this.updateComplete,this.transitionToken!==token)return}if(this.isConnected){const view=this.ownerDocument.defaultView;if(view&&await new Promise(resolve=>view.requestAnimationFrame(()=>resolve())),this.transitionToken!==token)return;const animations=this.renderRoot.querySelector('[part="listbox"]')?.getAnimations({subtree:!0})??[];if(await Promise.all(animations.map(animation=>animation.finished.catch(()=>{}))),this.transitionToken!==token)return}this.emit(event),this.resolveTransitionWaiters(event)}}waitForTransition(event){return new Promise(resolve=>{const waiters=this.transitionWaiters.get(event)??new Set;waiters.add(resolve),this.transitionWaiters.set(event,waiters)})}resolveTransitionWaiters(event){const waiters=this.transitionWaiters.get(event);if(waiters){this.transitionWaiters.delete(event);for(const resolve of waiters)resolve()}}emitValueEvents(){const self=this,data=this.resolveSelectedRowSlots().map(row=>row?.data);self.emit("input",{value:self.value,data}),self.emit("change",{value:self.value,data}),self.emit("lr-change",{value:self.value,data})}assignValue(next){this.value=next}createOption(inputValue){if(this.liveDisabled||this.emit("lr-create",{inputValue},{cancelable:!0}).defaultPrevented)return;const option=this.ownerDocument.createElement(tag("option"));option.setAttribute("value",inputValue),option.textContent=inputValue,this.append(option),this.pickRow({value:inputValue,label:inputValue})}commitCustomValue(inputValue){if(this.liveDisabled||this.multiple||!inputValue)return;const selectionChanged=this._selected[0]!==inputValue;this._selectedLabelCache.set(inputValue,inputValue),this.assignValue(inputValue),this.query="",this.explicitInputValue=!1,this.hide(),selectionChanged&&this.emitValueEvents()}pickRow(row){const sourceOption=this.sourceOptionsByRow.get(row);if(this.liveDisabled||row.disabled||sourceOption&&(sourceOption.disabled||sourceOption.closest("[inert]")))return;if(row.createInput!==void 0){this.createOption(row.createInput);return}const synthetic=row.unknownValue!==void 0,selectionChanged=this.multiple||this._selected[0]!==row.value;if(this.multiple){const set=new Set(this._selected);set.has(row.value)?(set.delete(row.value),this._selectedRowCache.delete(row.value)):(set.add(row.value),synthetic||(this._selectedLabelCache.set(row.value,row.label),this._selectedRowCache.set(row.value,row))),this.assignValue([...set]),this.query="",this.explicitInputValue=!1}else synthetic||(this._selectedLabelCache.set(row.value,row.label),this._selectedRowCache.clear(),this._selectedRowCache.set(row.value,row)),this.setValue(row.value,!0,sourceOption),this.query="",this.explicitInputValue=!1,this.hide();this.source&&this.runSource(this.query),selectionChanged&&this.emitValueEvents(),this.emit("lr-activate",{value:row.value})}removeValue(value){if(this.liveDisabled)return;const next=this._selected.filter(v=>v!==value);next.length!==this._selected.length&&(this.assignValue(next),this.emitValueEvents())}clear(){if(this.liveDisabled)return;const hadSelection=this._selected.length>0,queryChanged=this.query!=="";!hadSelection&&!queryChanged||(hadSelection&&this.assignValue([]),this.query="",this.explicitInputValue=!1,this.source&&this.runSource(this.query),hadSelection&&(this.emitValueEvents(),this.emit("lr-clear")),queryChanged&&this.emit("lr-filter",{value:this.query}))}refresh(){if(this.source){if(!this.open){this.refreshQueued=!0;return}this.refreshQueued=!1,this.runSource(this.query,{immediate:!0})}}runSource(query2,options){const source=this.source;if(!source)return;this.clearSourceTimer(),this.sourceAbort?.abort(),this.sourceAbort=void 0;const token=++this.sourceToken,ownerWindow=this.ownerDocument.defaultView;if(!this.isConnected||!ownerWindow)return;const request={query:query2,token,owner:ownerWindow,source};if(options?.immediate){this.runSourceRequest(request);return}this.sourceDebounce.delayMs=this._sourceDelay,this.sourceDebounce.push(request)}runSourceRequest({query:query2,token,owner:ownerWindow,source}){if(token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)return;const controller=new ownerWindow.AbortController;this.sourceAbort=controller,this.loading=!0,this.sourceFailed=!1,Promise.resolve().then(()=>source(query2,{signal:controller.signal,limit:MAX_SOURCE_ROWS})).then(result=>{if(token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)return;const normalized=normalizeSourceResult(result);this._sourceTotal=normalized.total,this._sourceTruncated=normalized.truncated,this.asyncRows=normalized.rows,this.sourceFailed=!1,this.sourceEverSettled=!0,this.normalizeActiveIndex(),this.applyPendingSelectedRows(!0);const selected=new Set(this._selected);for(const row of normalized.rows)selected.has(row.value)&&this._selectedRowCache.set(row.value,row)}).catch(err=>{token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow||typeof err=="object"&&err!==null&&"name"in err&&err.name==="AbortError"||(this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.activeIndex=-1,this.sourceFailed=!0,this.sourceEverSettled=!0,this.sourceErrorAnnouncementSink?.announce(this.localize("comboboxLoadError")),this.emit("lr-source-error",{error:err,query:query2}),console.warn("<lr-combobox> source() rejected:",err))}).finally(()=>{token===this.sourceToken&&(this.loading=!1)})}clearSourceTimer(){this.sourceDebounce.cancel()}renderRows(rows,activeId){const out=[];let currentGroup,currentGroupRows=[],groupIndex=0;const selectedSet=new Set(this.multiple?this._selected:this._selected.slice(0,1)),flushGroup=()=>{if(currentGroupRows.length){if(currentGroup){const labelId=`${this.listId}-group-${groupIndex++}`;out.push(html`<div role="group" aria-labelledby=${labelId}>
1
+ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{acquireNativeControlDescription}from"../../../internal/native-control-description.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{installFormControlLabelSupport}from"../../../internal/form-control-labels.js";installFormControlLabelSupport();import{loadAnchoredOverlayRuntime}from"../../../internal/anchored-overlay-runtime.js";import{hostAriaLabel,nextId}from"../../../internal/a11y.js";import{chevronIcon,closeIcon}from"../../../internal/icons.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{setCustomState,syncValidityStates}from"../../../internal/custom-states.js";import{submitOnEnter}from"../../../internal/submit-on-enter.js";import{finiteCount,finiteDuration}from"../../../internal/numbers.js";import{DebounceController}from"../../../internal/debounce-controller.js";import{sizes}from"../../../internal/sizes.styles.js";import{styles}from"./combobox.styles.js";import"./option.class.js";import{autocorrectConverter,omittedEmptyStringConverter,optionalLiteralSetConverter,spellcheckConverter}from"../../../internal/converters.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{sanitizeCssColor}from"../../../internal/safe-css.js";import{attachInternalsSafely,getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{installInteractionOnInvalid,installInvalidEventAlias,withStaticValidityCheck}from"../../../internal/invalid-event-alias.js";import{tag}from"../../../internal/prefix.js";import{renderInertPresentation}from"../../../internal/inert-presentation.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{renderDataState}from"../../../internal/data-state-renderer.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{activateNonmodalOverlay}from"../../../internal/nonmodal-overlay-manager.js";import{isOptionSelectedDirty,isOptionSelectedWrite,wasOptionInitiallySelected,RESET_OPTION_SELECTED_FROM_OWNER,SET_OPTION_SELECTED_FROM_OWNER}from"../../../internal/option-selection.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{LYRA_DEFAULT_clear,LYRA_DEFAULT_collapse,LYRA_DEFAULT_comboboxCreate,LYRA_DEFAULT_comboboxLabel,LYRA_DEFAULT_comboboxLoadError,LYRA_DEFAULT_comboboxOverflow,LYRA_DEFAULT_comboboxRequired,LYRA_DEFAULT_comboboxSelectedOverflow,LYRA_DEFAULT_date,LYRA_DEFAULT_details,LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_loading,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_noData,LYRA_DEFAULT_noMatches,LYRA_DEFAULT_notInCatalog,LYRA_DEFAULT_open,LYRA_DEFAULT_popover,LYRA_DEFAULT_progress,LYRA_DEFAULT_removeWithContext,LYRA_DEFAULT_restore,LYRA_DEFAULT_retry,LYRA_DEFAULT_search,LYRA_DEFAULT_select,LYRA_DEFAULT_tableLoadFailed,LYRA_DEFAULT_valueInvalid}from"../../../internal/default-strings.generated.js";function isLyraOptionElement(value){return isHtmlElement(value)&&value.localName===tag("option")}function normalizeSelectionValues(next){return Array.isArray(next)?next.filter(value=>typeof value=="string"):typeof next=="string"?[next]:[]}const POSITIONING_STRATEGY=optionalLiteralSetConverter(["absolute","fixed"]),VALIDITY_FLAG_KEYS=new Set(["badInput","customError","patternMismatch","rangeOverflow","rangeUnderflow","stepMismatch","tooLong","tooShort","typeMismatch","valueMissing"]),comboboxSpellcheckConverter={...spellcheckConverter,fromAttribute:(value,type)=>value===null?void 0:spellcheckConverter.fromAttribute?.(value,type)};function isValidityFlagKey(value){return typeof value=="string"&&VALIDITY_FLAG_KEYS.has(value)}const MAX_SOURCE_ROWS=2e3,MAX_SOURCE_TEXT_UNITS=25e4,MAX_SOURCE_FIELD_UNITS=4096,MAX_RENDER_ROWS=1e3;function normalizeSourceResult(input){let candidateRows,candidateTotal;try{Array.isArray(input)?candidateRows=input:typeof input=="object"&&input!==null&&(candidateRows=input.rows,candidateTotal=input.total)}catch{throw new TypeError("Invalid combobox source result")}if(!Array.isArray(candidateRows))throw new TypeError("Invalid combobox source result");const providerTotal=typeof candidateTotal=="number"&&Number.isFinite(candidateTotal)&&candidateTotal>=0?Math.trunc(candidateTotal):candidateRows.length,rows=[];let textUnits=0;const limit=Math.min(candidateRows.length,MAX_SOURCE_ROWS);for(let index=0;index<limit;index++)try{const value=candidateRows[index]?.value,label=candidateRows[index]?.label;if(typeof value!="string"||typeof label!="string"||value.length>MAX_SOURCE_FIELD_UNITS||label.length>MAX_SOURCE_FIELD_UNITS)continue;const source=candidateRows[index],optionalText=key=>{const candidate=source[key];return typeof candidate=="string"&&candidate.length<=MAX_SOURCE_FIELD_UNITS?candidate:void 0},sub=optionalText("sub"),accessibleLabel=optionalText("accessibleLabel"),dotColor=optionalText("dotColor"),group=optionalText("group"),badgeCandidate=source.badge,badge=typeof badgeCandidate=="string"&&badgeCandidate.length<=MAX_SOURCE_FIELD_UNITS||typeof badgeCandidate=="number"&&Number.isFinite(badgeCandidate)?badgeCandidate:void 0,units=value.length+label.length+(sub?.length??0)+(accessibleLabel?.length??0)+(dotColor?.length??0)+(group?.length??0)+(typeof badge=="string"?badge.length:0);if(textUnits+units>MAX_SOURCE_TEXT_UNITS)break;textUnits+=units,rows.push({value,label,...sub===void 0?{}:{sub},...source.icon===void 0?{}:{icon:source.icon},...source.start===void 0?{}:{start:source.start},...source.end===void 0?{}:{end:source.end},...badge===void 0?{}:{badge},...accessibleLabel===void 0?{}:{accessibleLabel},...source.data===void 0?{}:{data:source.data},...dotColor===void 0?{}:{dotColor},...group===void 0?{}:{group},...typeof source.disabled=="boolean"?{disabled:source.disabled}:{}})}catch{}const total=Math.max(providerTotal,candidateRows.length);return{rows,total,truncated:total>rows.length}}class LyraCombobox extends LyraElement{static{this.defaultStrings={...super.defaultStrings,clear:LYRA_DEFAULT_clear,collapse:LYRA_DEFAULT_collapse,comboboxCreate:LYRA_DEFAULT_comboboxCreate,comboboxLabel:LYRA_DEFAULT_comboboxLabel,comboboxLoadError:LYRA_DEFAULT_comboboxLoadError,comboboxOverflow:LYRA_DEFAULT_comboboxOverflow,comboboxRequired:LYRA_DEFAULT_comboboxRequired,comboboxSelectedOverflow:LYRA_DEFAULT_comboboxSelectedOverflow,date:LYRA_DEFAULT_date,details:LYRA_DEFAULT_details,fieldRequired:LYRA_DEFAULT_fieldRequired,loading:LYRA_DEFAULT_loading,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,noData:LYRA_DEFAULT_noData,noMatches:LYRA_DEFAULT_noMatches,notInCatalog:LYRA_DEFAULT_notInCatalog,open:LYRA_DEFAULT_open,popover:LYRA_DEFAULT_popover,progress:LYRA_DEFAULT_progress,removeWithContext:LYRA_DEFAULT_removeWithContext,restore:LYRA_DEFAULT_restore,retry:LYRA_DEFAULT_retry,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select,tableLoadFailed:LYRA_DEFAULT_tableLoadFailed,valueInvalid:LYRA_DEFAULT_valueInvalid}}static{this.immutableEventDetails=Object.freeze(["lr-change","input","change"])}static{this.identityEventDetailCollectionItems=Object.freeze({"lr-change":Object.freeze(["data"]),input:Object.freeze(["data"]),change:Object.freeze(["data"])})}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},multiple:{type:Boolean,reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0},required:{type:Boolean,reflect:!0,noAccessor:!0},value:{noAccessor:!0},name:{reflect:!0,noAccessor:!0,converter:omittedEmptyStringConverter},maxOptionsVisible:{type:Number,attribute:"max-options-visible",noAccessor:!0},maxRender:{type:Number,attribute:"max-render",noAccessor:!0},sourceDelay:{type:Number,attribute:"source-delay",noAccessor:!0}}}get open(){return this._open}set open(next){const old=this._open,liveDisabled=this.effectiveDisabled||typeof this.matches=="function"&&this.matches(":disabled");if(this._open=!!next&&!liveDisabled,this._open===old){next&&!this._open&&this.hasAttribute("open")&&this.removeAttribute("open");return}this.requestUpdate("open",old)}get positioningStrategy(){return this._positioningStrategy??"fixed"}set positioningStrategy(next){const normalized=POSITIONING_STRATEGY.normalize(next)??"fixed",old=this.positioningStrategy;this._positioningStrategy=normalized,normalized!==old&&this.requestUpdate("positioningStrategy",old)}get autocorrect(){return this.autocorrectValue}set autocorrect(next){this.autocorrectValue=!!next,this.requestUpdate()}get inputmode(){return this.inputMode}set inputmode(next){this.inputMode=next??""}get enterkeyhint(){return this.enterKeyHint}set enterkeyhint(next){this.enterKeyHint=next??""}get inputValue(){return this.query}set inputValue(next){this.explicitInputValue=!0,this.query=next??"",this.activeIndex=-1,this.source&&this.runSource(this.query),this.requestUpdate()}constructor(){super(),this.placeholder="",this.label="",this.hint="",this.errorText="",this.allowCreate=!1,this.allowCustomValue=!1,this.showUnknownOption=!1,this.appearance="outlined",this.placement="bottom",this.size="m",this.pill=!1,this.clearable=!1,this.withClear=!1,this.withLabel=!1,this.withHint=!1,this.validators=[],this.autocomplete="off",this.inputMode="",this.enterKeyHint="",this.spellcheck=!1,this.autocapitalize="",this.autocorrectValue=!0,this.filter=null,this.source=null,this.query="",this.explicitInputValue=!1,this.activeIndex=-1,this.options=[],this.touched=!1,this.validityRevision=0,this.slotPresence=new SlotPresenceController(this),this.loading=!1,this.sourceFailed=!1,this.sourceEverSettled=!1,this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.sourceDebounce=new DebounceController(0,request=>this.runSourceRequest(request),()=>this.ownerDocument.defaultView),this.sourceToken=0,this.refreshQueued=!1,this._sourceWarmed=!1,this._selectedLabelCache=new Map,this._selectedRowCache=new Map,this._rowsByValue=new Map,this._open=!1,this._fieldsetDisabled=!1,this.listId=nextId("combobox-list"),this.inputId=nextId("combobox-input"),this.listboxPositioned=!1,this.positioningGeneration=0,this.positioningReady=Promise.resolve(!1),this.restoreFocusOnClose=!0,this.restoringOverlayFocus=!1,this._isFirstUpdate=!0,this.openVetoed=!1,this.closeCleanupPending=!1,this.transitionToken=0,this.transitionWaiters=new Map,this._selected=[],this.sourceOptionsByRow=new WeakMap,this._valueDirty=!1,this._multiple=!1,this._disabled=!1,this._required=!1,this._defaultSelected=[],this._defaultCaptured=!1,this._restoredStateActive=!1,this._name="",this._maxOptionsVisible=3,this._maxRender=200,this._sourceDelay=200,this.localDescriptionIds="",this.markInteracted=()=>{this.touched||(this.touched=!0,this.updateValidity(),this.syncCustomStates())},this.collectOptions=e=>{this.collectOptionsFromSlot(e.target)},this.onOptionChange=e=>{e.stopPropagation();const option=e.composedPath().find(isLyraOptionElement);if(isLyraOptionElement(option)&&this.options.includes(option)&&isOptionSelectedWrite(e)){if(this.multiple){const next=option.selected?this._selected.includes(option.value)?this._selected:[...this._selected,option.value]:this._selected.filter(value=>value!==option.value);this.assignValue(next)}else{if(this._valueDirty=!0,this._restoredStateActive=!1,!option.selected&&this.singleSelectedOption!==option)return;this.setValue(option.selected?option.value:[],!0,option.selected?option:void 0)}return}isLyraOptionElement(option)&&this.adornmentClones.get(option)?.markup!==this.adornmentMarkup(option)&&this.adornmentClones.delete(option),queueMicrotask(()=>{this.refreshOptionDefaults(),this.reflectSelected(),this.options=[...this.options],this.normalizeActiveIndex()})},this.adornmentClones=new WeakMap,this.onDocPointer=e=>{if(!e.composedPath().includes(this)){if(this.overlayHandle?.isActive()){this.overlayHandle.dismissBackdrop();return}this.restoreFocusOnClose=!1,this.hide()}},this.onInput=e=>{this.liveDisabled||(this.explicitInputValue=!1,this.query=e.target.value,this.activeIndex=-1,this.show(),this.source&&this.runSource(this.query),this.emit("lr-filter",{value:this.query}))},this.onInputBlur=event=>{this.liveDisabled||(this.touched=!0),this.syncCustomStates(),this.restoreFocusOnClose=!1,this.hide(),relayNativeEvent(this,event)},this.onInputFocus=event=>{if(this.liveDisabled){event.stopPropagation();return}this.restoringOverlayFocus||this.show(),relayNativeEvent(this,event)},this.onKeyDown=e=>{if(e.isComposing||e.keyCode===229||this.liveDisabled)return;const navigable=this.renderedRows.rows.filter(r=>!r.disabled);switch(e.key){case"ArrowDown":if(e.preventDefault(),!this.open){this.show();return}this.activeIndex=Math.min(navigable.length-1,this.activeIndex+1);break;case"ArrowUp":if(e.preventDefault(),!this.open){this.show();return}this.activeIndex=Math.max(0,this.activeIndex-1);break;case"Enter":{const activeRow=navigable[this.activeIndex];if(this.open&&this.activeIndex>=0&&activeRow){e.preventDefault(),this.pickRow(activeRow);break}const create=this.createRow;if(this.open&&create){e.preventDefault(),this.createOption(create.createInput);break}if(this.open&&this.allowCustomValue&&!this.multiple&&this.query.trim()){e.preventDefault(),this.commitCustomValue(this.query.trim());break}submitOnEnter(this,e);break}case"Escape":this.open&&(!this.overlayHandle?.isActive()||this.overlayHandle.isTopmost())&&(e.preventDefault(),this.hide());break;case"Home":this.open&&(e.preventDefault(),this.activeIndex=0);break;case"End":this.open&&(e.preventDefault(),this.activeIndex=navigable.length-1);break;case"Backspace":this.multiple&&!this.query&&this._selected.length&&this.removeValue(this._selected[this._selected.length-1]);break}},this.onComboMouseDown=e=>{this.liveDisabled||e.composedPath()[0]!==this.inputEl&&(e.target.closest("button")||(e.preventDefault(),this.inputEl?.focus(),this.show()))},this.onListboxMouseDown=e=>{e.preventDefault()},this.onListboxClick=e=>{const value=e.target.closest('[part="option"]')?.dataset.value;if(value===void 0)return;const row=this._rowsByValue.get(value);row&&this.pickRow(row)},this.internals=attachInternalsSafely(this),this.validityController=new AnchoredValidityController(this,this.internals,()=>this[VALIDITY_ANCHOR]()),installCustomErrorProperty(this,()=>this.validityController.customValidityMessage),installInvalidEventAlias(this,init=>this.emit("lr-invalid",null,init)),installInteractionOnInvalid(this,this.markInteracted)}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}getForm(){return getFormOwner(this.internals)}get labels(){return this.internals.labels}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}get validationTarget(){return this.validationTargetOverride??this.inputEl??void 0}set validationTarget(next){this.validationTargetOverride=next??void 0,this.validityController.refreshAnchor()}resetValidity(){this.validityController.setCustomValidity(""),this.updateValidity()}get input(){return this.inputEl??null}get selectionStart(){return this.inputEl?.selectionStart??null}set selectionStart(value){this.inputEl&&(this.inputEl.selectionStart=value)}get selectionEnd(){return this.inputEl?.selectionEnd??null}set selectionEnd(value){this.inputEl&&(this.inputEl.selectionEnd=value)}get selectionDirection(){return this.inputEl?.selectionDirection}set selectionDirection(value){this.inputEl&&(this.inputEl.selectionDirection=value)}get liveDisabled(){return this.effectiveDisabled||this.matches(":disabled")}focus(options){this.liveDisabled||this.inputEl?.focus(options)}blur(){this.inputEl?.blur()}click(){this.liveDisabled||(this.inputEl?.focus(),this.show())}select(){this.inputEl?.select()}setSelectionRange(start,end,direction){this.inputEl?.setSelectionRange(start,end,direction)}setRangeText(replacement,start,end,selectMode){const input=this.inputEl;input&&(start===void 0||end===void 0?input.setRangeText(replacement):input.setRangeText(replacement,start,end,selectMode),this.explicitInputValue=!0,this.query=input.value,this.activeIndex=-1,this.source&&this.runSource(this.query))}[VALIDITY_ANCHOR](){return this.validationTarget}syncExternalDescription(){if(!this.isConnected)return;const target=this.renderRoot.querySelector('[part="combobox-input"]');target&&(this.externalDescriptionLease?this.externalDescriptionLease.update(target):this.externalDescriptionLease=acquireNativeControlDescription(this,target,()=>this.localDescriptionIds))}releaseExternalDescription(){this.externalDescriptionLease?.release(),this.externalDescriptionLease=void 0}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.syncExternalDescription(),this.syncSourceErrorAnnouncementSink(),this.updateValidity(),this.hasUpdated&&this.syncValidatorAttributeObserver(),this.hasUpdated&&queueMicrotask(()=>{this.open?this.reconnectOpenPopup():this.source&&this._selected.length&&this.asyncRows.length===0&&this.runSource("")})}adoptedCallback(){super.adoptedCallback(),this.releaseExternalDescription(),this.hasUpdated&&this.syncExternalDescription(),this.listboxPositioned=!1,this.invalidateListboxPositioning(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.unbindDocumentPointer(),this.clearSourceTimer(),this.sourceToken+=1,this.sourceAbort?.abort(),this.sourceAbort=void 0,this.releaseSourceErrorAnnouncementSink(),this.syncSourceErrorAnnouncementSink()}syncSourceErrorAnnouncementSink(){this.isConnected&&this.sourceErrorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseSourceErrorAnnouncementSink(),this.sourceErrorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseSourceErrorAnnouncementSink(){this.sourceErrorAnnouncementSink?.release(),this.sourceErrorAnnouncementSink=void 0}willUpdate(changed){super.willUpdate(changed),this._isFirstUpdate=!this.hasUpdated,this.announceOpenTransition(changed),changed.has("open")&&!this.openVetoed&&(this.listboxPositioned=!1),changed.has("open")&&this.openVetoed?this.closeCleanupPending=!1:changed.has("open")&&!this.open&&this.finalizeCloseState(),changed.has("source")&&(this.clearSourceTimer(),this.sourceAbort?.abort(),this.sourceAbort=void 0,this.sourceToken++,this.loading=!1,this.sourceFailed=!1,this.sourceEverSettled=!1,this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.activeIndex=-1,this._sourceWarmed=!1,this.source&&this.open&&this.runSource(this.query)),!this._sourceWarmed&&this.source&&(this._selected.length>0||(this.pendingSelectedRowValues?.length??0)>0)&&this.asyncRows.length===0&&(this._sourceWarmed=!0,this.runSource(""))}firstUpdated(changed){super.firstUpdated(changed);const slot=this.optionsSlot;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>{s.assignedElements({flatten:!0}).some(isLyraOptionElement)&&this.collectOptionsFromSlot(s)})})}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",this._name?this.setAttribute("name",this._name):this.removeAttribute("name"),this.syncFormValue(),this.requestUpdate("name",old)}get multiple(){return this._multiple}set multiple(next){const old=this._multiple;this._multiple=!!next,this.toggleAttribute("multiple",this._multiple),this.reflectSelected(),this.syncFormValue(),this.requestUpdate("multiple",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled;this._disabled=!!next,this.toggleAttribute("disabled",this._disabled),this._disabled&&this.hide(),this.updateValidity(),this.requestUpdate("disabled",old)}get required(){return this._required}set required(next){const old=this._required;this._required=!!next,this.toggleAttribute("required",this._required),this.updateValidity(),this.requestUpdate("required",old)}get value(){return this.multiple?[...this._selected]:this._selected[0]??""}set value(next){this.setValue(next,!0)}setValue(next,dirty,preferred){const old=this._selected;this.singleSelectedOption=preferred,dirty&&(this._restoredStateActive=!1,this._valueDirty=!0),this._selected=normalizeSelectionValues(next);const selected=new Set(this._selected);for(const value of selected){const row=this.effectiveRows.find(candidate=>candidate.value===value)??this.asyncRows.find(candidate=>candidate.value===value);row&&this._selectedRowCache.set(value,row)}for(const value of this._selectedRowCache.keys())selected.has(value)||this._selectedRowCache.delete(value);for(const value of this._selectedLabelCache.keys())selected.has(value)||this._selectedLabelCache.delete(value);this.syncFormValue(),this.reflectSelected(),this.updateValidity(),this.requestUpdate("value",old)}get maxOptionsVisible(){return this._maxOptionsVisible}set maxOptionsVisible(next){const old=this._maxOptionsVisible;this._maxOptionsVisible=finiteCount(next,3),this.requestUpdate("maxOptionsVisible",old)}get maxRender(){return this._maxRender}get sourceDelay(){return this._sourceDelay}set sourceDelay(next){const old=this._sourceDelay;this._sourceDelay=finiteDuration(next,200),this.requestUpdate("sourceDelay",old)}set maxRender(next){const old=this._maxRender;this._maxRender=Math.min(finiteCount(next,200),MAX_RENDER_ROWS),this.requestUpdate("maxRender",old)}get sourceTotal(){return this._sourceTotal}get sourceTruncated(){return this._sourceTruncated}get selectedRows(){return this.resolveSelectedRowSlots().filter(row=>row!=null).map(row=>({...row}))}resolveSelectedRowSlots(){return this._selected.map(value=>this._selectedRowCache.get(value)??this.effectiveRows.find(row=>row.value===value)??this.asyncRows.find(row=>row.value===value))}set selectedRows(next){const values=[],seen=new Set;if(Array.isArray(next))for(const candidate of next){let value;try{value=candidate?.value}catch{continue}typeof value!="string"||seen.has(value)||(seen.add(value),values.push(value))}if(values.length>0&&this.selectionSourceRows.length===0){this.pendingSelectedRowValues=values,this.source&&this.isConnected&&(this._sourceWarmed=!0,this.runSource(""));return}this.pendingSelectedRowValues=void 0,this.applySelectedRowValues(values)}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}validatorResult(){const self=this,current=self.value;for(const validator of Array.isArray(this.validators)?this.validators:[]){let result;try{if(typeof validator=="object"&&validator!==null&&"checkValidity"in validator){const checked=validator.checkValidity(this);if(checked?.isValid===!0)continue;const flags={};for(const key of Array.isArray(checked?.invalidKeys)?checked.invalidKeys:[])isValidityFlagKey(key)&&(flags[key]=!0);Object.values(flags).some(Boolean)||(flags.customError=!0);let message=typeof checked?.message=="string"?checked.message:"";return!message&&typeof validator.message=="string"&&(message=validator.message),!message&&typeof validator.message=="function"&&(message=validator.message(this)),{flags,message:message||this.localize("valueInvalid")}}result=typeof validator=="function"?validator(current,self):validator?.validate(current,self)}catch{return{flags:{customError:!0},message:this.localize("valueInvalid")}}if(!(result===void 0||result===!0)){if(typeof result=="string")return{flags:{customError:!0},message:result};if(result===!1)return{flags:{customError:!0},message:this.localize("valueInvalid")};if(result&&typeof result=="object"&&Object.values(result).some(Boolean))return{flags:result,message:this.localize("valueInvalid")}}}return{}}syncValidatorAttributeObserver(){this.disconnectValidatorAttributeObserver();const owner=this.ownerDocument.defaultView,MutationObserverCtor=owner?.MutationObserver;if(!this.isConnected||!owner||typeof MutationObserverCtor!="function")return;const attributes=new Set;for(const validator of Array.isArray(this.validators)?this.validators:[]){if(typeof validator!="object"||validator===null||!("checkValidity"in validator))continue;let observed;try{observed=validator.observedAttributes}catch{continue}if(Array.isArray(observed))for(const name of observed)typeof name=="string"&&name.length>0&&attributes.add(name)}if(attributes.size===0)return;const binding={},observer=new MutationObserverCtor(()=>{this.validatorAttributeObserver!==binding||!this.isConnected||this.ownerDocument.defaultView!==owner||(this.updateValidity(),this.validityRevision++)});binding.observer=observer,binding.owner=owner;try{observer.observe(this,{attributes:!0,attributeFilter:[...attributes]}),this.validatorAttributeObserver=binding}catch{observer.disconnect()}}disconnectValidatorAttributeObserver(){const binding=this.validatorAttributeObserver;this.validatorAttributeObserver=void 0,binding?.observer.disconnect()}updateValidity(){if(this.barredFromValidation){this.validityController.setValidity({}),this.syncCustomStates();return}const flags={};let message="";this.required&&this._selected.length===0&&(flags.valueMissing=!0,message=this.localize("comboboxRequired"));const configured=this.validatorResult();configured.flags&&Object.assign(flags,configured.flags),configured.message&&(message=configured.message),this.validityController.setValidity(flags,message),this.syncCustomStates()}syncCustomStates(){syncValidityStates(this.internals,{required:this.required,hasInteracted:this.touched,barred:this.barredFromValidation}),setCustomState(this.internals,"blank",this._selected.length===0),setCustomState(this.internals,"disabled",this.effectiveDisabled)}syncFormValue(){const state2=JSON.stringify(this._selected);if(this.multiple){if(!this.name){this.internals.setFormValue(null,state2);return}const fd=new FormData;for(const v of this._selected)fd.append(this.name,v);this.internals.setFormValue(fd,state2)}else this.internals.setFormValue(this._selected[0]??"",state2)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}formResetCallback(){this.touched=!1,this._restoredStateActive=!1,this._valueDirty=!1;const resetValues=this._defaultSelected.length>0?this._defaultSelected:this.options.filter(option=>wasOptionInitiallySelected(option)).map(option=>option.value);this._defaultSelected.length===0&&resetValues.length>0&&(this._defaultSelected=[...resetValues]);const defaults=new Set(resetValues);for(const option of this.options)option[RESET_OPTION_SELECTED_FROM_OWNER](defaults.has(option.value));this.setValue(this.multiple?[...resetValues]:resetValues.slice(0,1),!1),this.query="",this.explicitInputValue=!1}formStateRestoreCallback(state2,reason){let selected=[];if(typeof state2=="string")try{const parsed=JSON.parse(state2);Array.isArray(parsed)&&parsed.every(value=>typeof value=="string")&&(selected=parsed)}catch{}this.assignValue(this.multiple?selected:selected.slice(0,1)),this._restoredStateActive=!0}formDisabledCallback(disabled){this._fieldsetDisabled=disabled,disabled&&this.hide(),this.updateValidity(),this.requestUpdate()}checkValidity(){return this.updateValidity(),withStaticValidityCheck(this,()=>this.internals.checkValidity())}reportValidity(){return this.touched=!0,this.updateValidity(),this.syncCustomStates(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncCustomStates()}disconnectedCallback(){this.releaseExternalDescription(),this.transitionToken++,this.listboxPositioned=!1,this.releaseSourceErrorAnnouncementSink(),this.disconnectValidatorAttributeObserver(),super.disconnectedCallback(),this.invalidateListboxPositioning(),this.clearSourceTimer(),this.sourceToken+=1,this.sourceAbort?.abort(),this.sourceAbort=void 0,this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.unbindDocumentPointer(),this.resolveTransitionWaiters("lr-after-show"),this.resolveTransitionWaiters("lr-after-hide"),this.open=!1}collectOptionsFromSlot(slot){const previous=new Set(this.options);if(this.options=slot.assignedElements({flatten:!0}).filter(isLyraOptionElement),this.adornmentClones=new WeakMap,this.normalizeActiveIndex(),this.applyPendingSelectedRows(),this._defaultCaptured){const newDefaults=this.options.filter(option=>!previous.has(option)&&option.defaultSelected),newLive=this.options.filter(option=>!previous.has(option)&&option.selected&&!option.defaultSelected);this.refreshOptionDefaults();const eligible=[...!this._restoredStateActive&&!this._valueDirty?newDefaults:[],...this._restoredStateActive?[]:newLive];if(eligible.length){const values=eligible.map(option=>option.value),next=this.multiple?[...new Set([...this._selected,...values])]:values[values.length-1];newLive.length>0?this.assignValue(next):this.setValue(next,!1);return}}else{this._defaultCaptured=!0;const allDefaults=this.options.filter(option=>option.defaultSelected).map(option=>option.value),allLive=this.options.filter(option=>option.selected).map(option=>option.value),defaults=this.multiple?allDefaults:allDefaults.slice(0,1),live=this.multiple?allLive:allLive.slice(0,1),initialLive=this.options.filter(option=>wasOptionInitiallySelected(option)).map(option=>option.value),optionDirty=this.options.some(option=>isOptionSelectedDirty(option)),dirtyValues=this.options.filter(option=>isOptionSelectedDirty(option)&&option.selected).map(option=>option.value);this._defaultSelected=[...defaults.length>0?defaults:initialLive.length>0?initialLive:live];const fromDefaults=defaults.length>0,initial=optionDirty?this.multiple?allLive:dirtyValues.slice(-1)[0]?dirtyValues.slice(-1):live:fromDefaults?defaults:live;if(initial.length&&!this._restoredStateActive&&!this._valueDirty){const next=this.multiple?initial:initial[0];fromDefaults&&!optionDirty?this.setValue(next,!1):this.assignValue(next);return}optionDirty&&(this._valueDirty=!0)}this.reflectSelected()}refreshOptionDefaults(){const declared=this.options.filter(option=>option.defaultSelected).map(option=>option.value);this._defaultSelected=this.multiple?declared:declared.slice(0,1),!this._valueDirty&&!this._restoredStateActive&&this.setValue([...this._defaultSelected],!1)}reflectSelected(){const value=this._selected[0];(!this.singleSelectedOption||!this.options.includes(this.singleSelectedOption)||this.singleSelectedOption.value!==value)&&(this.singleSelectedOption=this.options.find(option=>option.value===value));const selected=new Set(this._selected);for(const option of this.options)option[SET_OPTION_SELECTED_FROM_OWNER](this.multiple?selected.has(option.value):option===this.singleSelectedOption)}labelFor(value){const nonBlank=label=>label!==void 0&&label.trim().length>0?label:void 0;if(this.getUnknownLabel&&this.isUnknownValue(value)){const override=nonBlank(this.getUnknownLabel(value));if(override!==void 0)return override}return(!this.source&&!this.multiple&&this.singleSelectedOption?.value===value?nonBlank(this.singleSelectedOption.label):void 0)??nonBlank(this._selectedLabelCache.get(value))??nonBlank(this.options.find(o=>o.value===value)?.label)??nonBlank(this.asyncRows.find(r=>r.value===value)?.label)??(this.source&&!this.sourceEverSettled?this.statusText("loading",this.loadingText):void 0)??value}isUnknownValue(value){return this.source&&!this.sourceEverSettled?!1:!(!this.source&&!this.multiple&&this.singleSelectedOption?.value===value||this._selectedLabelCache.has(value)||this.options.some(option=>option.value===value)||this.asyncRows.some(row=>row.value===value))}adornmentMarkup(option){return Array.from(option.children).filter(child=>["start","end","prefix","suffix"].includes(child.getAttribute("slot")??"")).map(child=>child.outerHTML).join("")}adornmentsFor(option){const cached=this.adornmentClones.get(option);if(cached)return cached;const cloneSlot=selector=>{const nodes=Array.from(option.querySelectorAll(selector));if(nodes.length!==0)return nodes.map(node=>node.cloneNode(!0))},resolved={markup:this.adornmentMarkup(option),start:cloneSlot(':scope > [slot="start"], :scope > [slot="prefix"]'),end:cloneSlot(':scope > [slot="end"], :scope > [slot="suffix"]')};return this.adornmentClones.set(option,resolved),resolved}rowForOption(option){const adornments=this.adornmentsFor(option),row={value:option.value,label:option.label,sub:option.sub||void 0,dotColor:option.dotColor||void 0,group:option.group||void 0,disabled:option.disabled||option.inert||option.closest("[inert]")!==null,data:option.data,...adornments.start===void 0?{}:{start:adornments.start},...adornments.end===void 0?{}:{end:adornments.end}};return this.sourceOptionsByRow.set(row,option),row}get selectionSourceRows(){return this.source?this.asyncRows:this.options.map(option=>this.rowForOption(option))}applySelectedRowValues(values){const rowsByValue=new Map;for(const row of this.selectionSourceRows)rowsByValue.has(row.value)||rowsByValue.set(row.value,row);const rows=values.map(value=>rowsByValue.get(value)).filter(row=>row!==void 0),limited=this.multiple?rows:rows.slice(0,1);this.assignValue(limited.map(row=>row.value));for(const row of limited)this._selectedRowCache.set(row.value,row)}applyPendingSelectedRows(acceptEmptySource=!1){if(this.pendingSelectedRowValues===void 0||!acceptEmptySource&&this.selectionSourceRows.length===0)return!1;const values=this.pendingSelectedRowValues;return this.pendingSelectedRowValues=void 0,this.applySelectedRowValues(values),!0}get effectiveRows(){return this.source?this.asyncRows:this.filtered.map(option=>this.rowForOption(option))}get unknownRows(){if(!this.showUnknownOption)return[];const locale=this.effectiveLocale,query2=this.query.trim().toLocaleLowerCase(locale);return this._selected.filter(value=>this.isUnknownValue(value)).map(value=>({value,label:this.labelFor(value),badge:this.localize("notInCatalog"),unknownValue:value})).filter(row=>!query2||row.label.toLocaleLowerCase(locale).includes(query2)||row.value.toLocaleLowerCase(locale).includes(query2))}get createRow(){if(!this.allowCreate)return;const inputValue=this.query.trim();if(!inputValue)return;const locale=this.effectiveLocale,folded=inputValue.toLocaleLowerCase(locale);if(!(this.source?this.asyncRows:this.options.map(option=>({value:option.value,label:option.label}))).some(row=>row.value.toLocaleLowerCase(locale)===folded||row.label.toLocaleLowerCase(locale)===folded))return{value:inputValue,label:this.localize("comboboxCreate",void 0,{value:inputValue}),createInput:inputValue}}get renderedRows(){const all=this.effectiveRows,create=this.createRow,sourceOverflow=this.source?Math.max(0,this._sourceTotal-all.length):0,unknown=this.unknownRows;if(all.length<=this.maxRender)return{rows:[...all,...unknown,...create?[create]:[]],overflow:sourceOverflow};const originalIndex=new Map(all.map((r,i)=>[r,i])),capped=all.slice(0,this.maxRender),cappedValues=new Set(capped.map(r=>r.value));let appendedOutOfCap=!1;for(const v of this._selected)if(!cappedValues.has(v)){const selectedRow=all.find(r=>r.value===v);selectedRow&&(capped.push(selectedRow),appendedOutOfCap=!0)}return appendedOutOfCap&&capped.sort((a,b)=>originalIndex.get(a)-originalIndex.get(b)),capped.push(...unknown),create&&capped.push(create),{rows:capped,overflow:all.length-capped.length+unknown.length+(create?1:0)+sourceOverflow}}normalizeActiveIndex(){if(this.activeIndex<0)return;const navigableCount=this.renderedRows.rows.filter(row=>!row.disabled).length,next=navigableCount>0?Math.min(this.activeIndex,navigableCount-1):-1;next!==this.activeIndex&&(this.activeIndex=next)}get filtered(){const locale=this.effectiveLocale,q=this.query.trim().toLocaleLowerCase(locale),selectedLabel=this.multiple?"":this.labelFor(this._selected[0]??"")??"",effective=q&&q===selectedLabel.toLocaleLowerCase(locale)?"":q;if(!effective)return this.options;const fn=this.filter??((o,query2)=>o.label.toLocaleLowerCase(locale).includes(query2)||o.searchText.toLocaleLowerCase(locale).includes(query2));return this.options.filter(o=>fn(o,effective))}get displayValue(){return this.multiple||this.open||this.explicitInputValue?this.query:this._selected[0]?this.labelFor(this._selected[0]):""}announceOpenTransition(changed){if(this.openVetoed=!1,!changed.has("open")||this._isFirstUpdate)return;const name=this.open?"lr-show":"lr-hide";if(!this.isConnected){this.emit("lr-hide");return}this.emit(name,null,{cancelable:!0}).defaultPrevented&&(this.openVetoed=!0,this.open=!this.open,this.resolveTransitionWaiters(this.open?"lr-after-hide":"lr-after-show"))}show(){if(this.open||this.liveDisabled)return Promise.resolve();this.resolveTransitionWaiters("lr-after-hide");const settled=this.waitForTransition("lr-after-show");return this.open=!0,settled}hide(){if(!this.open)return Promise.resolve();this.resolveTransitionWaiters("lr-after-show");const settled=this.waitForTransition("lr-after-hide");return this.closeCleanupPending=!0,this.open=!1,settled}finalizeCloseState(){if(this.closeCleanupPending&&(this.closeCleanupPending=!1,this.activeIndex=-1,!this.multiple)){const queryChanged=this.query!=="";this.query="",this.explicitInputValue=!1,queryChanged&&this.source&&(this.asyncRows=[],this.sourceFailed=!1,this._sourceTotal=0,this._sourceTruncated=!1)}}activateListboxOverlay(){this.invalidateListboxPositioning(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.restoreFocusOnClose=!0,this.overlayHandle=activateNonmodalOverlay({host:this,panel:()=>this.renderRoot.querySelector('[part="listbox"]'),onEscape:()=>{this.hide()},onBackdrop:()=>{this.restoreFocusOnClose=!1,this.hide()},restoreFocusTo:this.inputEl??null}),this.bindDocumentPointer();const anchor=this.renderRoot.querySelector('[part="combobox"]'),listbox=this.renderRoot.querySelector('[part="listbox"]');if(anchor&&listbox){const generation=this.positioningGeneration;this.positioningReady=new Promise(resolve=>{this.resolvePositioningReady=resolve}),this.startListboxPositioning(generation,anchor,listbox)}}invalidateListboxPositioning(){this.positioningGeneration++,this.cleanup?.(),this.cleanup=void 0,this.resolvePositioningReady?.(!1),this.resolvePositioningReady=void 0}resolveCurrentPositioning(positioned){const resolve=this.resolvePositioningReady;this.resolvePositioningReady=void 0,resolve?.(positioned)}async startListboxPositioning(generation,anchor,listbox){try{const{place}=await loadAnchoredOverlayRuntime();if(generation!==this.positioningGeneration||!this.open||!this.isConnected||this.renderRoot.querySelector('[part="combobox"]')!==anchor||this.renderRoot.querySelector('[part="listbox"]')!==listbox)return;const cleanup=place(anchor,listbox,{placement:`${this.placement}-start`,strategy:resolveEffectivePositioningStrategy(this,this._positioningStrategy,"fixed"),sync:this.sync,onPlaced:()=>{generation===this.positioningGeneration&&(this.listboxPositioned=!0,this.updateComplete.then(()=>{generation!==this.positioningGeneration||!this.open||this.resolveCurrentPositioning(!0)}))}});generation!==this.positioningGeneration?cleanup():this.cleanup=cleanup}catch{if(generation!==this.positioningGeneration)return;this.resolveCurrentPositioning(!1),this.hide()}}teardownListboxOverlay(restoreFocus=this.restoreFocusOnClose){this.invalidateListboxPositioning(),this.restoringOverlayFocus=restoreFocus;try{this.overlayHandle?.deactivate({restoreFocus})}finally{this.restoringOverlayFocus=!1}this.overlayHandle=void 0,this.unbindDocumentPointer(),this.restoreFocusOnClose=!0}bindDocumentPointer(){if(!this.isConnected)return;const ownerDocument=this.ownerDocument;if(this.pointerListenerDocument===ownerDocument&&this.pointerListener)return;this.unbindDocumentPointer();const listener=event=>{this.pointerListener!==listener||this.pointerListenerDocument!==ownerDocument||!this.isConnected||this.ownerDocument!==ownerDocument||this.onDocPointer(event)};this.pointerListenerDocument=ownerDocument,this.pointerListener=listener,ownerDocument.addEventListener("pointerdown",listener,!0)}unbindDocumentPointer(){this.pointerListenerDocument&&this.pointerListener&&this.pointerListenerDocument.removeEventListener("pointerdown",this.pointerListener,!0),this.pointerListenerDocument=void 0,this.pointerListener=void 0}reconnectOpenPopup(){!this.isConnected||!this.open||(this.activateListboxOverlay(),this.source&&this.asyncRows.length===0&&this.runSource(this.query))}syncVisibleOptionsCap(){const listbox=this.renderRoot?.querySelector('[part="listbox"]');if(!listbox)return;const clear=()=>{listbox.style.removeProperty("max-block-size")},requested=typeof this.visibleOptions=="number"?finiteCount(this.visibleOptions,0):0;if(requested<=0)return clear();const rows=listbox.querySelectorAll('[part="option"]');if(rows.length<=requested)return clear();const boundary=rows[requested];if(!boundary)return clear();const cap=boundary.getBoundingClientRect().top-listbox.getBoundingClientRect().top;if(!Number.isFinite(cap)||cap<=0)return clear();listbox.style.setProperty("max-block-size",`min(${Math.ceil(cap)}px, var(--lr-positioner-available-block-size, var(--lr-size-18rem)))`)}updated(changed){super.updated(changed),this.syncExternalDescription(),this.syncVisibleOptionsCap(),changed.has("open")&&!this.openVetoed?this.open&&this.isConnected?(this.activateListboxOverlay(),this._isFirstUpdate||this.settleTransition("lr-after-show"),this.refreshQueued?(this.refreshQueued=!1,this.runSource(this.query)):this.source&&this.asyncRows.length===0&&this.runSource(this.query)):this.open?this.teardownListboxOverlay(!1):(this.teardownListboxOverlay(),this._isFirstUpdate||this.settleTransition("lr-after-hide")):changed.has("open")&&this.openVetoed&&(this.restoreFocusOnClose=!0),changed.has("name")&&this.syncFormValue(),changed.has("validators")&&(this.updateValidity(),this.syncValidatorAttributeObserver()),(changed.has("touched")||changed.has("required")||changed.has("value")||changed.has("validators")||changed.has("validityRevision"))&&this.toggleAttribute("data-invalid",this.touched&&!this.internals.validity.valid),changed.has("activeIndex")&&this.renderRoot.querySelector('[part="option"][data-active]')?.scrollIntoView({block:"nearest"})}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(event==="lr-after-show"){for(;this.open&&!this.listboxPositioned;){const readiness=this.positioningReady,positioned=await readiness;if(this.transitionToken!==token)return;if(positioned)break;if(readiness===this.positioningReady)return}if(await this.updateComplete,this.transitionToken!==token)return}if(this.isConnected){const view=this.ownerDocument.defaultView;if(view&&await new Promise(resolve=>view.requestAnimationFrame(()=>resolve())),this.transitionToken!==token)return;const animations=this.renderRoot.querySelector('[part="listbox"]')?.getAnimations({subtree:!0})??[];if(await Promise.all(animations.map(animation=>animation.finished.catch(()=>{}))),this.transitionToken!==token)return}this.emit(event),this.resolveTransitionWaiters(event)}}waitForTransition(event){return new Promise(resolve=>{const waiters=this.transitionWaiters.get(event)??new Set;waiters.add(resolve),this.transitionWaiters.set(event,waiters)})}resolveTransitionWaiters(event){const waiters=this.transitionWaiters.get(event);if(waiters){this.transitionWaiters.delete(event);for(const resolve of waiters)resolve()}}emitValueEvents(){const self=this,data=this.resolveSelectedRowSlots().map(row=>row?.data);self.emit("input",{value:self.value,data}),self.emit("change",{value:self.value,data}),self.emit("lr-change",{value:self.value,data})}assignValue(next){this.value=next}createOption(inputValue){if(this.liveDisabled||this.emit("lr-create",{inputValue},{cancelable:!0}).defaultPrevented)return;const option=this.ownerDocument.createElement(tag("option"));option.setAttribute("value",inputValue),option.textContent=inputValue,this.append(option),this.pickRow({value:inputValue,label:inputValue})}commitCustomValue(inputValue){if(this.liveDisabled||this.multiple||!inputValue)return;const selectionChanged=this._selected[0]!==inputValue;this._selectedLabelCache.set(inputValue,inputValue),this.assignValue(inputValue),this.query="",this.explicitInputValue=!1,this.hide(),selectionChanged&&this.emitValueEvents()}pickRow(row){const sourceOption=this.sourceOptionsByRow.get(row);if(this.liveDisabled||row.disabled||sourceOption&&(sourceOption.disabled||sourceOption.closest("[inert]")))return;if(row.createInput!==void 0){this.createOption(row.createInput);return}const synthetic=row.unknownValue!==void 0,selectionChanged=this.multiple||this._selected[0]!==row.value;if(this.multiple){const set=new Set(this._selected);set.has(row.value)?(set.delete(row.value),this._selectedRowCache.delete(row.value)):(set.add(row.value),synthetic||(this._selectedLabelCache.set(row.value,row.label),this._selectedRowCache.set(row.value,row))),this.assignValue([...set]),this.query="",this.explicitInputValue=!1}else synthetic||(this._selectedLabelCache.set(row.value,row.label),this._selectedRowCache.clear(),this._selectedRowCache.set(row.value,row)),this.setValue(row.value,!0,sourceOption),this.query="",this.explicitInputValue=!1,this.hide();this.source&&this.runSource(this.query),selectionChanged&&this.emitValueEvents(),this.emit("lr-activate",{value:row.value})}removeValue(value){if(this.liveDisabled)return;const next=this._selected.filter(v=>v!==value);next.length!==this._selected.length&&(this.assignValue(next),this.emitValueEvents())}clear(){if(this.liveDisabled)return;const hadSelection=this._selected.length>0,queryChanged=this.query!=="";!hadSelection&&!queryChanged||(hadSelection&&this.assignValue([]),this.query="",this.explicitInputValue=!1,this.source&&this.runSource(this.query),hadSelection&&(this.emitValueEvents(),this.emit("lr-clear")),queryChanged&&this.emit("lr-filter",{value:this.query}))}refresh(){if(this.source){if(!this.open){this.refreshQueued=!0;return}this.refreshQueued=!1,this.runSource(this.query,{immediate:!0})}}runSource(query2,options){const source=this.source;if(!source)return;this.clearSourceTimer(),this.sourceAbort?.abort(),this.sourceAbort=void 0;const token=++this.sourceToken,ownerWindow=this.ownerDocument.defaultView;if(!this.isConnected||!ownerWindow)return;const request={query:query2,token,owner:ownerWindow,source};if(options?.immediate){this.runSourceRequest(request);return}this.sourceDebounce.delayMs=this._sourceDelay,this.sourceDebounce.push(request)}runSourceRequest({query:query2,token,owner:ownerWindow,source}){if(token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)return;const controller=new ownerWindow.AbortController;this.sourceAbort=controller,this.loading=!0,this.sourceFailed=!1,Promise.resolve().then(()=>source(query2,{signal:controller.signal,limit:MAX_SOURCE_ROWS})).then(result=>{if(token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)return;const normalized=normalizeSourceResult(result);this._sourceTotal=normalized.total,this._sourceTruncated=normalized.truncated,this.asyncRows=normalized.rows,this.sourceFailed=!1,this.sourceEverSettled=!0,this.normalizeActiveIndex(),this.applyPendingSelectedRows(!0);const selected=new Set(this._selected);for(const row of normalized.rows)selected.has(row.value)&&this._selectedRowCache.set(row.value,row)}).catch(err=>{token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow||typeof err=="object"&&err!==null&&"name"in err&&err.name==="AbortError"||(this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.activeIndex=-1,this.sourceFailed=!0,this.sourceEverSettled=!0,this.sourceErrorAnnouncementSink?.announce(this.localize("comboboxLoadError")),this.emit("lr-source-error",{error:err,query:query2}),console.warn("<lr-combobox> source() rejected:",err))}).finally(()=>{token===this.sourceToken&&(this.loading=!1)})}clearSourceTimer(){this.sourceDebounce.cancel()}renderRows(rows,activeId){const out=[];let currentGroup,currentGroupRows=[],groupIndex=0;const selectedSet=new Set(this.multiple?this._selected:this._selected.slice(0,1)),flushGroup=()=>{if(currentGroupRows.length){if(currentGroup){const labelId=`${this.listId}-group-${groupIndex++}`;out.push(html`<div role="group" aria-labelledby=${labelId}>
2
2
  <div id=${labelId} part="group-label" class="group-label">${currentGroup}</div>
3
3
  ${currentGroupRows}
4
4
  </div>`)}else out.push(...currentGroupRows);currentGroupRows=[]}};return rows.forEach((o,i)=>{o.group!==currentGroup&&(flushGroup(),currentGroup=o.group);const id=`${this.listId}-opt-${i}`,selected=this.multiple||this.source?selectedSet.has(o.value):this.singleSelectedOption!==void 0&&this.sourceOptionsByRow.get(o)===this.singleSelectedOption;selected&&!this.multiple&&selectedSet.delete(o.value),currentGroupRows.push(html`<div
@@ -138,4 +138,4 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
138
138
  @lr-option-change=${this.onOptionChange}
139
139
  hidden
140
140
  ></slot>
141
- `}}__decorate([property()],LyraCombobox.prototype,"placeholder",void 0),__decorate([property()],LyraCombobox.prototype,"label",void 0),__decorate([property()],LyraCombobox.prototype,"hint",void 0),__decorate([property({attribute:"error-text"})],LyraCombobox.prototype,"errorText",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCombobox.prototype,"open",null),__decorate([property({type:Boolean,attribute:"allow-create"})],LyraCombobox.prototype,"allowCreate",void 0),__decorate([property({type:Boolean,attribute:"allow-custom-value"})],LyraCombobox.prototype,"allowCustomValue",void 0),__decorate([property({type:Boolean,attribute:"show-unknown-option",reflect:!0})],LyraCombobox.prototype,"showUnknownOption",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"getUnknownLabel",void 0),__decorate([property({reflect:!0})],LyraCombobox.prototype,"appearance",void 0),__decorate([property({reflect:!0})],LyraCombobox.prototype,"placement",void 0),__decorate([property({attribute:"positioning-strategy",reflect:!0,converter:POSITIONING_STRATEGY})],LyraCombobox.prototype,"positioningStrategy",null),__decorate([property({reflect:!0})],LyraCombobox.prototype,"size",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCombobox.prototype,"pill",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCombobox.prototype,"clearable",void 0),__decorate([property({type:Boolean,attribute:"with-clear"})],LyraCombobox.prototype,"withClear",void 0),__decorate([property({type:Boolean,attribute:"with-label"})],LyraCombobox.prototype,"withLabel",void 0),__decorate([property({type:Boolean,attribute:"with-hint"})],LyraCombobox.prototype,"withHint",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"getTag",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"validators",void 0),__decorate([property()],LyraCombobox.prototype,"autocomplete",void 0),__decorate([property({attribute:"inputmode"})],LyraCombobox.prototype,"inputMode",void 0),__decorate([property({attribute:"enterkeyhint"})],LyraCombobox.prototype,"enterKeyHint",void 0),__decorate([property({converter:comboboxSpellcheckConverter,useDefault:!0})],LyraCombobox.prototype,"spellcheck",void 0),__decorate([property()],LyraCombobox.prototype,"autocapitalize",void 0),__decorate([property({attribute:"empty-text"})],LyraCombobox.prototype,"emptyText",void 0),__decorate([property({attribute:"loading-text"})],LyraCombobox.prototype,"loadingText",void 0),__decorate([property({attribute:"overflow-text"})],LyraCombobox.prototype,"overflowText",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"filter",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"source",void 0),__decorate([property({converter:autocorrectConverter})],LyraCombobox.prototype,"autocorrect",null),__decorate([state()],LyraCombobox.prototype,"query",void 0),__decorate([state()],LyraCombobox.prototype,"activeIndex",void 0),__decorate([state()],LyraCombobox.prototype,"options",void 0),__decorate([state()],LyraCombobox.prototype,"touched",void 0),__decorate([state()],LyraCombobox.prototype,"validityRevision",void 0),__decorate([state()],LyraCombobox.prototype,"loading",void 0),__decorate([state()],LyraCombobox.prototype,"sourceFailed",void 0),__decorate([state()],LyraCombobox.prototype,"sourceEverSettled",void 0),__decorate([state()],LyraCombobox.prototype,"asyncRows",void 0),__decorate([query('[part="combobox-input"]')],LyraCombobox.prototype,"inputEl",void 0),__decorate([query("slot:not([name])")],LyraCombobox.prototype,"optionsSlot",void 0),__decorate([state()],LyraCombobox.prototype,"listboxPositioned",void 0),__decorate([property({type:Number,attribute:"visible-options"})],LyraCombobox.prototype,"visibleOptions",void 0);export{LyraCombobox};
141
+ `}}__decorate([property()],LyraCombobox.prototype,"placeholder",void 0),__decorate([property()],LyraCombobox.prototype,"label",void 0),__decorate([property()],LyraCombobox.prototype,"hint",void 0),__decorate([property({attribute:"error-text"})],LyraCombobox.prototype,"errorText",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCombobox.prototype,"open",null),__decorate([property({type:Boolean,attribute:"allow-create"})],LyraCombobox.prototype,"allowCreate",void 0),__decorate([property({type:Boolean,attribute:"allow-custom-value"})],LyraCombobox.prototype,"allowCustomValue",void 0),__decorate([property({type:Boolean,attribute:"show-unknown-option",reflect:!0})],LyraCombobox.prototype,"showUnknownOption",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"getUnknownLabel",void 0),__decorate([property({reflect:!0})],LyraCombobox.prototype,"appearance",void 0),__decorate([property({reflect:!0})],LyraCombobox.prototype,"placement",void 0),__decorate([property({reflect:!0})],LyraCombobox.prototype,"sync",void 0),__decorate([property({attribute:"positioning-strategy",reflect:!0,converter:POSITIONING_STRATEGY})],LyraCombobox.prototype,"positioningStrategy",null),__decorate([property({reflect:!0})],LyraCombobox.prototype,"size",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCombobox.prototype,"pill",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCombobox.prototype,"clearable",void 0),__decorate([property({type:Boolean,attribute:"with-clear"})],LyraCombobox.prototype,"withClear",void 0),__decorate([property({type:Boolean,attribute:"with-label"})],LyraCombobox.prototype,"withLabel",void 0),__decorate([property({type:Boolean,attribute:"with-hint"})],LyraCombobox.prototype,"withHint",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"getTag",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"validators",void 0),__decorate([property()],LyraCombobox.prototype,"autocomplete",void 0),__decorate([property({attribute:"inputmode"})],LyraCombobox.prototype,"inputMode",void 0),__decorate([property({attribute:"enterkeyhint"})],LyraCombobox.prototype,"enterKeyHint",void 0),__decorate([property({converter:comboboxSpellcheckConverter,useDefault:!0})],LyraCombobox.prototype,"spellcheck",void 0),__decorate([property()],LyraCombobox.prototype,"autocapitalize",void 0),__decorate([property({attribute:"empty-text"})],LyraCombobox.prototype,"emptyText",void 0),__decorate([property({attribute:"loading-text"})],LyraCombobox.prototype,"loadingText",void 0),__decorate([property({attribute:"overflow-text"})],LyraCombobox.prototype,"overflowText",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"filter",void 0),__decorate([property({attribute:!1})],LyraCombobox.prototype,"source",void 0),__decorate([property({converter:autocorrectConverter})],LyraCombobox.prototype,"autocorrect",null),__decorate([state()],LyraCombobox.prototype,"query",void 0),__decorate([state()],LyraCombobox.prototype,"activeIndex",void 0),__decorate([state()],LyraCombobox.prototype,"options",void 0),__decorate([state()],LyraCombobox.prototype,"touched",void 0),__decorate([state()],LyraCombobox.prototype,"validityRevision",void 0),__decorate([state()],LyraCombobox.prototype,"loading",void 0),__decorate([state()],LyraCombobox.prototype,"sourceFailed",void 0),__decorate([state()],LyraCombobox.prototype,"sourceEverSettled",void 0),__decorate([state()],LyraCombobox.prototype,"asyncRows",void 0),__decorate([query('[part="combobox-input"]')],LyraCombobox.prototype,"inputEl",void 0),__decorate([query("slot:not([name])")],LyraCombobox.prototype,"optionsSlot",void 0),__decorate([state()],LyraCombobox.prototype,"listboxPositioned",void 0),__decorate([property({type:Number,attribute:"visible-options"})],LyraCombobox.prototype,"visibleOptions",void 0);export{LyraCombobox};
@@ -1 +1 @@
1
- import{css}from"lit";import{formControlFocusHalo,formControlRequiredMarker}from"../../../internal/form-control.styles.js";import{overlaySurface}from"../../../internal/overlay-surface.styles.js";import{dataStateRetryStyles}from"../../../internal/data-state-renderer.styles.js";const styles=css` :host { display: block; --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-s); --_lr-combobox-trigger-min-height: var(--lr-form-control-height); --_lr-combobox-font-size: var(--lr-form-control-font-size); --_lr-combobox-tag-padding: var(--lr-size-0-1rem) var(--lr-size-0-4rem); --_lr-combobox-tag-font-size: var(--lr-font-size-sm); --_lr-combobox-expand-size: var(--lr-size-1-75rem); --_lr-combobox-gap: var(--lr-space-xs); --_lr-combobox-radius: var(--lr-form-control-radius); --_lr-combobox-fill: var(--lr-color-surface); --_lr-combobox-border-color: var(--lr-color-border); --_lr-form-control-focus-shadow: var(--lr-form-control-focus-shadow, none); } :host([pill]) { --_lr-combobox-radius: var(--lr-radius-pill); } :host([appearance="filled"]) { --_lr-combobox-fill: var(--lr-color-surface-raised); --_lr-combobox-border-color: transparent; } :host([appearance="filled-outlined"]) { --_lr-combobox-fill: var(--lr-color-surface-raised); } :host([size="2xs"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-2xs); --_lr-combobox-tag-padding: 0 var(--lr-size-0-25rem); --_lr-combobox-tag-font-size: var(--lr-font-size-2xs); --_lr-combobox-expand-size: var(--lr-size-1rem); } :host([size="xs"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-xs); --_lr-combobox-tag-padding: 0 var(--lr-size-0-25rem); --_lr-combobox-tag-font-size: var(--lr-font-size-2xs); --_lr-combobox-expand-size: var(--lr-size-1rem); } :host([size="s"]), :host([size="small"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-xs); --_lr-combobox-tag-padding: var(--lr-size-0-05rem) var(--lr-size-0-3125rem); --_lr-combobox-tag-font-size: var(--lr-font-size-xs); --_lr-combobox-expand-size: var(--lr-size-1-25rem); } :host([size="l"]), :host([size="large"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-m); --_lr-combobox-tag-padding: var(--lr-size-0-15rem) var(--lr-size-0-5rem); --_lr-combobox-tag-font-size: var(--lr-font-size-md-sm); } :host([size="xl"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-l); --_lr-combobox-tag-padding: var(--lr-size-0-25rem) var(--lr-size-0-625rem); --_lr-combobox-tag-font-size: var(--lr-font-size-m); } [part="form-control-label"] { display: block; margin-block-end: var(--lr-space-xs); font-size: var(--lr-font-size-md-sm); font-weight: var(--lr-font-weight-semibold); } [part="form-control-label"][hidden] { display: none; } ${formControlRequiredMarker} [part='combobox'] { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lr-combobox-gap, var(--_lr-combobox-gap)); inline-size: 100%; min-block-size: var( --lr-combobox-trigger-height, var( --lr-combobox-trigger-min-height, var(--_lr-combobox-trigger-min-height) ) ); box-sizing: border-box; block-size: var(--lr-combobox-trigger-height, auto); padding: var( --lr-combobox-trigger-padding, var(--_lr-combobox-trigger-padding) ); border: var(--lr-border-width-thin) solid var(--lr-combobox-border-color, var(--_lr-combobox-border-color)); border-radius: var(--lr-combobox-radius, var(--_lr-combobox-radius)); background: var(--lr-combobox-fill, var(--_lr-combobox-fill)); font-size: var(--lr-combobox-font-size, var(--_lr-combobox-font-size)); cursor: text; } [part="combobox"]:focus-within { border-color: var(--lr-combobox-open-border-color, var(--lr-color-brand)); outline: var(--lr-border-width-medium) solid transparent; ${formControlFocusHalo} } :host(:disabled) [part="combobox"] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="start"], [part="end"] { flex: 0 0 auto; display: inline-flex; align-items: center; color: var(--lr-color-text-quiet); } .control-contents { display: contents; } [part="start"][hidden], [part="end"][hidden] { display: none; } [part="tags"] { display: contents; } [part="tag"] { display: inline-flex; min-inline-size: 0; max-inline-size: min(100%, var(--tag-max-size, var(--lr-size-5rem))); align-items: center; gap: var(--lr-space-xs); padding: var(--lr-combobox-tag-padding, var(--_lr-combobox-tag-padding)); font-size: var( --lr-combobox-tag-font-size, var(--_lr-combobox-tag-font-size) ); background: var(--lr-color-brand-quiet); color: var(--lr-color-text); border-radius: var(--lr-radius); } [part="tag-label"] { min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part="combobox-input"][data-unknown-value] { font-style: italic; } [part="tag"][data-unknown-value] [part="tag__content"] { font-style: italic; } [part="tag"][data-unknown-value] { border: var(--lr-border-width-thin) var(--lr-combobox-unknown-value-border-style, dashed) var(--lr-combobox-unknown-value-border-color, var(--lr-color-border)); } [part~="option"][data-unknown-value] [part="option-label"] { font-style: italic; } [part~="option"][data-unknown-value] { border: var(--lr-border-width-thin) var(--lr-combobox-unknown-value-border-style, dashed) var(--lr-combobox-unknown-value-border-color, var(--lr-color-border)); } [part="unknown-value"] { flex: 0 0 auto; margin-inline-start: var(--lr-space-2xs); font-size: var(--lr-size-0-6875rem); font-style: normal; font-weight: var(--lr-font-weight-normal); color: var(--lr-color-text-quiet); white-space: nowrap; } [part~="tag__remove-button"] { display: inline-flex; align-items: center; justify-content: center; min-inline-size: var(--lr-icon-button-size); min-block-size: var(--lr-icon-button-size); margin: calc((var(--lr-icon-button-size) - var(--lr-size-1rem)) / -2); border: none; background: none; cursor: pointer; color: inherit; padding: 0; font: inherit; line-height: var(--lr-line-height-none); font-size: var(--lr-font-size-m); } [part="combobox-input"] { flex: 1 1 var(--lr-size-6ch); min-inline-size: var(--lr-size-4ch); padding-block: 0; border: none; outline: none; background: transparent; color: inherit; font: inherit; } [part="combobox-input"]::placeholder { color: var(--lr-color-text-quiet); } [part="clear-button"], [part="expand-icon"] { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; border: none; background: none; cursor: pointer; color: var(--lr-color-text-quiet); padding: var(--lr-space-xs); line-height: var(--lr-line-height-none); } [part="expand-icon"] { box-sizing: border-box; min-inline-size: min( var(--lr-icon-button-size), var(--lr-combobox-expand-size, var(--_lr-combobox-expand-size)) ); min-block-size: min( var(--lr-icon-button-size), var(--lr-combobox-expand-size, var(--_lr-combobox-expand-size)) ); padding: 0; } [part="clear-button"] { font: inherit; min-inline-size: max(var(--lr-size-24px), min(var(--lr-icon-button-size), var(--lr-form-control-height))); min-block-size: max(var(--lr-size-24px), min(var(--lr-icon-button-size), var(--lr-form-control-height))); line-height: var(--lr-line-height-none); } [part="expand-icon"] svg { transform: rotate(90deg); } [part="clear-button"]:hover { color: var(--lr-color-text); } [part="clear-button"]:active { background: color-mix( in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); border-radius: var(--lr-radius); } [part="tag__remove-button"]:hover { background: color-mix(in srgb, currentColor 16%, transparent); } [part="tag__remove-button"]:active { background: color-mix( in srgb, currentColor var(--lr-color-mix-active), transparent ); } [part="clear-button"]:focus-visible, [part="tag__remove-button"]:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } [part="listbox"] { position: fixed; z-index: var(--lr-overlay-stack-index, var(--lr-layer-dropdown)); box-sizing: border-box; max-block-size: min( var(--lr-size-18rem), var(--lr-positioner-available-block-size, var(--lr-size-18rem)) ); overflow-y: auto; overflow-x: hidden; inline-size: max-content; min-inline-size: min( var(--lr-size-12rem), var(--lr-positioner-available-inline-size, var(--lr-size-12rem)) ); max-inline-size: min( var(--lr-popover-viewport-clamp), var(--lr-size-28rem), var(--lr-positioner-available-inline-size, 100vw) ); padding: var(--lr-space-xs); ${overlaySurface} box-shadow: var(--lr-overlay-shadow-anchored, var(--lr-shadow-m)); visibility: hidden; opacity: 0; transform: translateY(var(--lr-size-neg-0-25rem)); transition: opacity var(--hide-duration, var(--lr-transition-fast)), transform var(--hide-duration, var(--lr-transition-fast)), visibility var(--hide-duration, var(--lr-transition-fast)); } [part="option"], .group-label, .loading, .empty, .source-error { min-inline-size: 0; overflow-wrap: anywhere; } :host([open]) [part="listbox"][data-positioned] { visibility: visible; opacity: 1; transform: translateY(0); transition-duration: var(--show-duration, var(--lr-transition-fast)); } @media (prefers-reduced-motion: reduce) { [part="listbox"] { transition: none !important; } } [part="option"] { display: flex; align-items: center; gap: var(--lr-space-xs); inline-size: 100%; padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid transparent; border-radius: var(--lr-radius); background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; } [part="option"][aria-selected="true"] { background: var(--lr-combobox-option-selected-bg, transparent); border-color: var( --lr-combobox-option-selected-border, var(--lr-color-brand) ); color: var(--lr-combobox-option-selected-color, var(--lr-color-brand)); font-weight: var( --lr-combobox-option-selected-font-weight, var(--lr-font-weight-semibold) ); } [part="option"]:hover, [part="option"][data-active] { background: var( --lr-combobox-option-active-bg, var(--lr-color-brand-quiet) ); } [part="option"]:active { background: color-mix( in oklab, var(--lr-combobox-option-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="option"][aria-disabled="true"] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="option-dot"] { inline-size: var(--lr-size-0-5rem); block-size: var(--lr-size-0-5rem); border-radius: 50%; flex: 0 0 auto; } [part="option-icon"] { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--lr-color-text-quiet); } [part="option-start"], [part="option-end"] { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; max-inline-size: 40%; overflow: hidden; } [part="option-label"] { display: flex; flex-direction: column; flex: 1 1 auto; min-inline-size: 0; } [part="option-sub"] { font-size: var(--lr-font-size-xs); color: var(--lr-color-text-quiet); } [part="option-badge"] { flex: 0 0 auto; padding: 0 var(--lr-space-xs); border-radius: var(--lr-radius-pill); background: var(--lr-combobox-option-badge-bg, var(--lr-color-brand-quiet)); color: var(--lr-color-text); font-size: var(--lr-font-size-xs); } [part="option-overflow"], .loading { padding: var(--lr-space-s) var(--lr-space-m); font-size: var(--lr-font-size-sm); color: var(--lr-color-text-quiet); } .group-label { padding: var(--lr-space-xs) var(--lr-space-s) 0; font-size: var(--lr-size-0-6875rem); font-weight: var(--lr-font-weight-bold); text-transform: uppercase; letter-spacing: var(--lr-size-0-04em); color: var(--lr-color-text-quiet); } .empty { padding: var(--lr-space-m); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-md-sm); } [part="source-error-row"] { padding: var(--lr-space-xs) var(--lr-space-s); } ${dataStateRetryStyles} [part="hint"] { margin-block-start: var(--lr-space-xs); font-size: var(--lr-font-size-sm); color: var(--lr-color-text-quiet); } [part="hint"][hidden] { display: none; } [part="error"] { margin-block-start: var(--lr-space-xs); font-size: var(--lr-font-size-sm); color: var(--lr-color-danger); } [part="error"][hidden] { display: none; } [part="form-control"], [part="form-control-label"], [part="hint"], [part="error"] { min-inline-size: 0; max-inline-size: 100%; overflow-wrap: anywhere; } `;export{styles};
1
+ import{css}from"lit";import{formControlFocusHalo,formControlRequiredMarker}from"../../../internal/form-control.styles.js";import{overlaySurface}from"../../../internal/overlay-surface.styles.js";import{dataStateRetryStyles}from"../../../internal/data-state-renderer.styles.js";const styles=css` :host { display: block; --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-s); --_lr-combobox-trigger-min-height: var(--lr-form-control-height); --_lr-combobox-font-size: var(--lr-form-control-font-size); --_lr-combobox-tag-padding: var(--lr-size-0-1rem) var(--lr-size-0-4rem); --_lr-combobox-tag-font-size: var(--lr-font-size-sm); --_lr-combobox-expand-size: var(--lr-size-1-75rem); --_lr-combobox-gap: var(--lr-space-xs); --_lr-combobox-radius: var(--lr-form-control-radius); --_lr-combobox-fill: var(--lr-color-surface); --_lr-combobox-border-color: var(--lr-color-border); --_lr-form-control-focus-shadow: var(--lr-form-control-focus-shadow, none); } :host([pill]) { --_lr-combobox-radius: var(--lr-radius-pill); } :host([appearance="filled"]) { --_lr-combobox-fill: var(--lr-color-surface-raised); --_lr-combobox-border-color: transparent; } :host([appearance="filled-outlined"]) { --_lr-combobox-fill: var(--lr-color-surface-raised); } :host([size="2xs"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-2xs); --_lr-combobox-tag-padding: 0 var(--lr-size-0-25rem); --_lr-combobox-tag-font-size: var(--lr-font-size-2xs); --_lr-combobox-expand-size: var(--lr-size-1rem); } :host([size="xs"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-xs); --_lr-combobox-tag-padding: 0 var(--lr-size-0-25rem); --_lr-combobox-tag-font-size: var(--lr-font-size-2xs); --_lr-combobox-expand-size: var(--lr-size-1rem); } :host([size="s"]), :host([size="small"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-xs); --_lr-combobox-tag-padding: var(--lr-size-0-05rem) var(--lr-size-0-3125rem); --_lr-combobox-tag-font-size: var(--lr-font-size-xs); --_lr-combobox-expand-size: var(--lr-size-1-25rem); } :host([size="l"]), :host([size="large"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-m); --_lr-combobox-tag-padding: var(--lr-size-0-15rem) var(--lr-size-0-5rem); --_lr-combobox-tag-font-size: var(--lr-font-size-md-sm); } :host([size="xl"]) { --_lr-combobox-trigger-padding: var(--lr-form-control-padding-block) var(--lr-space-l); --_lr-combobox-tag-padding: var(--lr-size-0-25rem) var(--lr-size-0-625rem); --_lr-combobox-tag-font-size: var(--lr-font-size-m); } [part="form-control-label"] { display: block; margin-block-end: var(--lr-space-xs); font-size: var(--lr-font-size-md-sm); font-weight: var(--lr-font-weight-semibold); } [part="form-control-label"][hidden] { display: none; } ${formControlRequiredMarker} [part='combobox'] { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lr-combobox-gap, var(--_lr-combobox-gap)); inline-size: 100%; min-block-size: var( --lr-combobox-trigger-height, var( --lr-combobox-trigger-min-height, var(--_lr-combobox-trigger-min-height) ) ); box-sizing: border-box; block-size: var(--lr-combobox-trigger-height, auto); padding: var( --lr-combobox-trigger-padding, var(--_lr-combobox-trigger-padding) ); border: var(--lr-border-width-thin) solid var(--lr-combobox-border-color, var(--_lr-combobox-border-color)); border-radius: var(--lr-combobox-radius, var(--_lr-combobox-radius)); background: var(--lr-combobox-fill, var(--_lr-combobox-fill)); font-size: var(--lr-combobox-font-size, var(--_lr-combobox-font-size)); cursor: text; } [part="combobox"]:focus-within { border-color: var(--lr-combobox-open-border-color, var(--lr-color-brand)); outline: var(--lr-border-width-medium) solid transparent; ${formControlFocusHalo} } :host(:disabled) [part="combobox"] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="start"], [part="end"] { flex: 0 0 auto; display: inline-flex; align-items: center; color: var(--lr-color-text-quiet); } .control-contents { display: contents; } [part="start"][hidden], [part="end"][hidden] { display: none; } [part="tags"] { display: contents; } [part="tag"] { display: inline-flex; min-inline-size: 0; max-inline-size: min(100%, var(--tag-max-size, var(--lr-size-5rem))); align-items: center; gap: var(--lr-space-xs); padding: var(--lr-combobox-tag-padding, var(--_lr-combobox-tag-padding)); font-size: var( --lr-combobox-tag-font-size, var(--_lr-combobox-tag-font-size) ); background: var(--lr-color-brand-quiet); color: var(--lr-color-text); border-radius: var(--lr-radius); } [part="tag-label"] { min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part="combobox-input"][data-unknown-value] { font-style: italic; } [part="tag"][data-unknown-value] [part="tag__content"] { font-style: italic; } [part="tag"][data-unknown-value] { border: var(--lr-border-width-thin) var(--lr-combobox-unknown-value-border-style, dashed) var(--lr-combobox-unknown-value-border-color, var(--lr-color-border)); } [part~="option"][data-unknown-value] [part="option-label"] { font-style: italic; } [part~="option"][data-unknown-value] { border: var(--lr-border-width-thin) var(--lr-combobox-unknown-value-border-style, dashed) var(--lr-combobox-unknown-value-border-color, var(--lr-color-border)); } [part="unknown-value"] { flex: 0 0 auto; margin-inline-start: var(--lr-space-2xs); font-size: var(--lr-size-0-6875rem); font-style: normal; font-weight: var(--lr-font-weight-normal); color: var(--lr-color-text-quiet); white-space: nowrap; } [part~="tag__remove-button"] { display: inline-flex; align-items: center; justify-content: center; min-inline-size: var(--lr-icon-button-size); min-block-size: var(--lr-icon-button-size); margin: calc((var(--lr-icon-button-size) - var(--lr-size-1rem)) / -2); border: none; background: none; cursor: pointer; color: inherit; padding: 0; font: inherit; line-height: var(--lr-line-height-none); font-size: var(--lr-font-size-m); } [part="combobox-input"] { flex: 1 1 var(--lr-size-6ch); min-inline-size: var(--lr-size-4ch); padding-block: 0; border: none; outline: none; background: transparent; color: inherit; font: inherit; } [part="combobox-input"]::placeholder { color: var(--lr-color-text-quiet); } [part="clear-button"], [part="expand-icon"] { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; border: none; background: none; cursor: pointer; color: var(--lr-color-text-quiet); padding: var(--lr-space-xs); line-height: var(--lr-line-height-none); } [part="expand-icon"] { box-sizing: border-box; min-inline-size: min( var(--lr-icon-button-size), var(--lr-combobox-expand-size, var(--_lr-combobox-expand-size)) ); min-block-size: min( var(--lr-icon-button-size), var(--lr-combobox-expand-size, var(--_lr-combobox-expand-size)) ); padding: 0; } [part="clear-button"] { font: inherit; min-inline-size: max(var(--lr-size-24px), min(var(--lr-icon-button-size), var(--lr-form-control-height))); min-block-size: max(var(--lr-size-24px), min(var(--lr-icon-button-size), var(--lr-form-control-height))); line-height: var(--lr-line-height-none); } [part="expand-icon"] svg { transform: rotate(90deg); } [part="clear-button"]:hover { color: var(--lr-color-text); } [part="clear-button"]:active { background: color-mix( in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); border-radius: var(--lr-radius); } [part="tag__remove-button"]:hover { background: color-mix(in srgb, currentColor 16%, transparent); } [part="tag__remove-button"]:active { background: color-mix( in srgb, currentColor var(--lr-color-mix-active), transparent ); } [part="clear-button"]:focus-visible, [part="tag__remove-button"]:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } [part="listbox"] { position: fixed; z-index: var(--lr-overlay-stack-index, var(--lr-layer-dropdown)); box-sizing: border-box; max-block-size: min( var(--lr-size-18rem), var(--lr-positioner-available-block-size, var(--lr-size-18rem)) ); overflow-y: auto; overflow-x: hidden; inline-size: max-content; padding: var(--lr-space-xs); ${overlaySurface} box-shadow: var(--lr-overlay-shadow-anchored, var(--lr-shadow-m)); visibility: hidden; opacity: 0; transform: translateY(var(--lr-size-neg-0-25rem)); transition: opacity var(--hide-duration, var(--lr-transition-fast)), transform var(--hide-duration, var(--lr-transition-fast)), visibility var(--hide-duration, var(--lr-transition-fast)); } :host(:not([sync="width"]):not([sync="both"])) [part="listbox"] { min-inline-size: min( var(--lr-size-12rem), var(--lr-positioner-available-inline-size, var(--lr-size-12rem)) ); max-inline-size: min( var(--lr-popover-viewport-clamp), var(--lr-size-28rem), var(--lr-positioner-available-inline-size, 100vw) ); } :host([sync="width"]) [part="listbox"], :host([sync="both"]) [part="listbox"] { max-inline-size: var(--lr-positioner-available-inline-size, 100vw); } [part="option"], .group-label, .loading, .empty, .source-error { min-inline-size: 0; overflow-wrap: anywhere; } :host([open]) [part="listbox"][data-positioned] { visibility: visible; opacity: 1; transform: translateY(0); transition-duration: var(--show-duration, var(--lr-transition-fast)); } @media (prefers-reduced-motion: reduce) { [part="listbox"] { transition: none !important; } } [part="option"] { display: flex; align-items: center; gap: var(--lr-space-xs); inline-size: 100%; padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid transparent; border-radius: var(--lr-radius); background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; } [part="option"][aria-selected="true"] { background: var(--lr-combobox-option-selected-bg, transparent); border-color: var( --lr-combobox-option-selected-border, var(--lr-color-brand) ); color: var(--lr-combobox-option-selected-color, var(--lr-color-brand)); font-weight: var( --lr-combobox-option-selected-font-weight, var(--lr-font-weight-semibold) ); } [part="option"]:hover, [part="option"][data-active] { background: var( --lr-combobox-option-active-bg, var(--lr-color-brand-quiet) ); } [part="option"]:active { background: color-mix( in oklab, var(--lr-combobox-option-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="option"][aria-disabled="true"] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="option-dot"] { inline-size: var(--lr-size-0-5rem); block-size: var(--lr-size-0-5rem); border-radius: 50%; flex: 0 0 auto; } [part="option-icon"] { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--lr-color-text-quiet); } [part="option-start"], [part="option-end"] { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; max-inline-size: 40%; overflow: hidden; } [part="option-label"] { display: flex; flex-direction: column; flex: 1 1 auto; min-inline-size: 0; } [part="option-sub"] { font-size: var(--lr-font-size-xs); color: var(--lr-color-text-quiet); } [part="option-badge"] { flex: 0 0 auto; padding: 0 var(--lr-space-xs); border-radius: var(--lr-radius-pill); background: var(--lr-combobox-option-badge-bg, var(--lr-color-brand-quiet)); color: var(--lr-color-text); font-size: var(--lr-font-size-xs); } [part="option-overflow"], .loading { padding: var(--lr-space-s) var(--lr-space-m); font-size: var(--lr-font-size-sm); color: var(--lr-color-text-quiet); } .group-label { padding: var(--lr-space-xs) var(--lr-space-s) 0; font-size: var(--lr-size-0-6875rem); font-weight: var(--lr-font-weight-bold); text-transform: uppercase; letter-spacing: var(--lr-size-0-04em); color: var(--lr-color-text-quiet); } .empty { padding: var(--lr-space-m); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-md-sm); } [part="source-error-row"] { padding: var(--lr-space-xs) var(--lr-space-s); } ${dataStateRetryStyles} [part="hint"] { margin-block-start: var(--lr-space-xs); font-size: var(--lr-font-size-sm); color: var(--lr-color-text-quiet); } [part="hint"][hidden] { display: none; } [part="error"] { margin-block-start: var(--lr-space-xs); font-size: var(--lr-font-size-sm); color: var(--lr-color-danger); } [part="error"][hidden] { display: none; } [part="form-control"], [part="form-control-label"], [part="hint"], [part="error"] { min-inline-size: 0; max-inline-size: 100%; overflow-wrap: anywhere; } `;export{styles};
@@ -64,13 +64,20 @@ import{type PropertyValues,type TemplateResult}from'lit';import{LyraElement}from
64
64
  * accessibility trade-off it is. Scaling the glyph inside that floor is a separate concern and
65
65
  * already has its own inherited input, `--lr-icon-size`.
66
66
  *
67
- * Lowering `--lr-icon-button-size` directly on this element (or `--lr-theme-icon-button-size` on
68
- * an ancestor, which reaches a `<lr-icon-button>` composed inside another component -- see
69
- * `internal/tokens.test.ts`) is safe for a dense action row even below the ordinary 2.5rem/40px
70
- * floor: a coarse-pointer/no-hover media rule in `internal/tokens.styles.ts`'s `baseTokens` floors
71
- * the RENDERED hit area back at 2.75rem/44px regardless of how far that override lowered it, so
72
- * the control is still comfortably tappable the moment the pointer reaching it is a finger rather
73
- * than a mouse.
67
+ * Lowering the size for a dense action row below the ordinary 2.5rem/40px floor is safe ONLY
68
+ * through an ancestor lever -- `--lr-theme-icon-button-size` (application-wide) or
69
+ * `--lr-icon-button-size-scope` (one subtree). The coarse-pointer/no-hover media rule in
70
+ * `internal/tokens.styles.ts`'s `baseTokens` reads both, and floors the RENDERED hit area back at
71
+ * 2.75rem/44px however far the override lowered it, so the control stays comfortably tappable the
72
+ * moment the pointer reaching it is a finger rather than a mouse.
73
+ *
74
+ * Setting `--lr-icon-button-size` DIRECTLY on this element does NOT get that floor, and the
75
+ * reference said for several releases that it did. A declaration on the host comes from the outer
76
+ * tree and outranks the shadow tree's own `:host` rule, so the media rule never wins and the
77
+ * rendered hit area is exactly the value set: `--lr-icon-button-size: 1rem` really does render a
78
+ * 16px target under a coarse pointer. Below 24px that fails WCAG 2.2 SC 2.5.8, so the
79
+ * element-scoped lever is the explicit accessibility trade-off it reads as -- prefer a subtree
80
+ * override when the intent is merely a denser row. See `internal/tokens.test.ts`.
74
81
  *
75
82
  * @customElement lr-icon-button
76
83
  * @event focus - Native focus relayed once from the internal button.
@@ -103,8 +110,10 @@ import{type PropertyValues,type TemplateResult}from'lit';import{LyraElement}from
103
110
  * re-declares `--lr-icon-button-size` from `--lr-theme-icon-button-size` in the shared token
104
111
  * layer, so an ancestor rule that sets `--lr-icon-button-size` directly is reset the moment it
105
112
  * crosses into any intervening `lr-*` component's shadow root and never reaches this element.
106
- * Set it directly on this element instead, or set `--lr-theme-icon-button-size` on an ancestor
107
- * to resize every icon button in the subtree at once.
113
+ * Set it directly on this element, set `--lr-icon-button-size-scope` on any ancestor to resize
114
+ * one subtree, or set `--lr-theme-icon-button-size` to resize every icon button in the
115
+ * application at once. Only the two ancestor levers keep the coarse-pointer hit-area floor;
116
+ * see `llms/shared.md`.
108
117
  * @cssprop [--lr-icon-button-radius=var(--lr-radius)] - Corner radius of the native button.
109
118
  * @cssprop [--lr-icon-button-background=transparent] - Background fill of the native button.
110
119
  * @cssprop [--lr-icon-button-background-hover=color-mix(in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-hover))] -