@aceshooting/lyra-ui 16.0.0 → 17.0.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 (296) hide show
  1. package/CHANGELOG.md +504 -0
  2. package/custom-elements.json +1 -1
  3. package/dist/cli/migration-contract.json +1 -1
  4. package/dist/components/agent-tools/browser-frame/browser-frame.class.d.ts +3 -3
  5. package/dist/components/agent-tools/browser-frame/browser-frame.class.js +2 -2
  6. package/dist/components/agent-tools/compare-panel/compare-panel.class.d.ts +2 -2
  7. package/dist/components/agent-tools/compare-panel/compare-panel.class.js +3 -3
  8. package/dist/components/agent-tools/confirm-bar/confirm-bar.class.d.ts +37 -13
  9. package/dist/components/agent-tools/confirm-bar/confirm-bar.class.js +2 -2
  10. package/dist/components/agent-tools/task-list/task-list.class.js +2 -2
  11. package/dist/components/agent-tools/tool-call-chip/tool-call-chip.class.d.ts +4 -0
  12. package/dist/components/agent-tools/tool-call-chip/tool-call-chip.class.js +2 -2
  13. package/dist/components/agent-tools/tool-param-form/tool-param-form.class.d.ts +3 -3
  14. package/dist/components/agent-tools/tool-param-form/tool-param-form.class.js +1 -1
  15. package/dist/components/charts/chart/chart.class.d.ts +117 -17
  16. package/dist/components/charts/chart/chart.class.js +3 -3
  17. package/dist/components/charts/chart/histogram-bin.d.ts +5 -1
  18. package/dist/components/charts/chart/histogram-bin.js +1 -1
  19. package/dist/components/charts/chart/lite-chart.class.d.ts +9 -0
  20. package/dist/components/conversation/code-block/code-block.styles.js +1 -1
  21. package/dist/components/conversation/message-actions/message-actions.styles.js +1 -1
  22. package/dist/components/conversation/model-select/model-select.class.d.ts +13 -4
  23. package/dist/components/conversation/model-select/model-select.class.js +2 -1
  24. package/dist/components/conversation/model-select/model-select.styles.js +1 -1
  25. package/dist/components/conversation/streaming-text/streaming-text-base.class.d.ts +40 -2
  26. package/dist/components/conversation/streaming-text/streaming-text-base.class.js +2 -2
  27. package/dist/components/conversation/streaming-text/streaming-text-core.class.d.ts +5 -3
  28. package/dist/components/conversation/streaming-text/streaming-text-core.class.js +10 -0
  29. package/dist/components/conversation/streaming-text/streaming-text.class.d.ts +9 -3
  30. package/dist/components/conversation/streaming-text/streaming-text.class.js +10 -0
  31. package/dist/components/conversation/suggestion-chips/suggestion-chips.class.d.ts +30 -2
  32. package/dist/components/conversation/suggestion-chips/suggestion-chips.class.js +4 -3
  33. package/dist/components/conversation/suggestion-chips/suggestion-chips.styles.js +1 -1
  34. package/dist/components/conversation/transcript-feed/transcript-feed.class.js +1 -1
  35. package/dist/components/conversation/usage-badge/usage-badge-overlay-runtime.js +1 -1
  36. package/dist/components/conversation/usage-badge/usage-badge.class.d.ts +4 -0
  37. package/dist/components/conversation/voice-picker/voice-picker.class.d.ts +16 -4
  38. package/dist/components/conversation/voice-picker/voice-picker.class.js +2 -1
  39. package/dist/components/conversation/voice-picker/voice-picker.styles.js +1 -1
  40. package/dist/components/data/context-meter/context-meter.class.d.ts +23 -4
  41. package/dist/components/data/context-meter/context-meter.class.js +10 -7
  42. package/dist/components/data/context-meter/context-meter.styles.js +1 -1
  43. package/dist/components/data/data-grid/data-grid.class.d.ts +5 -2
  44. package/dist/components/data/data-grid/data-grid.class.js +1 -1
  45. package/dist/components/data/flow-canvas/flow-canvas.class.d.ts +32 -5
  46. package/dist/components/data/flow-canvas/flow-canvas.class.js +3 -1
  47. package/dist/components/data/flow-canvas/flow-canvas.styles.js +1 -1
  48. package/dist/components/data/flow-canvas/flow-model.js +1 -1
  49. package/dist/components/data/flow-canvas/flow-types.d.ts +10 -1
  50. package/dist/components/data/gauge/gauge.class.d.ts +15 -2
  51. package/dist/components/data/gauge/gauge.class.js +20 -20
  52. package/dist/components/data/gauge/gauge.styles.js +1 -1
  53. package/dist/components/data/graph-query-builder/graph-query-builder.class.d.ts +14 -5
  54. package/dist/components/data/graph-query-builder/graph-query-builder.class.js +2 -2
  55. package/dist/components/data/sequence-strip/sequence-strip.class.d.ts +28 -2
  56. package/dist/components/data/sequence-strip/sequence-strip.class.js +3 -2
  57. package/dist/components/data/sequence-strip/sequence-strip.styles.js +1 -1
  58. package/dist/components/data/table/table.class.d.ts +155 -30
  59. package/dist/components/data/table/table.class.js +6 -4
  60. package/dist/components/data/table/table.styles.js +1 -1
  61. package/dist/components/data/timeline/timeline-item.class.d.ts +9 -1
  62. package/dist/components/data/timeline/timeline-item.class.js +2 -2
  63. package/dist/components/data/word-cloud/word-cloud.class.js +1 -1
  64. package/dist/components/data/word-cloud/word-cloud.styles.js +1 -1
  65. package/dist/components/forms/button/button.class.d.ts +30 -1
  66. package/dist/components/forms/button/button.class.js +2 -2
  67. package/dist/components/forms/checkbox/checkbox.class.d.ts +8 -6
  68. package/dist/components/forms/checkbox/checkbox.class.js +2 -2
  69. package/dist/components/forms/checkbox-group/checkbox-group.class.d.ts +7 -5
  70. package/dist/components/forms/checkbox-group/checkbox-group.class.js +1 -1
  71. package/dist/components/forms/color-picker/color-picker.class.d.ts +16 -2
  72. package/dist/components/forms/color-picker/color-picker.class.js +2 -2
  73. package/dist/components/forms/color-picker/color-picker.styles.js +1 -1
  74. package/dist/components/forms/combobox/combobox.class.d.ts +43 -8
  75. package/dist/components/forms/combobox/combobox.class.js +2 -2
  76. package/dist/components/forms/date-picker/date-input.class.d.ts +4 -0
  77. package/dist/components/forms/date-picker/date-input.class.js +1 -1
  78. package/dist/components/forms/icon-button/icon-button.class.d.ts +20 -3
  79. package/dist/components/forms/icon-button/icon-button.class.js +1 -1
  80. package/dist/components/forms/icon-button/icon-button.styles.js +1 -1
  81. package/dist/components/forms/input/input.class.d.ts +5 -2
  82. package/dist/components/forms/input/input.class.js +1 -1
  83. package/dist/components/forms/input/time-input.class.d.ts +4 -0
  84. package/dist/components/forms/input/time-input.class.js +1 -1
  85. package/dist/components/forms/locale-picker/locale-picker.class.d.ts +11 -5
  86. package/dist/components/forms/locale-picker/locale-picker.class.js +1 -1
  87. package/dist/components/forms/otp-input/otp-input.class.d.ts +7 -2
  88. package/dist/components/forms/otp-input/otp-input.class.js +2 -2
  89. package/dist/components/forms/radio/radio-button.class.d.ts +2 -1
  90. package/dist/components/forms/radio/radio-group.class.d.ts +9 -4
  91. package/dist/components/forms/radio/radio-group.class.js +1 -1
  92. package/dist/components/forms/radio/radio.class.d.ts +13 -7
  93. package/dist/components/forms/radio/radio.class.js +1 -1
  94. package/dist/components/forms/rubric-form/rubric-form.class.d.ts +16 -6
  95. package/dist/components/forms/rubric-form/rubric-form.class.js +2 -2
  96. package/dist/components/forms/select/select.class.d.ts +19 -8
  97. package/dist/components/forms/select/select.class.js +2 -2
  98. package/dist/components/forms/slider/slider.class.d.ts +4 -2
  99. package/dist/components/forms/slider/slider.class.js +1 -1
  100. package/dist/components/forms/switch/switch.class.d.ts +8 -6
  101. package/dist/components/forms/switch/switch.class.js +1 -1
  102. package/dist/components/forms/textarea/textarea.class.d.ts +5 -3
  103. package/dist/components/forms/textarea/textarea.class.js +1 -1
  104. package/dist/components/forms/time-range/time-range.class.d.ts +12 -7
  105. package/dist/components/forms/time-range/time-range.class.js +1 -1
  106. package/dist/components/forms/time-range/time-range.styles.js +1 -1
  107. package/dist/components/forms/token-input/token-input.class.d.ts +6 -4
  108. package/dist/components/forms/token-input/token-input.class.js +1 -1
  109. package/dist/components/layout/app-rail/app-rail-item.class.d.ts +109 -4
  110. package/dist/components/layout/app-rail/app-rail-item.class.js +34 -29
  111. package/dist/components/layout/app-rail/app-rail-item.styles.js +1 -1
  112. package/dist/components/layout/app-rail/app-rail.class.d.ts +25 -3
  113. package/dist/components/layout/app-rail/app-rail.styles.js +1 -1
  114. package/dist/components/layout/app-rail-group/app-rail-group.class.d.ts +2 -2
  115. package/dist/components/layout/app-rail-group/app-rail-group.class.js +2 -2
  116. package/dist/components/layout/carousel/carousel.class.d.ts +1 -1
  117. package/dist/components/layout/carousel/carousel.class.js +1 -1
  118. package/dist/components/layout/details/accordion.class.d.ts +2 -2
  119. package/dist/components/layout/details/accordion.class.js +2 -2
  120. package/dist/components/layout/filter-bar/filter-bar-register.d.ts +1 -0
  121. package/dist/components/layout/filter-bar/filter-bar-register.js +1 -0
  122. package/dist/components/layout/filter-bar/filter-bar.class.d.ts +85 -10
  123. package/dist/components/layout/filter-bar/filter-bar.class.js +7 -4
  124. package/dist/components/layout/menu/menu-item.class.d.ts +3 -3
  125. package/dist/components/layout/menu/menu-item.class.js +3 -3
  126. package/dist/components/layout/menu/menu.class.d.ts +5 -1
  127. package/dist/components/layout/menu/menu.class.js +2 -2
  128. package/dist/components/layout/reorder-list/reorder-item.styles.js +1 -1
  129. package/dist/components/layout/virtual-list/virtual-list.class.js +1 -1
  130. package/dist/components/media/attachment-trigger/attachment-trigger.styles.js +1 -1
  131. package/dist/components/media/avatar-group/avatar-group.class.d.ts +12 -1
  132. package/dist/components/media/avatar-group/avatar-group.class.js +2 -2
  133. package/dist/components/media/drop-zone/drop-zone.class.d.ts +32 -11
  134. package/dist/components/media/drop-zone/drop-zone.class.js +2 -2
  135. package/dist/components/media/file-input/file-input.class.d.ts +40 -19
  136. package/dist/components/media/file-input/file-input.class.js +2 -2
  137. package/dist/components/overlays/callout/callout.styles.js +1 -1
  138. package/dist/components/overlays/dialog/dialog.styles.js +1 -1
  139. package/dist/components/overlays/overlay/dropdown.class.d.ts +13 -3
  140. package/dist/components/overlays/overlay/dropdown.class.js +2 -2
  141. package/dist/components/overlays/overlay/popover.class.d.ts +12 -3
  142. package/dist/components/overlays/overlay/popover.class.js +2 -2
  143. package/dist/components/overlays/rating/rating.class.d.ts +9 -7
  144. package/dist/components/overlays/rating/rating.class.js +1 -1
  145. package/dist/components/retrieval/citation-badge/citation-badge.class.d.ts +5 -1
  146. package/dist/components/retrieval/citation-badge/citation-badge.class.js +1 -1
  147. package/dist/components/retrieval/embedding-explorer/embedding-explorer.styles.js +1 -1
  148. package/dist/components/retrieval/entity-chip/entity-chip.class.d.ts +5 -1
  149. package/dist/components/retrieval/entity-chip/entity-chip.class.js +1 -1
  150. package/dist/components/retrieval/graph-legend/graph-legend.styles.js +1 -1
  151. package/dist/components/retrieval/retrieval-value-format.js +1 -1
  152. package/dist/components/retrieval/source-list/source-list.styles.js +1 -1
  153. package/dist/components/utility/copy-button/copy-button.class.d.ts +23 -11
  154. package/dist/components/utility/copy-button/copy-button.class.js +2 -2
  155. package/dist/components/utility/copy-button/copy-button.styles.js +1 -1
  156. package/dist/components/utility/diff-view/diff-view.styles.js +1 -1
  157. package/dist/components/utility/export-button/export-button.class.d.ts +4 -0
  158. package/dist/components/utility/export-button/export-button.class.js +1 -1
  159. package/dist/components/utility/json-viewer/json-viewer.styles.js +1 -1
  160. package/dist/components/utility/known-date/known-date.class.js +1 -1
  161. package/dist/components/utility/mention-popover/mention-popover.class.d.ts +38 -3
  162. package/dist/components/utility/mention-popover/mention-popover.class.js +2 -1
  163. package/dist/components/utility/mention-popover/mention-popover.styles.js +1 -1
  164. package/dist/components/utility/poll-status/poll-status.styles.js +1 -1
  165. package/dist/components/utility/tour/tour.class.d.ts +4 -0
  166. package/dist/components/utility/tour/tour.class.js +1 -1
  167. package/dist/components/utility/tour/tour.styles.js +1 -1
  168. package/dist/components/viewers/document-preview/document-preview.class.js +2 -2
  169. package/dist/components/viewers/docx-viewer/docx-viewer.class.js +2 -2
  170. package/dist/components/viewers/ebook-viewer/ebook-viewer.class.js +2 -2
  171. package/dist/components/viewers/highlight-layer/highlight-layer.class.js +2 -2
  172. package/dist/components/viewers/notebook-viewer/notebook-viewer.class.js +2 -2
  173. package/dist/components/viewers/pdf-viewer/pdf-viewer.class.js +2 -2
  174. package/dist/components/viewers/pptx-viewer/pptx-viewer.class.js +2 -2
  175. package/dist/components/viewers/xml-viewer/xml-viewer.class.js +2 -2
  176. package/dist/custom-elements-jsx.d.ts +2 -2
  177. package/dist/events.d.ts +13 -12
  178. package/dist/internal/aggregate-file-limits.d.ts +33 -0
  179. package/dist/internal/aggregate-file-limits.js +1 -0
  180. package/dist/internal/catalog-picker.d.ts +15 -2
  181. package/dist/internal/catalog-picker.js +1 -1
  182. package/dist/internal/debounce-controller.d.ts +14 -0
  183. package/dist/internal/debounce-controller.js +1 -1
  184. package/dist/internal/default-strings.generated.d.ts +1 -1
  185. package/dist/internal/default-strings.generated.js +2 -2
  186. package/dist/internal/focus-navigation.d.ts +45 -0
  187. package/dist/internal/focus-navigation.js +1 -1
  188. package/dist/internal/form-associated.js +1 -1
  189. package/dist/internal/initial-slot-collection.d.ts +30 -0
  190. package/dist/internal/initial-slot-collection.js +1 -0
  191. package/dist/internal/intl-cache.js +1 -1
  192. package/dist/internal/invalid-event-alias.d.ts +46 -0
  193. package/dist/internal/invalid-event-alias.js +1 -1
  194. package/dist/internal/localization-runtime.d.ts +24 -0
  195. package/dist/internal/localization-runtime.js +1 -1
  196. package/dist/internal/localization-types.d.ts +1 -1
  197. package/dist/internal/localization.js +1 -1
  198. package/dist/internal/package-metadata.d.ts +1 -1
  199. package/dist/internal/package-metadata.js +1 -1
  200. package/dist/internal/positioning-strategy.d.ts +3 -1
  201. package/dist/internal/state-part.d.ts +49 -0
  202. package/dist/internal/state-part.js +1 -0
  203. package/dist/internal/variants.styles.js +1 -1
  204. package/dist/lyra.d.ts +1 -1
  205. package/dist/svelte.d.ts +2 -2
  206. package/dist/testing/index.d.ts +1 -1
  207. package/dist/testing/index.js +1 -1
  208. package/dist/testing/lyra-tag-event-map.d.ts +2 -2
  209. package/dist/testing/lyra-tag-event-map.js +1 -1
  210. package/dist/testing/wait-for-mount.d.ts +46 -0
  211. package/dist/testing/wait-for-mount.js +1 -0
  212. package/dist/theme/theme-bootstrap.js +1 -1
  213. package/dist/theme/theme.d.ts +11 -2
  214. package/dist/theme/theme.js +1 -1
  215. package/dist/translations/ar/layout.js +1 -1
  216. package/dist/translations/de/layout.js +1 -1
  217. package/dist/translations/es/layout.js +1 -1
  218. package/dist/translations/fa/layout.js +1 -1
  219. package/dist/translations/fr/layout.js +1 -1
  220. package/dist/translations/he/layout.js +1 -1
  221. package/dist/translations/it/layout.js +1 -1
  222. package/dist/translations/ja/layout.js +1 -1
  223. package/dist/translations/pt-BR/layout.js +1 -1
  224. package/dist/translations/ru/layout.js +1 -1
  225. package/dist/translations/zh-CN/layout.js +1 -1
  226. package/dist/utilities/format.d.ts +17 -0
  227. package/dist/utilities/format.js +1 -1
  228. package/dist/vue.d.ts +2 -2
  229. package/llms/components/lr-app-rail-group.md +87 -10
  230. package/llms/components/lr-app-rail-item.md +88 -11
  231. package/llms/components/lr-app-rail.md +88 -11
  232. package/llms/components/lr-attachment-trigger.md +21 -0
  233. package/llms/components/lr-bar-chart.md +3 -2
  234. package/llms/components/lr-bubble-chart.md +3 -2
  235. package/llms/components/lr-callout.md +10 -0
  236. package/llms/components/lr-chart.md +43 -12
  237. package/llms/components/lr-citation-badge.md +7 -1
  238. package/llms/components/lr-code-block.md +21 -0
  239. package/llms/components/lr-color-picker.md +12 -7
  240. package/llms/components/lr-combobox.md +13 -1
  241. package/llms/components/lr-confirm-bar.md +36 -7
  242. package/llms/components/lr-context-meter.md +17 -4
  243. package/llms/components/lr-date-input.md +7 -1
  244. package/llms/components/lr-date-picker.md +6 -0
  245. package/llms/components/lr-dialog.md +21 -0
  246. package/llms/components/lr-doughnut-chart.md +3 -2
  247. package/llms/components/lr-drawer.md +10 -0
  248. package/llms/components/lr-drop-zone.md +16 -7
  249. package/llms/components/lr-dropdown-item.md +7 -0
  250. package/llms/components/lr-entity-chip.md +7 -1
  251. package/llms/components/lr-export-button.md +7 -1
  252. package/llms/components/lr-file-input.md +21 -10
  253. package/llms/components/lr-filter-bar.md +91 -15
  254. package/llms/components/lr-flow-canvas.md +16 -9
  255. package/llms/components/lr-gauge.md +22 -2
  256. package/llms/components/lr-histogram.md +7 -2
  257. package/llms/components/lr-icon-button.md +15 -7
  258. package/llms/components/lr-input.md +3 -1
  259. package/llms/components/lr-line-chart.md +3 -2
  260. package/llms/components/lr-lite-chart.md +13 -0
  261. package/llms/components/lr-locale-picker.md +7 -1
  262. package/llms/components/lr-mention-popover.md +16 -3
  263. package/llms/components/lr-menu-item.md +7 -0
  264. package/llms/components/lr-menu.md +8 -1
  265. package/llms/components/lr-message-actions.md +10 -0
  266. package/llms/components/lr-model-select.md +8 -3
  267. package/llms/components/lr-native-time-input.md +8 -1
  268. package/llms/components/lr-number-input.md +8 -1
  269. package/llms/components/lr-option.md +12 -0
  270. package/llms/components/lr-otp-input.md +6 -0
  271. package/llms/components/lr-pie-chart.md +3 -2
  272. package/llms/components/lr-polar-area-chart.md +3 -2
  273. package/llms/components/lr-prompt-input.md +2 -2
  274. package/llms/components/lr-radar-chart.md +3 -2
  275. package/llms/components/lr-reorder-item.md +12 -0
  276. package/llms/components/lr-reorder-list.md +12 -0
  277. package/llms/components/lr-scatter-chart.md +3 -2
  278. package/llms/components/lr-sequence-strip.md +10 -4
  279. package/llms/components/lr-streaming-text-core.md +21 -8
  280. package/llms/components/lr-streaming-text.md +34 -4
  281. package/llms/components/lr-suggestion-chips.md +8 -4
  282. package/llms/components/lr-table.md +47 -10
  283. package/llms/components/lr-textarea.md +1 -1
  284. package/llms/components/lr-time-input.md +7 -1
  285. package/llms/components/lr-tool-call-chip.md +7 -1
  286. package/llms/components/lr-tour.md +7 -1
  287. package/llms/components/lr-usage-badge.md +7 -1
  288. package/llms/components/lr-voice-picker.md +7 -3
  289. package/llms/shared.md +169 -16
  290. package/llms/tokens.md +17 -1
  291. package/llms-full.txt +941 -147
  292. package/package.json +16 -2
  293. package/registrations.json +1 -1
  294. package/vscode-css-data.json +1 -1
  295. package/vscode-html-data.json +1 -1
  296. package/web-types.json +1 -1
