@nldd/design-system 0.8.62 → 0.8.64

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 (476) hide show
  1. package/dist/assets/styles/{slotted-reset.d.ts → style-resets.d.ts} +1 -1
  2. package/dist/assets/styles/style-resets.d.ts.map +1 -0
  3. package/dist/assets/styles/{slotted-reset.fixtures.d.ts → style-resets.fixtures.d.ts} +4 -4
  4. package/dist/assets/styles/style-resets.fixtures.d.ts.map +1 -0
  5. package/dist/assets/styles/{slotted-reset.fixtures.js → style-resets.fixtures.js} +4 -4
  6. package/dist/assets/styles/style-resets.fixtures.js.map +1 -0
  7. package/dist/assets/styles/{slotted-reset.js → style-resets.js} +1 -1
  8. package/dist/assets/styles/style-resets.js.map +1 -0
  9. package/dist/components/actions/button/button.d.ts +9 -2
  10. package/dist/components/actions/button/button.d.ts.map +1 -1
  11. package/dist/components/actions/button/button.i18n.d.ts +5 -0
  12. package/dist/components/actions/button/button.i18n.d.ts.map +1 -0
  13. package/dist/components/actions/button/button.i18n.js +4 -0
  14. package/dist/components/actions/button/button.i18n.js.map +1 -0
  15. package/dist/components/actions/button/button.js +5 -2
  16. package/dist/components/actions/button/button.js.map +1 -1
  17. package/dist/components/actions/button/button.styles.d.ts.map +1 -1
  18. package/dist/components/actions/button/button.styles.js +21 -7
  19. package/dist/components/actions/button/button.styles.js.map +1 -1
  20. package/dist/components/actions/button/button.template.d.ts.map +1 -1
  21. package/dist/components/actions/button/button.template.js +17 -4
  22. package/dist/components/actions/button/button.template.js.map +1 -1
  23. package/dist/components/actions/button-bar/button-bar.styles.d.ts.map +1 -1
  24. package/dist/components/actions/button-bar/button-bar.styles.js +3 -0
  25. package/dist/components/actions/button-bar/button-bar.styles.js.map +1 -1
  26. package/dist/components/actions/button-group/button-group.styles.d.ts.map +1 -1
  27. package/dist/components/actions/button-group/button-group.styles.js +3 -0
  28. package/dist/components/actions/button-group/button-group.styles.js.map +1 -1
  29. package/dist/components/actions/icon-button/icon-button.d.ts +10 -2
  30. package/dist/components/actions/icon-button/icon-button.d.ts.map +1 -1
  31. package/dist/components/actions/icon-button/icon-button.i18n.d.ts +5 -0
  32. package/dist/components/actions/icon-button/icon-button.i18n.d.ts.map +1 -0
  33. package/dist/components/actions/icon-button/icon-button.i18n.js +4 -0
  34. package/dist/components/actions/icon-button/icon-button.i18n.js.map +1 -0
  35. package/dist/components/actions/icon-button/icon-button.js +5 -2
  36. package/dist/components/actions/icon-button/icon-button.js.map +1 -1
  37. package/dist/components/actions/icon-button/icon-button.styles.d.ts.map +1 -1
  38. package/dist/components/actions/icon-button/icon-button.styles.js +4 -1
  39. package/dist/components/actions/icon-button/icon-button.styles.js.map +1 -1
  40. package/dist/components/actions/icon-button/icon-button.template.d.ts.map +1 -1
  41. package/dist/components/actions/icon-button/icon-button.template.js +11 -2
  42. package/dist/components/actions/icon-button/icon-button.template.js.map +1 -1
  43. package/dist/components/actions/menu/menu.styles.d.ts.map +1 -1
  44. package/dist/components/actions/menu/menu.styles.js +4 -1
  45. package/dist/components/actions/menu/menu.styles.js.map +1 -1
  46. package/dist/components/actions/split-button/split-button.styles.d.ts.map +1 -1
  47. package/dist/components/actions/split-button/split-button.styles.js +4 -1
  48. package/dist/components/actions/split-button/split-button.styles.js.map +1 -1
  49. package/dist/components/actions/toolbar/toolbar.styles.d.ts.map +1 -1
  50. package/dist/components/actions/toolbar/toolbar.styles.js +4 -1
  51. package/dist/components/actions/toolbar/toolbar.styles.js.map +1 -1
  52. package/dist/components/components.js +64 -62
  53. package/dist/components/content/blockquote/blockquote.styles.d.ts.map +1 -1
  54. package/dist/components/content/blockquote/blockquote.styles.js +4 -1
  55. package/dist/components/content/blockquote/blockquote.styles.js.map +1 -1
  56. package/dist/components/content/byline/byline.d.ts +11 -0
  57. package/dist/components/content/byline/byline.d.ts.map +1 -1
  58. package/dist/components/content/byline/byline.js +20 -0
  59. package/dist/components/content/byline/byline.js.map +1 -1
  60. package/dist/components/content/byline/byline.styles.d.ts.map +1 -1
  61. package/dist/components/content/byline/byline.styles.js +17 -2
  62. package/dist/components/content/byline/byline.styles.js.map +1 -1
  63. package/dist/components/content/byline/byline.template.d.ts.map +1 -1
  64. package/dist/components/content/byline/byline.template.js +17 -2
  65. package/dist/components/content/byline/byline.template.js.map +1 -1
  66. package/dist/components/content/code-viewer/code-viewer.styles.d.ts.map +1 -1
  67. package/dist/components/content/code-viewer/code-viewer.styles.js +4 -1
  68. package/dist/components/content/code-viewer/code-viewer.styles.js.map +1 -1
  69. package/dist/components/content/icon/icon-aliases.js +1 -1
  70. package/dist/components/content/icon/icon-aliases.js.map +1 -1
  71. package/dist/components/content/icon/icon.styles.d.ts.map +1 -1
  72. package/dist/components/content/icon/icon.styles.js +3 -0
  73. package/dist/components/content/icon/icon.styles.js.map +1 -1
  74. package/dist/components/content/image/image.styles.d.ts.map +1 -1
  75. package/dist/components/content/image/image.styles.js +4 -1
  76. package/dist/components/content/image/image.styles.js.map +1 -1
  77. package/dist/components/content/keyboard-shortcut/keyboard-shortcut.styles.d.ts.map +1 -1
  78. package/dist/components/content/keyboard-shortcut/keyboard-shortcut.styles.js +4 -1
  79. package/dist/components/content/keyboard-shortcut/keyboard-shortcut.styles.js.map +1 -1
  80. package/dist/components/content/tag/tag.styles.d.ts.map +1 -1
  81. package/dist/components/content/tag/tag.styles.js +4 -1
  82. package/dist/components/content/tag/tag.styles.js.map +1 -1
  83. package/dist/components/content/title/title.styles.d.ts.map +1 -1
  84. package/dist/components/content/title/title.styles.js +4 -1
  85. package/dist/components/content/title/title.styles.js.map +1 -1
  86. package/dist/components/content/tooltip/tooltip.styles.d.ts.map +1 -1
  87. package/dist/components/content/tooltip/tooltip.styles.js +4 -1
  88. package/dist/components/content/tooltip/tooltip.styles.js.map +1 -1
  89. package/dist/components/forms/form-actions/form-actions.styles.d.ts.map +1 -1
  90. package/dist/components/forms/form-actions/form-actions.styles.js +4 -0
  91. package/dist/components/forms/form-actions/form-actions.styles.js.map +1 -1
  92. package/dist/components/forms/form-field/form-field.styles.d.ts.map +1 -1
  93. package/dist/components/forms/form-field/form-field.styles.js +5 -1
  94. package/dist/components/forms/form-field/form-field.styles.js.map +1 -1
  95. package/dist/components/{index-DPe5myEj.js → index-BNhqNvDd.js} +4882 -2776
  96. package/dist/components/index.d.ts +2 -0
  97. package/dist/components/index.d.ts.map +1 -1
  98. package/dist/components/index.js +2 -0
  99. package/dist/components/index.js.map +1 -1
  100. package/dist/components/inputs/checkbox/checkbox.styles.d.ts.map +1 -1
  101. package/dist/components/inputs/checkbox/checkbox.styles.js +3 -0
  102. package/dist/components/inputs/checkbox/checkbox.styles.js.map +1 -1
  103. package/dist/components/inputs/checkbox-field/checkbox-field.styles.d.ts.map +1 -1
  104. package/dist/components/inputs/checkbox-field/checkbox-field.styles.js +4 -1
  105. package/dist/components/inputs/checkbox-field/checkbox-field.styles.js.map +1 -1
  106. package/dist/components/inputs/code-editor/code-editor.styles.d.ts.map +1 -1
  107. package/dist/components/inputs/code-editor/code-editor.styles.js +4 -1
  108. package/dist/components/inputs/code-editor/code-editor.styles.js.map +1 -1
  109. package/dist/components/inputs/combo-box/combo-box.styles.d.ts.map +1 -1
  110. package/dist/components/inputs/combo-box/combo-box.styles.js +4 -1
  111. package/dist/components/inputs/combo-box/combo-box.styles.js.map +1 -1
  112. package/dist/components/inputs/dropdown/dropdown.styles.d.ts.map +1 -1
  113. package/dist/components/inputs/dropdown/dropdown.styles.js +4 -1
  114. package/dist/components/inputs/dropdown/dropdown.styles.js.map +1 -1
  115. package/dist/components/inputs/multi-line-text-field/multi-line-text-field.styles.d.ts.map +1 -1
  116. package/dist/components/inputs/multi-line-text-field/multi-line-text-field.styles.js +4 -1
  117. package/dist/components/inputs/multi-line-text-field/multi-line-text-field.styles.js.map +1 -1
  118. package/dist/components/inputs/number-field/number-field.styles.d.ts.map +1 -1
  119. package/dist/components/inputs/number-field/number-field.styles.js +4 -1
  120. package/dist/components/inputs/number-field/number-field.styles.js.map +1 -1
  121. package/dist/components/inputs/password-field/password-field.styles.d.ts.map +1 -1
  122. package/dist/components/inputs/password-field/password-field.styles.js +4 -1
  123. package/dist/components/inputs/password-field/password-field.styles.js.map +1 -1
  124. package/dist/components/inputs/radio-button/radio-button.styles.d.ts.map +1 -1
  125. package/dist/components/inputs/radio-button/radio-button.styles.js +3 -0
  126. package/dist/components/inputs/radio-button/radio-button.styles.js.map +1 -1
  127. package/dist/components/inputs/radio-button-field/radio-button-field.styles.d.ts.map +1 -1
  128. package/dist/components/inputs/radio-button-field/radio-button-field.styles.js +4 -1
  129. package/dist/components/inputs/radio-button-field/radio-button-field.styles.js.map +1 -1
  130. package/dist/components/inputs/radio-button-group/radio-button-group.styles.d.ts.map +1 -1
  131. package/dist/components/inputs/radio-button-group/radio-button-group.styles.js +4 -1
  132. package/dist/components/inputs/radio-button-group/radio-button-group.styles.js.map +1 -1
  133. package/dist/components/inputs/search-field/search-field.styles.d.ts.map +1 -1
  134. package/dist/components/inputs/search-field/search-field.styles.js +13 -1
  135. package/dist/components/inputs/search-field/search-field.styles.js.map +1 -1
  136. package/dist/components/inputs/search-field/search-field.template.d.ts.map +1 -1
  137. package/dist/components/inputs/search-field/search-field.template.js +47 -39
  138. package/dist/components/inputs/search-field/search-field.template.js.map +1 -1
  139. package/dist/components/inputs/segmented-control/segmented-control.styles.d.ts.map +1 -1
  140. package/dist/components/inputs/segmented-control/segmented-control.styles.js +4 -1
  141. package/dist/components/inputs/segmented-control/segmented-control.styles.js.map +1 -1
  142. package/dist/components/inputs/stepper/stepper.styles.d.ts.map +1 -1
  143. package/dist/components/inputs/stepper/stepper.styles.js +3 -0
  144. package/dist/components/inputs/stepper/stepper.styles.js.map +1 -1
  145. package/dist/components/inputs/switch/switch.styles.d.ts.map +1 -1
  146. package/dist/components/inputs/switch/switch.styles.js +3 -0
  147. package/dist/components/inputs/switch/switch.styles.js.map +1 -1
  148. package/dist/components/inputs/switch-field/switch-field.styles.d.ts.map +1 -1
  149. package/dist/components/inputs/switch-field/switch-field.styles.js +4 -1
  150. package/dist/components/inputs/switch-field/switch-field.styles.js.map +1 -1
  151. package/dist/components/inputs/text-field/text-field.styles.d.ts.map +1 -1
  152. package/dist/components/inputs/text-field/text-field.styles.js +4 -1
  153. package/dist/components/inputs/text-field/text-field.styles.js.map +1 -1
  154. package/dist/components/inputs/toggle-button/toggle-button.styles.d.ts.map +1 -1
  155. package/dist/components/inputs/toggle-button/toggle-button.styles.js +4 -1
  156. package/dist/components/inputs/toggle-button/toggle-button.styles.js.map +1 -1
  157. package/dist/components/inputs/toggle-button-group/toggle-button-group.styles.d.ts.map +1 -1
  158. package/dist/components/inputs/toggle-button-group/toggle-button-group.styles.js +3 -0
  159. package/dist/components/inputs/toggle-button-group/toggle-button-group.styles.js.map +1 -1
  160. package/dist/components/inputs/token/token.styles.d.ts.map +1 -1
  161. package/dist/components/inputs/token/token.styles.js +4 -1
  162. package/dist/components/inputs/token/token.styles.js.map +1 -1
  163. package/dist/components/layout/app-view/app-view.styles.d.ts.map +1 -1
  164. package/dist/components/layout/app-view/app-view.styles.js +3 -0
  165. package/dist/components/layout/app-view/app-view.styles.js.map +1 -1
  166. package/dist/components/layout/box/box.styles.d.ts.map +1 -1
  167. package/dist/components/layout/box/box.styles.js +3 -0
  168. package/dist/components/layout/box/box.styles.js.map +1 -1
  169. package/dist/components/layout/card/card.d.ts +28 -2
  170. package/dist/components/layout/card/card.d.ts.map +1 -1
  171. package/dist/components/layout/card/card.i18n.d.ts +5 -0
  172. package/dist/components/layout/card/card.i18n.d.ts.map +1 -0
  173. package/dist/components/layout/card/card.i18n.js +4 -0
  174. package/dist/components/layout/card/card.i18n.js.map +1 -0
  175. package/dist/components/layout/card/card.js +54 -2
  176. package/dist/components/layout/card/card.js.map +1 -1
  177. package/dist/components/layout/card/card.styles.d.ts.map +1 -1
  178. package/dist/components/layout/card/card.styles.js +20 -0
  179. package/dist/components/layout/card/card.styles.js.map +1 -1
  180. package/dist/components/layout/card/card.template.d.ts.map +1 -1
  181. package/dist/components/layout/card/card.template.js +17 -1
  182. package/dist/components/layout/card/card.template.js.map +1 -1
  183. package/dist/components/layout/collection/collection.d.ts +7 -5
  184. package/dist/components/layout/collection/collection.d.ts.map +1 -1
  185. package/dist/components/layout/collection/collection.js +17 -5
  186. package/dist/components/layout/collection/collection.js.map +1 -1
  187. package/dist/components/layout/collection/collection.styles.js +12 -12
  188. package/dist/components/layout/collection/collection.styles.js.map +1 -1
  189. package/dist/components/layout/collection/collection.template.d.ts.map +1 -1
  190. package/dist/components/layout/collection/collection.template.js +4 -2
  191. package/dist/components/layout/collection/collection.template.js.map +1 -1
  192. package/dist/components/layout/container/container.d.ts +7 -3
  193. package/dist/components/layout/container/container.d.ts.map +1 -1
  194. package/dist/components/layout/container/container.js +15 -3
  195. package/dist/components/layout/container/container.js.map +1 -1
  196. package/dist/components/layout/container/container.styles.d.ts.map +1 -1
  197. package/dist/components/layout/container/container.styles.js +42 -1
  198. package/dist/components/layout/container/container.styles.js.map +1 -1
  199. package/dist/components/layout/divider/divider.styles.d.ts.map +1 -1
  200. package/dist/components/layout/divider/divider.styles.js +3 -0
  201. package/dist/components/layout/divider/divider.styles.js.map +1 -1
  202. package/dist/components/layout/page/page.styles.d.ts.map +1 -1
  203. package/dist/components/layout/page/page.styles.js +3 -0
  204. package/dist/components/layout/page/page.styles.js.map +1 -1
  205. package/dist/components/layout/page-footer/page-footer.d.ts +1 -0
  206. package/dist/components/layout/page-footer/page-footer.d.ts.map +1 -1
  207. package/dist/components/layout/page-footer/page-footer.js +12 -4
  208. package/dist/components/layout/page-footer/page-footer.js.map +1 -1
  209. package/dist/components/layout/page-footer/page-footer.styles.d.ts.map +1 -1
  210. package/dist/components/layout/page-footer/page-footer.styles.js +13 -1
  211. package/dist/components/layout/page-footer/page-footer.styles.js.map +1 -1
  212. package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.styles.d.ts.map +1 -1
  213. package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.styles.js +3 -0
  214. package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.styles.js.map +1 -1
  215. package/dist/components/layout/page-sections/hero/hero.d.ts +25 -5
  216. package/dist/components/layout/page-sections/hero/hero.d.ts.map +1 -1
  217. package/dist/components/layout/page-sections/hero/hero.js +60 -11
  218. package/dist/components/layout/page-sections/hero/hero.js.map +1 -1
  219. package/dist/components/layout/page-sections/hero/hero.styles.d.ts.map +1 -1
  220. package/dist/components/layout/page-sections/hero/hero.styles.js +15 -4
  221. package/dist/components/layout/page-sections/hero/hero.styles.js.map +1 -1
  222. package/dist/components/layout/page-sections/hero/hero.template.d.ts.map +1 -1
  223. package/dist/components/layout/page-sections/hero/hero.template.js +13 -1
  224. package/dist/components/layout/page-sections/hero/hero.template.js.map +1 -1
  225. package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.styles.d.ts.map +1 -1
  226. package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.styles.js +3 -0
  227. package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.styles.js.map +1 -1
  228. package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.styles.d.ts.map +1 -1
  229. package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.styles.js +3 -0
  230. package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.styles.js.map +1 -1
  231. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.d.ts +119 -0
  232. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.d.ts.map +1 -0
  233. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.i18n.d.ts +6 -0
  234. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.i18n.d.ts.map +1 -0
  235. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.i18n.js +5 -0
  236. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.i18n.js.map +1 -0
  237. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.js +219 -0
  238. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.js.map +1 -0
  239. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.styles.d.ts +2 -0
  240. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.styles.d.ts.map +1 -0
  241. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.styles.js +157 -0
  242. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.styles.js.map +1 -0
  243. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.template.d.ts +4 -0
  244. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.template.d.ts.map +1 -0
  245. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.template.js +57 -0
  246. package/dist/components/layout/page-sections/sidebar-section/sidebar-section.template.js.map +1 -0
  247. package/dist/components/layout/page-sections/simple-section/simple-section.styles.d.ts.map +1 -1
  248. package/dist/components/layout/page-sections/simple-section/simple-section.styles.js +3 -0
  249. package/dist/components/layout/page-sections/simple-section/simple-section.styles.js.map +1 -1
  250. package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.styles.d.ts.map +1 -1
  251. package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.styles.js +3 -0
  252. package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.styles.js.map +1 -1
  253. package/dist/components/layout/popover/popover.styles.d.ts.map +1 -1
  254. package/dist/components/layout/popover/popover.styles.js +3 -0
  255. package/dist/components/layout/popover/popover.styles.js.map +1 -1
  256. package/dist/components/layout/sheet/sheet.styles.d.ts.map +1 -1
  257. package/dist/components/layout/sheet/sheet.styles.js +3 -0
  258. package/dist/components/layout/sheet/sheet.styles.js.map +1 -1
  259. package/dist/components/layout/spacer/spacer.styles.d.ts.map +1 -1
  260. package/dist/components/layout/spacer/spacer.styles.js +3 -0
  261. package/dist/components/layout/spacer/spacer.styles.js.map +1 -1
  262. package/dist/components/layout/split-views/bar-split-view/bar-split-view.styles.d.ts.map +1 -1
  263. package/dist/components/layout/split-views/bar-split-view/bar-split-view.styles.js +3 -0
  264. package/dist/components/layout/split-views/bar-split-view/bar-split-view.styles.js.map +1 -1
  265. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.d.ts +47 -19
  266. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.d.ts.map +1 -1
  267. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.js +123 -73
  268. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.js.map +1 -1
  269. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.styles.d.ts.map +1 -1
  270. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.styles.js +17 -14
  271. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.styles.js.map +1 -1
  272. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.template.d.ts.map +1 -1
  273. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.template.js +10 -8
  274. package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.template.js.map +1 -1
  275. package/dist/components/layout/split-views/side-by-side-split-view/side-by-side-split-view.styles.d.ts.map +1 -1
  276. package/dist/components/layout/split-views/side-by-side-split-view/side-by-side-split-view.styles.js +3 -0
  277. package/dist/components/layout/split-views/side-by-side-split-view/side-by-side-split-view.styles.js.map +1 -1
  278. package/dist/components/layout/split-views/split-view-divider/split-view-divider.styles.d.ts.map +1 -1
  279. package/dist/components/layout/split-views/split-view-divider/split-view-divider.styles.js +3 -0
  280. package/dist/components/layout/split-views/split-view-divider/split-view-divider.styles.js.map +1 -1
  281. package/dist/components/layout/split-views/split-view-pane/split-view-pane.styles.d.ts.map +1 -1
  282. package/dist/components/layout/split-views/split-view-pane/split-view-pane.styles.js +3 -0
  283. package/dist/components/layout/split-views/split-view-pane/split-view-pane.styles.js.map +1 -1
  284. package/dist/components/layout/split-views/stacked-split-view/stacked-split-view.styles.d.ts.map +1 -1
  285. package/dist/components/layout/split-views/stacked-split-view/stacked-split-view.styles.js +3 -0
  286. package/dist/components/layout/split-views/stacked-split-view/stacked-split-view.styles.js.map +1 -1
  287. package/dist/components/layout/window/window.d.ts +1 -19
  288. package/dist/components/layout/window/window.d.ts.map +1 -1
  289. package/dist/components/layout/window/window.js +1 -187
  290. package/dist/components/layout/window/window.js.map +1 -1
  291. package/dist/components/layout/window/window.styles.d.ts.map +1 -1
  292. package/dist/components/layout/window/window.styles.js +5 -28
  293. package/dist/components/layout/window/window.styles.js.map +1 -1
  294. package/dist/components/layout/window/window.template.d.ts.map +1 -1
  295. package/dist/components/layout/window/window.template.js +1 -2
  296. package/dist/components/layout/window/window.template.js.map +1 -1
  297. package/dist/components/lists-and-tables/cells/cell/cell.styles.d.ts.map +1 -1
  298. package/dist/components/lists-and-tables/cells/cell/cell.styles.js +4 -1
  299. package/dist/components/lists-and-tables/cells/cell/cell.styles.js.map +1 -1
  300. package/dist/components/lists-and-tables/cells/description-cell/description-cell.styles.d.ts.map +1 -1
  301. package/dist/components/lists-and-tables/cells/description-cell/description-cell.styles.js +4 -1
  302. package/dist/components/lists-and-tables/cells/description-cell/description-cell.styles.js.map +1 -1
  303. package/dist/components/lists-and-tables/cells/drag-handle-cell/drag-handle-cell.styles.d.ts.map +1 -1
  304. package/dist/components/lists-and-tables/cells/drag-handle-cell/drag-handle-cell.styles.js +3 -0
  305. package/dist/components/lists-and-tables/cells/drag-handle-cell/drag-handle-cell.styles.js.map +1 -1
  306. package/dist/components/lists-and-tables/cells/icon-cell/icon-cell.styles.d.ts.map +1 -1
  307. package/dist/components/lists-and-tables/cells/icon-cell/icon-cell.styles.js +3 -0
  308. package/dist/components/lists-and-tables/cells/icon-cell/icon-cell.styles.js.map +1 -1
  309. package/dist/components/lists-and-tables/cells/spacer-cell/spacer-cell.styles.d.ts.map +1 -1
  310. package/dist/components/lists-and-tables/cells/spacer-cell/spacer-cell.styles.js +3 -0
  311. package/dist/components/lists-and-tables/cells/spacer-cell/spacer-cell.styles.js.map +1 -1
  312. package/dist/components/lists-and-tables/cells/text-cell/text-cell.styles.d.ts.map +1 -1
  313. package/dist/components/lists-and-tables/cells/text-cell/text-cell.styles.js +4 -1
  314. package/dist/components/lists-and-tables/cells/text-cell/text-cell.styles.js.map +1 -1
  315. package/dist/components/lists-and-tables/cells/timeline-track-cell/timeline-track-cell.styles.d.ts.map +1 -1
  316. package/dist/components/lists-and-tables/cells/timeline-track-cell/timeline-track-cell.styles.js +3 -0
  317. package/dist/components/lists-and-tables/cells/timeline-track-cell/timeline-track-cell.styles.js.map +1 -1
  318. package/dist/components/lists-and-tables/cells/title-cell/title-cell.styles.d.ts.map +1 -1
  319. package/dist/components/lists-and-tables/cells/title-cell/title-cell.styles.js +4 -1
  320. package/dist/components/lists-and-tables/cells/title-cell/title-cell.styles.js.map +1 -1
  321. package/dist/components/lists-and-tables/list/list.d.ts +183 -8
  322. package/dist/components/lists-and-tables/list/list.d.ts.map +1 -1
  323. package/dist/components/lists-and-tables/list/list.i18n.d.ts +3 -0
  324. package/dist/components/lists-and-tables/list/list.i18n.d.ts.map +1 -1
  325. package/dist/components/lists-and-tables/list/list.i18n.js +3 -0
  326. package/dist/components/lists-and-tables/list/list.i18n.js.map +1 -1
  327. package/dist/components/lists-and-tables/list/list.js +522 -17
  328. package/dist/components/lists-and-tables/list/list.js.map +1 -1
  329. package/dist/components/lists-and-tables/list/list.styles.d.ts.map +1 -1
  330. package/dist/components/lists-and-tables/list/list.styles.js +163 -25
  331. package/dist/components/lists-and-tables/list/list.styles.js.map +1 -1
  332. package/dist/components/lists-and-tables/list/list.template.d.ts +26 -1
  333. package/dist/components/lists-and-tables/list/list.template.d.ts.map +1 -1
  334. package/dist/components/lists-and-tables/list/list.template.js +76 -18
  335. package/dist/components/lists-and-tables/list/list.template.js.map +1 -1
  336. package/dist/components/lists-and-tables/list-item/list-item.d.ts +30 -9
  337. package/dist/components/lists-and-tables/list-item/list-item.d.ts.map +1 -1
  338. package/dist/components/lists-and-tables/list-item/list-item.i18n.d.ts +1 -1
  339. package/dist/components/lists-and-tables/list-item/list-item.i18n.js +1 -1
  340. package/dist/components/lists-and-tables/list-item/list-item.i18n.js.map +1 -1
  341. package/dist/components/lists-and-tables/list-item/list-item.js +81 -20
  342. package/dist/components/lists-and-tables/list-item/list-item.js.map +1 -1
  343. package/dist/components/lists-and-tables/list-item/list-item.styles.d.ts.map +1 -1
  344. package/dist/components/lists-and-tables/list-item/list-item.styles.js +55 -32
  345. package/dist/components/lists-and-tables/list-item/list-item.styles.js.map +1 -1
  346. package/dist/components/lists-and-tables/list-item/list-item.template.d.ts +1 -1
  347. package/dist/components/lists-and-tables/list-item/list-item.template.d.ts.map +1 -1
  348. package/dist/components/lists-and-tables/list-item/list-item.template.js +10 -5
  349. package/dist/components/lists-and-tables/list-item/list-item.template.js.map +1 -1
  350. package/dist/components/lists-and-tables/table/table.styles.d.ts.map +1 -1
  351. package/dist/components/lists-and-tables/table/table.styles.js +4 -1
  352. package/dist/components/lists-and-tables/table/table.styles.js.map +1 -1
  353. package/dist/components/navigation/breadcrumbs/breadcrumbs.d.ts +0 -44
  354. package/dist/components/navigation/breadcrumbs/breadcrumbs.d.ts.map +1 -1
  355. package/dist/components/navigation/breadcrumbs/breadcrumbs.i18n.d.ts +0 -1
  356. package/dist/components/navigation/breadcrumbs/breadcrumbs.i18n.d.ts.map +1 -1
  357. package/dist/components/navigation/breadcrumbs/breadcrumbs.i18n.js +0 -1
  358. package/dist/components/navigation/breadcrumbs/breadcrumbs.i18n.js.map +1 -1
  359. package/dist/components/navigation/breadcrumbs/breadcrumbs.js +1 -84
  360. package/dist/components/navigation/breadcrumbs/breadcrumbs.js.map +1 -1
  361. package/dist/components/navigation/breadcrumbs/breadcrumbs.styles.d.ts.map +1 -1
  362. package/dist/components/navigation/breadcrumbs/breadcrumbs.styles.js +6 -52
  363. package/dist/components/navigation/breadcrumbs/breadcrumbs.styles.js.map +1 -1
  364. package/dist/components/navigation/breadcrumbs/breadcrumbs.template.d.ts.map +1 -1
  365. package/dist/components/navigation/breadcrumbs/breadcrumbs.template.js +1 -17
  366. package/dist/components/navigation/breadcrumbs/breadcrumbs.template.js.map +1 -1
  367. package/dist/components/navigation/document-tab-bar/document-tab-bar.styles.d.ts.map +1 -1
  368. package/dist/components/navigation/document-tab-bar/document-tab-bar.styles.js +5 -1
  369. package/dist/components/navigation/document-tab-bar/document-tab-bar.styles.js.map +1 -1
  370. package/dist/components/navigation/link/link.d.ts +9 -2
  371. package/dist/components/navigation/link/link.d.ts.map +1 -1
  372. package/dist/components/navigation/link/link.i18n.d.ts +5 -0
  373. package/dist/components/navigation/link/link.i18n.d.ts.map +1 -0
  374. package/dist/components/navigation/link/link.i18n.js +4 -0
  375. package/dist/components/navigation/link/link.i18n.js.map +1 -0
  376. package/dist/components/navigation/link/link.js +5 -2
  377. package/dist/components/navigation/link/link.js.map +1 -1
  378. package/dist/components/navigation/link/link.styles.d.ts.map +1 -1
  379. package/dist/components/navigation/link/link.styles.js +18 -1
  380. package/dist/components/navigation/link/link.styles.js.map +1 -1
  381. package/dist/components/navigation/link/link.template.d.ts.map +1 -1
  382. package/dist/components/navigation/link/link.template.js +14 -1
  383. package/dist/components/navigation/link/link.template.js.map +1 -1
  384. package/dist/components/navigation/menu-bar/menu-bar.styles.d.ts.map +1 -1
  385. package/dist/components/navigation/menu-bar/menu-bar.styles.js +4 -1
  386. package/dist/components/navigation/menu-bar/menu-bar.styles.js.map +1 -1
  387. package/dist/components/navigation/menu-bar-item/menu-bar-item.styles.d.ts.map +1 -1
  388. package/dist/components/navigation/menu-bar-item/menu-bar-item.styles.js +4 -1
  389. package/dist/components/navigation/menu-bar-item/menu-bar-item.styles.js.map +1 -1
  390. package/dist/components/navigation/pagination/pagination.styles.d.ts.map +1 -1
  391. package/dist/components/navigation/pagination/pagination.styles.js +4 -1
  392. package/dist/components/navigation/pagination/pagination.styles.js.map +1 -1
  393. package/dist/components/navigation/skip-link/skip-link.styles.d.ts.map +1 -1
  394. package/dist/components/navigation/skip-link/skip-link.styles.js +4 -1
  395. package/dist/components/navigation/skip-link/skip-link.styles.js.map +1 -1
  396. package/dist/components/navigation/tab-bar/tab-bar.d.ts.map +1 -1
  397. package/dist/components/navigation/tab-bar/tab-bar.js +11 -4
  398. package/dist/components/navigation/tab-bar/tab-bar.js.map +1 -1
  399. package/dist/components/navigation/tab-bar/tab-bar.styles.d.ts.map +1 -1
  400. package/dist/components/navigation/tab-bar/tab-bar.styles.js +29 -4
  401. package/dist/components/navigation/tab-bar/tab-bar.styles.js.map +1 -1
  402. package/dist/components/navigation/top-navigation-bar/top-navigation-bar.d.ts +5 -0
  403. package/dist/components/navigation/top-navigation-bar/top-navigation-bar.d.ts.map +1 -1
  404. package/dist/components/navigation/top-navigation-bar/top-navigation-bar.js +17 -0
  405. package/dist/components/navigation/top-navigation-bar/top-navigation-bar.js.map +1 -1
  406. package/dist/components/navigation/top-navigation-bar/top-navigation-bar.styles.d.ts.map +1 -1
  407. package/dist/components/navigation/top-navigation-bar/top-navigation-bar.styles.js +32 -16
  408. package/dist/components/navigation/top-navigation-bar/top-navigation-bar.styles.js.map +1 -1
  409. package/dist/components/navigation/top-title-bar/top-title-bar.styles.d.ts.map +1 -1
  410. package/dist/components/navigation/top-title-bar/top-title-bar.styles.js +4 -1
  411. package/dist/components/navigation/top-title-bar/top-title-bar.styles.js.map +1 -1
  412. package/dist/components/{prism-python-mIMEATOA.js → prism-python--N285k7w.js} +1 -1
  413. package/dist/components/{prism-rust-Ig3wVTFD.js → prism-rust-Cnm1tSdo.js} +1 -1
  414. package/dist/components/{prism-typescript-BeulJu8Z.js → prism-typescript-BPJAiB1s.js} +1 -1
  415. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.d.ts +35 -12
  416. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.d.ts.map +1 -1
  417. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.js +48 -13
  418. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.js.map +1 -1
  419. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.styles.d.ts.map +1 -1
  420. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.styles.js +81 -18
  421. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.styles.js.map +1 -1
  422. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.template.d.ts +1 -2
  423. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.template.d.ts.map +1 -1
  424. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.template.js +21 -7
  425. package/dist/components/status-and-feedback/activity-indicator/activity-indicator.template.js.map +1 -1
  426. package/dist/components/status-and-feedback/badge/badge.styles.d.ts.map +1 -1
  427. package/dist/components/status-and-feedback/badge/badge.styles.js +4 -1
  428. package/dist/components/status-and-feedback/badge/badge.styles.js.map +1 -1
  429. package/dist/components/status-and-feedback/banner/banner.styles.d.ts.map +1 -1
  430. package/dist/components/status-and-feedback/banner/banner.styles.js +4 -1
  431. package/dist/components/status-and-feedback/banner/banner.styles.js.map +1 -1
  432. package/dist/components/status-and-feedback/inline-dialog/inline-dialog.d.ts.map +1 -1
  433. package/dist/components/status-and-feedback/inline-dialog/inline-dialog.js +12 -2
  434. package/dist/components/status-and-feedback/inline-dialog/inline-dialog.js.map +1 -1
  435. package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.d.ts.map +1 -1
  436. package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.js +4 -1
  437. package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.js.map +1 -1
  438. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.d.ts +124 -0
  439. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.d.ts.map +1 -0
  440. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.i18n.d.ts +6 -0
  441. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.i18n.d.ts.map +1 -0
  442. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.i18n.js +5 -0
  443. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.i18n.js.map +1 -0
  444. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.js +550 -0
  445. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.js.map +1 -0
  446. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.styles.d.ts +2 -0
  447. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.styles.d.ts.map +1 -0
  448. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.styles.js +304 -0
  449. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.styles.js.map +1 -0
  450. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.template.d.ts +4 -0
  451. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.template.d.ts.map +1 -0
  452. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.template.js +72 -0
  453. package/dist/components/status-and-feedback/just-in-time-education/just-in-time-education.template.js.map +1 -0
  454. package/dist/components/status-and-feedback/modal-dialog/modal-dialog.styles.d.ts.map +1 -1
  455. package/dist/components/status-and-feedback/modal-dialog/modal-dialog.styles.js +4 -1
  456. package/dist/components/status-and-feedback/modal-dialog/modal-dialog.styles.js.map +1 -1
  457. package/dist/components/status-and-feedback/progress-bar/progress-bar.styles.d.ts.map +1 -1
  458. package/dist/components/status-and-feedback/progress-bar/progress-bar.styles.js +4 -1
  459. package/dist/components/status-and-feedback/progress-bar/progress-bar.styles.js.map +1 -1
  460. package/dist/components/status-and-feedback/progress-circle/progress-circle.styles.d.ts.map +1 -1
  461. package/dist/components/status-and-feedback/progress-circle/progress-circle.styles.js +4 -1
  462. package/dist/components/status-and-feedback/progress-circle/progress-circle.styles.js.map +1 -1
  463. package/dist/components/status-and-feedback/status-bar/status-bar.d.ts +6 -1
  464. package/dist/components/status-and-feedback/status-bar/status-bar.d.ts.map +1 -1
  465. package/dist/components/status-and-feedback/status-bar/status-bar.js +23 -9
  466. package/dist/components/status-and-feedback/status-bar/status-bar.js.map +1 -1
  467. package/dist/components/status-and-feedback/status-bar/status-bar.styles.d.ts.map +1 -1
  468. package/dist/components/status-and-feedback/status-bar/status-bar.styles.js +4 -1
  469. package/dist/components/status-and-feedback/status-bar/status-bar.styles.js.map +1 -1
  470. package/dist/css/rich-text.css +63 -0
  471. package/dist/css/settings.css +10 -3
  472. package/package.json +9 -1
  473. package/dist/assets/styles/slotted-reset.d.ts.map +0 -1
  474. package/dist/assets/styles/slotted-reset.fixtures.d.ts.map +0 -1
  475. package/dist/assets/styles/slotted-reset.fixtures.js.map +0 -1
  476. package/dist/assets/styles/slotted-reset.js.map +0 -1
