@brightspot/ui 1.10.0 → 3.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 (264) hide show
  1. package/dist/components/action-bar/ActionBar.d.ts +163 -0
  2. package/dist/components/action-bar/ActionBar.d.ts.map +1 -0
  3. package/dist/components/action-bar/ActionBar.js +479 -0
  4. package/dist/components/action-bar/ActionBar.js.map +1 -0
  5. package/dist/components/action-bar/ActionItem.d.ts +103 -0
  6. package/dist/components/action-bar/ActionItem.d.ts.map +1 -0
  7. package/dist/components/action-bar/ActionItem.js +237 -0
  8. package/dist/components/action-bar/ActionItem.js.map +1 -0
  9. package/dist/components/avatar/AvatarGroup.d.ts +3 -0
  10. package/dist/components/avatar/AvatarGroup.d.ts.map +1 -1
  11. package/dist/components/avatar/AvatarGroup.js +3 -0
  12. package/dist/components/avatar/AvatarGroup.js.map +1 -1
  13. package/dist/components/badge/Badge.d.ts +3 -1
  14. package/dist/components/badge/Badge.d.ts.map +1 -1
  15. package/dist/components/badge/Badge.js +2 -0
  16. package/dist/components/badge/Badge.js.map +1 -1
  17. package/dist/components/button-group/ButtonGroup.d.ts +138 -0
  18. package/dist/components/button-group/ButtonGroup.d.ts.map +1 -0
  19. package/dist/components/button-group/ButtonGroup.js +436 -0
  20. package/dist/components/button-group/ButtonGroup.js.map +1 -0
  21. package/dist/components/checkbox/Checkbox.d.ts +107 -0
  22. package/dist/components/checkbox/Checkbox.d.ts.map +1 -0
  23. package/dist/components/checkbox/Checkbox.js +224 -0
  24. package/dist/components/checkbox/Checkbox.js.map +1 -0
  25. package/dist/components/circular-progress/CircularProgress.d.ts +2 -2
  26. package/dist/components/circular-progress/CircularProgress.js +2 -2
  27. package/dist/components/copy-to-clipboard/CopyToClipboard.d.ts +7 -2
  28. package/dist/components/copy-to-clipboard/CopyToClipboard.d.ts.map +1 -1
  29. package/dist/components/copy-to-clipboard/CopyToClipboard.js +10 -5
  30. package/dist/components/copy-to-clipboard/CopyToClipboard.js.map +1 -1
  31. package/dist/components/dropdown/Dropdown.d.ts +8 -6
  32. package/dist/components/dropdown/Dropdown.d.ts.map +1 -1
  33. package/dist/components/dropdown/Dropdown.js +33 -22
  34. package/dist/components/dropdown/Dropdown.js.map +1 -1
  35. package/dist/components/dropdown/DropdownItem.d.ts +28 -7
  36. package/dist/components/dropdown/DropdownItem.d.ts.map +1 -1
  37. package/dist/components/dropdown/DropdownItem.js +41 -16
  38. package/dist/components/dropdown/DropdownItem.js.map +1 -1
  39. package/dist/components/dropdown/DropdownMenu.d.ts +6 -8
  40. package/dist/components/dropdown/DropdownMenu.d.ts.map +1 -1
  41. package/dist/components/dropdown/DropdownMenu.js +22 -37
  42. package/dist/components/dropdown/DropdownMenu.js.map +1 -1
  43. package/dist/components/empty-state/EmptyState.css +4 -0
  44. package/dist/components/empty-state/EmptyState.d.ts +103 -0
  45. package/dist/components/empty-state/EmptyState.d.ts.map +1 -0
  46. package/dist/components/empty-state/EmptyState.js +209 -0
  47. package/dist/components/empty-state/EmptyState.js.map +1 -0
  48. package/dist/components/icon/Icon.d.ts +23 -10
  49. package/dist/components/icon/Icon.d.ts.map +1 -1
  50. package/dist/components/icon/Icon.js +40 -9
  51. package/dist/components/icon/Icon.js.map +1 -1
  52. package/dist/components/icon-button/IconButton.d.ts +7 -21
  53. package/dist/components/icon-button/IconButton.d.ts.map +1 -1
  54. package/dist/components/icon-button/IconButton.js +12 -18
  55. package/dist/components/icon-button/IconButton.js.map +1 -1
  56. package/dist/components/linear-progress/LinearProgress.d.ts +2 -2
  57. package/dist/components/linear-progress/LinearProgress.js +2 -2
  58. package/dist/components/pagination/Pagination.d.ts +33 -4
  59. package/dist/components/pagination/Pagination.d.ts.map +1 -1
  60. package/dist/components/pagination/Pagination.js +88 -24
  61. package/dist/components/pagination/Pagination.js.map +1 -1
  62. package/dist/components/popover/Popover.d.ts +6 -0
  63. package/dist/components/popover/Popover.d.ts.map +1 -1
  64. package/dist/components/popover/Popover.js +6 -0
  65. package/dist/components/popover/Popover.js.map +1 -1
  66. package/dist/components/switch/Switch.d.ts +5 -1
  67. package/dist/components/switch/Switch.d.ts.map +1 -1
  68. package/dist/components/switch/Switch.js +10 -6
  69. package/dist/components/switch/Switch.js.map +1 -1
  70. package/dist/components/tabs/Tab.d.ts +108 -0
  71. package/dist/components/tabs/Tab.d.ts.map +1 -0
  72. package/dist/components/tabs/Tab.js +152 -0
  73. package/dist/components/tabs/Tab.js.map +1 -0
  74. package/dist/components/tabs/Tabs.d.ts +126 -0
  75. package/dist/components/tabs/Tabs.d.ts.map +1 -0
  76. package/dist/components/tabs/Tabs.js +390 -0
  77. package/dist/components/tabs/Tabs.js.map +1 -0
  78. package/dist/components/upload/Upload.d.ts +157 -0
  79. package/dist/components/upload/Upload.d.ts.map +1 -0
  80. package/dist/components/upload/Upload.js +538 -0
  81. package/dist/components/upload/Upload.js.map +1 -0
  82. package/dist/components/upload/UploadItem.d.ts +73 -0
  83. package/dist/components/upload/UploadItem.d.ts.map +1 -0
  84. package/dist/components/upload/UploadItem.js +180 -0
  85. package/dist/components/upload/UploadItem.js.map +1 -0
  86. package/dist/components/widget/Widget.d.ts +1 -6
  87. package/dist/components/widget/Widget.d.ts.map +1 -1
  88. package/dist/components/widget/Widget.js +1 -6
  89. package/dist/components/widget/Widget.js.map +1 -1
  90. package/dist/custom-elements.json +8445 -1989
  91. package/dist/storybook/assets/ActionBar.stories-DRIVI-W2.js +408 -0
  92. package/dist/storybook/assets/ActionItem.stories-5qlgxYNB.js +203 -0
  93. package/dist/storybook/assets/{Avatar.stories-B26mRkkZ.js → Avatar.stories-B3VkhRhP.js} +2 -2
  94. package/dist/storybook/assets/{AvatarGroup.stories-J7lVGsMY.js → AvatarGroup.stories-DOfim2NY.js} +5 -5
  95. package/dist/storybook/assets/{Badge.stories-BpTIV61M.js → Badge.stories-B04VNAcc.js} +2 -2
  96. package/dist/storybook/assets/{Button-Dg-fIrzT.js → Button-CILTcGRT.js} +1 -1
  97. package/dist/storybook/assets/{Button.stories-gPKRVbxk.js → Button.stories-CzWAltrX.js} +1 -1
  98. package/dist/storybook/assets/ButtonGroup.stories-1uAJf79o.js +588 -0
  99. package/dist/storybook/assets/{Celebrate.stories-DbY-sKEe.js → Celebrate.stories-BEqj0VnW.js} +7 -7
  100. package/dist/storybook/assets/Checkbox.stories-DXAGFS0M.js +141 -0
  101. package/dist/storybook/assets/{CircularProgress.stories-DeH5JYX_.js → CircularProgress.stories-D4rftw22.js} +7 -7
  102. package/dist/storybook/assets/{ClipboardMixin.stories-C-lZ4uuw.js → ClipboardMixin.stories-z2n2HWt1.js} +31 -28
  103. package/dist/storybook/assets/{Color-6BZIO3FS-Cu6zVIuG.js → Color-6BZIO3FS-C6KyMgZz.js} +1 -1
  104. package/dist/storybook/assets/{Colors.stories-D6XYMrTD.js → Colors.stories-CX-Ny3B_.js} +1 -1
  105. package/dist/storybook/assets/{CombinedEffects.stories-jFekKTYg.js → CombinedEffects.stories-BkqtiVHp.js} +33 -33
  106. package/dist/storybook/assets/{ComponentStatesMixin-g50hRCPT.js → ComponentStatesMixin-DLd0feFg.js} +1 -1
  107. package/dist/storybook/assets/{ComponentStatesMixin.stories-D3Q5pR38.js → ComponentStatesMixin.stories-D6Yc5Jgl.js} +3 -3
  108. package/dist/storybook/assets/{CopyToClipboard.stories-COZZ1VC2.js → CopyToClipboard.stories-B-omwDDJ.js} +16 -16
  109. package/dist/storybook/assets/{Debounce.stories-Dl10LAnx.js → Debounce.stories-B2vE5QIx.js} +9 -9
  110. package/dist/storybook/assets/{DocsRenderer-LL677BLK-CFLtMbUx.js → DocsRenderer-LL677BLK-DNUlRvMg.js} +3 -3
  111. package/dist/storybook/assets/{Dropdown.stories-Drwq-0Z2.js → Dropdown.stories-_bx4WDLr.js} +95 -68
  112. package/dist/storybook/assets/EmptyState.stories-CGMbmo77.js +318 -0
  113. package/dist/storybook/assets/{Events.stories-dODeR-g-.js → Events.stories-CkQYKcoZ.js} +1 -1
  114. package/dist/storybook/assets/{Heading.stories-CH7_-_q3.js → Heading.stories-BU5Do_od.js} +1 -1
  115. package/dist/storybook/assets/{HueRipple.stories-CH1Y739k.js → HueRipple.stories-Di2zmxo3.js} +11 -11
  116. package/dist/storybook/assets/Icon.stories-Dk4ZXhhJ.js +441 -0
  117. package/dist/storybook/assets/{IconButton.stories-DuzqvcnN.js → IconButton.stories-BSCiXPXa.js} +126 -146
  118. package/dist/storybook/assets/{LinearProgress.stories-C7IdnJd3.js → LinearProgress.stories-BGxPZuni.js} +7 -7
  119. package/dist/storybook/assets/Pagination.stories-z3Zq8b4f.js +252 -0
  120. package/dist/storybook/assets/{Popover.stories-Ca1F-wrI.js → Popover.stories-C9GxWcax.js} +33 -62
  121. package/dist/storybook/assets/ReadyMixin-CQw8N6P9.js +1 -0
  122. package/dist/storybook/assets/RovingTabindexMixin.stories-ByxLBi6m.js +192 -0
  123. package/dist/storybook/assets/{Rtc.stories-BVJc1vCA.js → Rtc.stories-DQJlCXWR.js} +3 -3
  124. package/dist/storybook/assets/ScrollShadow.stories-gjTIAbUA.js +17 -0
  125. package/dist/storybook/assets/{Switch.stories-BEEHP8mD.js → Switch.stories-BEeqPZiP.js} +21 -21
  126. package/dist/storybook/assets/Tab.stories-DpB3I-WZ.js +218 -0
  127. package/dist/storybook/assets/Tabs.stories-C6mG6Xi7.js +211 -0
  128. package/dist/storybook/assets/{Throttle.stories-C4xsYeAb.js → Throttle.stories-x9tpGeQh.js} +10 -10
  129. package/dist/storybook/assets/{Tooltip.stories-Ccm4AnSv.js → Tooltip.stories-CqcLqdmc.js} +2 -2
  130. package/dist/storybook/assets/Upload.stories-CMaAbCSH.js +447 -0
  131. package/dist/storybook/assets/UploadItem.stories-GB98L3JQ.js +167 -0
  132. package/dist/storybook/assets/{Welcome.stories-Degjk-M0.js → Welcome.stories-6h9cUZ7v.js} +1 -1
  133. package/dist/storybook/assets/{Widget.stories-OKnZ9sDs.js → Widget.stories-DiA1PR6Y.js} +13 -13
  134. package/dist/storybook/assets/{WithTooltip-65CFNBJE-CXL3TyJ2.js → WithTooltip-65CFNBJE-DTsHhBb_.js} +2 -2
  135. package/dist/storybook/assets/{blocks-DLdUKG_W.js → blocks-IXdn9TGW.js} +5 -5
  136. package/dist/storybook/assets/{formatter-EIJCOSYU-29NCxjfM.js → formatter-EIJCOSYU-Cum4J6N4.js} +1 -1
  137. package/dist/storybook/assets/if-defined-CgfCxQoV.js +1 -0
  138. package/dist/storybook/assets/iframe-BgFj0b5u.css +1 -0
  139. package/dist/storybook/assets/{iframe-BqvwP3or.js → iframe-Sf9RHZFu.js} +200 -200
  140. package/dist/storybook/assets/{index-BIyTv1BF.js → index-D605PvQH.js} +1 -1
  141. package/dist/storybook/assets/onFind-C41m8c_a.js +1 -0
  142. package/dist/storybook/assets/{onFind.stories-D64-QZqf.js → onFind.stories-MOTfGlJd.js} +53 -77
  143. package/dist/storybook/assets/{onRemove.stories-BICsnIJL.js → onRemove.stories-DX58Bf6f.js} +6 -10
  144. package/dist/storybook/assets/{onVisible.stories-DpDZP9_5.js → onVisible.stories-NNFeFeD8.js} +3 -3
  145. package/dist/storybook/assets/style-map-B99QiqCo.js +1 -0
  146. package/dist/storybook/assets/{syntaxhighlighter-ED5Y7EFY-Bz_DuQj8.js → syntaxhighlighter-ED5Y7EFY-BqQ-o9mS.js} +1 -1
  147. package/dist/storybook/box-illustration.svg +51 -0
  148. package/dist/storybook/cloud-illustration.svg +49 -0
  149. package/dist/storybook/docs-illustration.svg +92 -0
  150. package/dist/storybook/iframe.html +2 -2
  151. package/dist/storybook/index.json +1 -1
  152. package/dist/storybook/project.json +1 -1
  153. package/dist/tailwind-plugin-action-bar.d.ts +2 -0
  154. package/dist/tailwind-plugin-action-bar.d.ts.map +1 -0
  155. package/dist/tailwind-plugin-action-bar.js +120 -0
  156. package/dist/tailwind-plugin-action-bar.js.map +1 -0
  157. package/dist/tailwind-plugin-action-bar.ts +134 -0
  158. package/dist/tailwind-plugin-badge.js +5 -6
  159. package/dist/tailwind-plugin-badge.js.map +1 -1
  160. package/dist/tailwind-plugin-badge.ts +5 -6
  161. package/dist/tailwind-plugin-button-group.d.ts +2 -0
  162. package/dist/tailwind-plugin-button-group.d.ts.map +1 -0
  163. package/dist/tailwind-plugin-button-group.js +215 -0
  164. package/dist/tailwind-plugin-button-group.js.map +1 -0
  165. package/dist/tailwind-plugin-button-group.ts +238 -0
  166. package/dist/tailwind-plugin-button.js +2 -1
  167. package/dist/tailwind-plugin-button.js.map +1 -1
  168. package/dist/tailwind-plugin-button.ts +2 -1
  169. package/dist/tailwind-plugin-checkbox.d.ts +2 -0
  170. package/dist/tailwind-plugin-checkbox.d.ts.map +1 -0
  171. package/dist/tailwind-plugin-checkbox.js +246 -0
  172. package/dist/tailwind-plugin-checkbox.js.map +1 -0
  173. package/dist/tailwind-plugin-checkbox.ts +281 -0
  174. package/dist/tailwind-plugin-empty-state.d.ts +2 -0
  175. package/dist/tailwind-plugin-empty-state.d.ts.map +1 -0
  176. package/dist/tailwind-plugin-empty-state.js +113 -0
  177. package/dist/tailwind-plugin-empty-state.js.map +1 -0
  178. package/dist/tailwind-plugin-empty-state.ts +124 -0
  179. package/dist/tailwind-plugin-icon.js +122 -18
  180. package/dist/tailwind-plugin-icon.js.map +1 -1
  181. package/dist/tailwind-plugin-icon.ts +131 -18
  182. package/dist/tailwind-plugin-loader.js +3 -3
  183. package/dist/tailwind-plugin-loader.ts +3 -3
  184. package/dist/tailwind-plugin-pagination.js +13 -23
  185. package/dist/tailwind-plugin-pagination.js.map +1 -1
  186. package/dist/tailwind-plugin-pagination.ts +15 -25
  187. package/dist/tailwind-plugin-tabs.d.ts +2 -0
  188. package/dist/tailwind-plugin-tabs.d.ts.map +1 -0
  189. package/dist/tailwind-plugin-tabs.js +158 -0
  190. package/dist/tailwind-plugin-tabs.js.map +1 -0
  191. package/dist/tailwind-plugin-tabs.ts +169 -0
  192. package/dist/tailwind-plugin-upload.d.ts +2 -0
  193. package/dist/tailwind-plugin-upload.d.ts.map +1 -0
  194. package/dist/tailwind-plugin-upload.js +322 -0
  195. package/dist/tailwind-plugin-upload.js.map +1 -0
  196. package/dist/tailwind-plugin-upload.ts +362 -0
  197. package/dist/tailwind.config.d.ts.map +1 -1
  198. package/dist/tailwind.config.js +1 -0
  199. package/dist/tailwind.config.js.map +1 -1
  200. package/dist/tailwind.config.ts +1 -0
  201. package/dist/util/ClipboardMixin.d.ts +7 -2
  202. package/dist/util/ClipboardMixin.d.ts.map +1 -1
  203. package/dist/util/ClipboardMixin.js +15 -13
  204. package/dist/util/ClipboardMixin.js.map +1 -1
  205. package/dist/util/ComponentStatesMixin.d.ts +2 -1
  206. package/dist/util/ComponentStatesMixin.d.ts.map +1 -1
  207. package/dist/util/ComponentStatesMixin.js +4 -0
  208. package/dist/util/ComponentStatesMixin.js.map +1 -1
  209. package/dist/util/EventEmitterMixin.d.ts +58 -4
  210. package/dist/util/EventEmitterMixin.d.ts.map +1 -1
  211. package/dist/util/EventEmitterMixin.js +5 -2
  212. package/dist/util/EventEmitterMixin.js.map +1 -1
  213. package/dist/util/ProgressMixin.d.ts +9 -2
  214. package/dist/util/ProgressMixin.d.ts.map +1 -1
  215. package/dist/util/ProgressMixin.js +22 -18
  216. package/dist/util/ProgressMixin.js.map +1 -1
  217. package/dist/util/RovingTabindexMixin.d.ts +46 -0
  218. package/dist/util/RovingTabindexMixin.d.ts.map +1 -0
  219. package/dist/util/RovingTabindexMixin.js +83 -0
  220. package/dist/util/RovingTabindexMixin.js.map +1 -0
  221. package/dist/util/TetherLayout.d.ts.map +1 -1
  222. package/dist/util/TetherLayout.js +3 -0
  223. package/dist/util/TetherLayout.js.map +1 -1
  224. package/dist/util/TooltipMixin.d.ts.map +1 -1
  225. package/dist/util/TooltipMixin.js +5 -4
  226. package/dist/util/TooltipMixin.js.map +1 -1
  227. package/dist/util/upload.d.ts +53 -0
  228. package/dist/util/upload.d.ts.map +1 -0
  229. package/dist/util/upload.js +113 -0
  230. package/dist/util/upload.js.map +1 -0
  231. package/docs/components/ActionBar.md +77 -0
  232. package/docs/components/ActionItem.md +101 -0
  233. package/docs/components/Avatar.md +42 -12
  234. package/docs/components/AvatarGroup.md +4 -3
  235. package/docs/components/Badge.md +13 -1
  236. package/docs/components/ButtonGroup.md +91 -0
  237. package/docs/components/Checkbox.md +91 -0
  238. package/docs/components/CircularProgress.md +41 -12
  239. package/docs/components/CopyToClipboard.md +13 -11
  240. package/docs/components/Dropdown.md +51 -26
  241. package/docs/components/DropdownItem.md +44 -27
  242. package/docs/components/DropdownMenu.md +14 -14
  243. package/docs/components/EmptyState.md +75 -0
  244. package/docs/components/Icon.md +22 -14
  245. package/docs/components/IconButton.md +46 -21
  246. package/docs/components/LinearProgress.md +43 -4
  247. package/docs/components/Pagination.md +38 -34
  248. package/docs/components/Popover.md +16 -0
  249. package/docs/components/README.md +9 -0
  250. package/docs/components/Switch.md +21 -16
  251. package/docs/components/Tab.md +79 -0
  252. package/docs/components/Tabs.md +85 -0
  253. package/docs/components/Upload.md +112 -0
  254. package/docs/components/UploadItem.md +61 -0
  255. package/docs/components/Widget.md +12 -6
  256. package/package.json +4 -2
  257. package/dist/storybook/assets/Icon.stories-CPjM-jTU.js +0 -264
  258. package/dist/storybook/assets/Pagination.stories-C4cLjS_9.js +0 -272
  259. package/dist/storybook/assets/ReadyMixin-DNZ5dCsZ.js +0 -1
  260. package/dist/storybook/assets/ScrollShadow.stories-C3W5o9ZW.js +0 -17
  261. package/dist/storybook/assets/if-defined-BZFPaJjl.js +0 -1
  262. package/dist/storybook/assets/iframe-C5bIZMJ5.css +0 -1
  263. package/dist/storybook/assets/onFind-1l3EPW-I.js +0 -1
  264. package/dist/storybook/assets/style-map-CBrSnxRe.js +0 -1