@@ -1 +1 @@
1
- import{css}from"lit";const styles=css`:host{--_lr-message-actions-button-bg:var(--lr-icon-button-background,transparent);--_lr-message-actions-button-bg-hover:var(--lr-icon-button-background-hover,var(--lr-color-surface-raised));--_lr-message-actions-button-bg-active:var(--lr-icon-button-background-active,color-mix(in oklab, var(--lr-icon-button-background-hover,var(--lr-color-surface-raised)), var(--lr-color-mix-partner) var(--lr-color-mix-active)));--_lr-message-actions-button-color:var(--lr-icon-button-color,var(--lr-color-text-quiet));--_lr-message-actions-button-color-hover:var(--lr-icon-button-color-hover,var(--lr-color-text));--_lr-message-actions-button-color-active:var(--lr-icon-button-color-active,var(--lr-icon-button-color-hover,var(--lr-color-text)));--_lr-message-actions-button-radius:var(--lr-icon-button-radius,var(--lr-radius));max-inline-size:100%;display:inline-flex}:host([reveal-on-interaction]){opacity:0;transition:opacity var(--lr-transition-fast)}:host([reveal-on-interaction][data-revealed]){opacity:1}@media (hover:none){:host([reveal-on-interaction]){opacity:1}}@media (prefers-reduced-motion:reduce){:host([reveal-on-interaction]){transition:none}}[part=base]{align-items:center;gap:var(--lr-space-2xs);flex-wrap:wrap;max-inline-size:100%;display:flex}[part~=regenerate-button],[part~=edit-button]{--lr-icon-button-background:var(--_lr-message-actions-button-bg);--lr-icon-button-background-hover:var(--_lr-message-actions-button-bg-hover);--lr-icon-button-background-active:var(--_lr-message-actions-button-bg-active);--lr-icon-button-color:var(--_lr-message-actions-button-color);--lr-icon-button-color-hover:var(--_lr-message-actions-button-color-hover);--lr-icon-button-color-active:var(--_lr-message-actions-button-color-active);--lr-icon-button-radius:var(--_lr-message-actions-button-radius)}`;export{styles};
1
+ import{css}from"lit";const styles=css`:host{--_lr-message-actions-button-bg:transparent;--_lr-message-actions-button-bg-hover:var(--lr-color-surface-raised);--_lr-message-actions-button-bg-active:color-mix(in oklab, var(--lr-icon-button-background-hover,var(--lr-color-surface-raised)), var(--lr-color-mix-partner) var(--lr-color-mix-active));--_lr-message-actions-button-color:var(--lr-color-text-quiet);--_lr-message-actions-button-color-hover:var(--lr-color-text);--_lr-message-actions-button-color-active:var(--lr-icon-button-color-hover,var(--lr-color-text));--_lr-message-actions-button-radius:var(--lr-radius);max-inline-size:100%;display:inline-flex}:host([reveal-on-interaction]){opacity:0;transition:opacity var(--lr-transition-fast)}:host([reveal-on-interaction][data-revealed]){opacity:1}@media (hover:none){:host([reveal-on-interaction]){opacity:1}}@media (prefers-reduced-motion:reduce){:host([reveal-on-interaction]){transition:none}}[part=base]{align-items:center;gap:var(--lr-space-2xs);flex-wrap:wrap;max-inline-size:100%;display:flex}[part~=regenerate-button],[part~=edit-button]{--_lr-icon-button-background-default:var(--_lr-message-actions-button-bg);--_lr-icon-button-background-hover-default:var(--_lr-message-actions-button-bg-hover);--_lr-icon-button-background-active-default:var(--_lr-message-actions-button-bg-active);--_lr-icon-button-color-default:var(--_lr-message-actions-button-color);--_lr-icon-button-color-hover-default:var(--_lr-message-actions-button-color-hover);--_lr-icon-button-color-active-default:var(--_lr-message-actions-button-color-active);--_lr-icon-button-radius-default:var(--_lr-message-actions-button-radius)}`;export{styles};
@@ -27,6 +27,12 @@ export type LyraModelSelectSelectionDirection=LyraSelectionDirection;export inte
27
27
  * `option-icon` part in either listbox mode. It is presentation only: the row's accessible name
28
28
  * remains its `label`.
29
29
  *
30
+ * A catalog row may also set `disabled`, marking it non-actionable: `aria-disabled="true"`
31
+ * replaces its selected/active affordances, activating it (click or keyboard) commits nothing and
32
+ * changes no state, and arrow-key/Home/End active-descendant navigation steps past it instead of
33
+ * landing on it. Omitted or `false` renders the row exactly as before this field existed.
34
+ *
35
+
30
36
  * Ships the standard label/hint/error form-control chrome: properties, matching named slots, and
31
37
  * the complete `form-control` frame. Each surface is opt-in; left unset, it renders no chrome.
32
38
  * A focused trigger/input follows a rendering-mode replacement. If that new owner is disabled or
@@ -59,7 +65,8 @@ export type LyraModelSelectSelectionDirection=LyraSelectionDirection;export inte
59
65
  * @cssstate invalid - Matches while it does not — from the very first render, before the user has
60
66
  * touched anything.
61
67
  * @cssstate user-valid - `valid`, but only after the user has interacted: a blur of the
62
- * trigger/combobox, or a `reportValidity()` call (which is what a submit attempt runs).
68
+ * trigger/combobox, `reportValidity()`, or a submission attempt. Not after a silent
69
+ * `checkValidity()` alone.
63
70
  * @cssstate user-invalid - `invalid` after that same interaction. Style validation errors with this
64
71
  * rather than `invalid`: a pristine required picker is genuinely invalid, but colouring it red
65
72
  * before the user has done anything is hostile.
@@ -101,6 +108,7 @@ export type LyraModelSelectSelectionDirection=LyraSelectionDirection;export inte
101
108
  * @cssprop [--lr-model-select-option-selected-font-weight=var(--lr-font-weight-semibold)] - Font weight of the selected option row.
102
109
  * @cssprop [--lr-model-select-option-synthetic-border-style=dashed] - Border style of a synthetic stale-value option row.
103
110
  * @cssprop [--lr-model-select-option-synthetic-border-color=var(--lr-color-border)] - Border color of a synthetic stale-value option row.
111
+ * @cssprop [--lr-model-select-option-disabled-opacity=0.5] - Opacity of an option row whose catalog entry sets `disabled`.
104
112
  * @cssprop [--lr-form-control-required-content=' *'] - The required marker appended to
105
113
  * `form-control-label` while `required` is set. Set it to `''` to suppress the marker, or to any
106
114
  * other quoted string (`' (required)'`, a localized word) to replace it.
@@ -220,9 +228,10 @@ private updateValidity;
220
228
  * can move -- {@linkcode updateValidity}, `reportValidity()`, and `updated()` for `touched` --
221
229
  * because this control drives `ElementInternals` directly rather than through the
222
230
  * `FormAssociated` mixin, which does this for the controls that do use it. `touched` is the