@@ -0,0 +1,304 @@
1
+ import { css } from 'lit';
2
+ import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
3
+ export const justInTimeEducationStyles = css `
4
+ :host {
5
+ box-sizing: border-box;
6
+ }
7
+
8
+
9
+ /* # Host */
10
+
11
+ :host {
12
+ --_arrow-length: var(--primitives-space-64); /* JS overrides this with the arrow-length attribute when valid */
13
+ --_desired-arrow-length: max(var(--primitives-space-40), var(--_arrow-length));
14
+ --_no-arrow-gap: var(--primitives-space-16);
15
+ --_gap: min(var(--_desired-arrow-length), var(--_available-distance));
16
+ --_available-distance: 9999px; /* JS sets the px distance to the viewport/document edge; default = no clamp */
17
+ --_background-blur: var(--primitives-space-8);
18
+ --_background-z-index: -1;
19
+ --_corner-radius: var(--primitives-space-40);
20
+ --_text-width: var(--primitives-area-320);
21
+ --_min-text-width: var(--primitives-area-200);
22
+ --_dismiss-width: var(--semantics-controls-md-min-size);
23
+ --_main-width: var(--_text-width);
24
+ --_max-width: var(--_main-width);
25
+ --_show-duration: var(--primitives-transition-duration-fast);
26
+ --_hide-duration: var(--primitives-transition-duration-medium);
27
+ --_offset: 0; /* px, unitless — read by JS */
28
+ --_shift-padding: 8; /* px, unitless — read by JS */
29
+ --_main-padding: var(--primitives-space-16);
30
+ --_main-background-color: color-mix(in srgb, var(--semantics-surfaces-base-background-color) 90%, transparent);
31
+ --_text-color: var(--semantics-content-color);
32
+ --_text-font: var(--primitives-font-body-lg-bold-tight);
33
+ --_supporting-text-color: var(--semantics-content-color);
34
+ --_supporting-text-font: var(--primitives-font-body-md-regular-tight);
35
+ --_arrow-color: var(--semantics-content-color);
36
+
37
+ ${inheritedTextReset}
38
+ display: contents;
39
+ }
40
+
41
+ :host([hidden]) {
42
+ display: none;
43
+ }
44
+
45
+ /* no-arrow (consumer) or the auto-collapsed state (JS sets it when the gap would
46
+ * fall below its minimum): drop to a small fixed gap, with no arrow drawn. */
47
+ :host([no-arrow]),
48
+ :host([data-arrow-collapsed]) {
49
+ --_gap: var(--_no-arrow-gap);
50
+ }
51
+
52
+ /* Horizontal placement: the arrow gap is horizontal here (unlike vertical), so
53
+ * the container is the main plus the arrow length. (Vertical keeps the base
54
+ * --_max-width = --_main-width.) */
55
+ :host([data-arrow-side="left"]),
56
+ :host([data-arrow-side="right"]) {
57
+ --_max-width: calc(var(--_main-width) + var(--_desired-arrow-length));
58
+ }
59
+
60
+ /* The dismiss button widens the main — it sits beside the text — for horizontal
61
+ * placement only; vertical stacks it below. --_max-width follows via --_main-width. */
62
+ :host([dismissable][data-arrow-side="left"]),
63
+ :host([dismissable][data-arrow-side="right"]) {
64
+ --_main-width: calc(var(--_text-width) + var(--_dismiss-width));
65
+ }
66
+
67
+ /* Horizontal placement near a viewport edge: --_available-distance (JS) is the
68
+ * distance to that edge. Reserve the main's width (--_main-width) so the arrow
69
+ * gap absorbs the first shrink and falls to 0; the container cap then narrows
70
+ * the main itself. Skipped for no-arrow, which keeps its fixed gap. */
71
+ :host(:not([no-arrow]):not([data-arrow-collapsed])[data-arrow-side="left"]),
72
+ :host(:not([no-arrow]):not([data-arrow-collapsed])[data-arrow-side="right"]) {
73
+ --_gap: clamp(0px, var(--_desired-arrow-length), calc(var(--_available-distance) - var(--_main-width)));
74
+ }
75
+
76
+
77
+ /* # Container */
78
+
79
+ /* Transparent top-layer wrapper. It carries the arrow gap as padding on the
80
+ * side facing the control (so the arrow lives INSIDE the box and is never
81
+ * clipped); the other sides keep a small margin for the blurred background.
82
+ * pointer-events are off so clicks on the empty padding fall through to the
83
+ * page (counted as "outside"). The whole thing fades as one on open/close;
84
+ * the base rule holds the (slower) hide timing, :popover-open the show. */
85
+ .just-in-time-education {
86
+ box-sizing: border-box;
87
+ position: absolute;
88
+ opacity: 0;
89
+ margin: 0;
90
+ border: none;
91
+ background: none;
92
+ width: max-content;
93
+ max-width: var(--_max-width);
94
+ padding: var(--_background-blur);
95
+ pointer-events: none;
96
+ overflow: visible;
97
+ transition:
98
+ opacity var(--_hide-duration) ease,
99
+ display var(--_hide-duration) allow-discrete,
100
+ overlay var(--_hide-duration) allow-discrete;
101
+ /* Force a GPU layer so Safari paints the freshly-opened top-layer popover
102
+ * (blurred background + SVG arrow) correctly instead of leaving it stale
103
+ * until a manual resize. */
104
+ transform: translate3d(0, 0, 0);
105
+ }
106
+
107
+ /* Horizontal placement: never exceed the room to the viewport edge. Once the
108
+ * arrow gap has shrunk to 0, this is what makes the main itself narrower. */
109
+ :host([data-arrow-side="left"]) .just-in-time-education,
110
+ :host([data-arrow-side="right"]) .just-in-time-education {
111
+ max-width: min(var(--_max-width), var(--_available-distance));
112
+ }
113
+
114
+
115
+ /* ## Arrow-side padding (only the side facing the control needs the gap) */
116
+
117
+ :host([data-arrow-side="bottom"]) .just-in-time-education {
118
+ padding-block-start: var(--_gap);
119
+ }
120
+
121
+ :host([data-arrow-side="top"]) .just-in-time-education {
122
+ padding-block-end: var(--_gap);
123
+ }
124
+
125
+ :host([data-arrow-side="left"]) .just-in-time-education {
126
+ padding-inline-end: var(--_gap);
127
+ }
128
+
129
+ :host([data-arrow-side="right"]) .just-in-time-education {
130
+ padding-inline-start: var(--_gap);
131
+ }
132
+
133
+
134
+ /* ## Fade */
135
+
136
+ .just-in-time-education:popover-open {
137
+ opacity: 1;
138
+ transition:
139
+ opacity var(--_show-duration) ease,
140
+ display var(--_show-duration) allow-discrete,
141
+ overlay var(--_show-duration) allow-discrete;
142
+ }
143
+
144
+ @starting-style {
145
+ .just-in-time-education:popover-open {
146
+ opacity: 0;
147
+ }
148
+ }
149
+
150
+ @media (prefers-reduced-motion: reduce) {
151
+ .just-in-time-education {
152
+ transition: none;
153
+ }
154
+ }
155
+
156
+
157
+ /* # Main */
158
+
159
+ .just-in-time-education__main {
160
+ box-sizing: border-box;
161
+ position: relative;
162
+ isolation: isolate;
163
+ pointer-events: auto;
164
+ padding: var(--_main-padding);
165
+ display: flex;
166
+ flex-direction: column;
167
+ align-items: center;
168
+ }
169
+
170
+ /* The dismiss sits on the side away from the arrow: below the text for bottom,
171
+ * above it for top, beside it (on the placement's own side) for left/right —
172
+ * so the text always leans toward the control. */
173
+ :host([data-arrow-side="top"]) .just-in-time-education__main {
174
+ flex-direction: column-reverse;
175
+ }
176
+
177
+ :host([data-arrow-side="left"]) .just-in-time-education__main {
178
+ flex-direction: row-reverse;
179
+ align-items: center;
180
+ }
181
+
182
+ :host([data-arrow-side="right"]) .just-in-time-education__main {
183
+ flex-direction: row;
184
+ align-items: center;
185
+ }
186
+
187
+ /* Horizontal placement floor: as the room narrows the main (after the arrow
188
+ * has collapsed), keep it usable at this minimum — the card overflows the
189
+ * viewport edge rather than shrinking further. */
190
+ :host([data-arrow-side="left"]) .just-in-time-education__main,
191
+ :host([data-arrow-side="right"]) .just-in-time-education__main {
192
+ min-width: var(--_min-text-width);
193
+ }
194
+
195
+ /* ...plus the dismiss button when dismissable: it sits beside the text, so the
196
+ * text keeps its 200px floor with the button next to it. */
197
+ :host([dismissable][data-arrow-side="left"]) .just-in-time-education__main,
198
+ :host([dismissable][data-arrow-side="right"]) .just-in-time-education__main {
199
+ min-width: calc(var(--_min-text-width) + var(--_dismiss-width));
200
+ }
201
+
202
+ /* Background lives on a blurred pseudo-element so its edges fade softly (no
203
+ * hard border, no drop shadow). The radius is a local, free value because
204
+ * this surface has a different function than the standard surfaces. The
205
+ * element is grown by the blur radius so the solid centre still covers the
206
+ * content after blurring. */
207
+ .just-in-time-education__main::before {
208
+ content: '';
209
+ position: absolute;
210
+ z-index: var(--_background-z-index);
211
+ inset: calc(-1 * var(--_background-blur));
212
+ border-radius: var(--_corner-radius);
213
+ background-color: var(--_main-background-color);
214
+ filter: blur(var(--_background-blur));
215
+ transform: translate3d(0, 0, 0);
216
+ }
217
+
218
+
219
+ /* ## Text */
220
+
221
+ .just-in-time-education__text-area {
222
+ display: flex;
223
+ flex-direction: column;
224
+ text-align: center;
225
+ }
226
+
227
+ :host([data-arrow-side="left"]) .just-in-time-education__text-area {
228
+ text-align: right;
229
+ }
230
+
231
+ :host([data-arrow-side="right"]) .just-in-time-education__text-area {
232
+ text-align: left;
233
+ }
234
+
235
+ .just-in-time-education__text {
236
+ margin: 0;
237
+ color: var(--_text-color);
238
+ font: var(--_text-font);
239
+ font-style: italic;
240
+ text-wrap: pretty;
241
+ }
242
+
243
+ .just-in-time-education__supporting-text {
244
+ margin: 0;
245
+ color: var(--_supporting-text-color);
246
+ font: var(--_supporting-text-font);
247
+ font-style: italic;
248
+ text-wrap: pretty;
249
+ }
250
+
251
+
252
+ /* ## Dismiss button */
253
+
254
+ .just-in-time-education__dismiss-button {
255
+ display: flex;
256
+ }
257
+
258
+
259
+ /* # Arrow */
260
+
261
+ .just-in-time-education__arrow {
262
+ position: absolute;
263
+ pointer-events: none;
264
+ overflow: visible;
265
+ color: var(--_arrow-color);
266
+ transform: translate3d(0, 0, 0);
267
+ }
268
+
269
+ /* Auto-collapsed (gap below its minimum near an edge): hide the arrow; the gap
270
+ * has already dropped to the small no-arrow value. */
271
+ :host([data-arrow-collapsed]) .just-in-time-education__arrow {
272
+ display: none;
273
+ }
274
+
275
+ .just-in-time-education__arrow-path {
276
+ fill: none;
277
+ stroke: currentColor;
278
+ stroke-width: 2;
279
+ stroke-linecap: butt;
280
+ stroke-dasharray: 5 3;
281
+ }
282
+
283
+ .just-in-time-education__arrow-head {
284
+ fill: currentColor;
285
+ }
286
+
287
+
288
+ /* # Live-region announcer */
289
+
290
+ /* Visually hidden but present in the a11y tree, so the polite announcement set
291
+ * on open reaches assistive tech without moving focus into the callout. */
292
+ .just-in-time-education__announcer {
293
+ position: absolute;
294
+ margin: -1px;
295
+ border: 0;
296
+ width: 1px;
297
+ height: 1px;
298
+ overflow: hidden;
299
+ padding: 0;
300
+ white-space: nowrap;
301
+ clip-path: inset(50%);
302
+ }
303
+ `;
304
+ //# sourceMappingURL=just-in-time-education.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"just-in-time-education.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/just-in-time-education/just-in-time-education.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,CAAC,MAAM,yBAAyB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAkCxC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0QrB,CAAC"}
@@ -0,0 +1,4 @@
1
+ import type { TemplateResult } from 'lit';
2
+ import type { NLDDJustInTimeEducation } from './just-in-time-education.js';
3
+ export declare function justInTimeEducationTemplate(component: NLDDJustInTimeEducation): TemplateResult;
4
+ //# sourceMappingURL=just-in-time-education.template.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"just-in-time-education.template.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/just-in-time-education/just-in-time-education.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAE3E,wBAAgB,2BAA2B,CAAC,SAAS,EAAE,uBAAuB,GAAG,cAAc,CAqE9F"}
@@ -0,0 +1,72 @@
1
+ import { html, nothing } from 'lit';
2
+ export function justInTimeEducationTemplate(component) {
3
+ return html `
4
+ <slot
5
+ @slotchange=${component._handleSlotChange}
6
+ @focusin=${component._handleAdvisedInteraction}
7
+ @pointerdown=${component._handleAdvisedInteraction}
8
+ ></slot>
9
+ <div class="just-in-time-education__announcer"
10
+ aria-live="polite"
11
+ aria-atomic="true"
12
+ ></div>
13
+ <div class="just-in-time-education"
14
+ popover="manual"
15
+ role=${component.dismissable ? 'dialog' : 'region'}
16
+ tabindex=${component.dismissable ? '-1' : nothing}
17
+ aria-label=${component.text || component._t('components.just-in-time-education.accessible-label')}
18
+ @keydown=${component._handleCalloutKeydown}
19
+ >
20
+ <div class="just-in-time-education__main">
21
+ <div class="just-in-time-education__text-area">
22
+ ${component.text ? html `
23
+ <p class="just-in-time-education__text">
24
+ ${component.text}
25
+ </p>
26
+ ` : nothing}
27
+ ${component.supportingText ? html `
28
+ <p class="just-in-time-education__supporting-text">
29
+ ${component.supportingText}
30
+ </p>
31
+ ` : nothing}
32
+ </div>
33
+ ${component.dismissable ? html `
34
+ <div class="just-in-time-education__dismiss-button">
35
+ <nldd-icon-button
36
+ icon="dismiss"
37
+ variant="neutral-transparent"
38
+ size="md"
39
+ accessible-label=${component._t('components.just-in-time-education.dismiss-action')}
40
+ @click=${component._handleDismiss}
41
+ ></nldd-icon-button>
42
+ </div>
43
+ ` : nothing}
44
+ </div>
45
+ ${component.noArrow ? nothing : html `
46
+ <svg class="just-in-time-education__arrow"
47
+ aria-hidden="true"
48
+ >
49
+ <defs>
50
+ <marker
51
+ id=${component._arrowMarkerId}
52
+ markerWidth="10"
53
+ markerHeight="12"
54
+ refX="0"
55
+ refY="5.78"
56
+ orient="auto"
57
+ markerUnits="userSpaceOnUse"
58
+ >
59
+ <path class="just-in-time-education__arrow-head"
60
+ d="M0,0 L10,5.78 L0,11.55 Z"
61
+ ></path>
62
+ </marker>
63
+ </defs>
64
+ <path class="just-in-time-education__arrow-path"
65
+ marker-end=${`url(#${component._arrowMarkerId})`}
66
+ ></path>
67
+ </svg>
68
+ `}
69
+ </div>
70
+ `;
71
+ }
72
+ //# sourceMappingURL=just-in-time-education.template.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"just-in-time-education.template.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/just-in-time-education/just-in-time-education.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAIpC,MAAM,UAAU,2BAA2B,CAAC,SAAkC;IAC7E,OAAO,IAAI,CAAA;;iBAEK,SAAS,CAAC,iBAAiB;cAC9B,SAAS,CAAC,yBAAyB;kBAC/B,SAAS,CAAC,yBAAyB;;;;;;;;UAQ3C,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ;cACvC,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO;gBACpC,SAAS,CAAC,IAAI,IAAI,SAAS,CAAC,EAAE,CAAC,oDAAoD,CAAC;cACtF,SAAS,CAAC,qBAAqB;;;;OAItC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;;SAEnB,SAAS,CAAC,IAAI;;MAEjB,CAAC,CAAC,CAAC,OAAO;OACT,SAAS,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,CAAA;;SAE7B,SAAS,CAAC,cAAc;;MAE3B,CAAC,CAAC,CAAC,OAAO;;MAEV,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAA;;;;;;0BAMR,SAAS,CAAC,EAAE,CAAC,kDAAkD,CAAC;gBAC1E,SAAS,CAAC,cAAc;;;KAGnC,CAAC,CAAC,CAAC,OAAO;;KAEV,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA;;;;;;YAM3B,SAAS,CAAC,cAAc;;;;;;;;;;;;;;mBAcjB,QAAQ,SAAS,CAAC,cAAc,GAAG;;;IAGlD;;EAEF,CAAC;AACH,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"modal-dialog.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/modal-dialog/modal-dialog.styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,iBAAiB,yBA4F7B,CAAC"}
1
+ {"version":3,"file":"modal-dialog.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/modal-dialog/modal-dialog.styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,iBAAiB,yBA+F7B,CAAC"}
@@ -1,8 +1,11 @@
1
1
  import { css, unsafeCSS } from 'lit';