@@ -0,0 +1,91 @@
1
+ # `src/components/checkbox/Checkbox.ts`:
2
+
3
+ ## class: `Checkbox`, `btu-checkbox`
4
+
5
+ ### Superclass
6
+
7
+ | Name | Module | Package |
8
+ | ------------ | ------ | ------- |
9
+ | `LitElement` | | lit |
10
+
11
+ ### Mixins
12
+
13
+ | Name | Module | Package |
14
+ | ------------------- | ------------------------------ | ------- |
15
+ | `EventEmitterMixin` | /src/util/EventEmitterMixin.js | |
16
+ | `ReadyMixin` | /src/util/ReadyMixin.js | |
17
+
18
+ ### Fields
19
+
20
+ | Name | Privacy | Type | Default | Description | Inherited From |
21
+ | ------------------------- | ------- | --------------------- | --------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------- |
22
+ | `label` | | `string \| undefined` | | The text label displayed next to the checkbox. | |
23
+ | `description` | | `string \| undefined` | | Optional helper text displayed below the label. | |
24
+ | `size` | | `'sm' \| 'md'` | `'sm'` | Controls the scale of the checkbox and associated typography. | |
25
+ | `checked` | | `boolean` | `false` | Whether the checkbox is currently selected. | |
26
+ | `indeterminate` | | `boolean` | `false` | Whether the checkbox is in a partially selected state. Sets \`aria-checked='mixed'\`
and activates the native \`:indeterminate\` pseudo-class. Cleared automatically when
the user clicks the checkbox. | |
27
+ | `disabled` | | `boolean` | `false` | If true, the checkbox is non-interactive and visually muted. | |
28
+ | `invalid` | | `boolean` | `false` | If true, displays error styling on the checkbox. | |
29
+ | `error` | | `string \| undefined` | | Error message text displayed below the checkbox when validation fails.
Setting this also activates error styling without needing to set invalid. | |
30
+ | `required` | | `boolean` | `false` | Marks the field as mandatory for form submission. | |
31
+ | `name` | | `string \| undefined` | | Name of the form control submitted with the form data. | |
32
+ | `value` | | `string` | `'on'` | Value associated with the checkbox when submitted. | |
33
+ | `_userInitiated` | private | `boolean` | `false` | | |
34
+ | `_initialClasses` | private | `string[]` | `[]` | | |
35
+ | `_initialClassesCaptured` | private | `boolean` | `false` | | |
36
+ | `_descId` | private | | `` `checkbox-desc-${crypto.randomUUID()}` `` | | |
37
+ | `_errorId` | private | | `` `checkbox-error-${crypto.randomUUID()}` `` | | |
38
+ | `_handleClick` | private | | | | |
39
+ | `_describedBy` | private | `string \| undefined` | | | |
40
+ | `_iconSymbol` | private | `'minus' \| 'check'` | | | |
41
+
42
+ ### Methods
43
+
44
+ | Name | Privacy | Description | Parameters | Return | Inherited From |
45
+ | ---------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | --------- | ----------------- |
46
+ | `_onInputChange` | private | | `e: Event` | `void` | |
47
+ | `emit` | | Dispatches a type-safe CustomEvent with standardized configuration.&#xA;&#xA;All events are configured with:&#xA;- bubbles: true (event propagates up the DOM tree)&#xA;- cancelable: false (event cannot be cancelled)&#xA;- composed: true (event crosses shadow DOM boundaries) | `type: K, detail: UnpackCustomEvent<CustomEventMap[K]>` | `boolean` | EventEmitterMixin |
48
+
49
+ ### Events
50
+
51
+ | Name | Type | Description | Inherited From |
52
+ | --------------------- | ----------------------------------- | ---------------------------------------------------------- | -------------- |
53
+ | `btu-checkbox-ready` | `CustomEvent` | Fired after the checkbox is first rendered and initialized | |
54
+ | `btu-checkbox-change` | `CustomEvent<{ checked: boolean }>` | Fired when the user toggles the checked state | |
55
+
56
+ ### Attributes
57
+
58
+ | Name | Field | Inherited From |
59
+ | --------------- | ------------- | -------------- |
60
+ | `label` | label | |
61
+ | `description` | description | |
62
+ | `size` | size | |
63
+ | `checked` | checked | |
64
+ | `indeterminate` | indeterminate | |
65
+ | `disabled` | disabled | |
66
+ | `invalid` | invalid | |
67
+ | `error` | error | |
68
+ | `required` | required | |
69
+ | `name` | name | |
70
+ | `value` | value | |
71
+
72
+ ### CSS Properties
73
+
74
+ | Name | Default | Description |
75
+ | -------------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
76
+ | `--checkbox-color-primary` | | Background and border color when checked or indeterminate, and tinted background/border on unchecked hover (default: oklch(var(--btu-theme-primary-700))) |
77
+ | `--checkbox-color-border` | | Border color in the unchecked state (default: oklch(var(--btu-theme-gray-300))) |
78
+ | `--checkbox-color-error` | | Border and text color in the error state (default: oklch(var(--btu-theme-error-600))) |
79
+ | `--checkbox-border-radius` | | Corner rounding of the checkbox square (default: 4px) |
80
+ | `--checkbox-label-spacing` | | Distance between the checkbox and the label (default: 0.75rem) |
81
+ | `--checkbox-box-size` | | \[Internal] Width and height of the checkbox square, set by the size variant (sm: 1rem, md: 1.25rem). Use the \`size\` attribute instead of overriding directly — the icon must scale in tandem. |
82
+ | `--checkbox-icon-size` | | \[Internal] Width and height of the icon inside the box, set by the size variant (sm: 0.75rem, md: 0.875rem). Use the \`size\` attribute instead of overriding directly. |
83
+
84
+ <hr/>
85
+
86
+ ## Exports
87
+
88
+ | Kind | Name | Declaration | Module | Package |
89
+ | --------------------------- | -------------- | ----------- | ----------------------------------- | ------- |
90
+ | `js` | `default` | Checkbox | src/components/checkbox/Checkbox.ts | |
91
+ | `custom-element-definition` | `btu-checkbox` | Checkbox | src/components/checkbox/Checkbox.ts | |
@@ -18,24 +18,53 @@
18
18
 
19
19
  ### Fields
20
20
 
21
- | Name | Privacy | Type | Default | Description | Inherited From |
22
- | --------------- | ------- | ---------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------- | -------------- |
23
- | `indeterminate` | | `boolean` | `true` | Whether the progress indicator is indeterminate (animated spinner).&#xA;When false, shows determinate progress based on the progress value. | |
24
- | `size` | | `'sm' \| 'md' \| 'lg'` | `'sm'` | Size variant.&#xA;- 'sm': Small (16px) - default&#xA;- 'md': Medium (32px)&#xA;- 'lg': Large (48px) | |
21
+ | Name | Privacy | Type | Default | Description | Inherited From |
22
+ | ------------------------- | ------- | -------------------------------------------------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------- | -------------- |
23
+ | `indeterminate` | | `boolean` | `true` | Whether the progress indicator is indeterminate (animated spinner).&#xA;When false, shows determinate progress based on the progress value. | |
24
+ | `size` | | `'sm' \| 'md' \| 'lg'` | `'sm'` | Size variant.&#xA;- 'sm': Small (16px) - default&#xA;- 'md': Medium (32px)&#xA;- 'lg': Large (48px) | |
25
+ | `color` | | `ProgressColors` | `'primary'` | Color theme of the progress indicator.&#xA;Supports: black, white, primary, teal, gray, purple, rose, error, warning, success | ProgressMixin |
26
+ | `thickness` | | `number \| undefined` | | Stroke width of the progress indicator. | ProgressMixin |
27
+ | `_progress` | private | `number` | `0` | | ProgressMixin |
28
+ | `progress` | | | | Progress value for determinate variant. Clamped to 0–100. | ProgressMixin |
29
+ | `label` | | `string \| undefined` | | Optional label text to display with the progress indicator. | ProgressMixin |
30
+ | `initialAnimation` | | `boolean` | `true` | Whether to animate progress from 0 to target value when component first becomes visible. | ProgressMixin |
31
+ | `ariaLabel` | | `string \| null` | `null` | Optional aria-label attribute for screen readers.&#xA;Describes what the progress indicator represents. | ProgressMixin |
32
+ | `ariaLabelledBy` | | `string \| null` | `null` | Optional aria-labelledby attribute for screen readers.&#xA;References the ID of an element that labels the progress indicator. | ProgressMixin |
33
+ | `ariaValueText` | | `string \| null` | `null` | Optional aria-valuetext attribute for screen readers.&#xA;Provides human-readable text alternative for progress value. | ProgressMixin |
34
+ | `completionAnnouncement` | | `string \| undefined` | | Optional message to announce to screen readers when progress reaches 100%.&#xA;If not provided, no announcement will be made on completion. | ProgressMixin |
35
+ | `_isAnimationInitialized` | private | `boolean` | `false` | | ProgressMixin |
36
+ | `_intersectionObserver` | private | `IntersectionObserver \| undefined` | | | ProgressMixin |
37
+ | `_hasCompletedAt100` | private | `boolean` | `false` | | ProgressMixin |
38
+ | `_hostTag` | private | `'btu-linear-progress' \| 'btu-circular-progress'` | | | ProgressMixin |
39
+
40
+ ### Methods
41
+
42
+ | Name | Privacy | Description | Parameters | Return | Inherited From |
43
+ | ------ | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | --------- | ----------------- |
44
+ | `emit` | | Dispatches a type-safe CustomEvent with standardized configuration.&#xA;&#xA;All events are configured with:&#xA;- bubbles: true (event propagates up the DOM tree)&#xA;- cancelable: false (event cannot be cancelled)&#xA;- composed: true (event crosses shadow DOM boundaries) | `type: K, detail: UnpackCustomEvent<CustomEventMap[K]>` | `boolean` | EventEmitterMixin |
25
45
 
26
46
  ### Events
27
47
 
28
- | Name | Type | Description | Inherited From |
29
- | ----------------------- | ------------- | ------------------------------------------- | -------------- |
30
- | `btu-progress-ready` | `CustomEvent` | Fired after first render and initialization | |
31
- | `btu-progress-complete` | `CustomEvent` | Fired when determinate progress reaches 100 | |
48
+ | Name | Type | Description | Inherited From |
49
+ | -------------------------------- | ------------- | ------------------------------------------- | -------------- |
50
+ | `btu-circular-progress-ready` | `CustomEvent` | Fired after first render and initialization | |
51
+ | `btu-circular-progress-complete` | `CustomEvent` | Fired when determinate progress reaches 100 | |
32
52
 
33
53
  ### Attributes
34
54
 
35
- | Name | Field | Inherited From |
36
- | --------------- | ------------- | -------------- |
37
- | `indeterminate` | indeterminate | |
38
- | `size` | size | |
55
+ | Name | Field | Inherited From |
56
+ | ------------------------- | ---------------------- | -------------- |
57
+ | `indeterminate` | indeterminate | |
58
+ | `size` | size | |
59
+ | `color` | color | ProgressMixin |
60
+ | `thickness` | thickness | ProgressMixin |
61
+ | `progress` | progress | ProgressMixin |
62
+ | `label` | label | ProgressMixin |
63
+ | `initial-animation` | initialAnimation | ProgressMixin |
64
+ | `aria-label` | ariaLabel | ProgressMixin |
65
+ | `aria-labelledby` | ariaLabelledBy | ProgressMixin |
66
+ | `aria-valuetext` | ariaValueText | ProgressMixin |
67
+ | `completion-announcement` | completionAnnouncement | ProgressMixin |
39
68
 
40
69
  ### CSS Properties
41
70
 
@@ -19,23 +19,25 @@
19
19
 
20
20
  ### Fields
21
21
 
22
- | Name | Privacy | Type | Default | Description | Inherited From |
23
- | --------------- | ------- | --------------------- | ------- | ----------------------------------------------------------------------------- | -------------- |
24
- | `copydata` | | `string \| undefined` | | The text to be copied to the system clipboard. | |
25
- | `buttonClasses` | | `string \| undefined` | | Custom CSS classes for the button. If provided, replaces the default classes. | |
22
+ | Name | Privacy | Type | Default | Description | Inherited From |
23
+ | ---------------- | ------- | -------------------------------- | ------- | ------------------------------------------------------------------------------- | -------------- |
24
+ | `copydata` | | `string \| undefined` | | The text to be copied to the system clipboard. | |
25
+ | `buttonClasses` | | `string \| undefined` | | Custom CSS classes for the button. If provided, replaces the default classes. | |
26
+ | `copiedStateKey` | | `'btu-copy-to-clipboard-copied'` | | Custom state applied briefly after a successful copy; also emitted as an event. | ClipboardMixin |
26
27
 
27
28
  ### Methods
28
29
 
29
- | Name | Privacy | Description | Parameters | Return | Inherited From |
30
- | ------ | ------- | ------------------------------------------------------------------------------------------------------ | ---------- | ------ | -------------- |
31
- | `copy` | | Copies the copydata to the system clipboard.&#xA;Displays a success state for 3 seconds after copying. | | | |
30
+ | Name | Privacy | Description | Parameters | Return | Inherited From |
31
+ | ------ | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | --------- | ----------------- |
32
+ | `copy` | | Copies the copydata to the system clipboard.&#xA;Displays a success state for 3 seconds after copying. | `text: string, timeout` | | ClipboardMixin |
33
+ | `emit` | | Dispatches a type-safe CustomEvent with standardized configuration.&#xA;&#xA;All events are configured with:&#xA;- bubbles: true (event propagates up the DOM tree)&#xA;- cancelable: false (event cannot be cancelled)&#xA;- composed: true (event crosses shadow DOM boundaries) | `type: K, detail: UnpackCustomEvent<CustomEventMap[K]>` | `boolean` | EventEmitterMixin |
32
34
 
33
35
  ### Events
34
36
 
35
- | Name | Type | Description | Inherited From |
36
- | ---------------------- | ------------- | --------------------------------------------------- | -------------- |
37
- | `btu-clipboard-ready` | `CustomEvent` | Fired after first render and initialization | |
38
- | `btu-clipboard-copied` | `CustomEvent` | Fired when text is successfully copied to clipboard | |
37
+ | Name | Type | Description | Inherited From |
38
+ | ------------------------------ | ------------- | --------------------------------------------------- | -------------- |
39
+ | `btu-copy-to-clipboard-ready` | `CustomEvent` | Fired after first render and initialization | |
40
+ | `btu-copy-to-clipboard-copied` | `CustomEvent` | Fired when text is successfully copied to clipboard | |
39
41
 
40
42
  ### Attributes
41
43
 
@@ -18,37 +18,51 @@
18
18
 
19
19
  ### Fields
20
20
 
21
- | Name | Privacy | Type | Default | Description | Inherited From |
22
- | ------------------ | ------- | ------------------------- | ---------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | -------------- |
23
- | `label` | | `string` | `''` | Trigger button text. | |
24
- | `open` | | `boolean` | `false` | Panel visibility state. Can be set programmatically (e.g., for tour UIs)&#xA;— syncs to \`showPopover()\`/\`hidePopover()\` in \`updated()\`. | |
25
- | `placement` | | `Placement` | `'bottom-start'` | Panel placement: 'bottom-start', 'bottom-end', 'top-start', 'top-end'. | |
26
- | `size` | | `Size` | `'medium'` | Button size: 'small', 'medium', 'large'. | |
27
- | `disabled` | | `boolean` | `false` | Prevents opening. | |
28
- | `variant` | | `Variant` | `'secondary'` | Button variant: 'primary', 'secondary', 'tertiary', 'primary-clear', 'secondary-clear', 'tertiary-clear'. | |
29
- | `iconSymbol` | | `string` | `''` | Lucide icon symbol for the trigger. | |
30
- | `iconPosition` | | `'leading' \| 'trailing'` | `'leading'` | Icon position: 'leading' or 'trailing'. | |
31
- | `iconOnly` | | `boolean` | `false` | Hides label, shows icon only. | |
32
- | `stayOpenOnSelect` | | `boolean` | `false` | Keeps panel open on item click. | |
33
- | `noChevron` | | `boolean` | `false` | Hides the chevron icon on the trigger button. | |
21
+ | Name | Privacy | Type | Default | Description | Inherited From |
22
+ | ------------------ | ------- | ---------------------------------------- | ---------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | -------------- |
23
+ | `label` | | `string` | `''` | Trigger button text. | |
24
+ | `open` | | `boolean` | `false` | Panel visibility state. Can be set programmatically (e.g., for tour UIs)&#xA;— syncs to \`showPopover()\`/\`hidePopover()\` in \`updated()\`. | |
25
+ | `placement` | | `Placement` | `'bottom-start'` | Panel placement: 'bottom-start', 'bottom-end', 'top-start', 'top-end'. | |
26
+ | `size` | | `Size` | `'md'` | Button size: 'sm', 'md', 'lg'. | |
27
+ | `disabled` | | `boolean` | `false` | Prevents opening. | |
28
+ | `variant` | | `Variant` | `'secondary'` | Button variant: 'primary', 'secondary', 'tertiary', 'primary-clear', 'secondary-clear', 'tertiary-clear'. | |
29
+ | `symbol` | | `string` | `''` | Lucide icon symbol for the trigger. | |
30
+ | `iconPosition` | | `'leading' \| 'trailing'` | `'leading'` | Icon position: 'leading' or 'trailing'. | |
31
+ | `iconOnly` | | `boolean` | `false` | Hides label, shows icon only. | |
32
+ | `stayOpenOnSelect` | | `boolean` | `false` | Keeps panel open on item click. | |
33
+ | `noChevron` | | `boolean` | `false` | Hides the chevron icon on the trigger button. | |
34
+ | `tooltip` | | `string` | `''` | Tooltip text content. Set to empty string to remove the tooltip. | TooltipMixin |
35
+ | `tooltipPosition` | | `'top' \| 'bottom' \| 'left' \| 'right'` | `'top'` | Position relative to the host element. Auto-flips when constrained by the viewport. | TooltipMixin |
36
+ | `tooltipDelay` | | `number` | `300` | Show delay in milliseconds (hover trigger only). | TooltipMixin |
37
+ | `tooltipOffset` | | `TooltipOffset \| null` | `null` | Gap between host and tooltip (sm=4px, md=8px, lg=12px, xl=16px). | TooltipMixin |
38
+ | `tooltipNoArrow` | | `boolean` | `false` | Hide the arrow pseudo-element. | TooltipMixin |
39
+ | `tooltipTrigger` | | `string` | `'hover focus'` | Space-separated trigger types: 'hover', 'focus', 'click'. | TooltipMixin |
40
+ | `_onMouseLeave` | private | | | | TooltipMixin |
41
+ | `_onFocusIn` | private | | | | TooltipMixin |
42
+ | `_onFocusOut` | private | | | | TooltipMixin |
43
+ | `_onClick` | private | | | | TooltipMixin |
44
+ | `_onNativeToggle` | private | | | | TooltipMixin |
45
+ | `_onKeyDown` | private | | | | TooltipMixin |
46
+ | `_onDocumentClick` | private | `((e: MouseEvent) => void) \| null` | `null` | | TooltipMixin |
34
47
 
35
48
  ### Methods
36
49
 
37
- | Name | Privacy | Description | Parameters | Return | Inherited From |
38
- | ------------------- | ------- | ------------------------------------------------------- | ---------- | -------- | -------------- |
39
- | `_getButtonClasses` | private | Build the button class string based on variant and size | | `string` | |
40
- | `_showPanel` | private | Show the dropdown panel | | `void` | |
41
- | `_hidePanel` | private | Hide the dropdown panel | | `void` | |
50
+ | Name | Privacy | Description | Parameters | Return | Inherited From |
51
+ | ------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | --------- | ----------------- |
52
+ | `_getButtonClasses` | private | Build the button class string based on variant and size | | `string` | |
53
+ | `_showPanel` | private | Show the dropdown panel | | `void` | |
54
+ | `_hidePanel` | private | Hide the dropdown panel | | `void` | |
55
+ | `emit` | | Dispatches a type-safe CustomEvent with standardized configuration.&#xA;&#xA;All events are configured with:&#xA;- bubbles: true (event propagates up the DOM tree)&#xA;- cancelable: false (event cannot be cancelled)&#xA;- composed: true (event crosses shadow DOM boundaries) | `type: K, detail: UnpackCustomEvent<CustomEventMap[K]>` | `boolean` | EventEmitterMixin |
42
56
 
43
57
  ### Events
44
58
 
45
- | Name | Type | Description | Inherited From |
46
- | ---------------------------- | -------------------------------------------------- | ----------------------------------------------------------------------------- | -------------- |
47
- | `btu-dropdown-ready` | `CustomEvent` | Fired after first render and initialization | |
48
- | `btu-dropdown-show` | `CustomEvent` | Fired when the dropdown panel opens | |
49
- | `btu-dropdown-hide` | `CustomEvent` | Fired when the dropdown panel closes | |
50
- | `btu-dropdown-item-select` | `CustomEvent<{label: string, selected: boolean}>` | Fired when a menu item is activated (bubbles from btu-dropdown-item) | |
51
- | `btu-dropdown-item-favorite` | `CustomEvent<{label: string, favorited: boolean}>` | Fired when a menu item's favorite is toggled (bubbles from btu-dropdown-item) | |
59
+ | Name | Type | Description | Inherited From |
60
+ | ---------------------------- | ---------------------------------------------------------------- | ----------------------------------------------------------------------------- | -------------- |
61
+ | `btu-dropdown-ready` | `CustomEvent` | Fired after first render and initialization | |
62
+ | `btu-dropdown-show` | `CustomEvent` | Fired when the dropdown panel opens | |
63
+ | `btu-dropdown-hide` | `CustomEvent` | Fired when the dropdown panel closes | |
64
+ | `btu-dropdown-item-select` | `CustomEvent<{label: string, value: string, selected: boolean}>` | Fired when a menu item is activated (bubbles from btu-dropdown-item) | |
65
+ | `btu-dropdown-item-favorite` | `CustomEvent<{label: string, favorited: boolean}>` | Fired when a menu item's favorite is toggled (bubbles from btu-dropdown-item) | |
52
66
 
53
67
  ### Attributes
54
68
 
@@ -60,11 +74,22 @@
60
74
  | `size` | size | |
61
75
  | `disabled` | disabled | |
62
76
  | `variant` | variant | |
63
- | `icon-symbol` | iconSymbol | |
77
+ | `symbol` | symbol | |
64
78
  | `icon-position` | iconPosition | |
65
79
  | `icon-only` | iconOnly | |
66
80
  | `stay-open-on-select` | stayOpenOnSelect | |
67
81
  | `no-chevron` | noChevron | |
82
+ | `tooltip` | tooltip | TooltipMixin |
83
+ | `tooltipPosition` | tooltipPosition | TooltipMixin |
84
+ | `tooltipDelay` | tooltipDelay | TooltipMixin |
85
+ | `tooltipOffset` | tooltipOffset | TooltipMixin |
86
+ | `tooltipNoArrow` | tooltipNoArrow | TooltipMixin |
87
+ | `tooltipTrigger` | tooltipTrigger | TooltipMixin |
88
+ | `tooltip-position` | tooltipPosition | TooltipMixin |
89
+ | `tooltip-delay` | tooltipDelay | TooltipMixin |
90
+ | `tooltip-offset` | tooltipOffset | TooltipMixin |
91
+ | `tooltip-no-arrow` | tooltipNoArrow | TooltipMixin |
92
+ | `tooltip-trigger` | tooltipTrigger | TooltipMixin |
68
93
 
69
94
  ### CSS Properties
70
95
 
@@ -17,42 +17,59 @@
17
17
 
18
18
  ### Fields
19
19
 
20
- | Name | Privacy | Type | Default | Description | Inherited From |
21
- | ------------ | ------- | ------------------------------------- | ----------- | ---------------------------------------------- | -------------- |
22
- | `label` | | `string` | `''` | Display text for the item. | |
23
- | `type` | | `'default' \| 'divider' \| 'subhead'` | `'default'` | Item type: 'default', 'divider', or 'subhead'. | |
24
- | `iconSymbol` | | `string` | `''` | Lucide icon symbol. | |
25
- | `shortcut` | | `string` | `''` | Keyboard shortcut display text. | |
26
- | `disabled` | | `boolean` | `false` | Whether the item is disabled. | |
27
- | `selected` | | `boolean` | `false` | Whether the item is selected/checked. | |
28
- | `favorited` | | `boolean` | `false` | Whether the item is favorited. | |
20
+ | Name | Privacy | Type | Default | Description | Inherited From |
21
+ | ----------- | ------- | ------------------------------------- | ----------- | ---------------------------------------------- | -------------- |
22
+ | `label` | | `string` | `''` | Display text for the item. | |
23
+ | `type` | | `'default' \| 'divider' \| 'subhead'` | `'default'` | Item type: 'default', 'divider', or 'subhead'. | |
24
+ | `symbol` | | `string` | `''` | Lucide icon symbol. | |
25
+ | `shortcut` | | `string` | `''` | Keyboard shortcut display text. | |
26
+ | `value` | | `string` | `''` | Optional data value associated with the item. | |
27
+ | `disabled` | | `boolean` | `false` | Whether the item is disabled. | |
28
+ | `selected` | | `boolean` | `false` | Whether the item is selected/checked. | |
29
+ | `favorited` | | `boolean` | `false` | Whether the item is favorited. | |
30
+ | `error` | | `boolean` | `false` | Whether the item has an error. | |
29
31
 
30
32
  ### Methods
31
33
 
32
- | Name | Privacy | Description | Parameters | Return | Inherited From |
33
- | ----------------- | ------- | --------------------- | ---------- | ------ | -------------- |
34
- | `_toggleFavorite` | private | Toggle favorite state | `e: Event` | `void` | |
35
- | `_handleClick` | private | | | `void` | |
34
+ | Name | Privacy | Description | Parameters | Return | Inherited From |
35
+ | ----------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | --------- | ----------------- |
36
+ | `_toggleFavorite` | private | Toggle favorite state | `e: Event` | `void` | |
37
+ | `_handleClick` | private | | | `void` | |
38
+ | `emit` | | Dispatches a type-safe CustomEvent with standardized configuration.&#xA;&#xA;All events are configured with:&#xA;- bubbles: true (event propagates up the DOM tree)&#xA;- cancelable: false (event cannot be cancelled)&#xA;- composed: true (event crosses shadow DOM boundaries) | `type: K, detail: UnpackCustomEvent<CustomEventMap[K]>` | `boolean` | EventEmitterMixin |
36
39
 
37
40
  ### Events
38
41
 
39
- | Name | Type | Description | Inherited From |
40
- | ---------------------------- | -------------------------------------------------- | ------------------------------ | -------------- |
41
- | `btu-dropdown-item-ready` | `CustomEvent` | Fired after first render | |
42
- | `btu-dropdown-item-select` | `CustomEvent<{label: string, selected: boolean}>` | Fired when item is activated | |
43
- | `btu-dropdown-item-favorite` | `CustomEvent<{label: string, favorited: boolean}>` | Fired when favorite is toggled | |
42
+ | Name | Type | Description | Inherited From |
43
+ | ---------------------------- | ---------------------------------------------------------------- | ------------------------------ | -------------- |
44
+ | `btu-dropdown-item-ready` | `CustomEvent` | Fired after first render | |
45
+ | `btu-dropdown-item-select` | `CustomEvent<{label: string, value: string, selected: boolean}>` | Fired when item is activated | |
46
+ | `btu-dropdown-item-favorite` | `CustomEvent<{label: string, favorited: boolean}>` | Fired when favorite is toggled | |
44
47
 
45
48
  ### Attributes
46
49
 
47
- | Name | Field | Inherited From |
48
- | ------------- | ---------- | -------------- |
49
- | `label` | label | |
50
- | `type` | type | |
51
- | `icon-symbol` | iconSymbol | |
52
- | `shortcut` | shortcut | |
53
- | `disabled` | disabled | |
54
- | `selected` | selected | |
55
- | `favorited` | favorited | |
50
+ | Name | Field | Inherited From |
51
+ | ----------- | --------- | -------------- |
52
+ | `label` | label | |
53
+ | `type` | type | |
54
+ | `symbol` | symbol | |
55
+ | `shortcut` | shortcut | |
56
+ | `value` | value | |
57
+ | `disabled` | disabled | |
58
+ | `selected` | selected | |
59
+ | `favorited` | favorited | |
60
+ | `error` | error | |
61
+
62
+ ### CSS Properties
63
+
64
+ | Name | Default | Description |
65
+ | ------------------------------------- | ------- | ----------------------------------------------- |
66
+ | `--dropdown-item-font-size` | | Item font size (default: theme fontSize.sm) |
67
+ | `--dropdown-item-color` | | Item text color (default: gray-700) |
68
+ | `--dropdown-item-background` | | Item background color (default: transparent) |
69
+ | `--dropdown-item-hover-background` | | Background on hover (default: gray-100) |
70
+ | `--dropdown-item-hover-color` | | Text color on hover (default: gray-900) |
71
+ | `--dropdown-item-selected-background` | | Background when selected (default: primary-50) |
72
+ | `--dropdown-item-selected-color` | | Text color when selected (default: primary-700) |
56
73
 
57
74
  <hr/>
58
75
 
@@ -10,10 +10,11 @@
10
10
 
11
11
  ### Mixins
12
12
 
13
- | Name | Module | Package |
14
- | ------------------- | ------------------------------ | ------- |
15
- | `EventEmitterMixin` | /src/util/EventEmitterMixin.js | |
16
- | `ReadyMixin` | /src/util/ReadyMixin.js | |
13
+ | Name | Module | Package |
14
+ | --------------------- | -------------------------------- | ------- |
15
+ | `RovingTabindexMixin` | /src/util/RovingTabindexMixin.js | |
16
+ | `EventEmitterMixin` | /src/util/EventEmitterMixin.js | |
17
+ | `ReadyMixin` | /src/util/ReadyMixin.js | |
17
18
 
18
19
  ### Fields
19
20
 
@@ -23,7 +24,7 @@
23
24
  | `header` | | `boolean` | `false` | Show header bar with menu name. | |
24
25
  | `checkbox` | | `boolean` | `false` | Enable checkbox mode for items (menuitemcheckbox role). | |
25
26
  | `icon` | | `boolean` | `false` | Show icons before each item. | |
26
- | `iconSymbol` | | `string` | `''` | Fallback Lucide icon symbol for items without their own. | |
27
+ | `symbol` | | `string` | `''` | Fallback Lucide icon symbol for items without their own. | |
27
28
  | `favorites` | | `boolean` | `false` | Show favorite toggle on each item. | |
28
29
  | `shortcuts` | | `boolean` | `false` | Show keyboard shortcut text on each item. | |
29
30
  | `emptyMessage` | | `string` | `'No items available'` | Message displayed when the menu has no focusable items. | |
@@ -31,14 +32,13 @@
31
32
 
32
33
  ### Methods
33
34
 
34
- | Name | Privacy | Description | Parameters | Return | Inherited From |
35
- | ----------------------- | ------- | --------------------------------------------------------------- | ---------------------------------------------------------------- | ---------------- | -------------- |
36
- | `_configureItems` | private | Configure all child items with menu-level settings | | `void` | |
37
- | `_getAllItems` | private | Get all btu-dropdown-item children | | `DropdownItem[]` | |
38
- | `_getFocusableItems` | private | Get only focusable items (default type, skip dividers/subheads) | | `DropdownItem[]` | |
39
- | `_getCurrentFocusIndex` | private | Find the current focused item index | `focusable: DropdownItem[]` | `number` | |
40
- | `_findNextIndex` | private | Find next index wrapping around, moving in direction (+1 or -1) | `focusable: DropdownItem[], current: number, direction: 1 \| -1` | `number` | |
41
- | `_handleTypeahead` | private | Typeahead character matching with 500ms accumulation | `char: string, focusable: DropdownItem[]` | `void` | |
35
+ | Name | Privacy | Description | Parameters | Return | Inherited From |
36
+ | -------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | ---------------- | ----------------- |
37
+ | `_configureItems` | private | Configure all child items with menu-level settings | | `void` | |
38
+ | `_getAllItems` | private | Get all btu-dropdown-item children | | `DropdownItem[]` | |
39
+ | `_getFocusableItems` | private | Get only focusable items (default type, skip dividers/subheads) | | `DropdownItem[]` | |
40
+ | `_handleTypeahead` | private | Typeahead character matching with 500ms accumulation | `char: string, focusable: DropdownItem[]` | `void` | |
41
+ | `emit` | | Dispatches a type-safe CustomEvent with standardized configuration.&#xA;&#xA;All events are configured with:&#xA;- bubbles: true (event propagates up the DOM tree)&#xA;- cancelable: false (event cannot be cancelled)&#xA;- composed: true (event crosses shadow DOM boundaries) | `type: K, detail: UnpackCustomEvent<CustomEventMap[K]>` | `boolean` | EventEmitterMixin |
42
42
 
43
43
  ### Events
44
44
 
@@ -54,7 +54,7 @@
54
54
  | `header` | header | |
55
55
  | `checkbox` | checkbox | |
56
56
  | `icon` | icon | |
57
- | `icon-symbol` | iconSymbol | |
57
+ | `symbol` | symbol | |
58
58
  | `favorites` | favorites | |
59
59
  | `shortcuts` | shortcuts | |
60
60
  | `empty-message` | emptyMessage | |
@@ -0,0 +1,75 @@
1
+ # `src/components/empty-state/EmptyState.ts`:
2
+
3
+ ## class: `EmptyState`, `btu-empty-state`
4
+
5
+ ### Superclass
6
+
7
+ | Name | Module | Package |
8
+ | ------------ | ------ | ------- |
9
+ | `LitElement` | | lit |
10
+
11
+ ### Mixins
12
+
13
+ | Name | Module | Package |
14
+ | ------------------- | ------------------------------ | ------- |
15
+ | `EventEmitterMixin` | /src/util/EventEmitterMixin.js | |
16
+ | `ReadyMixin` | /src/util/ReadyMixin.js | |
17
+
18
+ ### Fields
19
+
20
+ | Name | Privacy | Type | Default | Description | Inherited From |
21
+ | ---------------- | ------- | ---------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------- |
22
+ | `heading` | | `string` | `''` | Heading text displayed in the empty state. | |
23
+ | `description` | | `string \| undefined` | | Description text displayed below the heading. | |
24
+ | `size` | | `'sm' \| 'md' \| 'lg'` | `'md'` | Size variant of the empty state. Affects spacing, description text, graphic size,&#xA;and — when \`heading-level\` is unset — the default heading level (sm→5, md→4, lg→3). | |
25
+ | `headingLevel` | | `number \| undefined` | | Heading level (1-6). When set to a valid integer 1-6, overrides the size-based&#xA;default and drives both the semantic h1-h6 tag and the visual heading size&#xA;(btu-heading-1 through btu-heading-6). Invalid values log a warning and fall&#xA;back to the size-based default. | |
26
+ | `initialClasses` | private | `string[]` | `[]` | | |
27
+
28
+ ### Methods
29
+
30
+ | Name | Privacy | Description | Parameters | Return | Inherited From |
31
+ | --------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- | -------------------------- | ----------------- |
32
+ | `syncGraphicIconSize` | private | | | `void` | |
33
+ | `resolveHeadingLevel` | private | | | `HeadingLevel` | |
34
+ | `renderHeading` | private | | `level: HeadingLevel, className: string` | `TemplateResult \| string` | |
35
+ | `emit` | | Dispatches a type-safe CustomEvent with standardized configuration.&#xA;&#xA;All events are configured with:&#xA;- bubbles: true (event propagates up the DOM tree)&#xA;- cancelable: false (event cannot be cancelled)&#xA;- composed: true (event crosses shadow DOM boundaries) | `type: K, detail: UnpackCustomEvent<CustomEventMap[K]>` | `boolean` | EventEmitterMixin |
36
+
37
+ ### Events
38
+
39
+ | Name | Type | Description | Inherited From |
40
+ | ------------------------ | ------------- | ---------------------------------------------- | -------------- |
41
+ | `btu-empty-state-ready` | `CustomEvent` | Fired after first render and initialization | |
42
+ | `btu-button-group-ready` | `CustomEvent` | Bubbles from the internal actions button-group | |
43
+
44
+ ### Attributes
45
+
46
+ | Name | Field | Inherited From |
47
+ | --------------- | ------------ | -------------- |
48
+ | `heading` | heading | |
49
+ | `description` | description | |
50
+ | `size` | size | |
51
+ | `heading-level` | headingLevel | |
52
+
53
+ ### CSS Properties
54
+
55
+ | Name | Default | Description |
56
+ | --------------------------------- | ------- | --------------------------------------------------------------- |
57
+ | `--empty-state-max-width` | | Maximum width of the content block (default: min(75cqw, 360px)) |
58
+ | `--empty-state-color-heading` | | Heading text color (default: gray-900) |
59
+ | `--empty-state-color-description` | | Description text color (default: gray-500) |
60
+
61
+ ### Slots
62
+
63
+ | Name | Description |
64
+ | --------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
65
+ | `graphic` | Pseudo-slot for icon, image, picture, or SVG graphic. When the child is a \`btu-icon\`, the component overrides its \`size\` attribute based on the empty-state \`size\` prop (sm→md, md→lg, lg→xl). Use an \`img\`, \`picture\`, or inline \`svg\` for full size control. |
66
+ | `actions` | Pseudo-slot for action buttons. Children are moved into an internal \`btu-button-group\` (variant="spaced"), so size and disabled state are managed by the group. |
67
+
68
+ <hr/>
69
+
70
+ ## Exports
71
+
72
+ | Kind | Name | Declaration | Module | Package |
73
+ | --------------------------- | ----------------- | ----------- | ---------------------------------------- | ------- |
74
+ | `js` | `default` | EmptyState | src/components/empty-state/EmptyState.ts | |
75
+ | `custom-element-definition` | `btu-empty-state` | EmptyState | src/components/empty-state/EmptyState.ts | |