223
- * interaction flag: it flips on the trigger's/input's first blur, and on a `reportValidity()`
224
- * call, which is what a submit attempt runs. */
225
- private publishValidityStates;formResetCallback():void;formStateRestoreCallback(state:string|File|FormData|null,_mode?:'restore'|'autocomplete'):void;formDisabledCallback(disabled:boolean):void;checkValidity():boolean;reportValidity():boolean;
231
+ * interaction flag: it flips on the trigger's/input's first blur, and on interactive validation
232
+ * -- `reportValidity()` and a submission attempt alike, via `installInteractionOnInvalid()`. A
233
+ * silent `checkValidity()` alone never counts. */
234
+ private publishValidityStates;formResetCallback():void;formStateRestoreCallback(state:string|File|FormData|null,_mode?:'restore'|'autocomplete'):void;formDisabledCallback(disabled:boolean):void;private markInteracted;checkValidity():boolean;reportValidity():boolean;
226
235
  /**
227
236
  * Sets or clears a consumer-supplied validation error — the standard channel for a server-side
228
237
  * rejection ("that model was retired by the provider") that no client-side constraint can
@@ -1,10 +1,11 @@
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{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{activeElementIn}from"../../../internal/active-element.js";import{applyComposedFocusRepair,captureComposedFocusRepair,isComposedFocusAvailable}from"../../../internal/focus-navigation.js";import{LyraElement}from"../../../internal/lyra-element.js";import{installFormControlLabelSupport}from"../../../internal/form-control-labels.js";installFormControlLabelSupport();import{sizes}from"../../../internal/sizes.styles.js";import{hostAriaLabel,nextId}from"../../../internal/a11y.js";import{syncAriaDescribedByElements}from"../../../internal/aria-reflection.js";import{chevronIcon}from"../../../internal/icons.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{syncValidityStates}from"../../../internal/custom-states.js";import{styles}from"./model-select.styles.js";import{spellcheckFromAttributeConverter as spellcheckConverter}from"../../../internal/converters.js";import{attachInternalsSafely,getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{installInvalidEventAlias}from"../../../internal/invalid-event-alias.js";import{CatalogPickerController}from"../../../internal/catalog-picker.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_model,LYRA_DEFAULT_modelSelectNoModels,LYRA_DEFAULT_modelSelectRequired,LYRA_DEFAULT_noMatches,LYRA_DEFAULT_notInCatalog}from"../../../internal/default-strings.generated.js";class LyraModelSelect extends LyraElement{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,model:LYRA_DEFAULT_model,modelSelectNoModels:LYRA_DEFAULT_modelSelectNoModels,modelSelectRequired:LYRA_DEFAULT_modelSelectRequired,noMatches:LYRA_DEFAULT_noMatches,notInCatalog:LYRA_DEFAULT_notInCatalog}}static{this.ownedCollectionProperties=Object.freeze(["catalog"])}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0},required:{type:Boolean,reflect:!0,noAccessor:!0},value:{attribute:!1,noAccessor:!0},defaultValue:{attribute:"value",reflect:!0,useDefault:!0,noAccessor:!0},name:{reflect:!0,noAccessor:!0}}}get open(){return this.catalogPicker.open}set open(next){this.catalogPicker.setOpen(next)}get activeIndex(){return this.catalogPicker.activeIndex}get query(){return this.catalogPicker.query}constructor(){super(),this.provider="",this.allowCustom=!1,this.readonly=!1,this.label="",this.hint="",this.errorText="",this.placeholder="",this.spellcheck=!0,this.autocapitalize="",this.autoCorrect="",this.autocomplete="off",this.inputMode="",this.enterKeyHint="",this.size="m",this.touched=!1,this.slotPresence=new SlotPresenceController(this),this.listId=nextId("model-select-list"),this.controlId=nextId("model-select-control"),this.hasSyncedDescribedByElements=!1,this._fieldsetDisabled=!1,this._name="",this._disabled=!1,this._required=!1,this.suppressControlBlur=!1,this.catalogPicker=new CatalogPickerController(this,{catalog:()=>this.catalog,allowCustom:()=>this.allowCustom,isReadonly:()=>this.readonly,locale:()=>this.effectiveLocale,searchableFields:entry=>[entry.id,entry.label],emitChange:detail=>this.emit("lr-change",detail),onValueChange:(value,oldValue)=>{this.internals.setFormValue(value),this.updateValidity(),this.requestUpdate("value",oldValue)},onDefaultValueChange:(_value,oldValue)=>this.requestUpdate("defaultValue",oldValue),onStateChange:(state2,oldValue)=>{state2==="open"?this.requestUpdate("open",oldValue):this.requestUpdate()},onControlFocus:event=>this.captureModeFocus(event),onControlBlur:event=>{this.effectiveDisabled||(this.touched=!0),this.retireModeFocusAfterBlur(event)},forwardFreeInputClick:!0}),this.onTriggerClick=()=>{this.effectiveDisabled||(this.open?this.hide():this.show())},this.onTriggerBlur=event=>{this.catalogPicker.handleControlBlur(event)},this.onTriggerFocus=event=>{this.catalogPicker.handleControlFocus(event)},this.onTriggerKeyDown=e=>{this.catalogPicker.handleTriggerKeyDown(e)},this.onComboMouseDown=e=>{this.catalogPicker.handleComboMouseDown(e)},this.onInputFocus=event=>{this.catalogPicker.handleInputFocus(event)},this.onInput=e=>{this.catalogPicker.handleInput(e)},this.onInputBlur=event=>{this.catalogPicker.handleControlBlur(event)},this.onInputKeyDown=e=>{this.catalogPicker.handleInputKeyDown(e)},this.onListboxMouseDown=e=>{this.catalogPicker.handleListboxMouseDown(e)},this.onListboxClick=e=>{this.catalogPicker.handleListboxClick(e)},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)),this.internals.setFormValue("")}click(){this.catalogPicker.click()}focus(options){this.catalogPicker.focus(options)}blur(){this.catalogPicker.blur()}get input(){return this.catalogPicker.input}get selectionStart(){return this.input?.selectionStart??null}set selectionStart(value){this.input&&(this.input.selectionStart=value)}get selectionEnd(){return this.input?.selectionEnd??null}set selectionEnd(value){this.input&&(this.input.selectionEnd=value)}get selectionDirection(){return this.input?.selectionDirection??null}set selectionDirection(value){this.input&&(this.input.selectionDirection=value)}select(){this.catalogPicker.select()}setSelectionRange(start,end,direction){this.catalogPicker.setSelectionRange(start,end,direction)}setRangeText(replacement,start,end,selectMode){this.catalogPicker.setRangeText(replacement,start,end,selectMode)}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}[VALIDITY_ANCHOR](){return this.renderRoot?.querySelector('[part="trigger"], [part="combobox-input"]')??null}connectedCallback(){super.connectedCallback(),this.updateValidity(),this.catalogPicker.connected(this.hasUpdated)}willUpdate(changed){super.willUpdate(changed);let modeChanged=!1;if(this.hasUpdated){const renderedControl=this.renderRoot.querySelector('[part="trigger"], [part="combobox-input"]');modeChanged=renderedControl?.getAttribute("part")==="trigger"!==this.closedMode,this.suppressControlBlur=modeChanged,this.catalogPicker.suppressControlEvents=modeChanged,this.modeFocusRepair=modeChanged&&renderedControl!==null&&activeElementIn(this.shadowRoot)===renderedControl?captureComposedFocusRepair(this,this.modeFocusFallback()??renderedControl)??void 0:modeChanged?this.focusedModeRepair:void 0}this.open&&(changed.has("catalog")||changed.has("value")||changed.has("allowCustom"))&&this.catalogPicker.reconcileRows(void 0,changed.has("value")||changed.has("allowCustom")||modeChanged,!1)}disconnectedCallback(){super.disconnectedCallback(),this.modeFocusRepair=void 0,this.focusedModeRepair=void 0,this.focusReturnTarget=void 0,this.catalogPicker.disconnected()}adoptedCallback(){super.adoptedCallback(),this.modeFocusRepair=void 0,this.focusedModeRepair=void 0,this.focusReturnTarget=void 0,this.catalogPicker.adopted()}get value(){return this.catalogPicker.value}set value(next){this.catalogPicker.value=next}get defaultValue(){return this.catalogPicker.defaultValue}set defaultValue(next){this.catalogPicker.defaultValue=next}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.requestUpdate("name",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 effectiveDisabled(){return this.disabled||this._fieldsetDisabled}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}updateValidity(){this.barredFromValidation?this.validityController.setValidity({}):this.required&&!this.value?this.validityController.setValidity({valueMissing:!0},this.localize("modelSelectRequired")):this.validityController.setValidity({}),this.publishValidityStates()}publishValidityStates(){syncValidityStates(this.internals,{required:this.required,hasInteracted:this.touched,barred:this.barredFromValidation})}formResetCallback(){this.touched=!1,this.catalogPicker.resetValue()}formStateRestoreCallback(state2,_mode){this.catalogPicker.restoreState(state2)}formDisabledCallback(disabled){this._fieldsetDisabled=disabled,disabled&&this.hide(),this.updateValidity(),this.requestUpdate()}checkValidity(){return this.internals.checkValidity()}reportValidity(){return this.touched=!0,this.publishValidityStates(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.publishValidityStates()}get closedMode(){return this.catalogPicker.closedMode}get effectiveEntries(){return this.catalogPicker.effectiveEntries}get filteredEntries(){return this.catalogPicker.filteredEntries}labelFor(id){return this.catalogPicker.labelFor(id)}show(){this.catalogPicker.show()}hide(){this.catalogPicker.hide()}updated(changed){super.updated(changed);const hostDescribedBy=this.getAttribute("aria-describedby");if(hostDescribedBy||this.hasSyncedDescribedByElements){const control=this.renderRoot.querySelector(`#${CSS.escape(this.controlId)}`);this.hasSyncedDescribedByElements=syncAriaDescribedByElements(this,control??void 0,hostDescribedBy)}const reposition=changed.has("open")||this.open&&(changed.has("catalog")||changed.has("allowCustom"));this.catalogPicker.updated(reposition),(changed.has("required")||changed.has("readonly")||changed.has("touched")||changed.has("value"))&&(changed.has("readonly")&&this.updateValidity(),this.toggleAttribute("data-invalid",this.touched&&!this.internals.validity.valid)),this.publishValidityStates(),this.suppressControlBlur=!1,this.catalogPicker.suppressControlEvents=!1;const focusRepair=this.modeFocusRepair;this.modeFocusRepair=void 0,focusRepair&&this.scheduleAfterUpdate(()=>{const replacement=this[VALIDITY_ANCHOR](),target=replacement&&isComposedFocusAvailable(replacement)?replacement:this.modeFocusFallback();applyComposedFocusRepair(focusRepair,target),this.focusedModeRepair===focusRepair&&(this.focusedModeRepair=void 0)},"model-select-mode-focus")}rememberFocusReturn(event){const related=event.relatedTarget;related&&related.nodeType===1&&isComposedFocusAvailable(related)&&(this.focusReturnTarget=related)}captureModeFocus(event){this.rememberFocusReturn(event);const control=event.currentTarget;!control||control.nodeType!==1||(this.focusedModeRepair=captureComposedFocusRepair(this,this.modeFocusFallback()??control)??void 0)}retireModeFocusAfterBlur(event){const destination=event.relatedTarget;if(destination&&destination.nodeType===1){this.focusedModeRepair=void 0;return}queueMicrotask(()=>{!this.suppressControlBlur&&!this.effectiveDisabled&&!this.hasAttribute("inert")&&(this.focusedModeRepair=void 0)})}modeFocusFallback(){if(this.focusReturnTarget&&isComposedFocusAvailable(this.focusReturnTarget))return this.focusReturnTarget;const owner=this.renderRoot.querySelector('[part="form-control"]');return owner&&isComposedFocusAvailable(owner)?owner:null}renderRows(rows,activeId){return rows.map((entry,i)=>{const id=`${this.listId}-opt-${i}`,selected=entry.id===this.value;return html`<div
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{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{activeElementIn}from"../../../internal/active-element.js";import{applyComposedFocusRepair,captureComposedFocusRepair,isComposedFocusAvailable}from"../../../internal/focus-navigation.js";import{LyraElement}from"../../../internal/lyra-element.js";import{installFormControlLabelSupport}from"../../../internal/form-control-labels.js";installFormControlLabelSupport();import{sizes}from"../../../internal/sizes.styles.js";import{hostAriaLabel,nextId}from"../../../internal/a11y.js";import{syncAriaDescribedByElements}from"../../../internal/aria-reflection.js";import{chevronIcon}from"../../../internal/icons.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{syncValidityStates}from"../../../internal/custom-states.js";import{styles}from"./model-select.styles.js";import{spellcheckFromAttributeConverter as spellcheckConverter}from"../../../internal/converters.js";import{attachInternalsSafely,getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{installInteractionOnInvalid,installInvalidEventAlias,withStaticValidityCheck}from"../../../internal/invalid-event-alias.js";import{CatalogPickerController}from"../../../internal/catalog-picker.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_model,LYRA_DEFAULT_modelSelectNoModels,LYRA_DEFAULT_modelSelectRequired,LYRA_DEFAULT_noMatches,LYRA_DEFAULT_notInCatalog}from"../../../internal/default-strings.generated.js";class LyraModelSelect extends LyraElement{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,model:LYRA_DEFAULT_model,modelSelectNoModels:LYRA_DEFAULT_modelSelectNoModels,modelSelectRequired:LYRA_DEFAULT_modelSelectRequired,noMatches:LYRA_DEFAULT_noMatches,notInCatalog:LYRA_DEFAULT_notInCatalog}}static{this.ownedCollectionProperties=Object.freeze(["catalog"])}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0},required:{type:Boolean,reflect:!0,noAccessor:!0},value:{attribute:!1,noAccessor:!0},defaultValue:{attribute:"value",reflect:!0,useDefault:!0,noAccessor:!0},name:{reflect:!0,noAccessor:!0}}}get open(){return this.catalogPicker.open}set open(next){this.catalogPicker.setOpen(next)}get activeIndex(){return this.catalogPicker.activeIndex}get query(){return this.catalogPicker.query}constructor(){super(),this.provider="",this.allowCustom=!1,this.readonly=!1,this.label="",this.hint="",this.errorText="",this.placeholder="",this.spellcheck=!0,this.autocapitalize="",this.autoCorrect="",this.autocomplete="off",this.inputMode="",this.enterKeyHint="",this.size="m",this.touched=!1,this.slotPresence=new SlotPresenceController(this),this.listId=nextId("model-select-list"),this.controlId=nextId("model-select-control"),this.hasSyncedDescribedByElements=!1,this._fieldsetDisabled=!1,this._name="",this._disabled=!1,this._required=!1,this.suppressControlBlur=!1,this.catalogPicker=new CatalogPickerController(this,{catalog:()=>this.catalog,allowCustom:()=>this.allowCustom,isReadonly:()=>this.readonly,locale:()=>this.effectiveLocale,searchableFields:entry=>[entry.id,entry.label],emitChange:detail=>this.emit("lr-change",detail),onValueChange:(value,oldValue)=>{this.internals.setFormValue(value),this.updateValidity(),this.requestUpdate("value",oldValue)},onDefaultValueChange:(_value,oldValue)=>this.requestUpdate("defaultValue",oldValue),onStateChange:(state2,oldValue)=>{state2==="open"?this.requestUpdate("open",oldValue):this.requestUpdate()},onControlFocus:event=>this.captureModeFocus(event),onControlBlur:event=>{this.effectiveDisabled||(this.touched=!0),this.retireModeFocusAfterBlur(event)},forwardFreeInputClick:!0}),this.markInteracted=()=>{this.touched||(this.touched=!0,this.publishValidityStates())},this.onTriggerClick=()=>{this.effectiveDisabled||(this.open?this.hide():this.show())},this.onTriggerBlur=event=>{this.catalogPicker.handleControlBlur(event)},this.onTriggerFocus=event=>{this.catalogPicker.handleControlFocus(event)},this.onTriggerKeyDown=e=>{this.catalogPicker.handleTriggerKeyDown(e)},this.onComboMouseDown=e=>{this.catalogPicker.handleComboMouseDown(e)},this.onInputFocus=event=>{this.catalogPicker.handleInputFocus(event)},this.onInput=e=>{this.catalogPicker.handleInput(e)},this.onInputBlur=event=>{this.catalogPicker.handleControlBlur(event)},this.onInputKeyDown=e=>{this.catalogPicker.handleInputKeyDown(e)},this.onListboxMouseDown=e=>{this.catalogPicker.handleListboxMouseDown(e)},this.onListboxClick=e=>{this.catalogPicker.handleListboxClick(e)},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),this.internals.setFormValue("")}click(){this.catalogPicker.click()}focus(options){this.catalogPicker.focus(options)}blur(){this.catalogPicker.blur()}get input(){return this.catalogPicker.input}get selectionStart(){return this.input?.selectionStart??null}set selectionStart(value){this.input&&(this.input.selectionStart=value)}get selectionEnd(){return this.input?.selectionEnd??null}set selectionEnd(value){this.input&&(this.input.selectionEnd=value)}get selectionDirection(){return this.input?.selectionDirection??null}set selectionDirection(value){this.input&&(this.input.selectionDirection=value)}select(){this.catalogPicker.select()}setSelectionRange(start,end,direction){this.catalogPicker.setSelectionRange(start,end,direction)}setRangeText(replacement,start,end,selectMode){this.catalogPicker.setRangeText(replacement,start,end,selectMode)}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}[VALIDITY_ANCHOR](){return this.renderRoot?.querySelector('[part="trigger"], [part="combobox-input"]')??null}connectedCallback(){super.connectedCallback(),this.updateValidity(),this.catalogPicker.connected(this.hasUpdated)}willUpdate(changed){super.willUpdate(changed);let modeChanged=!1;if(this.hasUpdated){const renderedControl=this.renderRoot.querySelector('[part="trigger"], [part="combobox-input"]');modeChanged=renderedControl?.getAttribute("part")==="trigger"!==this.closedMode,this.suppressControlBlur=modeChanged,this.catalogPicker.suppressControlEvents=modeChanged,this.modeFocusRepair=modeChanged&&renderedControl!==null&&activeElementIn(this.shadowRoot)===renderedControl?captureComposedFocusRepair(this,this.modeFocusFallback()??renderedControl)??void 0:modeChanged?this.focusedModeRepair:void 0}this.open&&(changed.has("catalog")||changed.has("value")||changed.has("allowCustom"))&&this.catalogPicker.reconcileRows(void 0,changed.has("value")||changed.has("allowCustom")||modeChanged,!1)}disconnectedCallback(){super.disconnectedCallback(),this.modeFocusRepair=void 0,this.focusedModeRepair=void 0,this.focusReturnTarget=void 0,this.catalogPicker.disconnected()}adoptedCallback(){super.adoptedCallback(),this.modeFocusRepair=void 0,this.focusedModeRepair=void 0,this.focusReturnTarget=void 0,this.catalogPicker.adopted()}get value(){return this.catalogPicker.value}set value(next){this.catalogPicker.value=next}get defaultValue(){return this.catalogPicker.defaultValue}set defaultValue(next){this.catalogPicker.defaultValue=next}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.requestUpdate("name",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 effectiveDisabled(){return this.disabled||this._fieldsetDisabled}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}updateValidity(){this.barredFromValidation?this.validityController.setValidity({}):this.required&&!this.value?this.validityController.setValidity({valueMissing:!0},this.localize("modelSelectRequired")):this.validityController.setValidity({}),this.publishValidityStates()}publishValidityStates(){syncValidityStates(this.internals,{required:this.required,hasInteracted:this.touched,barred:this.barredFromValidation})}formResetCallback(){this.touched=!1,this.catalogPicker.resetValue()}formStateRestoreCallback(state2,_mode){this.catalogPicker.restoreState(state2)}formDisabledCallback(disabled){this._fieldsetDisabled=disabled,disabled&&this.hide(),this.updateValidity(),this.requestUpdate()}checkValidity(){return withStaticValidityCheck(this,()=>this.internals.checkValidity())}reportValidity(){return this.touched=!0,this.publishValidityStates(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.publishValidityStates()}get closedMode(){return this.catalogPicker.closedMode}get effectiveEntries(){return this.catalogPicker.effectiveEntries}get filteredEntries(){return this.catalogPicker.filteredEntries}labelFor(id){return this.catalogPicker.labelFor(id)}show(){this.catalogPicker.show()}hide(){this.catalogPicker.hide()}updated(changed){super.updated(changed);const hostDescribedBy=this.getAttribute("aria-describedby");if(hostDescribedBy||this.hasSyncedDescribedByElements){const control=this.renderRoot.querySelector(`#${CSS.escape(this.controlId)}`);this.hasSyncedDescribedByElements=syncAriaDescribedByElements(this,control??void 0,hostDescribedBy)}const reposition=changed.has("open")||this.open&&(changed.has("catalog")||changed.has("allowCustom"));this.catalogPicker.updated(reposition),(changed.has("required")||changed.has("readonly")||changed.has("touched")||changed.has("value"))&&(changed.has("readonly")&&this.updateValidity(),this.toggleAttribute("data-invalid",this.touched&&!this.internals.validity.valid)),this.publishValidityStates(),this.suppressControlBlur=!1,this.catalogPicker.suppressControlEvents=!1;const focusRepair=this.modeFocusRepair;this.modeFocusRepair=void 0,focusRepair&&this.scheduleAfterUpdate(()=>{const replacement=this[VALIDITY_ANCHOR](),target=replacement&&isComposedFocusAvailable(replacement)?replacement:this.modeFocusFallback();applyComposedFocusRepair(focusRepair,target),this.focusedModeRepair===focusRepair&&(this.focusedModeRepair=void 0)},"model-select-mode-focus")}rememberFocusReturn(event){const related=event.relatedTarget;related&&related.nodeType===1&&isComposedFocusAvailable(related)&&(this.focusReturnTarget=related)}captureModeFocus(event){this.rememberFocusReturn(event);const control=event.currentTarget;!control||control.nodeType!==1||(this.focusedModeRepair=captureComposedFocusRepair(this,this.modeFocusFallback()??control)??void 0)}retireModeFocusAfterBlur(event){const destination=event.relatedTarget;if(destination&&destination.nodeType===1){this.focusedModeRepair=void 0;return}queueMicrotask(()=>{!this.suppressControlBlur&&!this.effectiveDisabled&&!this.hasAttribute("inert")&&(this.focusedModeRepair=void 0)})}modeFocusFallback(){if(this.focusReturnTarget&&isComposedFocusAvailable(this.focusReturnTarget))return this.focusReturnTarget;const owner=this.renderRoot.querySelector('[part="form-control"]');return owner&&isComposedFocusAvailable(owner)?owner:null}renderRows(rows,activeId){return rows.map((entry,i)=>{const id=`${this.listId}-opt-${i}`,selected=entry.id===this.value,disabled=entry.disabled===!0;return html`<div
2
2
  part="option"
3
3
  id=${id}
4
4
  role="option"
5
5
  data-value=${entry.id}
6
6
  ?data-synthetic=${entry.synthetic}
7
7
  aria-selected=${selected?"true":"false"}
8
+ aria-disabled=${disabled?"true":nothing}
8
9
  ?data-active=${id===activeId}
9
10
  >
10
11
  ${entry.icon?html`<span part="option-icon" aria-hidden="true" inert>${entry.icon}</span>`:nothing}
@@ -1 +1 @@
1
- import{css}from"lit";import{formControlRequiredMarker}from"../../../internal/form-control.styles.js";import{overlaySurfaceFill}from"../../../internal/overlay-surface.styles.js";const styles=css` :host { position: relative; display: inline-block; inline-size: 100%; min-inline-size: 0; max-inline-size: var(--lr-model-select-max-inline-size, var(--lr-size-24rem)); --_lr-model-select-trigger-padding: var(--lr-form-control-padding-block) var(--lr-form-control-padding-inline); --_lr-model-select-trigger-min-height: var(--lr-form-control-height); --_lr-model-select-font-size: var(--lr-form-control-font-size); --_lr-model-select-expand-size: var(--lr-size-1-75rem); --_lr-model-select-gap-default: var(--lr-space-xs); --_lr-model-select-radius-default: var(--lr-radius); } :host(:disabled) { cursor: not-allowed; } :host([size="2xs"]), :host([size="xs"]) { --_lr-model-select-expand-size: var(--lr-size-1rem); } :host([size="s"]), :host([size="small"]) { --_lr-model-select-expand-size: var(--lr-size-1-25rem); } [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='trigger'], [part='combobox'] { display: flex; align-items: center; gap: var(--lr-model-select-gap, var(--_lr-model-select-gap-default)); inline-size: 100%; min-inline-size: 0; min-block-size: var( --lr-model-select-trigger-height, var( --lr-model-select-trigger-min-height, var(--_lr-model-select-trigger-min-height) ) ); block-size: var(--lr-model-select-trigger-height, auto); box-sizing: border-box; padding: var( --lr-model-select-trigger-padding, var(--_lr-model-select-trigger-padding) ); border: var(--lr-border-width-thin) solid var(--lr-model-select-trigger-border-color, var(--lr-color-border)); border-radius: var( --lr-model-select-radius, var(--_lr-model-select-radius-default) ); background: var(--lr-model-select-trigger-fill, var(--lr-color-surface)); color: inherit; font: inherit; font-size: var( --lr-model-select-font-size, var(--_lr-model-select-font-size) ); } [part="trigger"] { cursor: pointer; text-align: start; } [part="combobox"] { cursor: text; } [part="trigger"]:focus-visible, [part="combobox"]:focus-within { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } :where([part="trigger"]):hover:where(:not(:disabled)) { background: var(--lr-color-brand-quiet); } :where([part="trigger"]):active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } :host([open]) [part="trigger"] { border-color: var( --lr-model-select-open-border-color, var(--lr-color-brand) ); } :host(:disabled) [part="trigger"], :host(:disabled) [part="combobox"] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="provider-badge"] { flex: 0 1 auto; min-inline-size: 0; max-inline-size: 40%; overflow: hidden; text-overflow: ellipsis; padding-inline-end: var(--lr-space-xs); margin-inline-end: var(--lr-space-xs); border-inline-end: var(--lr-border-width-thin) solid var(--lr-color-border); 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); white-space: nowrap; } .trigger-label { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .trigger-label[data-placeholder] { color: var(--lr-color-text-quiet); } [part="combobox-input"] { flex: 1 1 auto; min-inline-size: 0; border: none; outline: none; background: transparent; color: inherit; font: inherit; } [part="combobox-input"]::placeholder { color: var(--lr-color-text-quiet); } [part="expand-icon"] { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--lr-color-text-quiet); min-inline-size: min( var(--lr-icon-button-size), var(--lr-model-select-expand-size, var(--_lr-model-select-expand-size)) ); min-block-size: min( var(--lr-icon-button-size), var(--lr-model-select-expand-size, var(--_lr-model-select-expand-size)) ); line-height: var(--lr-line-height-none); } [part="expand-icon"] svg { transform: rotate(90deg); } [part="listbox"] { position: fixed; z-index: var(--lr-layer-dropdown); box-sizing: border-box; max-block-size: var(--lr-size-18rem); overflow-y: auto; overflow-x: hidden; inline-size: max-content; min-inline-size: var(--lr-size-12rem); max-inline-size: min( var(--lr-popover-viewport-clamp), var(--lr-size-28rem) ); padding: var(--lr-space-xs); ${overlaySurfaceFill} border-radius: var( --lr-model-select-radius, var(--lr-overlay-radius, var(--_lr-model-select-radius-default)) ); 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(--lr-transition-fast), transform var(--lr-transition-fast), visibility var(--lr-transition-fast); } :host([open]) [part="listbox"] { visibility: visible; opacity: 1; transform: translateY(0); } @media (prefers-reduced-motion: reduce) { [part="listbox"] { transition: none !important; } } [part="option"] { display: flex; align-items: center; gap: var(--lr-model-select-gap, var(--_lr-model-select-gap-default)); inline-size: 100%; box-sizing: border-box; padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid transparent; border-radius: var( --lr-model-select-radius, var(--_lr-model-select-radius-default) ); background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; } [part="option"][aria-selected="true"] { background: var(--lr-model-select-option-selected-bg, transparent); border-color: var( --lr-model-select-option-selected-border, var(--lr-color-brand) ); color: var(--lr-model-select-option-selected-color, var(--lr-color-brand)); font-weight: var( --lr-model-select-option-selected-font-weight, var(--lr-font-weight-semibold) ); } [part="option"]:hover, [part="option"][data-active] { background: var( --lr-model-select-option-active-bg, var(--lr-color-brand-quiet) ); } [part="option"]:active { background: color-mix( in oklab, var(--lr-model-select-option-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="option-icon"] { flex: 0 0 auto; line-height: var(--lr-line-height-1-4); } [part="option-label"] { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part="option"][data-synthetic] { border-style: var(--lr-model-select-option-synthetic-border-style, dashed); border-color: var( --lr-model-select-option-synthetic-border-color, var(--lr-color-border) ); } [part="option"][data-synthetic] [part="option-label"] { font-style: italic; } [part="option-badge"] { flex: 0 0 auto; 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="empty"] { padding: var(--lr-space-m); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-md-sm); } [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; } `;export{styles};
1
+ import{css}from"lit";import{formControlRequiredMarker}from"../../../internal/form-control.styles.js";import{overlaySurfaceFill}from"../../../internal/overlay-surface.styles.js";const styles=css` :host { position: relative; display: inline-block; inline-size: 100%; min-inline-size: 0; max-inline-size: var(--lr-model-select-max-inline-size, var(--lr-size-24rem)); --_lr-model-select-trigger-padding: var(--lr-form-control-padding-block) var(--lr-form-control-padding-inline); --_lr-model-select-trigger-min-height: var(--lr-form-control-height); --_lr-model-select-font-size: var(--lr-form-control-font-size); --_lr-model-select-expand-size: var(--lr-size-1-75rem); --_lr-model-select-gap-default: var(--lr-space-xs); --_lr-model-select-radius-default: var(--lr-radius); } :host(:disabled) { cursor: not-allowed; } :host([size="2xs"]), :host([size="xs"]) { --_lr-model-select-expand-size: var(--lr-size-1rem); } :host([size="s"]), :host([size="small"]) { --_lr-model-select-expand-size: var(--lr-size-1-25rem); } [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='trigger'], [part='combobox'] { display: flex; align-items: center; gap: var(--lr-model-select-gap, var(--_lr-model-select-gap-default)); inline-size: 100%; min-inline-size: 0; min-block-size: var( --lr-model-select-trigger-height, var( --lr-model-select-trigger-min-height, var(--_lr-model-select-trigger-min-height) ) ); block-size: var(--lr-model-select-trigger-height, auto); box-sizing: border-box; padding: var( --lr-model-select-trigger-padding, var(--_lr-model-select-trigger-padding) ); border: var(--lr-border-width-thin) solid var(--lr-model-select-trigger-border-color, var(--lr-color-border)); border-radius: var( --lr-model-select-radius, var(--_lr-model-select-radius-default) ); background: var(--lr-model-select-trigger-fill, var(--lr-color-surface)); color: inherit; font: inherit; font-size: var( --lr-model-select-font-size, var(--_lr-model-select-font-size) ); } [part="trigger"] { cursor: pointer; text-align: start; } [part="combobox"] { cursor: text; } [part="trigger"]:focus-visible, [part="combobox"]:focus-within { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } :where([part="trigger"]):hover:where(:not(:disabled)) { background: var(--lr-color-brand-quiet); } :where([part="trigger"]):active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } :host([open]) [part="trigger"] { border-color: var( --lr-model-select-open-border-color, var(--lr-color-brand) ); } :host(:disabled) [part="trigger"], :host(:disabled) [part="combobox"] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="provider-badge"] { flex: 0 1 auto; min-inline-size: 0; max-inline-size: 40%; overflow: hidden; text-overflow: ellipsis; padding-inline-end: var(--lr-space-xs); margin-inline-end: var(--lr-space-xs); border-inline-end: var(--lr-border-width-thin) solid var(--lr-color-border); 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); white-space: nowrap; } .trigger-label { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .trigger-label[data-placeholder] { color: var(--lr-color-text-quiet); } [part="combobox-input"] { flex: 1 1 auto; min-inline-size: 0; border: none; outline: none; background: transparent; color: inherit; font: inherit; } [part="combobox-input"]::placeholder { color: var(--lr-color-text-quiet); } [part="expand-icon"] { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--lr-color-text-quiet); min-inline-size: min( var(--lr-icon-button-size), var(--lr-model-select-expand-size, var(--_lr-model-select-expand-size)) ); min-block-size: min( var(--lr-icon-button-size), var(--lr-model-select-expand-size, var(--_lr-model-select-expand-size)) ); line-height: var(--lr-line-height-none); } [part="expand-icon"] svg { transform: rotate(90deg); } [part="listbox"] { position: fixed; z-index: var(--lr-layer-dropdown); box-sizing: border-box; max-block-size: var(--lr-size-18rem); overflow-y: auto; overflow-x: hidden; inline-size: max-content; min-inline-size: var(--lr-size-12rem); max-inline-size: min( var(--lr-popover-viewport-clamp), var(--lr-size-28rem) ); padding: var(--lr-space-xs); ${overlaySurfaceFill} border-radius: var( --lr-model-select-radius, var(--lr-overlay-radius, var(--_lr-model-select-radius-default)) ); 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(--lr-transition-fast), transform var(--lr-transition-fast), visibility var(--lr-transition-fast); } :host([open]) [part="listbox"] { visibility: visible; opacity: 1; transform: translateY(0); } @media (prefers-reduced-motion: reduce) { [part="listbox"] { transition: none !important; } } [part="option"] { display: flex; align-items: center; gap: var(--lr-model-select-gap, var(--_lr-model-select-gap-default)); inline-size: 100%; box-sizing: border-box; padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid transparent; border-radius: var( --lr-model-select-radius, var(--_lr-model-select-radius-default) ); background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; } [part="option"][aria-selected="true"] { background: var(--lr-model-select-option-selected-bg, transparent); border-color: var( --lr-model-select-option-selected-border, var(--lr-color-brand) ); color: var(--lr-model-select-option-selected-color, var(--lr-color-brand)); font-weight: var( --lr-model-select-option-selected-font-weight, var(--lr-font-weight-semibold) ); } [part="option"]:where(:not([aria-disabled='true'])):hover, [part="option"][data-active] { background: var( --lr-model-select-option-active-bg, var(--lr-color-brand-quiet) ); } [part="option"]:where(:not([aria-disabled='true'])):active { background: color-mix( in oklab, var(--lr-model-select-option-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="option"][aria-disabled='true'] { cursor: default; opacity: var(--lr-model-select-option-disabled-opacity, 0.5); } [part="option-icon"] { flex: 0 0 auto; line-height: var(--lr-line-height-1-4); } [part="option-label"] { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part="option"][data-synthetic] { border-style: var(--lr-model-select-option-synthetic-border-style, dashed); border-color: var( --lr-model-select-option-synthetic-border-color, var(--lr-color-border) ); } [part="option"][data-synthetic] [part="option-label"] { font-style: italic; } [part="option-badge"] { flex: 0 0 auto; 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="empty"] { padding: var(--lr-space-m); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-md-sm); } [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; } `;export{styles};
@@ -1,4 +1,4 @@
1
- import{type TemplateResult,type PropertyValues}from'lit';import{LyraElement}from'../../../internal/lyra-element.js';import type{ShikiLanguageInput}from'../code-block/shiki-types.js';
1
+ import{type TemplateResult,type PropertyValues}from'lit';import{LyraElement}from'../../../internal/lyra-element.js';import type{ShikiLanguageInput}from'../code-block/shiki-types.js';import type{MarkdownHtmlMode}from'../markdown/markdown-shared.js';
2
2
  /** Runs {@link APPEND_MONOTONIC_MARKDOWN_PATTERNS}/{@link BOUNDARY_SENSITIVE_MARKDOWN_PATTERNS}
3
3
  * against `text`, used whenever `contentMode` is left unset (auto-detect). Exported so the
4
4
  * heuristic is directly testable without going through either variant's render cycle. */