2
2
  import { breakpoints } from '../../../assets/styles/breakpoints.js';
3
- import { inheritedTextReset } from '../../../assets/styles/slotted-reset.js';
3
+ import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
4
4
  const mdMin = unsafeCSS(breakpoints.mdMin);
5
5
  export const modalDialogStyles = css `
6
+ :host {
7
+ box-sizing: border-box;
8
+ }
6
9
 
7
10
 
8
11
  /* # Host */
@@ -1 +1 @@
1
- {"version":3,"file":"modal-dialog.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/modal-dialog/modal-dialog.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAE3C,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;IAUhC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;uBAwBC,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0D3B,CAAC"}
1
+ {"version":3,"file":"modal-dialog.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/modal-dialog/modal-dialog.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAE3C,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;IAahC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;uBAwBC,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0D3B,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"progress-bar.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/progress-bar/progress-bar.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB,yBA2M7B,CAAC;AAGF,eAAO,MAAM,iCAAiC,yBA8L7C,CAAC"}
1
+ {"version":3,"file":"progress-bar.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/progress-bar/progress-bar.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB,yBA8M7B,CAAC;AAGF,eAAO,MAAM,iCAAiC,yBA8L7C,CAAC"}
@@ -1,6 +1,9 @@
1
1
  import { css } from 'lit';
2
- import { inheritedTextReset } from '../../../assets/styles/slotted-reset.js';
2
+ import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
3
3
  export const progressBarStyles = css `