@@ -30,7 +30,45 @@ contentMode:StreamingTextContentMode;
30
30
  * explicit language-grammar bundle scoping shiki's build output to just those grammars. Unset
31
31
  * leaves the composed element's own default untouched: the full variant falls back to its
32
32
  * ~200-language dynamic-import table, the core variant renders unmatched fences as plain text. */
33
- languages?:Readonly<Record<string,ShikiLanguageInput>>;protected displayedContent:string;private lastScannedContent?;private lastScannedResult;private lastMonotonicResult;private readonly coalescer;
33
+ languages?:Readonly<Record<string,ShikiLanguageInput>>;
34
+ /** Forwarded verbatim to the composed Markdown element's own `tabSize` -- the tab-stop width
35
+ * used to expand tabs in leading indentation before parsing. `4` (the default) matches the
36
+ * composed element's own default. */
37
+ tabSize:number;
38
+ /** Forwarded verbatim to the composed Markdown element's own `htmlMode` -- how authored raw
39
+ * HTML is handled (`'sanitize'`, `'escape'`, or `'trusted'`). `'sanitize'` (the default)
40
+ * matches the composed element's own default. */
41
+ htmlMode:MarkdownHtmlMode;
42
+ /** Forwarded verbatim to the composed Markdown element's own `gfm` -- GitHub-flavored Markdown
43
+ * (tables, strikethrough, autolinks, task lists). `true` (the default) matches the composed
44
+ * element's own default. */
45
+ gfm:boolean;
46
+ /** Forwarded verbatim to the composed Markdown element's own `linkTarget` -- the `target`
47
+ * applied to every rendered `<a>`, with `rel="noopener noreferrer"` always added by the
48
+ * composed element alongside it whenever a `target` is emitted. `'_blank'` (the default)
49
+ * matches the composed element's own default; set to `null` (or the empty string, e.g. via the
50
+ * `link-target=""` attribute) to omit `target`/`rel` entirely so rendered links open in the
51
+ * same tab. */
52
+ linkTarget:string|null;
53
+ /** Forwarded verbatim to the composed Markdown element's own `internalLinkPrefix`. Empty (the
54
+ * default) matches the composed element's own default -- every link is treated as external. */
55
+ internalLinkPrefix:string;
56
+ /** Forwarded verbatim to the composed Markdown element's own `headingOffset`. `0` (the
57
+ * default) matches the composed element's own default. */
58
+ headingOffset:number;
59
+ /** Forwarded verbatim to the composed Markdown element's own `highlightCode`. `true` (the
60
+ * default) matches the composed element's own default. */
61
+ highlightCode:boolean;
62
+ /** Forwarded verbatim to the composed Markdown element's own `headingAnchors`. `false` (the
63
+ * default) matches the composed element's own default. */
64
+ headingAnchors:boolean;
65
+ /** Forwarded verbatim to the composed Markdown element's own `math`. `false` (the default)
66
+ * matches the composed element's own default. */
67
+ math:boolean;
68
+ /** Forwarded verbatim to the composed Markdown element's own `maxHeight`. Empty (the default)
69
+ * matches the composed element's own default -- the rendered document never scrolls
70
+ * internally. */
71
+ maxHeight:string;protected displayedContent:string;private lastScannedContent?;private lastScannedResult;private lastMonotonicResult;private readonly coalescer;
34
72
  /** `coalesceMs` normalized to a finite, non-negative timer delay before it ever reaches
35
73
  * `Announcer.throttleMs` (and, from there, a raw `setTimeout()` call) -- a `NaN`/negative raw
36
74
  * value would otherwise feed the platform a nonsensical delay (clamped to `0` by the
@@ -1,6 +1,6 @@
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{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{Announcer}from"../../../internal/announcer.js";import{finiteDuration}from"../../../internal/numbers.js";import{styles}from"./streaming-text.styles.js";const DEFAULT_COALESCE_MS=50,APPEND_MONOTONIC_MARKDOWN_PATTERNS=[/^ {0,3}#{1,6}\s+\S/m,/```/,/\*\*[^*\n]+\*\*/,/`[^`\n]+`/,/^ {0,3}[-*+]\s+\S/m,/^ {0,3}\d+\.\s+\S/m,/\[[^\]]+\]\([^)\s]+\)/,/^ {0,3}>\s?\S/m],BOUNDARY_SENSITIVE_MARKDOWN_PATTERNS=[/(?:^|[^\w])_[^_\n]+_(?:[^\w]|$)/];function looksLikeMarkdown(text){return text?[...APPEND_MONOTONIC_MARKDOWN_PATTERNS,...BOUNDARY_SENSITIVE_MARKDOWN_PATTERNS].some(pattern=>pattern.test(text)):!1}class StreamingTextRuntimeBase extends LyraElement{static{this.styles=[LyraElement.styles,styles]}get safeCoalesceMs(){return finiteDuration(this.coalesceMs,DEFAULT_COALESCE_MS,0)}constructor(){super(),this.content="",this.streaming=!1,this.coalesceMs=DEFAULT_COALESCE_MS,this.contentMode="auto",this.displayedContent="",this.lastScannedResult=!1,this.lastMonotonicResult=!1,this.coalescer=new Announcer({throttleMs:this.safeCoalesceMs,onFlush:text=>{this.displayedContent=text}})}connectedCallback(){super.connectedCallback();const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.coalescer.setTimerHost(ownerWindow),this.hasUpdated&&this.displayedContent!==this.content&&this.coalescer.announce(this.content,{force:!0})}willUpdate(changed){if(super.willUpdate(changed),changed.has("coalesceMs")&&(this.coalescer.throttleMs=this.safeCoalesceMs),changed.has("content")&&this.coalescer.announce(this.content,{force:!this.hasUpdated}),changed.has("streaming")&&changed.get("streaming")!==void 0&&changed.get("streaming")!==this.streaming&&this.coalescer.announce(this.content,{force:!0}),changed.has("displayedContent")&&this.displayedContent!==this.lastScannedContent){const previous=this.lastScannedContent;this.lastScannedContent=this.displayedContent,previous!==void 0&&this.displayedContent.startsWith(previous)&&this.lastMonotonicResult||(this.lastMonotonicResult=APPEND_MONOTONIC_MARKDOWN_PATTERNS.some(pattern=>pattern.test(this.displayedContent)),this.lastScannedResult=this.lastMonotonicResult||BOUNDARY_SENSITIVE_MARKDOWN_PATTERNS.some(pattern=>pattern.test(this.displayedContent)))}}updated(changed){super.updated(changed),changed.has("displayedContent")&&!this.effectiveMarkdown&&this.emit("lr-content-settled",null)}disconnectedCallback(){super.disconnectedCallback(),this.coalescer.cancel()}adoptedCallback(){super.adoptedCallback();const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.coalescer.setTimerHost(ownerWindow)}get effectiveMarkdown(){return this.contentMode==="markdown"?!0:this.contentMode==="plain"?!1:this.lastScannedResult}stopOwnedEvent(event){event.stopPropagation()}render(){return html`
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{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{Announcer}from"../../../internal/announcer.js";import{finiteDuration}from"../../../internal/numbers.js";import{trueDefaultBooleanFromAttributeConverter as trueDefaultBooleanConverter}from"../../../internal/converters.js";import{styles}from"./streaming-text.styles.js";const DEFAULT_COALESCE_MS=50,APPEND_MONOTONIC_MARKDOWN_PATTERNS=[/^ {0,3}#{1,6}\s+\S/m,/```/,/\*\*[^*\n]+\*\*/,/`[^`\n]+`/,/^ {0,3}[-*+]\s+\S/m,/^ {0,3}\d+\.\s+\S/m,/\[[^\]]+\]\([^)\s]+\)/,/^ {0,3}>\s?\S/m],BOUNDARY_SENSITIVE_MARKDOWN_PATTERNS=[/(?:^|[^\w])_[^_\n]+_(?:[^\w]|$)/];function looksLikeMarkdown(text){return text?[...APPEND_MONOTONIC_MARKDOWN_PATTERNS,...BOUNDARY_SENSITIVE_MARKDOWN_PATTERNS].some(pattern=>pattern.test(text)):!1}class StreamingTextRuntimeBase extends LyraElement{static{this.styles=[LyraElement.styles,styles]}get safeCoalesceMs(){return finiteDuration(this.coalesceMs,DEFAULT_COALESCE_MS,0)}constructor(){super(),this.content="",this.streaming=!1,this.coalesceMs=DEFAULT_COALESCE_MS,this.contentMode="auto",this.tabSize=4,this.htmlMode="sanitize",this.gfm=!0,this.linkTarget="_blank",this.internalLinkPrefix="",this.headingOffset=0,this.highlightCode=!0,this.headingAnchors=!1,this.math=!1,this.maxHeight="",this.displayedContent="",this.lastScannedResult=!1,this.lastMonotonicResult=!1,this.coalescer=new Announcer({throttleMs:this.safeCoalesceMs,onFlush:text=>{this.displayedContent=text}})}connectedCallback(){super.connectedCallback();const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.coalescer.setTimerHost(ownerWindow),this.hasUpdated&&this.displayedContent!==this.content&&this.coalescer.announce(this.content,{force:!0})}willUpdate(changed){if(super.willUpdate(changed),changed.has("coalesceMs")&&(this.coalescer.throttleMs=this.safeCoalesceMs),changed.has("content")&&this.coalescer.announce(this.content,{force:!this.hasUpdated}),changed.has("streaming")&&changed.get("streaming")!==void 0&&changed.get("streaming")!==this.streaming&&this.coalescer.announce(this.content,{force:!0}),changed.has("displayedContent")&&this.displayedContent!==this.lastScannedContent){const previous=this.lastScannedContent;this.lastScannedContent=this.displayedContent,previous!==void 0&&this.displayedContent.startsWith(previous)&&this.lastMonotonicResult||(this.lastMonotonicResult=APPEND_MONOTONIC_MARKDOWN_PATTERNS.some(pattern=>pattern.test(this.displayedContent)),this.lastScannedResult=this.lastMonotonicResult||BOUNDARY_SENSITIVE_MARKDOWN_PATTERNS.some(pattern=>pattern.test(this.displayedContent)))}}updated(changed){super.updated(changed),changed.has("displayedContent")&&!this.effectiveMarkdown&&this.emit("lr-content-settled",null)}disconnectedCallback(){super.disconnectedCallback(),this.coalescer.cancel()}adoptedCallback(){super.adoptedCallback();const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.coalescer.setTimerHost(ownerWindow)}get effectiveMarkdown(){return this.contentMode==="markdown"?!0:this.contentMode==="plain"?!1:this.lastScannedResult}stopOwnedEvent(event){event.stopPropagation()}render(){return html`
2
2
  <div part="base">
3
3
  ${this.effectiveMarkdown?this.renderMarkdown():html`<span class="plain">${this.displayedContent}</span>`}
4
4
  ${this.streaming?html`<span part="cursor" aria-hidden="true"></span>`:nothing}
5
5
  </div>
6
- `}}__decorate([property()],StreamingTextRuntimeBase.prototype,"content",void 0),__decorate([property({type:Boolean,reflect:!0})],StreamingTextRuntimeBase.prototype,"streaming",void 0),__decorate([property({type:Number,attribute:"coalesce-ms"})],StreamingTextRuntimeBase.prototype,"coalesceMs",void 0),__decorate([property({reflect:!0,attribute:"content-mode"})],StreamingTextRuntimeBase.prototype,"contentMode",void 0),__decorate([property({attribute:!1})],StreamingTextRuntimeBase.prototype,"languages",void 0),__decorate([state()],StreamingTextRuntimeBase.prototype,"displayedContent",void 0);export{StreamingTextRuntimeBase,looksLikeMarkdown};
6
+ `}}__decorate([property()],StreamingTextRuntimeBase.prototype,"content",void 0),__decorate([property({type:Boolean,reflect:!0})],StreamingTextRuntimeBase.prototype,"streaming",void 0),__decorate([property({type:Number,attribute:"coalesce-ms"})],StreamingTextRuntimeBase.prototype,"coalesceMs",void 0),__decorate([property({reflect:!0,attribute:"content-mode"})],StreamingTextRuntimeBase.prototype,"contentMode",void 0),__decorate([property({attribute:!1})],StreamingTextRuntimeBase.prototype,"languages",void 0),__decorate([property({type:Number,attribute:"tab-size"})],StreamingTextRuntimeBase.prototype,"tabSize",void 0),__decorate([property({attribute:"html-mode"})],StreamingTextRuntimeBase.prototype,"htmlMode",void 0),__decorate([property({converter:trueDefaultBooleanConverter})],StreamingTextRuntimeBase.prototype,"gfm",void 0),__decorate([property({attribute:"link-target"})],StreamingTextRuntimeBase.prototype,"linkTarget",void 0),__decorate([property({attribute:"internal-link-prefix"})],StreamingTextRuntimeBase.prototype,"internalLinkPrefix",void 0),__decorate([property({type:Number,attribute:"heading-offset"})],StreamingTextRuntimeBase.prototype,"headingOffset",void 0),__decorate([property({attribute:"highlight-code",converter:trueDefaultBooleanConverter})],StreamingTextRuntimeBase.prototype,"highlightCode",void 0),__decorate([property({type:Boolean,attribute:"heading-anchors"})],StreamingTextRuntimeBase.prototype,"headingAnchors",void 0),__decorate([property({type:Boolean})],StreamingTextRuntimeBase.prototype,"math",void 0),__decorate([property({attribute:"max-height"})],StreamingTextRuntimeBase.prototype,"maxHeight",void 0),__decorate([state()],StreamingTextRuntimeBase.prototype,"displayedContent",void 0);export{StreamingTextRuntimeBase,looksLikeMarkdown};
@@ -7,9 +7,11 @@ export interface LyraStreamingTextCoreEventMap extends StreamingTextRuntimeEvent
7
7
  * `<lr-streaming-text-core>` — a build-lean `<lr-streaming-text>` variant for a consumer whose
8
8
  * `languages` map already covers every fenced-code language it will ever stream, or who never
9
9
  * renders fenced code at all. Every capability is identical to `<lr-streaming-text>` -- token
10
- * coalescing, `contentMode` auto-detection, the blinking cursor, the `lr-content-settled` event --
11
- * only which Markdown element Markdown mode composes differs: this variant renders
12
- * `<lr-markdown-core>` (`../markdown/markdown-core.js`) instead of `<lr-markdown>`, so this
10
+ * coalescing, `contentMode` auto-detection, the blinking cursor, the `lr-content-settled` event,
11
+ * and the full forwarded Markdown configuration surface (`tabSize`, `htmlMode`, `gfm`,
12
+ * `linkTarget`, `internalLinkPrefix`, `headingOffset`, `highlightCode`, `headingAnchors`, `math`,
13
+ * `maxHeight`) -- only which Markdown element Markdown mode composes differs: this variant
14
+ * renders `<lr-markdown-core>` (`../markdown/markdown-core.js`) instead of `<lr-markdown>`, so this
13
15
  * component's own module never textually contains a reference to `<lr-markdown>`'s ~200-language
14
16
  * dynamic-import table. A fenced code block whose language isn't a key in `languages` always
15
17
  * renders the plain-text fallback here -- there is no default/full-table highlighter to fall back