4
+ :host {
5
+ box-sizing: border-box;
6
+ }
4
7
 
5
8
 
6
9
  /* # Host */
@@ -1 +1 @@
1
- {"version":3,"file":"progress-bar.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/progress-bar/progress-bar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;IAuBhC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoLrB,CAAC;AAGF,MAAM,CAAC,MAAM,iCAAiC,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8LnD,CAAC"}
1
+ {"version":3,"file":"progress-bar.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/progress-bar/progress-bar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;IA0BhC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoLrB,CAAC;AAGF,MAAM,CAAC,MAAM,iCAAiC,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8LnD,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"progress-circle.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/progress-circle/progress-circle.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB,yBA2PhC,CAAC;AAGF,eAAO,MAAM,oCAAoC,yBAIhD,CAAC"}
1
+ {"version":3,"file":"progress-circle.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/progress-circle/progress-circle.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB,yBA8PhC,CAAC;AAGF,eAAO,MAAM,oCAAoC,yBAIhD,CAAC"}
@@ -1,6 +1,9 @@
1
1
  import { css } from 'lit';
2
- import { inheritedTextReset } from '../../../assets/styles/slotted-reset.js';
2
+ import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
3
3
  export const progressCircleStyles = css `
4
+ :host {
5
+ box-sizing: border-box;
6
+ }
4
7
 
5
8
 
6
9
  /* # Host */
@@ -1 +1 @@
1
- {"version":3,"file":"progress-circle.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/progress-circle/progress-circle.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;IAqBnC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsOrB,CAAC;AAGF,MAAM,CAAC,MAAM,oCAAoC,GAAG,GAAG,CAAA;;;;CAItD,CAAC"}
1
+ {"version":3,"file":"progress-circle.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/progress-circle/progress-circle.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;IAwBnC,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsOrB,CAAC;AAGF,MAAM,CAAC,MAAM,oCAAoC,GAAG,GAAG,CAAA;;;;CAItD,CAAC"}
@@ -8,6 +8,11 @@
8
8
  * benoemen ("Storing: …", "Gepland onderhoud …"), zodat de betekenis niet
9
9
  * alleen uit kleur volgt (WCAG 1.4.1).
10
10
  *
11
+ * Houd de tekst kort: de balk toont één regel en kapt af met ellipsis, zeker
12
+ * op smallere schermen. Bij een lang bericht met veel informatie hoort alleen
13
+ * de kern in de balk; verwijs voor de rest naar een losse pagina of sheet
14
+ * (bijvoorbeeld via `href` of `button`) waar de gebruiker verder kan lezen.
15
+ *
11
16
  * De hele balk kan klikbaar zijn: zet `href` (rendert een `<a>`) of `button`
12
17
  * (rendert een `<button>`; luister naar het native `click` event). Zonder
13
18
  * beide is de balk statisch. Bij interactie verschijnt een chevron als
@@ -45,7 +50,7 @@ export declare class NLDDStatusBar extends LitElement {
45
50
  /** Link rel attribute. Only used when href is set. */
46
51
  rel: string;
47
52
  button: boolean;
48
- constructor();
53
+ connectedCallback(): void;
49
54
  /** @internal Auto-secure rel for new-tab links unless the consumer set one. */
50
55
  _resolvedRel(): string;
51
56
  updated(changed: Map<string, unknown>): void;
@@ -1 +1 @@
1
- {"version":3,"file":"status-bar.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/status-bar/status-bar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,OAAO,4BAA4B,CAAC;AAEpC,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;AAEzF,qBACa,aAAc,SAAQ,UAAU;IAC5C,OAAgB,MAAM,0BAAmB;IAGzC,OAAO,EAAE,gBAAgB,CAAa;IAGtC,IAAI,SAAM;IAGV,IAAI,SAAM;IAEV,+DAA+D;IAE/D,MAAM,SAAM;IAEZ,sDAAsD;IAEtD,GAAG,SAAM;IAGT,MAAM,UAAS;;IAcf,+EAA+E;IAC/E,YAAY,IAAI,MAAM;IAKb,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAIrD,OAAO,CAAC,oBAAoB;IAanB,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,iBAAiB,EAAE,aAAa,CAAC;KACjC;CACD"}
1
+ {"version":3,"file":"status-bar.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/status-bar/status-bar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjC,OAAO,4BAA4B,CAAC;AAEpC,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;AAEzF,qBACa,aAAc,SAAQ,UAAU;IAC5C,OAAgB,MAAM,0BAAmB;IAGzC,OAAO,EAAE,gBAAgB,CAAa;IAGtC,IAAI,SAAM;IAGV,IAAI,SAAM;IAEV,+DAA+D;IAE/D,MAAM,SAAM;IAEZ,sDAAsD;IAEtD,GAAG,SAAM;IAGT,MAAM,UAAS;IAEN,iBAAiB,IAAI,IAAI;IAYlC,+EAA+E;IAC/E,YAAY,IAAI,MAAM;IAKb,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAIrD,OAAO,CAAC,oBAAoB;IAmBnB,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,iBAAiB,EAAE,aAAa,CAAC;KACjC;CACD"}
@@ -14,6 +14,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
14
14
  * benoemen ("Storing: …", "Gepland onderhoud …"), zodat de betekenis niet
15
15
  * alleen uit kleur volgt (WCAG 1.4.1).
16
16
  *
17
+ * Houd de tekst kort: de balk toont één regel en kapt af met ellipsis, zeker
18
+ * op smallere schermen. Bij een lang bericht met veel informatie hoort alleen
19
+ * de kern in de balk; verwijs voor de rest naar een losse pagina of sheet
20
+ * (bijvoorbeeld via `href` of `button`) waar de gebruiker verder kan lezen.
21
+ *
17
22
  * De hele balk kan klikbaar zijn: zet `href` (rendert een `<a>`) of `button`
18
23
  * (rendert een `<button>`; luister naar het native `click` event). Zonder
19
24
  * beide is de balk statisch. Bij interactie verschijnt een chevron als
@@ -45,7 +50,7 @@ import { statusBarTemplate } from './status-bar.template.js';
45
50
  import '../../content/icon/icon.js';
46
51
  let NLDDStatusBar = class NLDDStatusBar extends LitElement {
47
52
  constructor() {
48
- super();
53
+ super(...arguments);
49
54
  this.variant = 'neutral';
50
55
  this.text = '';
51
56
  this.href = '';
@@ -54,14 +59,17 @@ let NLDDStatusBar = class NLDDStatusBar extends LitElement {
54
59
  /** Link rel attribute. Only used when href is set. */
55
60
  this.rel = '';
56
61
  this.button = false;
57
- // AT requires role + aria-live to be present on the element by the time
58
- // it's first inserted into the DOM, otherwise the initial announcement
59
- // is missed. Reading the raw attribute here (instead of waiting for
60
- // Lit to project the @property) covers both HTML-declared and
61
- // document.createElement + setAttribute flows. updated() keeps the
62
- // host in sync when variant changes at runtime.
63
- const initialVariant = this.getAttribute('variant');
64
- this._applyAriaForVariant(initialVariant ?? 'neutral');
62
+ }
63
+ connectedCallback() {
64
+ super.connectedCallback();
65
+ // Set role + aria-live here, NOT in the constructor: the custom-element
66
+ // spec forbids a constructor from adding attributes to its element, so
67
+ // document.createElement (the path Vue, React and other createElement-based
68
+ // frameworks use) would throw NotSupportedError and the element would never
69
+ // upgrade. connectedCallback runs at insertion, before the first render, so
70
+ // the live-region role is present from the start; updated() keeps it in sync
71
+ // on later variant changes.
72
+ this._applyAriaForVariant(this.variant);
65
73
  }
66
74
  /** @internal Auto-secure rel for new-tab links unless the consumer set one. */
67
75
  _resolvedRel() {
@@ -74,6 +82,12 @@ let NLDDStatusBar = class NLDDStatusBar extends LitElement {
74
82
  this._applyAriaForVariant(this.variant);
75
83
  }
76
84
  _applyAriaForVariant(variant) {
85
+ // role + aria-live are component-owned and tied to the variant for correct
86
+ // announcement (critical = assertive alert, else polite status). They are
87
+ // (re)applied unconditionally on every connect/variant change, NOT guarded
88
+ // behind "consumer hasn't set role" — deliberately, since the docs state they
89
+ // are not consumer-overridable: a wrong role here (e.g. presentation on a
90
+ // critical alert) would silently break the a11y contract.
77
91
  if (variant === 'critical') {
78
92
  this.setAttribute('role', 'alert');
79
93
  this.removeAttribute('aria-live');
@@ -1 +1 @@
1
- {"version":3,"file":"status-bar.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/status-bar/status-bar.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,4BAA4B,CAAC;AAK7B,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAuB5C;QACC,KAAK,EAAE,CAAC;QApBT,YAAO,GAAqB,SAAS,CAAC;QAGtC,SAAI,GAAG,EAAE,CAAC;QAGV,SAAI,GAAG,EAAE,CAAC;QAEV,+DAA+D;QAE/D,WAAM,GAAG,EAAE,CAAC;QAEZ,sDAAsD;QAEtD,QAAG,GAAG,EAAE,CAAC;QAGT,WAAM,GAAG,KAAK,CAAC;QAId,wEAAwE;QACxE,uEAAuE;QACvE,oEAAoE;QACpE,8DAA8D;QAC9D,mEAAmE;QACnE,gDAAgD;QAChD,MAAM,cAAc,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAA4B,CAAC;QAC/E,IAAI,CAAC,oBAAoB,CAAC,cAAc,IAAI,SAAS,CAAC,CAAC;IACxD,CAAC;IAED,+EAA+E;IAC/E,YAAY;QACX,IAAI,IAAI,CAAC,GAAG;YAAE,OAAO,IAAI,CAAC,GAAG,CAAC;QAC9B,OAAO,IAAI,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9D,CAAC;IAEQ,OAAO,CAAC,OAA6B;QAC7C,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC;YAAE,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACrE,CAAC;IAEO,oBAAoB,CAAC,OAAyB;QACrD,IAAI,OAAO,KAAK,UAAU,EAAE,CAAC;YAC5B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YACnC,IAAI,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;QACnC,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;YACpC,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;QAC1C,CAAC;QACD,oEAAoE;QACpE,6DAA6D;QAC7D,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC1C,CAAC;IAEQ,MAAM;QACd,OAAO,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;;AA3De,oBAAM,GAAG,eAAe,AAAlB,CAAmB;AAGzC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CACJ;AAGtC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACjB;AAGV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACjB;AAIV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CACf;AAIZ;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAClB;AAGT;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAC5B;AArBH,aAAa;IADzB,aAAa,CAAC,iBAAiB,CAAC;GACpB,aAAa,CA6DzB"}
1
+ {"version":3,"file":"status-bar.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/status-bar/status-bar.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,4BAA4B,CAAC;AAK7B,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAIN,YAAO,GAAqB,SAAS,CAAC;QAGtC,SAAI,GAAG,EAAE,CAAC;QAGV,SAAI,GAAG,EAAE,CAAC;QAEV,+DAA+D;QAE/D,WAAM,GAAG,EAAE,CAAC;QAEZ,sDAAsD;QAEtD,QAAG,GAAG,EAAE,CAAC;QAGT,WAAM,GAAG,KAAK,CAAC;IA8ChB,CAAC;IA5CS,iBAAiB;QACzB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,wEAAwE;QACxE,uEAAuE;QACvE,4EAA4E;QAC5E,4EAA4E;QAC5E,4EAA4E;QAC5E,6EAA6E;QAC7E,4BAA4B;QAC5B,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACzC,CAAC;IAED,+EAA+E;IAC/E,YAAY;QACX,IAAI,IAAI,CAAC,GAAG;YAAE,OAAO,IAAI,CAAC,GAAG,CAAC;QAC9B,OAAO,IAAI,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9D,CAAC;IAEQ,OAAO,CAAC,OAA6B;QAC7C,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC;YAAE,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACrE,CAAC;IAEO,oBAAoB,CAAC,OAAyB;QACrD,2EAA2E;QAC3E,0EAA0E;QAC1E,2EAA2E;QAC3E,8EAA8E;QAC9E,0EAA0E;QAC1E,0DAA0D;QAC1D,IAAI,OAAO,KAAK,UAAU,EAAE,CAAC;YAC5B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YACnC,IAAI,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;QACnC,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;YACpC,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;QAC1C,CAAC;QACD,oEAAoE;QACpE,6DAA6D;QAC7D,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC1C,CAAC;IAEQ,MAAM;QACd,OAAO,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;;AAjEe,oBAAM,GAAG,eAAe,AAAlB,CAAmB;AAGzC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CACJ;AAGtC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACjB;AAGV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACjB;AAIV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CACf;AAIZ;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAClB;AAGT;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAC5B;AArBH,aAAa;IADzB,aAAa,CAAC,iBAAiB,CAAC;GACpB,aAAa,CAmEzB"}
@@ -1 +1 @@
1
- {"version":3,"file":"status-bar.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/status-bar/status-bar.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,yBA0I3B,CAAC"}
1
+ {"version":3,"file":"status-bar.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/status-bar/status-bar.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,yBA6I3B,CAAC"}
@@ -1,6 +1,9 @@
1
1
  import { css } from 'lit';
2
- import { inheritedTextReset } from '../../../assets/styles/slotted-reset.js';
2
+ import { inheritedTextReset } from '../../../assets/styles/style-resets.js';
3
3
  export const statusBarStyles = css `
4
+ :host {
5
+ box-sizing: border-box;
6
+ }
4
7
 
5
8
 
6
9
  /* # Host */
@@ -1 +1 @@
1
- {"version":3,"file":"status-bar.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/status-bar/status-bar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;IAiB9B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyHrB,CAAC"}
1
+ {"version":3,"file":"status-bar.styles.js","sourceRoot":"","sources":["../../../../src/components/status-and-feedback/status-bar/status-bar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;IAoB9B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyHrB,CAAC"}