@@ -2,6 +2,16 @@ import{html}from"lit";import{StreamingTextRuntimeBase}from"./streaming-text-base
2
2
  .content=${this.displayedContent}
3
3
  .streaming=${this.streaming}
4
4
  .languages=${this.languages??{}}
5
+ .tabSize=${this.tabSize}
6
+ .htmlMode=${this.htmlMode}
7
+ .gfm=${this.gfm}
8
+ .linkTarget=${this.linkTarget}
9
+ .internalLinkPrefix=${this.internalLinkPrefix}
10
+ .headingOffset=${this.headingOffset}
11
+ .highlightCode=${this.highlightCode}
12
+ .headingAnchors=${this.headingAnchors}
13
+ .math=${this.math}
14
+ .maxHeight=${this.maxHeight}
5
15
  @lr-render-error=${this.stopOwnedEvent}
6
16
  @lr-link-click=${this.stopOwnedEvent}
7
17
  @lr-highlight-activate=${this.stopOwnedEvent}
@@ -39,12 +39,18 @@ import{type TemplateResult}from'lit';import{StreamingTextRuntimeBase}from'./stre
39
39
  * directly, forwarding this component's own `streaming` through as that
40
40
  * component's own forward-compatible `streaming` hint prop, and this
41
41
  * component's own `languages` through verbatim; plain-text mode
42
- * renders into a `white-space: pre-wrap` span instead. The plain-text path
42
+ * renders into a `white-space: pre-wrap` span instead. The rest of
43
+ * `<lr-markdown>`'s configuration surface is forwarded verbatim too --
44
+ * `tabSize`, `htmlMode`, `gfm`, `linkTarget`, `internalLinkPrefix`,
45
+ * `headingOffset`, `highlightCode`, `headingAnchors`, `math`, and
46
+ * `maxHeight` -- each defaulting to exactly `<lr-markdown>`'s own default, so
47
+ * leaving all of them unset renders identically to before this wrapper
48
+ * forwarded them. The plain-text path
43
49
  * does not load optional peers. Markdown mode uses `<lr-markdown>`'s lazy
44
50
  * `marked` parser and default `dompurify` sanitizer; fenced-code highlighting
45
51
  * can additionally use `shiki`. The transitive Markdown graph also contains
46
- * the opt-in `katex` loader, but this wrapper does not enable Markdown math,
47
- * so it never requests that peer itself.
52
+ * the opt-in `katex` loader, requested only if this wrapper's own `math` is
53
+ * set (forwarded to the composed element, unset by default).
48
54
  *
49
55
  * A consumer with a bounded, known fence-language set who wants to avoid `<lr-markdown>`'s
50
56
  * ~200-language dynamic-import table entirely -- either by setting `languages` here, or to skip
@@ -2,6 +2,16 @@ import{html}from"lit";import{StreamingTextRuntimeBase}from"./streaming-text-base
2
2
  .content=${this.displayedContent}
3
3
  .streaming=${this.streaming}
4
4
  .languages=${this.languages}
5
+ .tabSize=${this.tabSize}
6
+ .htmlMode=${this.htmlMode}
7
+ .gfm=${this.gfm}
8
+ .linkTarget=${this.linkTarget}
9
+ .internalLinkPrefix=${this.internalLinkPrefix}
10
+ .headingOffset=${this.headingOffset}
11
+ .highlightCode=${this.highlightCode}
12
+ .headingAnchors=${this.headingAnchors}
13
+ .math=${this.math}
14
+ .maxHeight=${this.maxHeight}
5
15
  @lr-render-error=${this.stopOwnedEvent}
6
16
  @lr-link-click=${this.stopOwnedEvent}
7
17
  @lr-highlight-activate=${this.stopOwnedEvent}
@@ -4,7 +4,14 @@ label:string;
4
4
  /** Optional literal icon hint (for example, an emoji). Rendered decoratively before the text. */
5
5
  icon?:string;
6
6
  /** An optional secondary line (Perplexity-style related questions). */
7
- detail?:string;}export interface LyraSuggestionChipsEventMap{'lr-suggestion-select':CustomEvent<{suggestionId:string;label:string;}>;}
7
+ detail?:string;
8
+ /**
9
+ * Marks this suggestion non-actionable: its chip renders a genuinely disabled `<button>` (no
10
+ * roving tab stop, no hover/press affordance, no `lr-suggestion-select`), and arrow-key/Home/End
11
+ * roving navigation steps past it instead of landing on it. Omitted or `false` renders the chip
12
+ * exactly as before this field existed.
13
+ */
14
+ disabled?:boolean;}export interface LyraSuggestionChipsEventMap{'lr-suggestion-select':CustomEvent<{suggestionId:string;label:string;}>;}
8
15
  /**
9
16
  * `<lr-suggestion-chips>` — starter prompts (empty thread) and follow-up suggestions (after a
10
17
  * response) as a horizontally scrollable chip row; activation hands the prompt to the host, which
@@ -17,6 +24,12 @@ detail?:string;}export interface LyraSuggestionChipsEventMap{'lr-suggestion-sele
17
24
  * Suggestions are a clone-owned, bounded readonly snapshot; create and reassign a new array after
18
25
  * changing the sequence or a row.
19
26
  *
27
+ * A suggestion may also set `disabled`, marking it non-actionable: its chip renders a genuinely
28
+ * disabled `<button>` (no roving tab stop, no hover/press affordance) and activating it -- by click
29
+ * or keyboard -- emits nothing and changes no state. Arrow-key/Home/End roving navigation steps
30
+ * past it instead of landing on it. Omitted or `false` renders the chip exactly as before this
31
+ * field existed.
32
+ *
20
33
  * @customElement lr-suggestion-chips
21
34
  * @event lr-suggestion-select - `detail: { suggestionId, label }`.
22
35
  * @csspart base - The labeled group.
@@ -30,6 +43,7 @@ detail?:string;}export interface LyraSuggestionChipsEventMap{'lr-suggestion-sele
30
43
  * centers every line, the wrapped final one included — what `::part(base)` alone cannot do.
31
44
  * @cssprop [--lr-suggestion-chips-hover-bg=var(--lr-color-brand-quiet)] - Background of a hovered chip.
32
45
  * @cssprop [--lr-suggestion-chips-hover-border=var(--lr-color-brand)] - Border color of a hovered chip.
46
+ * @cssprop [--lr-suggestion-chips-disabled-opacity=0.5] - Opacity of a chip whose suggestion sets `disabled`.
33
47
  * @status stable
34
48
  * @since 4.0.0
35
49
  */
@@ -42,4 +56,18 @@ suggestions:readonly LyraChatSuggestion[];
42
56
  wrap:boolean;
43
57
  /** Accessible name for the group. Optional. Omitting it localizes the default `suggestionsLabel`
44
58
  * message; an explicit empty string renders no visible/accessible label. */
45
- label?:string;private activeIndex;private pendingFocus?;private focusRepairGeneration;private normalizeSuggestions;private get effectiveSuggestions();disconnectedCallback():void;adoptedCallback():void;protected willUpdate(changed:PropertyValues):void;protected updated(changed:PropertyValues):void;private restorePendingFocus;private select;private chipButtons;private focusChip;private onChipFocus;private onKeyDown;private renderChip;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-suggestion-chips':LyraSuggestionChips;}}
59
+ label?:string;private activeIndex;private pendingFocus?;private focusRepairGeneration;private normalizeSuggestions;private get effectiveSuggestions();disconnectedCallback():void;adoptedCallback():void;protected willUpdate(changed:PropertyValues):void;protected updated(changed:PropertyValues):void;private restorePendingFocus;
60
+ /** A `disabled` suggestion cannot be activated -- by click or keyboard -- and emits nothing and
61
+ * changes no state, matching every other declared-non-actionable entry in this library. */
62
+ private select;private chipButtons;private focusChip;private onChipFocus;private isSuggestionDisabled;
63
+ /** Degrades `this.activeIndex` off a disabled suggestion to the nearest enabled one (forward
64
+ * first, then backward), so the `tabindex="0"` resting stop this drives is never one a keyboard
65
+ * user cannot reach. Returns `-1` only when every suggestion is disabled. Unset regression: with
66
+ * no disabled suggestion, this is the same `clamp(activeIndex, 0, count - 1)` the tabindex
67
+ * comparison always used. */
68
+ private effectiveActiveIndex;
69
+ /** Steps `from` by one chip in `direction`, wrapping around while skipping a disabled chip --
70
+ * the wrap-around analogue of `stepEnabledIndex()` in `internal/catalog-picker.ts`. Returns `-1`
71
+ * only when every suggestion is disabled. Unset regression: with no disabled suggestion, this
72
+ * is the same `(from + direction + n) % n` the arrow-key handler always computed. */
73
+ private stepEnabledIndex;private firstEnabledIndex;private lastEnabledIndex;private onKeyDown;private renderChip;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-suggestion-chips':LyraSuggestionChips;}}
@@ -1,9 +1,10 @@
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{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{styles}from"./suggestion-chips.styles.js";import{applyComposedFocusRepair,captureComposedFocusRepair}from"../../../internal/focus-navigation.js";import{deepActiveElementIn}from"../../../internal/active-element.js";import{LYRA_DEFAULT_suggestionsLabel}from"../../../internal/default-strings.generated.js";class LyraSuggestionChips extends LyraElement{constructor(){super(...arguments),this.suggestions=[],this.wrap=!1,this.activeIndex=0,this.focusRepairGeneration=0,this.onKeyDown=e=>{const n=this.effectiveSuggestions.length;if(n===0)return;const forwardKey=this.effectiveDirection==="rtl"?"ArrowLeft":"ArrowRight",backwardKey=this.effectiveDirection==="rtl"?"ArrowRight":"ArrowLeft";let target;if(e.key===forwardKey)target=(this.activeIndex+1)%n;else if(e.key===backwardKey)target=(this.activeIndex-1+n)%n;else if(e.key==="Home")target=0;else if(e.key==="End")target=n-1;else return;e.preventDefault(),this.activeIndex=target,this.focusChip(target)}}static{this.defaultStrings={...super.defaultStrings,suggestionsLabel:LYRA_DEFAULT_suggestionsLabel}}static{this.ownedCollectionProperties=Object.freeze(["suggestions"])}static{this.styles=[LyraElement.styles,styles]}normalizeSuggestions(items){const seen=new Set,normalized=[];for(const suggestion of items??[]){let suggestionId,label;try{suggestionId=suggestion?.suggestionId,label=suggestion?.label}catch{continue}typeof suggestionId!="string"||suggestionId.trim()===""||typeof label!="string"||label.trim()===""||seen.has(suggestionId)||(seen.add(suggestionId),normalized.push(suggestion))}return normalized}get effectiveSuggestions(){return this.normalizeSuggestions(this.suggestions)}disconnectedCallback(){this.focusRepairGeneration++,this.pendingFocus=void 0,super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.focusRepairGeneration++,this.pendingFocus=void 0}willUpdate(changed){if(super.willUpdate(changed),changed.has("suggestions")||changed.has("wrap")){const active=deepActiveElementIn(this.ownerDocument),activeElement=active?.nodeType===1&&"dataset"in active?active:null,suggestionId=activeElement?.dataset.suggestionId,repair=activeElement?captureComposedFocusRepair(this,activeElement):null,generation=++this.focusRepairGeneration;this.pendingFocus=suggestionId&&repair?{suggestionId,index:this.activeIndex,repair,generation}:void 0}if(changed.has("suggestions")){const previous=this.normalizeSuggestions(changed.get("suggestions")),current=this.effectiveSuggestions,activeId=this.pendingFocus?.suggestionId??previous[this.activeIndex]?.suggestionId,remapped=activeId?current.findIndex(suggestion=>suggestion.suggestionId===activeId):-1;this.activeIndex=remapped>=0?remapped:Math.min(this.activeIndex,Math.max(0,current.length-1))}}updated(changed){super.updated(changed);const pending=this.pendingFocus;this.pendingFocus=void 0,pending&&this.restorePendingFocus(pending)}async restorePendingFocus(pending){if(await this.renderRoot.querySelector("lr-scroller")?.updateComplete,await Promise.resolve(),pending.generation!==this.focusRepairGeneration||!this.isConnected)return;const buttons=this.chipButtons(),target=buttons.find(button=>button.dataset.suggestionId===pending.suggestionId)??buttons[Math.min(pending.index,Math.max(0,buttons.length-1))]??null;applyComposedFocusRepair(pending.repair,target)}select(suggestion){this.emit("lr-suggestion-select",{suggestionId:suggestion.suggestionId,label:suggestion.label})}chipButtons(){return[...this.renderRoot.querySelectorAll('[part~="chip"]')]}focusChip(index){this.chipButtons()[index]?.focus()}onChipFocus(index){this.activeIndex=index}renderChip(suggestion,index){return html`
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{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{styles}from"./suggestion-chips.styles.js";import{applyComposedFocusRepair,captureComposedFocusRepair}from"../../../internal/focus-navigation.js";import{deepActiveElementIn}from"../../../internal/active-element.js";import{LYRA_DEFAULT_suggestionsLabel}from"../../../internal/default-strings.generated.js";class LyraSuggestionChips extends LyraElement{constructor(){super(...arguments),this.suggestions=[],this.wrap=!1,this.activeIndex=0,this.focusRepairGeneration=0,this.onKeyDown=e=>{const suggestions=this.effectiveSuggestions;if(suggestions.length===0)return;const forwardKey=this.effectiveDirection==="rtl"?"ArrowLeft":"ArrowRight",backwardKey=this.effectiveDirection==="rtl"?"ArrowRight":"ArrowLeft";let target;if(e.key===forwardKey)target=this.stepEnabledIndex(suggestions,this.activeIndex,1);else if(e.key===backwardKey)target=this.stepEnabledIndex(suggestions,this.activeIndex,-1);else if(e.key==="Home")target=this.firstEnabledIndex(suggestions);else if(e.key==="End")target=this.lastEnabledIndex(suggestions);else return;e.preventDefault(),!(target<0)&&(this.activeIndex=target,this.focusChip(target))}}static{this.defaultStrings={...super.defaultStrings,suggestionsLabel:LYRA_DEFAULT_suggestionsLabel}}static{this.ownedCollectionProperties=Object.freeze(["suggestions"])}static{this.styles=[LyraElement.styles,styles]}normalizeSuggestions(items){const seen=new Set,normalized=[];for(const suggestion of items??[]){let suggestionId,label;try{suggestionId=suggestion?.suggestionId,label=suggestion?.label}catch{continue}typeof suggestionId!="string"||suggestionId.trim()===""||typeof label!="string"||label.trim()===""||seen.has(suggestionId)||(seen.add(suggestionId),normalized.push(suggestion))}return normalized}get effectiveSuggestions(){return this.normalizeSuggestions(this.suggestions)}disconnectedCallback(){this.focusRepairGeneration++,this.pendingFocus=void 0,super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.focusRepairGeneration++,this.pendingFocus=void 0}willUpdate(changed){if(super.willUpdate(changed),changed.has("suggestions")||changed.has("wrap")){const active=deepActiveElementIn(this.ownerDocument),activeElement=active?.nodeType===1&&"dataset"in active?active:null,suggestionId=activeElement?.dataset.suggestionId,repair=activeElement?captureComposedFocusRepair(this,activeElement):null,generation=++this.focusRepairGeneration;this.pendingFocus=suggestionId&&repair?{suggestionId,index:this.activeIndex,repair,generation}:void 0}if(changed.has("suggestions")){const previous=this.normalizeSuggestions(changed.get("suggestions")),current=this.effectiveSuggestions,activeId=this.pendingFocus?.suggestionId??previous[this.activeIndex]?.suggestionId,remapped=activeId?current.findIndex(suggestion=>suggestion.suggestionId===activeId):-1;this.activeIndex=remapped>=0?remapped:Math.min(this.activeIndex,Math.max(0,current.length-1))}}updated(changed){super.updated(changed);const pending=this.pendingFocus;this.pendingFocus=void 0,pending&&this.restorePendingFocus(pending)}async restorePendingFocus(pending){if(await this.renderRoot.querySelector("lr-scroller")?.updateComplete,await Promise.resolve(),pending.generation!==this.focusRepairGeneration||!this.isConnected)return;const buttons=this.chipButtons(),target=buttons.find(button=>button.dataset.suggestionId===pending.suggestionId)??buttons[Math.min(pending.index,Math.max(0,buttons.length-1))]??null;applyComposedFocusRepair(pending.repair,target)}select(suggestion){suggestion.disabled||this.emit("lr-suggestion-select",{suggestionId:suggestion.suggestionId,label:suggestion.label})}chipButtons(){return[...this.renderRoot.querySelectorAll('[part~="chip"]')]}focusChip(index){this.chipButtons()[index]?.focus()}onChipFocus(index){this.activeIndex=index}isSuggestionDisabled(suggestion){return suggestion?.disabled===!0}effectiveActiveIndex(suggestions){const count=suggestions.length;if(!count)return-1;const clamped=Math.min(Math.max(this.activeIndex,0),count-1);if(!this.isSuggestionDisabled(suggestions[clamped]))return clamped;for(let forward=clamped+1;forward<count;forward+=1)if(!this.isSuggestionDisabled(suggestions[forward]))return forward;for(let backward=clamped-1;backward>=0;backward-=1)if(!this.isSuggestionDisabled(suggestions[backward]))return backward;return-1}stepEnabledIndex(suggestions,from,direction){const n=suggestions.length;if(!n)return-1;let index=from;for(let steps=0;steps<n;steps+=1)if(index=(index+direction+n)%n,!this.isSuggestionDisabled(suggestions[index]))return index;return-1}firstEnabledIndex(suggestions){return suggestions.findIndex(suggestion=>!this.isSuggestionDisabled(suggestion))}lastEnabledIndex(suggestions){for(let index=suggestions.length-1;index>=0;index-=1)if(!this.isSuggestionDisabled(suggestions[index]))return index;return-1}renderChip(suggestion,index,activeIndex){return html`
2
2
  <button
3
3
  type="button"
4
4
  part="chip"
5
5
  data-suggestion-id=${suggestion.suggestionId}
6
- tabindex=${index===this.activeIndex?"0":"-1"}
6
+ tabindex=${index===activeIndex?"0":"-1"}
7
+ ?disabled=${suggestion.disabled===!0}
7
8
  @click=${()=>this.select(suggestion)}
8
9
  @focus=${()=>this.onChipFocus(index)}
9
10
  >
@@ -13,7 +14,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
13
14
  ${suggestion.detail?html`<span part="chip-detail">${suggestion.detail}</span>`:nothing}
14
15
  </span>
15
16
  </button>
16
- `}render(){const suggestions=this.effectiveSuggestions;if(suggestions.length===0)return html``;const label=this.label==null?this.localize("suggestionsLabel"):this.label,ariaLabel=this.getAttribute("aria-label")??label,chips=repeat(suggestions,s=>s.suggestionId,(s,i)=>this.renderChip(s,i));return html`
17
+ `}render(){const suggestions=this.effectiveSuggestions;if(suggestions.length===0)return html``;const label=this.label==null?this.localize("suggestionsLabel"):this.label,ariaLabel=this.getAttribute("aria-label")??label,activeIndex=this.effectiveActiveIndex(suggestions),chips=repeat(suggestions,s=>s.suggestionId,(s,i)=>this.renderChip(s,i,activeIndex));return html`
17
18
  <div part="base" role="group" aria-label=${ariaLabel} @keydown=${this.onKeyDown}>
18
19
  ${this.wrap?html`<div part="row" class="row">${chips}</div>`:html`<lr-scroller orientation="horizontal" without-scrollbar><div part="row" class="row">${chips}</div></lr-scroller>`}
19
20
  </div>
@@ -1 +1 @@
1
- import{css}from"lit";const styles=css`:host{max-inline-size:100%;display:block}[part=base]{max-inline-size:100%}.row{justify-content:var(--lr-suggestion-chips-justify,flex-start);gap:var(--lr-space-xs);display:flex}:host([wrap]) .row{flex-wrap:wrap}[part~=chip]{align-items:center;gap:var(--lr-space-xs);max-inline-size:var(--lr-size-16rem);padding-inline:var(--lr-space-m);padding-block:var(--lr-space-xs);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius-pill);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;text-align:start;cursor:pointer;min-block-size:var(--lr-size-2-5rem);transition:background-color var(--lr-transition-fast), border-color var(--lr-transition-fast);flex:none;display:flex}.content{align-items:flex-start;gap:var(--lr-space-2xs);flex-direction:column;min-inline-size:0;display:flex}[part=chip-icon]{line-height:var(--lr-line-height-compact);flex:none}[part~=chip]:hover{background:var(--lr-suggestion-chips-hover-bg,var(--lr-color-brand-quiet));border-color:var(--lr-suggestion-chips-hover-border,var(--lr-color-brand))}[part~=chip]:active{background:color-mix(in oklab, var(--lr-suggestion-chips-hover-bg,var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active));border-color:var(--lr-suggestion-chips-hover-border,var(--lr-color-brand))}[part~=chip]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=chip-label]{-webkit-line-clamp:1;-webkit-box-orient:vertical;inline-size:100%;display:-webkit-box;overflow:hidden}[part=chip-detail]{-webkit-line-clamp:2;inline-size:100%;color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-xs);-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}`;export{styles};
1
+ import{css}from"lit";const styles=css`:host{max-inline-size:100%;display:block}[part=base]{max-inline-size:100%}.row{justify-content:var(--lr-suggestion-chips-justify,flex-start);gap:var(--lr-space-xs);display:flex}:host([wrap]) .row{flex-wrap:wrap}[part~=chip]{align-items:center;gap:var(--lr-space-xs);max-inline-size:var(--lr-size-16rem);padding-inline:var(--lr-space-m);padding-block:var(--lr-space-xs);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius-pill);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;text-align:start;cursor:pointer;min-block-size:var(--lr-size-2-5rem);transition:background-color var(--lr-transition-fast), border-color var(--lr-transition-fast);flex:none;display:flex}.content{align-items:flex-start;gap:var(--lr-space-2xs);flex-direction:column;min-inline-size:0;display:flex}[part=chip-icon]{line-height:var(--lr-line-height-compact);flex:none}[part~=chip]:where(:not(:disabled)):hover{background:var(--lr-suggestion-chips-hover-bg,var(--lr-color-brand-quiet));border-color:var(--lr-suggestion-chips-hover-border,var(--lr-color-brand))}[part~=chip]:where(:not(:disabled)):active{background:color-mix(in oklab, var(--lr-suggestion-chips-hover-bg,var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active));border-color:var(--lr-suggestion-chips-hover-border,var(--lr-color-brand))}[part~=chip]:disabled{cursor:default;opacity:var(--lr-suggestion-chips-disabled-opacity,.5)}[part~=chip]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=chip-label]{-webkit-line-clamp:1;-webkit-box-orient:vertical;inline-size:100%;display:-webkit-box;overflow:hidden}[part=chip-detail]{-webkit-line-clamp:2;inline-size:100%;color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-xs);-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}`;export{styles};
@@ -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{html,nothing}from"lit";import{property}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{getDateTimeFormat}from"../../../internal/intl-cache.js";import{finiteCount}from"../../../internal/numbers.js";import{captureComposedFocusRepair,applyComposedFocusRepair}from"../../../internal/focus-navigation.js";import{styles}from"./transcript-feed.styles.js";import{presenceTrueDefaultBooleanConverter as trueDefaultBooleanConverter}from"../../../internal/converters.js";import{normalizeLyraTimestamp}from"../timestamp.js";import{LYRA_DEFAULT_jumpToLatest,LYRA_DEFAULT_transcriptFeedEmpty,LYRA_DEFAULT_transcriptFeedInterim,LYRA_DEFAULT_transcriptFeedLabel}from"../../../internal/default-strings.generated.js";const NEAR_BOTTOM_PX=48;class LyraTranscriptFeed extends LyraElement{constructor(){super(...arguments),this.entries=[],this.follow=!0,this.showTimestamps=!1,this.maxRenderedEntries=500,this.sessionId="",this.accessibleLabel=null,this._isFirstUpdate=!0,this.announcedFinalIds=new Set,this.sessionChanged=!1,this.pendingSessionBaseline=!1,this.onScroll=e=>{const base=e.currentTarget,atBottom=base.scrollHeight-base.scrollTop-base.clientHeight<=NEAR_BOTTOM_PX;atBottom!==this.follow&&(this.follow=atBottom,this.emit("lr-follow-change",{following:atBottom}))},this.onJumpClick=()=>{const jump=this.renderRoot.querySelector('[part="jump-button"]'),base=this.renderRoot.querySelector('[part="base"]'),repair=jump?captureComposedFocusRepair(jump,base):null,changed=!this.follow;this.scrollToBottom(),changed&&this.emit("lr-follow-change",{following:!0}),repair&&this.updateComplete.then(()=>{this.isConnected&&this.follow&&applyComposedFocusRepair(repair)})}}static{this.defaultStrings={...super.defaultStrings,jumpToLatest:LYRA_DEFAULT_jumpToLatest,transcriptFeedEmpty:LYRA_DEFAULT_transcriptFeedEmpty,transcriptFeedInterim:LYRA_DEFAULT_transcriptFeedInterim,transcriptFeedLabel:LYRA_DEFAULT_transcriptFeedLabel}}static{this.ownedCollectionProperties=Object.freeze(["entries"])}static{this.styles=[LyraElement.styles,styles]}get effectiveMaxRenderedEntries(){return finiteCount(this.maxRenderedEntries,500)}get normalizedEntries(){const seen=new Set;return this.entries.filter(entry=>entry===null||typeof entry!="object"||typeof entry.id!="string"||entry.id.trim().length===0||typeof entry.text!="string"||seen.has(entry.id)?!1:(seen.add(entry.id),!0))}get renderedEntries(){const entries=this.normalizedEntries,maxRenderedEntries=this.effectiveMaxRenderedEntries;return maxRenderedEntries>0&&entries.length>maxRenderedEntries?entries.slice(-maxRenderedEntries):entries}connectedCallback(){super.connectedCallback(),this.syncAnnouncementSink()}disconnectedCallback(){super.disconnectedCallback(),this.releaseAnnouncementSink()}adoptedCallback(){super.adoptedCallback(),this.syncAnnouncementSink()}releaseAnnouncementSink(){this.announcementSink?.release(),this.announcementSink=void 0}syncAnnouncementSink(){if(!this.isConnected){this.releaseAnnouncementSink();return}this.announcementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseAnnouncementSink(),this.announcementSink=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}))}willUpdate(changed){super.willUpdate(changed),this._isFirstUpdate=!this.hasUpdated,this.sessionChanged=changed.has("sessionId")&&this.hasUpdated,this.sessionChanged&&(this.announcedFinalIds.clear(),this.pendingSessionBaseline=!0)}updated(changed){super.updated(changed),changed.has("entries")&&(this.follow&&this.scrollToBottom(),this.announceFinalizedEntries())}announceFinalizedEntries(){const alreadyAnnounced=this.announcedFinalIds,fresh=[];for(const entry of this.normalizedEntries)entry.interim||alreadyAnnounced.has(entry.id)||(alreadyAnnounced.add(entry.id),fresh.push(entry.text));const establishesBaseline=this._isFirstUpdate||this.sessionChanged||this.pendingSessionBaseline;if(this.pendingSessionBaseline=!1,establishesBaseline)return;const sink=this.announcementSink;if(sink)for(const text of fresh){const message=text.replace(/\s+/g," ").trim();message&&sink.announce(message)}}scrollToBottom(){this.follow=!0;const base=this.renderRoot.querySelector('[part="base"]');base&&(base.scrollTop=base.scrollHeight)}showSpeakerFor(list,index){const prev=list[index-1],current=list[index];return!prev||prev.speaker!==current.speaker}formatTs(value){const date=normalizeLyraTimestamp(value);return date?this.formatTimestamp?this.formatTimestamp(date):getDateTimeFormat(this.effectiveLocale,{hour:"numeric",minute:"2-digit"}).format(date):null}renderEntry(entry,showSpeaker,interim){const parts=["entry"];interim&&parts.push("interim");const timestamp=entry.timestamp==null?null:this.formatTs(entry.timestamp);return html`
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{html,nothing}from"lit";import{property}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{getDateTimeFormat}from"../../../internal/intl-cache.js";import{finiteCount}from"../../../internal/numbers.js";import{srOnly}from"../../../internal/a11y.js";import{captureComposedFocusRepair,applyComposedFocusRepair}from"../../../internal/focus-navigation.js";import{styles}from"./transcript-feed.styles.js";import{presenceTrueDefaultBooleanConverter as trueDefaultBooleanConverter}from"../../../internal/converters.js";import{normalizeLyraTimestamp}from"../timestamp.js";import{LYRA_DEFAULT_jumpToLatest,LYRA_DEFAULT_transcriptFeedEmpty,LYRA_DEFAULT_transcriptFeedInterim,LYRA_DEFAULT_transcriptFeedLabel}from"../../../internal/default-strings.generated.js";const NEAR_BOTTOM_PX=48;class LyraTranscriptFeed extends LyraElement{constructor(){super(...arguments),this.entries=[],this.follow=!0,this.showTimestamps=!1,this.maxRenderedEntries=500,this.sessionId="",this.accessibleLabel=null,this._isFirstUpdate=!0,this.announcedFinalIds=new Set,this.sessionChanged=!1,this.pendingSessionBaseline=!1,this.onScroll=e=>{const base=e.currentTarget,atBottom=base.scrollHeight-base.scrollTop-base.clientHeight<=NEAR_BOTTOM_PX;atBottom!==this.follow&&(this.follow=atBottom,this.emit("lr-follow-change",{following:atBottom}))},this.onJumpClick=()=>{const jump=this.renderRoot.querySelector('[part="jump-button"]'),base=this.renderRoot.querySelector('[part="base"]'),repair=jump?captureComposedFocusRepair(jump,base):null,changed=!this.follow;this.scrollToBottom(),changed&&this.emit("lr-follow-change",{following:!0}),repair&&this.updateComplete.then(()=>{this.isConnected&&this.follow&&applyComposedFocusRepair(repair)})}}static{this.defaultStrings={...super.defaultStrings,jumpToLatest:LYRA_DEFAULT_jumpToLatest,transcriptFeedEmpty:LYRA_DEFAULT_transcriptFeedEmpty,transcriptFeedInterim:LYRA_DEFAULT_transcriptFeedInterim,transcriptFeedLabel:LYRA_DEFAULT_transcriptFeedLabel}}static{this.ownedCollectionProperties=Object.freeze(["entries"])}static{this.styles=[LyraElement.styles,srOnly,styles]}get effectiveMaxRenderedEntries(){return finiteCount(this.maxRenderedEntries,500)}get normalizedEntries(){const seen=new Set;return this.entries.filter(entry=>entry===null||typeof entry!="object"||typeof entry.id!="string"||entry.id.trim().length===0||typeof entry.text!="string"||seen.has(entry.id)?!1:(seen.add(entry.id),!0))}get renderedEntries(){const entries=this.normalizedEntries,maxRenderedEntries=this.effectiveMaxRenderedEntries;return maxRenderedEntries>0&&entries.length>maxRenderedEntries?entries.slice(-maxRenderedEntries):entries}connectedCallback(){super.connectedCallback(),this.syncAnnouncementSink()}disconnectedCallback(){super.disconnectedCallback(),this.releaseAnnouncementSink()}adoptedCallback(){super.adoptedCallback(),this.syncAnnouncementSink()}releaseAnnouncementSink(){this.announcementSink?.release(),this.announcementSink=void 0}syncAnnouncementSink(){if(!this.isConnected){this.releaseAnnouncementSink();return}this.announcementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseAnnouncementSink(),this.announcementSink=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}))}willUpdate(changed){super.willUpdate(changed),this._isFirstUpdate=!this.hasUpdated,this.sessionChanged=changed.has("sessionId")&&this.hasUpdated,this.sessionChanged&&(this.announcedFinalIds.clear(),this.pendingSessionBaseline=!0)}updated(changed){super.updated(changed),changed.has("entries")&&(this.follow&&this.scrollToBottom(),this.announceFinalizedEntries())}announceFinalizedEntries(){const alreadyAnnounced=this.announcedFinalIds,fresh=[];for(const entry of this.normalizedEntries)entry.interim||alreadyAnnounced.has(entry.id)||(alreadyAnnounced.add(entry.id),fresh.push(entry.text));const establishesBaseline=this._isFirstUpdate||this.sessionChanged||this.pendingSessionBaseline;if(this.pendingSessionBaseline=!1,establishesBaseline)return;const sink=this.announcementSink;if(sink)for(const text of fresh){const message=text.replace(/\s+/g," ").trim();message&&sink.announce(message)}}scrollToBottom(){this.follow=!0;const base=this.renderRoot.querySelector('[part="base"]');base&&(base.scrollTop=base.scrollHeight)}showSpeakerFor(list,index){const prev=list[index-1],current=list[index];return!prev||prev.speaker!==current.speaker}formatTs(value){const date=normalizeLyraTimestamp(value);return date?this.formatTimestamp?this.formatTimestamp(date):getDateTimeFormat(this.effectiveLocale,{hour:"numeric",minute:"2-digit"}).format(date):null}renderEntry(entry,showSpeaker,interim){const parts=["entry"];interim&&parts.push("interim");const timestamp=entry.timestamp==null?null:this.formatTs(entry.timestamp);return html`
2
2
  <div part=${parts.join(" ")} ?data-interim=${interim}>
3
3
  ${showSpeaker&&entry.speaker?html`<span part="speaker">${entry.speaker}</span>`:nothing}
4
4
  <span part="text" dir="auto">${entry.text}</span>
@@ -1 +1 @@
1
- import{deferredPlace as place}from"../../../internal/anchored-overlay-runtime.js";import{activateNonmodalOverlay}from"../../../internal/nonmodal-overlay-manager.js";import{RenderedStateController}from"../../../internal/rendered-state.js";function activateUsageBadgeOverlay(host,onEscape,orderReservation){const anchor=host.renderRoot.querySelector('[part="base"]'),panel=()=>host.renderRoot.querySelector('[part="tooltip"]'),popup=panel();if(!anchor||!popup)return;const cleanupPositioner=place(anchor,popup,{placement:"top-start"}),handle=activateNonmodalOverlay({host,panel,onEscape,orderReservation,beforeInitialFocus:()=>!1,restoreFocusTo:null}),renderedState=new RenderedStateController(host,panel,rendered=>{handle.isActive()&&(rendered?handle.resume():handle.suspend())});return handle.isActive()&&renderedState.start(),{deactivate:options=>(cleanupPositioner?.(),renderedState.stop(),handle.deactivate(options)),isTopmost:()=>(renderedState.check(),handle.isTopmost())}}export{activateUsageBadgeOverlay};
1
+ import{deferredPlace as place}from"../../../internal/anchored-overlay-runtime.js";import{activateNonmodalOverlay}from"../../../internal/nonmodal-overlay-manager.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{RenderedStateController}from"../../../internal/rendered-state.js";function activateUsageBadgeOverlay(host,onEscape,orderReservation){const anchor=host.renderRoot.querySelector('[part="base"]'),panel=()=>host.renderRoot.querySelector('[part="tooltip"]'),popup=panel();if(!anchor||!popup)return;const cleanupPositioner=place(anchor,popup,{placement:"top-start",strategy:resolveEffectivePositioningStrategy(host,void 0,"fixed")}),handle=activateNonmodalOverlay({host,panel,onEscape,orderReservation,beforeInitialFocus:()=>!1,restoreFocusTo:null}),renderedState=new RenderedStateController(host,panel,rendered=>{handle.isActive()&&(rendered?handle.resume():handle.suspend())});return handle.isActive()&&renderedState.start(),{deactivate:options=>(cleanupPositioner?.(),renderedState.stop(),handle.deactivate(options)),isTopmost:()=>(renderedState.check(),handle.isTopmost())}}export{activateUsageBadgeOverlay};
@@ -47,6 +47,10 @@ import{type TemplateResult,type PropertyValues}from'lit';import{LyraElement}from
47
47
  * @cssprop [--lr-overlay-radius=var(--lr-radius)] - Shared floating-surface corner radius, on the
48
48
  * anchored breakdown tooltip.
49
49
  * @cssprop [--lr-overlay-shadow-anchored=var(--lr-shadow-m)] - Elevation of the anchored surface.
50
+ * @cssprop --lr-positioning-strategy - Cascading `absolute`/`fixed` override for the breakdown
51
+ * tooltip's `fixed` default, read from computed style when it is (re)positioned. Set it once on
52
+ * `:root`, a theme, or one clipping ancestor to change every unset usage badge beneath it; an
53
+ * unrecognized value falls back to `fixed`.
50
54
  * @status stable
51
55
  * @since 4.0.0
52
56
  */
@@ -45,6 +45,14 @@ export type LyraVoicePickerSelectionDirection=LyraSelectionDirection;export inte
45
45
  * Catalog assignments become bounded, clone-owned, frozen snapshots. Create and reassign a new
46
46
  * catalog array after changing its rows; mutating an assigned source does not update the picker.
47
47
  *
48
+ * A catalog row may also set `disabled`, marking it non-actionable exactly like `lr-model-select`'s
49
+ * own catalog rows: `aria-disabled="true"` replaces its selected/active affordances, activating it
50
+ * (click or keyboard) commits nothing and changes no state, and arrow-key/Home/End
51
+ * active-descendant navigation steps past it instead of landing on it. It does not affect that
52
+ * row's own `[part="option-preview"]`, a separate affordance -- a disabled voice remains
53
+ * previewable so a listener can hear why it is excluded. Omitted or `false` renders the row exactly
54
+ * as before this field existed.
55
+ *
48
56
  * @customElement lr-voice-picker
49
57
  * @slot label - Custom visible label content.
50
58
  * @slot hint - Custom hint content.
@@ -56,7 +64,8 @@ export type LyraVoicePickerSelectionDirection=LyraSelectionDirection;export inte
56
64
  * @cssstate invalid - Matches while it does not — from the very first render, before the user has
57
65
  * touched anything.
58
66
  * @cssstate user-valid - `valid`, but only after the user has interacted: a blur of the
59
- * trigger/combobox, or a `reportValidity()` call (which is what a submit attempt runs).
67
+ * trigger/combobox, `reportValidity()`, or a submission attempt. Not after a silent
68
+ * `checkValidity()` alone.
60
69
  * @cssstate user-invalid - `invalid` after that same interaction. Style validation errors with this
61
70
  * rather than `invalid`: a pristine required picker is genuinely invalid, but colouring it red
62
71
  * before the user has done anything is hostile.
@@ -130,6 +139,8 @@ export type LyraVoicePickerSelectionDirection=LyraSelectionDirection;export inte
130
139
  * of a synthetic stale-value option row.
131
140
  * @cssprop [--lr-voice-picker-option-synthetic-font-style=italic] - Font style of a synthetic
132
141
  * stale-value option label.
142
+ * @cssprop [--lr-voice-picker-option-disabled-opacity=0.5] - Opacity of an option row whose catalog
143
+ * entry sets `disabled`.
133
144
  * @cssprop [--lr-voice-picker-preview-hover-bg=var(--lr-color-brand-quiet)] - Shared hover/press
134
145
  * fill for the standalone and row preview actions.
135
146
  * @cssprop [--lr-voice-picker-preview-hover-color=var(--lr-color-brand)] - Shared hover/press
@@ -226,9 +237,10 @@ private updateValidity;
226
237
  * can move -- {@linkcode updateValidity}, `reportValidity()`, and `updated()` -- because this
227
238
  * control drives `ElementInternals` directly rather than through the `FormAssociated` mixin,
228
239
  * which does this for the controls that do use it. `touched` is the interaction flag: it flips
229
- * on the trigger's/input's first blur, and on a `reportValidity()` call, which is what a submit
230
- * attempt runs. */
231
- private publishValidityStates;formResetCallback():void;formStateRestoreCallback(state:string|File|FormData|null,_mode?:'restore'|'autocomplete'):void;formDisabledCallback(disabled:boolean):void;checkValidity():boolean;reportValidity():boolean;
240
+ * on the trigger's/input's first blur, and on interactive validation -- `reportValidity()` and
241
+ * a submission attempt alike, via `installInteractionOnInvalid()`. A silent `checkValidity()`
242
+ * alone never counts. */
243
+ private publishValidityStates;formResetCallback():void;formStateRestoreCallback(state:string|File|FormData|null,_mode?:'restore'|'autocomplete'):void;formDisabledCallback(disabled:boolean):void;private markInteracted;checkValidity():boolean;reportValidity():boolean;
232
244
  /**
233
245
  * Sets or clears a consumer-supplied validation error — the standard channel for a server-side
234
246
  * rejection ("that voice is not enabled for your account") that no client-side constraint can