@bspk/ui 1.3.11 → 1.3.16

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 (506) hide show
  1. package/dist/components/Accordion/Accordion.d.ts +22 -20
  2. package/dist/components/Accordion/Accordion.js +22 -20
  3. package/dist/components/Accordion/Accordion.js.map +1 -1
  4. package/dist/components/Accordion/AccordionExample.js +5 -4
  5. package/dist/components/Accordion/AccordionExample.js.map +1 -1
  6. package/dist/components/Avatar/Avatar.d.ts +1 -2
  7. package/dist/components/Avatar/Avatar.js +2 -3
  8. package/dist/components/Avatar/Avatar.js.map +1 -1
  9. package/dist/components/Avatar/avatar.css +13 -8
  10. package/dist/components/Avatar/avatar.css.js +13 -8
  11. package/dist/components/AvatarGroup/AvatarGroup.d.ts +1 -1
  12. package/dist/components/AvatarGroup/AvatarGroup.js +1 -1
  13. package/dist/components/Badge/Badge.d.ts +1 -1
  14. package/dist/components/Badge/Badge.js +1 -1
  15. package/dist/components/Badge/BadgeExample.js +0 -1
  16. package/dist/components/Badge/BadgeExample.js.map +1 -1
  17. package/dist/components/BadgeDot/BadgeDot.d.ts +1 -1
  18. package/dist/components/BadgeDot/BadgeDot.js +1 -1
  19. package/dist/components/BadgeDot/BadgeDotExample.js +0 -1
  20. package/dist/components/BadgeDot/BadgeDotExample.js.map +1 -1
  21. package/dist/components/BannerAlert/BannerAlert.d.ts +14 -12
  22. package/dist/components/BannerAlert/BannerAlert.js +14 -12
  23. package/dist/components/BannerAlert/BannerAlert.js.map +1 -1
  24. package/dist/components/BannerAlert/BannerAlertExample.js +0 -1
  25. package/dist/components/BannerAlert/BannerAlertExample.js.map +1 -1
  26. package/dist/components/Breadcrumb/Breadcrumb.d.ts +20 -18
  27. package/dist/components/Breadcrumb/Breadcrumb.js +20 -18
  28. package/dist/components/Breadcrumb/Breadcrumb.js.map +1 -1
  29. package/dist/components/Button/Button.d.ts +29 -4
  30. package/dist/components/Button/Button.js +33 -8
  31. package/dist/components/Button/Button.js.map +1 -1
  32. package/dist/components/Button/button.css +4 -3
  33. package/dist/components/Button/button.css.js +4 -3
  34. package/dist/components/Calendar/Calendar.d.ts +5 -41
  35. package/dist/components/Calendar/Calendar.js +61 -185
  36. package/dist/components/Calendar/Calendar.js.map +1 -1
  37. package/dist/components/Calendar/CalendarExample.js +0 -1
  38. package/dist/components/Calendar/CalendarExample.js.map +1 -1
  39. package/dist/components/Calendar/calendar.css +35 -28
  40. package/dist/components/Calendar/calendar.css.js +35 -28
  41. package/dist/components/Calendar/index.d.ts +1 -0
  42. package/dist/components/Calendar/index.js +1 -0
  43. package/dist/components/Calendar/index.js.map +1 -1
  44. package/dist/components/Calendar/utils.d.ts +11 -0
  45. package/dist/components/Calendar/utils.js +76 -0
  46. package/dist/components/Calendar/utils.js.map +1 -0
  47. package/dist/components/Card/Card.d.ts +1 -1
  48. package/dist/components/Card/Card.js +1 -1
  49. package/dist/components/Carousel/Carousel.d.ts +8 -8
  50. package/dist/components/Carousel/Carousel.js +8 -8
  51. package/dist/components/Carousel/carousel.css +0 -1
  52. package/dist/components/Carousel/carousel.css.js +0 -1
  53. package/dist/components/Checkbox/Checkbox.d.ts +1 -1
  54. package/dist/components/Checkbox/Checkbox.js +1 -1
  55. package/dist/components/Checkbox/checkbox.css +3 -1
  56. package/dist/components/Checkbox/checkbox.css.js +3 -1
  57. package/dist/components/CheckboxGroup/CheckboxGroup.d.ts +1 -1
  58. package/dist/components/CheckboxGroup/CheckboxGroup.js +1 -1
  59. package/dist/components/CheckboxGroup/checkbox-group.css +1 -1
  60. package/dist/components/CheckboxGroup/checkbox-group.css.js +1 -1
  61. package/dist/components/CheckboxGroupField/CheckboxGroupField.d.ts +1 -1
  62. package/dist/components/CheckboxGroupField/CheckboxGroupField.js +1 -1
  63. package/dist/components/CheckboxOption/CheckboxOption.d.ts +1 -1
  64. package/dist/components/CheckboxOption/CheckboxOption.js +1 -1
  65. package/dist/components/Chip/Chip.d.ts +1 -1
  66. package/dist/components/Chip/Chip.js +1 -1
  67. package/dist/components/ChipGroup/ChipGroup.d.ts +1 -1
  68. package/dist/components/ChipGroup/ChipGroup.js +1 -1
  69. package/dist/components/DatePicker/DatePicker.d.ts +23 -11
  70. package/dist/components/DatePicker/DatePicker.js +20 -83
  71. package/dist/components/DatePicker/DatePicker.js.map +1 -1
  72. package/dist/components/DatePicker/DatePickerExample.d.ts +1 -0
  73. package/dist/components/DatePicker/DatePickerExample.js +10 -2
  74. package/dist/components/DatePicker/DatePickerExample.js.map +1 -1
  75. package/dist/components/DatePicker/date-picker.css +9 -0
  76. package/dist/components/DatePicker/date-picker.css.js +9 -0
  77. package/dist/components/DatePickerField/DatePickerField.d.ts +1 -1
  78. package/dist/components/DatePickerField/DatePickerField.js +1 -1
  79. package/dist/components/Divider/Divider.d.ts +4 -4
  80. package/dist/components/Divider/Divider.js +4 -4
  81. package/dist/components/Divider/DividerExample.js +17 -20
  82. package/dist/components/Divider/DividerExample.js.map +1 -1
  83. package/dist/components/Drawer/Drawer.d.ts +8 -10
  84. package/dist/components/Drawer/Drawer.js +9 -12
  85. package/dist/components/Drawer/Drawer.js.map +1 -1
  86. package/dist/components/Drawer/DrawerExample.d.ts +1 -0
  87. package/dist/components/Drawer/DrawerExample.js +10 -4
  88. package/dist/components/Drawer/DrawerExample.js.map +1 -1
  89. package/dist/components/Drawer/drawer.css +6 -0
  90. package/dist/components/Drawer/drawer.css.js +6 -0
  91. package/dist/components/EmptyState/EmptyState.d.ts +2 -2
  92. package/dist/components/EmptyState/EmptyState.js +4 -7
  93. package/dist/components/EmptyState/EmptyState.js.map +1 -1
  94. package/dist/components/EmptyState/EmptyStateExample.js +5 -6
  95. package/dist/components/EmptyState/EmptyStateExample.js.map +1 -1
  96. package/dist/components/ExamplePlaceholder/ExamplePlaceholder.d.ts +6 -13
  97. package/dist/components/ExamplePlaceholder/ExamplePlaceholder.js +12 -7
  98. package/dist/components/ExamplePlaceholder/ExamplePlaceholder.js.map +1 -1
  99. package/dist/components/Fab/Fab.d.ts +5 -3
  100. package/dist/components/Fab/Fab.js +8 -6
  101. package/dist/components/Fab/Fab.js.map +1 -1
  102. package/dist/components/Fab/FabExample.d.ts +1 -0
  103. package/dist/components/Fab/FabExample.js +6 -0
  104. package/dist/components/Fab/FabExample.js.map +1 -1
  105. package/dist/components/Fab/fab.css +5 -3
  106. package/dist/components/Fab/fab.css.js +5 -3
  107. package/dist/components/FileUpload/FileUpload.d.ts +1 -1
  108. package/dist/components/FileUpload/FileUpload.js +1 -1
  109. package/dist/components/FileUploadItem/FileUploadItem.d.ts +1 -1
  110. package/dist/components/FileUploadItem/FileUploadItem.js +1 -1
  111. package/dist/components/Flex/Flex.d.ts +55 -0
  112. package/dist/components/Flex/Flex.js +38 -0
  113. package/dist/components/Flex/Flex.js.map +1 -0
  114. package/dist/components/Flex/FlexExample.d.ts +5 -0
  115. package/dist/components/Flex/FlexExample.js +13 -0
  116. package/dist/components/Flex/FlexExample.js.map +1 -0
  117. package/dist/components/Flex/index.d.ts +1 -0
  118. package/dist/components/Flex/index.js +2 -0
  119. package/dist/components/Flex/index.js.map +1 -0
  120. package/dist/components/FormField/FormFieldExample.js +0 -1
  121. package/dist/components/FormField/FormFieldExample.js.map +1 -1
  122. package/dist/components/Grid/Grid.d.ts +48 -0
  123. package/dist/components/Grid/Grid.js +36 -0
  124. package/dist/components/Grid/Grid.js.map +1 -0
  125. package/dist/components/Grid/GridExample.d.ts +3 -0
  126. package/dist/components/Grid/GridExample.js +28 -0
  127. package/dist/components/Grid/GridExample.js.map +1 -0
  128. package/dist/components/Grid/index.d.ts +1 -0
  129. package/dist/components/Grid/index.js +2 -0
  130. package/dist/components/Grid/index.js.map +1 -0
  131. package/dist/components/InlineAlert/InlineAlert.d.ts +1 -1
  132. package/dist/components/InlineAlert/InlineAlert.js +1 -1
  133. package/dist/components/Input/Input.d.ts +5 -9
  134. package/dist/components/Input/Input.js +5 -9
  135. package/dist/components/Input/Input.js.map +1 -1
  136. package/dist/components/Input/InputElement.js +3 -6
  137. package/dist/components/Input/InputElement.js.map +1 -1
  138. package/dist/components/Input/InputExample.d.ts +1 -0
  139. package/dist/components/Input/InputExample.js +10 -1
  140. package/dist/components/Input/InputExample.js.map +1 -1
  141. package/dist/components/Input/input.css +6 -1
  142. package/dist/components/Input/input.css.js +6 -1
  143. package/dist/components/InputField/InputField.d.ts +1 -1
  144. package/dist/components/InputField/InputField.js +1 -1
  145. package/dist/components/InputNumber/InputNumber.d.ts +6 -15
  146. package/dist/components/InputNumber/InputNumber.js +6 -15
  147. package/dist/components/InputNumber/InputNumber.js.map +1 -1
  148. package/dist/components/InputNumber/InputNumberExample.d.ts +1 -0
  149. package/dist/components/InputNumber/InputNumberExample.js +10 -1
  150. package/dist/components/InputNumber/InputNumberExample.js.map +1 -1
  151. package/dist/components/InputNumber/input-number.css +6 -4
  152. package/dist/components/InputNumber/input-number.css.js +6 -4
  153. package/dist/components/InputNumberField/InputNumberField.d.ts +1 -1
  154. package/dist/components/InputNumberField/InputNumberField.js +1 -1
  155. package/dist/components/InputPhone/InputPhone.d.ts +7 -9
  156. package/dist/components/InputPhone/InputPhone.js +19 -19
  157. package/dist/components/InputPhone/InputPhone.js.map +1 -1
  158. package/dist/components/InputPhone/InputPhoneExample.d.ts +2 -1
  159. package/dist/components/InputPhone/InputPhoneExample.js +9 -1
  160. package/dist/components/InputPhone/InputPhoneExample.js.map +1 -1
  161. package/dist/components/InputPhoneField/InputPhoneField.d.ts +1 -1
  162. package/dist/components/InputPhoneField/InputPhoneField.js +1 -1
  163. package/dist/components/Link/Link.d.ts +1 -1
  164. package/dist/components/Link/Link.js +1 -1
  165. package/dist/components/ListItem/ListItem.d.ts +1 -1
  166. package/dist/components/ListItem/ListItem.js +1 -1
  167. package/dist/components/Menu/Menu.d.ts +1 -3
  168. package/dist/components/Menu/Menu.js +1 -3
  169. package/dist/components/Menu/Menu.js.map +1 -1
  170. package/dist/components/Modal/Modal.d.ts +1 -3
  171. package/dist/components/Modal/Modal.js +2 -4
  172. package/dist/components/Modal/Modal.js.map +1 -1
  173. package/dist/components/OTPInput/OTPInput.d.ts +1 -1
  174. package/dist/components/OTPInput/OTPInput.js +1 -1
  175. package/dist/components/OTPInput/OTPInputExample.js +0 -1
  176. package/dist/components/OTPInput/OTPInputExample.js.map +1 -1
  177. package/dist/components/PageControl/PageControl.d.ts +1 -1
  178. package/dist/components/PageControl/PageControl.js +1 -1
  179. package/dist/components/PageControl/PageControlExample.js +0 -1
  180. package/dist/components/PageControl/PageControlExample.js.map +1 -1
  181. package/dist/components/PageHeader/PageHeader.d.ts +57 -0
  182. package/dist/components/PageHeader/PageHeader.js +28 -0
  183. package/dist/components/PageHeader/PageHeader.js.map +1 -0
  184. package/dist/components/PageHeader/PageHeaderExample.d.ts +4 -0
  185. package/dist/components/PageHeader/PageHeaderExample.js +56 -0
  186. package/dist/components/PageHeader/PageHeaderExample.js.map +1 -0
  187. package/dist/components/PageHeader/index.d.ts +1 -0
  188. package/dist/components/PageHeader/index.js +2 -0
  189. package/dist/components/PageHeader/index.js.map +1 -0
  190. package/dist/components/PageHeader/page-header.css +35 -0
  191. package/dist/components/PageHeader/page-header.css.js +40 -0
  192. package/dist/components/Pagination/Pagination.d.ts +2 -2
  193. package/dist/components/Pagination/Pagination.js +8 -3
  194. package/dist/components/Pagination/Pagination.js.map +1 -1
  195. package/dist/components/Pagination/pagination.css +8 -2
  196. package/dist/components/Pagination/pagination.css.js +8 -2
  197. package/dist/components/Password/Password.d.ts +11 -16
  198. package/dist/components/Password/Password.js +11 -16
  199. package/dist/components/Password/Password.js.map +1 -1
  200. package/dist/components/Password/PasswordExample.d.ts +1 -0
  201. package/dist/components/Password/PasswordExample.js +9 -0
  202. package/dist/components/Password/PasswordExample.js.map +1 -1
  203. package/dist/components/PasswordField/PasswordField.d.ts +1 -1
  204. package/dist/components/PasswordField/PasswordField.js +1 -1
  205. package/dist/components/Popover/Popover.d.ts +1 -1
  206. package/dist/components/Popover/Popover.js +1 -1
  207. package/dist/components/Popover/PopoverExample.js +0 -1
  208. package/dist/components/Popover/PopoverExample.js.map +1 -1
  209. package/dist/components/Popover/popover.css +7 -5
  210. package/dist/components/Popover/popover.css.js +7 -5
  211. package/dist/components/ProgressBar/ProgressBar.d.ts +1 -1
  212. package/dist/components/ProgressBar/ProgressBar.js +1 -1
  213. package/dist/components/ProgressCircle/ProgressCircle.d.ts +1 -1
  214. package/dist/components/ProgressCircle/ProgressCircle.js +1 -1
  215. package/dist/components/ProgressionStepper/ProgressionStepper.d.ts +1 -1
  216. package/dist/components/ProgressionStepper/ProgressionStepper.js +1 -1
  217. package/dist/components/ProgressionStepper/ProgressionStepperExample.js +0 -1
  218. package/dist/components/ProgressionStepper/ProgressionStepperExample.js.map +1 -1
  219. package/dist/components/ProgressionStepper/progression-stepper.css +5 -3
  220. package/dist/components/ProgressionStepper/progression-stepper.css.js +5 -3
  221. package/dist/components/ProgressionStepperBar/ProgressionStepperBar.d.ts +1 -1
  222. package/dist/components/ProgressionStepperBar/ProgressionStepperBar.js +1 -1
  223. package/dist/components/ProgressionStepperBar/progression-stepper-bar.css +6 -6
  224. package/dist/components/ProgressionStepperBar/progression-stepper-bar.css.js +7 -7
  225. package/dist/components/RadioGroup/RadioGroup.d.ts +1 -1
  226. package/dist/components/RadioGroup/RadioGroup.js +1 -1
  227. package/dist/components/RadioGroup/radio-group.css +1 -1
  228. package/dist/components/RadioGroup/radio-group.css.js +1 -1
  229. package/dist/components/RadioGroupField/RadioGroupField.d.ts +1 -1
  230. package/dist/components/RadioGroupField/RadioGroupField.js +1 -1
  231. package/dist/components/Rating/Rating.d.ts +3 -2
  232. package/dist/components/Rating/Rating.js +5 -3
  233. package/dist/components/Rating/Rating.js.map +1 -1
  234. package/dist/components/SearchBar/SearchBar.d.ts +1 -1
  235. package/dist/components/SearchBar/SearchBar.js +3 -4
  236. package/dist/components/SearchBar/SearchBar.js.map +1 -1
  237. package/dist/components/SegmentedControl/SegmentedControl.d.ts +1 -1
  238. package/dist/components/SegmentedControl/SegmentedControl.js +1 -1
  239. package/dist/components/SegmentedControl/segmented-control.css +3 -1
  240. package/dist/components/SegmentedControl/segmented-control.css.js +3 -1
  241. package/dist/components/Select/Select.d.ts +11 -24
  242. package/dist/components/Select/Select.js +11 -24
  243. package/dist/components/Select/Select.js.map +1 -1
  244. package/dist/components/Select/SelectExample.d.ts +1 -0
  245. package/dist/components/Select/SelectExample.js +18 -1
  246. package/dist/components/Select/SelectExample.js.map +1 -1
  247. package/dist/components/SelectField/SelectField.d.ts +1 -1
  248. package/dist/components/SelectField/SelectField.js +1 -1
  249. package/dist/components/Skeleton/Skeleton.d.ts +1 -1
  250. package/dist/components/Skeleton/Skeleton.js +1 -1
  251. package/dist/components/SkeletonText/SkeletonText.d.ts +1 -1
  252. package/dist/components/SkeletonText/SkeletonText.js +1 -1
  253. package/dist/components/Slider/Slider.d.ts +18 -3
  254. package/dist/components/Slider/Slider.js +20 -4
  255. package/dist/components/Slider/Slider.js.map +1 -1
  256. package/dist/components/Slider/SliderExample.d.ts +1 -0
  257. package/dist/components/Slider/SliderExample.js +7 -2
  258. package/dist/components/Slider/SliderExample.js.map +1 -1
  259. package/dist/components/Snackbar/Manager.d.ts +1 -1
  260. package/dist/components/Snackbar/Manager.js +1 -1
  261. package/dist/components/Snackbar/Snackbar.d.ts +1 -1
  262. package/dist/components/Snackbar/Snackbar.js +1 -1
  263. package/dist/components/Snackbar/SnackbarExample.js +0 -1
  264. package/dist/components/Snackbar/SnackbarExample.js.map +1 -1
  265. package/dist/components/Switch/Switch.d.ts +1 -1
  266. package/dist/components/Switch/Switch.js +1 -1
  267. package/dist/components/Switch/switch.css +11 -9
  268. package/dist/components/Switch/switch.css.js +11 -9
  269. package/dist/components/SwitchOption/SwitchOption.d.ts +1 -1
  270. package/dist/components/SwitchOption/SwitchOption.js +1 -1
  271. package/dist/components/TabGroup/TabGroup.d.ts +1 -1
  272. package/dist/components/TabGroup/TabGroup.js +1 -1
  273. package/dist/components/TabGroup/TabGroupExample.js +0 -1
  274. package/dist/components/TabGroup/TabGroupExample.js.map +1 -1
  275. package/dist/components/TabList/TabListExample.js +0 -1
  276. package/dist/components/TabList/TabListExample.js.map +1 -1
  277. package/dist/components/TabList/tab-list.css +5 -3
  278. package/dist/components/TabList/tab-list.css.js +5 -3
  279. package/dist/components/Table/Table.d.ts +2 -2
  280. package/dist/components/Table/Table.js +8 -8
  281. package/dist/components/Table/Table.js.map +1 -1
  282. package/dist/components/Table/TableExample.js +56 -54
  283. package/dist/components/Table/TableExample.js.map +1 -1
  284. package/dist/components/Table/utils.d.ts +2 -2
  285. package/dist/components/Table/utils.js +27 -22
  286. package/dist/components/Table/utils.js.map +1 -1
  287. package/dist/components/Tag/Tag.d.ts +1 -1
  288. package/dist/components/Tag/Tag.js +1 -1
  289. package/dist/components/Textarea/Textarea.d.ts +5 -8
  290. package/dist/components/Textarea/Textarea.js +5 -8
  291. package/dist/components/Textarea/Textarea.js.map +1 -1
  292. package/dist/components/Textarea/TextareaExample.d.ts +1 -0
  293. package/dist/components/Textarea/TextareaExample.js +12 -1
  294. package/dist/components/Textarea/TextareaExample.js.map +1 -1
  295. package/dist/components/Textarea/textarea.css +5 -3
  296. package/dist/components/Textarea/textarea.css.js +5 -3
  297. package/dist/components/TextareaField/TextareaField.d.ts +1 -1
  298. package/dist/components/TextareaField/TextareaField.js +1 -1
  299. package/dist/components/TimePicker/TimePicker.d.ts +5 -9
  300. package/dist/components/TimePicker/TimePicker.js +5 -9
  301. package/dist/components/TimePicker/TimePicker.js.map +1 -1
  302. package/dist/components/TimePicker/TimePickerExample.d.ts +1 -0
  303. package/dist/components/TimePicker/TimePickerExample.js +9 -1
  304. package/dist/components/TimePicker/TimePickerExample.js.map +1 -1
  305. package/dist/components/TimePickerField/TimePickerField.d.ts +1 -1
  306. package/dist/components/TimePickerField/TimePickerField.js +1 -1
  307. package/dist/components/Tooltip/Tooltip.d.ts +1 -1
  308. package/dist/components/Tooltip/Tooltip.js +2 -2
  309. package/dist/components/Tooltip/Tooltip.js.map +1 -1
  310. package/dist/components/Tooltip/tooltip.css +7 -3
  311. package/dist/components/Tooltip/tooltip.css.js +7 -3
  312. package/dist/components/Txt/Txt.d.ts +1 -1
  313. package/dist/components/Txt/Txt.js +1 -1
  314. package/dist/components/UIProvider/UIProvider.js +4 -6
  315. package/dist/components/UIProvider/UIProvider.js.map +1 -1
  316. package/dist/components/UIProvider/UIProviderExample.d.ts +0 -1
  317. package/dist/components/UIProvider/UIProviderExample.js +1 -46
  318. package/dist/components/UIProvider/UIProviderExample.js.map +1 -1
  319. package/dist/hooks/useControlledState.d.ts +7 -0
  320. package/dist/hooks/useControlledState.js +21 -0
  321. package/dist/hooks/useControlledState.js.map +1 -0
  322. package/dist/hooks/{useAddEventListener.js → useEventListener.js} +1 -1
  323. package/dist/hooks/useEventListener.js.map +1 -0
  324. package/dist/types/meta.d.ts +0 -1
  325. package/dist/types/meta.js +0 -7
  326. package/dist/types/meta.js.map +1 -1
  327. package/dist/utils/createCustomEvent.js +1 -1
  328. package/dist/utils/createCustomEvent.js.map +1 -1
  329. package/dist/utils/demo.d.ts +19 -2
  330. package/dist/utils/demo.js.map +1 -1
  331. package/dist/utils/dom.d.ts +1 -0
  332. package/dist/utils/dom.js +5 -0
  333. package/dist/utils/dom.js.map +1 -1
  334. package/dist/utils/handleKeyDown.d.ts +1 -0
  335. package/dist/utils/handleKeyDown.js +9 -3
  336. package/dist/utils/handleKeyDown.js.map +1 -1
  337. package/dist/utils/keyboard.d.ts +3 -1
  338. package/dist/utils/keyboard.js.map +1 -1
  339. package/dist/utils/sendAriaLiveMessage.d.ts +8 -0
  340. package/dist/utils/sendAriaLiveMessage.js +14 -0
  341. package/dist/utils/sendAriaLiveMessage.js.map +1 -0
  342. package/dist/utils/sizing.d.ts +3 -0
  343. package/dist/utils/sizing.js +28 -0
  344. package/dist/utils/sizing.js.map +1 -0
  345. package/dist/utils/uiContext.d.ts +0 -1
  346. package/dist/utils/uiContext.js.map +1 -1
  347. package/meta.ts +9 -8
  348. package/package.json +28 -22
  349. package/src/components/Accordion/Accordion.tsx +22 -20
  350. package/src/components/Accordion/AccordionExample.tsx +5 -4
  351. package/src/components/Avatar/Avatar.tsx +2 -3
  352. package/src/components/Avatar/avatar.scss +9 -6
  353. package/src/components/AvatarGroup/AvatarGroup.tsx +1 -1
  354. package/src/components/Badge/Badge.tsx +1 -1
  355. package/src/components/Badge/BadgeExample.tsx +0 -1
  356. package/src/components/BadgeDot/BadgeDot.tsx +1 -1
  357. package/src/components/BadgeDot/BadgeDotExample.tsx +0 -1
  358. package/src/components/BannerAlert/BannerAlert.tsx +14 -12
  359. package/src/components/BannerAlert/BannerAlertExample.tsx +0 -1
  360. package/src/components/Breadcrumb/Breadcrumb.tsx +20 -18
  361. package/src/components/Button/Button.tsx +36 -10
  362. package/src/components/Button/button.scss +13 -6
  363. package/src/components/Calendar/Calendar.rtl.test.tsx +1 -1
  364. package/src/components/Calendar/Calendar.tsx +156 -371
  365. package/src/components/Calendar/CalendarExample.tsx +0 -1
  366. package/src/components/Calendar/calendar.scss +46 -40
  367. package/src/components/Calendar/index.tsx +1 -0
  368. package/src/components/Calendar/utils.tsx +98 -0
  369. package/src/components/Card/Card.tsx +1 -1
  370. package/src/components/Carousel/Carousel.tsx +8 -8
  371. package/src/components/Carousel/carousel.scss +0 -1
  372. package/src/components/Checkbox/Checkbox.tsx +1 -1
  373. package/src/components/CheckboxGroup/CheckboxGroup.tsx +1 -1
  374. package/src/components/CheckboxGroupField/CheckboxGroupField.tsx +1 -1
  375. package/src/components/CheckboxOption/CheckboxOption.tsx +1 -1
  376. package/src/components/Chip/Chip.tsx +1 -1
  377. package/src/components/ChipGroup/ChipGroup.tsx +1 -1
  378. package/src/components/DatePicker/DatePicker.rtl.test.tsx +1 -1
  379. package/src/components/DatePicker/DatePicker.tsx +51 -106
  380. package/src/components/DatePicker/DatePickerExample.tsx +20 -3
  381. package/src/components/DatePicker/date-picker.scss +11 -0
  382. package/src/components/DatePickerField/DatePickerField.tsx +1 -1
  383. package/src/components/Divider/Divider.tsx +4 -4
  384. package/src/components/Divider/DividerExample.tsx +22 -23
  385. package/src/components/Drawer/Drawer.tsx +9 -16
  386. package/src/components/Drawer/DrawerExample.tsx +28 -4
  387. package/src/components/Drawer/drawer.scss +7 -0
  388. package/src/components/EmptyState/EmptyState.rtl.test.tsx +1 -1
  389. package/src/components/EmptyState/EmptyState.tsx +14 -21
  390. package/src/components/EmptyState/EmptyStateExample.tsx +5 -5
  391. package/src/components/ExamplePlaceholder/ExamplePlaceholder.tsx +17 -22
  392. package/src/components/Fab/Fab.tsx +10 -7
  393. package/src/components/Fab/FabExample.tsx +10 -1
  394. package/src/components/FileUpload/FileUpload.tsx +1 -1
  395. package/src/components/FileUploadItem/FileUploadItem.tsx +1 -1
  396. package/src/components/{Layout/Layout.rtl.test.tsx → Flex/Flex.rtl.test.tsx} +3 -3
  397. package/src/components/Flex/Flex.tsx +100 -0
  398. package/src/components/Flex/FlexExample.tsx +27 -0
  399. package/src/components/Flex/index.tsx +1 -0
  400. package/src/components/FormField/FormFieldExample.tsx +1 -2
  401. package/src/components/Grid/Grid.rtl.test.tsx +19 -0
  402. package/src/components/Grid/Grid.tsx +75 -0
  403. package/src/components/Grid/GridExample.tsx +42 -0
  404. package/src/components/Grid/index.tsx +1 -0
  405. package/src/components/InlineAlert/InlineAlert.tsx +1 -1
  406. package/src/components/Input/Input.tsx +5 -9
  407. package/src/components/Input/InputElement.tsx +4 -7
  408. package/src/components/Input/InputExample.tsx +19 -1
  409. package/src/components/Input/input.scss +9 -1
  410. package/src/components/InputField/InputField.tsx +1 -1
  411. package/src/components/InputNumber/InputNumber.tsx +6 -15
  412. package/src/components/InputNumber/InputNumberExample.tsx +24 -1
  413. package/src/components/InputNumberField/InputNumberField.tsx +1 -1
  414. package/src/components/InputPhone/InputPhone.tsx +18 -17
  415. package/src/components/InputPhone/InputPhoneExample.tsx +27 -2
  416. package/src/components/InputPhoneField/InputPhoneField.tsx +1 -1
  417. package/src/components/Link/Link.tsx +1 -1
  418. package/src/components/ListItem/ListItem.tsx +1 -1
  419. package/src/components/Menu/Menu.tsx +1 -3
  420. package/src/components/Modal/Modal.tsx +2 -4
  421. package/src/components/OTPInput/OTPInput.tsx +1 -1
  422. package/src/components/OTPInput/OTPInputExample.tsx +0 -1
  423. package/src/components/PageControl/PageControl.tsx +1 -1
  424. package/src/components/PageControl/PageControlExample.tsx +0 -1
  425. package/src/components/PageHeader/PageHeader.rtl.test.tsx +18 -0
  426. package/src/components/PageHeader/PageHeader.tsx +78 -0
  427. package/src/components/PageHeader/PageHeaderExample.tsx +58 -0
  428. package/src/components/PageHeader/index.tsx +1 -0
  429. package/src/components/PageHeader/page-header.scss +41 -0
  430. package/src/components/Pagination/Pagination.tsx +14 -3
  431. package/src/components/Pagination/pagination.scss +12 -5
  432. package/src/components/Password/Password.tsx +11 -16
  433. package/src/components/Password/PasswordExample.tsx +18 -1
  434. package/src/components/PasswordField/PasswordField.tsx +1 -1
  435. package/src/components/Popover/Popover.tsx +1 -1
  436. package/src/components/Popover/PopoverExample.tsx +0 -1
  437. package/src/components/ProgressBar/ProgressBar.tsx +1 -1
  438. package/src/components/ProgressCircle/ProgressCircle.tsx +1 -1
  439. package/src/components/ProgressionStepper/ProgressionStepper.tsx +1 -1
  440. package/src/components/ProgressionStepper/ProgressionStepperExample.tsx +0 -1
  441. package/src/components/ProgressionStepperBar/ProgressionStepperBar.tsx +1 -1
  442. package/src/components/RadioGroup/RadioGroup.tsx +1 -1
  443. package/src/components/RadioGroupField/RadioGroupField.tsx +1 -1
  444. package/src/components/Rating/Rating.tsx +7 -3
  445. package/src/components/SearchBar/SearchBar.tsx +3 -5
  446. package/src/components/SegmentedControl/SegmentedControl.tsx +1 -1
  447. package/src/components/Select/Select.tsx +11 -24
  448. package/src/components/Select/SelectExample.tsx +36 -1
  449. package/src/components/SelectField/SelectField.tsx +1 -1
  450. package/src/components/Skeleton/Skeleton.tsx +1 -1
  451. package/src/components/SkeletonText/SkeletonText.tsx +1 -1
  452. package/src/components/Slider/Slider.tsx +21 -4
  453. package/src/components/Slider/SliderExample.tsx +16 -2
  454. package/src/components/Snackbar/Manager.tsx +1 -1
  455. package/src/components/Snackbar/Snackbar.tsx +1 -1
  456. package/src/components/Snackbar/SnackbarExample.tsx +0 -1
  457. package/src/components/Switch/Switch.tsx +1 -1
  458. package/src/components/SwitchOption/SwitchOption.tsx +1 -1
  459. package/src/components/TabGroup/TabGroup.tsx +1 -1
  460. package/src/components/TabGroup/TabGroupExample.tsx +0 -1
  461. package/src/components/TabList/TabListExample.tsx +0 -1
  462. package/src/components/Table/Table.tsx +11 -16
  463. package/src/components/Table/TableExample.tsx +56 -54
  464. package/src/components/Table/utils.ts +31 -20
  465. package/src/components/Tag/Tag.tsx +1 -1
  466. package/src/components/Textarea/Textarea.tsx +5 -8
  467. package/src/components/Textarea/TextareaExample.tsx +21 -1
  468. package/src/components/TextareaField/TextareaField.tsx +1 -1
  469. package/src/components/TimePicker/TimePicker.tsx +5 -9
  470. package/src/components/TimePicker/TimePickerExample.tsx +18 -1
  471. package/src/components/TimePickerField/TimePickerField.tsx +1 -1
  472. package/src/components/Tooltip/Tooltip.tsx +2 -2
  473. package/src/components/Tooltip/tooltip.scss +2 -0
  474. package/src/components/Txt/Txt.tsx +1 -1
  475. package/src/components/UIProvider/UIProvider.tsx +1 -4
  476. package/src/components/UIProvider/UIProviderExample.tsx +0 -83
  477. package/src/hooks/useControlledState.ts +31 -0
  478. package/src/types/meta.ts +0 -8
  479. package/src/utils/createCustomEvent.ts +1 -1
  480. package/src/utils/demo.ts +19 -2
  481. package/src/utils/dom.ts +8 -0
  482. package/src/utils/handleKeyDown.ts +9 -3
  483. package/src/utils/keyboard.ts +5 -2
  484. package/src/utils/sendAriaLiveMessage.ts +17 -0
  485. package/src/utils/sizing.ts +30 -0
  486. package/src/utils/uiContext.ts +0 -1
  487. package/.scripts/index.ts +0 -110
  488. package/dist/components/Layout/Layout.d.ts +0 -50
  489. package/dist/components/Layout/Layout.js +0 -28
  490. package/dist/components/Layout/Layout.js.map +0 -1
  491. package/dist/components/Layout/LayoutExample.d.ts +0 -4
  492. package/dist/components/Layout/LayoutExample.js +0 -9
  493. package/dist/components/Layout/LayoutExample.js.map +0 -1
  494. package/dist/components/Layout/index.d.ts +0 -1
  495. package/dist/components/Layout/index.js +0 -2
  496. package/dist/components/Layout/index.js.map +0 -1
  497. package/dist/components/UIProvider/AriaLiveMessageHandler.d.ts +0 -13
  498. package/dist/components/UIProvider/AriaLiveMessageHandler.js +0 -31
  499. package/dist/components/UIProvider/AriaLiveMessageHandler.js.map +0 -1
  500. package/dist/hooks/useAddEventListener.js.map +0 -1
  501. package/src/components/Layout/Layout.tsx +0 -85
  502. package/src/components/Layout/LayoutExample.tsx +0 -17
  503. package/src/components/Layout/index.tsx +0 -1
  504. package/src/components/UIProvider/AriaLiveMessageHandler.tsx +0 -46
  505. /package/dist/hooks/{useAddEventListener.d.ts → useEventListener.d.ts} +0 -0
  506. /package/src/hooks/{useAddEventListener.ts → useEventListener.ts} +0 -0
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Button } from '../Button';
3
- import { Layout } from '../Layout';
3
+ import { Flex } from '../Flex';
4
4
  import { Txt } from '../Txt';
5
5
  /**
6
6
  * A design pattern component that indicates to users that system has no content to display.
@@ -9,16 +9,13 @@ import { Txt } from '../Txt';
9
9
  * import { EmptyState } from '@bspk/ui/EmptyState';
10
10
  *
11
11
  * <EmptyState body="Example body" header="Example header">
12
- * Example EmptyState
12
+ * <ExamplePlaceholder height="200px" width="200px" label="Illustration slot or icon slot" />
13
13
  * </EmptyState>;
14
14
  *
15
15
  * @name EmptyState
16
- * @phase UXReview
16
+ * @phase Stable
17
17
  */
18
18
  export function EmptyState({ children, header, body, callToAction, bodyAlign = 'center' }) {
19
- return (_jsxs(Layout, { align: "center", column: true, "data-bspk": "empty-state", style: {
20
- margin: 'var(--spacing-sizing-04)',
21
- maxWidth: '500px',
22
- }, children: [children, _jsxs(Layout, { align: "center", column: true, gap: "4", children: [_jsx(Txt, { as: "header", variant: "heading-h5", children: header }), _jsx(Txt, { as: "p", style: { textAlign: bodyAlign }, variant: "body-base", children: body })] }), callToAction && (_jsx(Button, { label: callToAction.label, onClick: callToAction.onClick, size: callToAction.size || 'medium', variant: "primary" }))] }));
19
+ return (_jsxs(Flex, { align: "center", "data-bspk": "empty-state", direction: "column", gap: "16", children: [children, _jsxs(Flex, { align: bodyAlign === 'left' ? 'flex-start' : 'center', direction: "column", gap: "4", style: { textAlign: bodyAlign }, children: [_jsx(Txt, { variant: "heading-h5", children: header }), _jsx(Txt, { variant: "body-base", children: body })] }), callToAction && (_jsx(Button, { label: callToAction.label, onClick: callToAction.onClick, size: callToAction.size || 'medium', variant: "primary" }))] }));
23
20
  }
24
21
  //# sourceMappingURL=EmptyState.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAiCvC;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,SAAS,GAAG,QAAQ,EAAmB;IACtG,OAAO,CACH,MAAC,MAAM,IACH,KAAK,EAAC,QAAQ,EACd,MAAM,qBACI,aAAa,EACvB,KAAK,EAAE;YACH,MAAM,EAAE,0BAA0B;YAClC,QAAQ,EAAE,OAAO;SACpB,aAEA,QAAQ,EACT,MAAC,MAAM,IAAC,KAAK,EAAC,QAAQ,EAAC,MAAM,QAAC,GAAG,EAAC,GAAG,aACjC,KAAC,GAAG,IAAC,EAAE,EAAC,QAAQ,EAAC,OAAO,EAAC,YAAY,YAChC,MAAM,GACL,EACN,KAAC,GAAG,IAAC,EAAE,EAAC,GAAG,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,OAAO,EAAC,WAAW,YAC3D,IAAI,GACH,IACD,EACR,YAAY,IAAI,CACb,KAAC,MAAM,IACH,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,IAAI,EAAE,YAAY,CAAC,IAAI,IAAI,QAAQ,EACnC,OAAO,EAAC,SAAS,GACnB,CACL,IACI,CACZ,CAAC;AACN,CAAC"}
1
+ {"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAiCvC;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,SAAS,GAAG,QAAQ,EAAmB;IACtG,OAAO,CACH,MAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,eAAW,aAAa,EAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,aACnE,QAAQ,EACT,MAAC,IAAI,IACD,KAAK,EAAE,SAAS,KAAK,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ,EACrD,SAAS,EAAC,QAAQ,EAClB,GAAG,EAAC,GAAG,EACP,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,aAE/B,KAAC,GAAG,IAAC,OAAO,EAAC,YAAY,YAAE,MAAM,GAAO,EACxC,KAAC,GAAG,IAAC,OAAO,EAAC,WAAW,YAAE,IAAI,GAAO,IAClC,EACN,YAAY,IAAI,CACb,KAAC,MAAM,IACH,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,IAAI,EAAE,YAAY,CAAC,IAAI,IAAI,QAAQ,EACnC,OAAO,EAAC,SAAS,GACnB,CACL,IACE,CACV,CAAC;AACN,CAAC"}
@@ -5,18 +5,17 @@ export const presets = [
5
5
  label: 'With Custom Content',
6
6
  propState: {
7
7
  callToAction: undefined,
8
- body: 'Example body',
9
- header: 'Example header',
10
- children: (_jsx(ExamplePlaceholder, { style: {
8
+ body: 'No results found',
9
+ header: 'We couldn’t find any matching results. Try changing your search.',
10
+ children: (_jsx(ExamplePlaceholder, { label: "Illustration slot or icon slot", style: {
11
11
  height: '200px',
12
- width: '60%',
13
- minWidth: '250px',
12
+ width: '200px',
14
13
  } })),
15
14
  },
16
15
  },
17
16
  ];
18
17
  export const EmptyStateExample = ({ action }) => ({
19
- containerStyle: { width: '100%' },
18
+ containerStyle: { width: '400px' },
20
19
  render: ({ props: { children, ...props }, Component }) => _jsx(Component, { ...props, children: children }),
21
20
  presets: [
22
21
  {
@@ -1 +1 @@
1
- {"version":3,"file":"EmptyStateExample.js","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyStateExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAGrE,MAAM,CAAC,MAAM,OAAO,GAA8B;IAC9C;QACI,KAAK,EAAE,qBAAqB;QAC5B,SAAS,EAAE;YACP,YAAY,EAAE,SAAS;YACvB,IAAI,EAAE,cAAc;YACpB,MAAM,EAAE,gBAAgB;YACxB,QAAQ,EAAE,CACN,KAAC,kBAAkB,IACf,KAAK,EAAE;oBACH,MAAM,EAAE,OAAO;oBACf,KAAK,EAAE,KAAK;oBACZ,QAAQ,EAAE,OAAO;iBACpB,GACH,CACL;SACJ;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAwC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IACnF,cAAc,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;IACjC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,YAAG,QAAQ,GAAa;IACtG,OAAO,EAAE;QACL;YACI,KAAK,EAAE,mBAAmB;YAC1B,SAAS,EAAE;gBACP,IAAI,EAAE,cAAc;gBACpB,MAAM,EAAE,gBAAgB;gBACxB,YAAY,EAAE;oBACV,KAAK,EAAE,oBAAoB;oBAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,6BAA6B,CAAC;iBACvD;gBACD,QAAQ,EAAE,SAAS;aACtB;SACJ;QACD,GAAG,OAAO;KACb;CACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"EmptyStateExample.js","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyStateExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAGrE,MAAM,CAAC,MAAM,OAAO,GAA8B;IAC9C;QACI,KAAK,EAAE,qBAAqB;QAC5B,SAAS,EAAE;YACP,YAAY,EAAE,SAAS;YACvB,IAAI,EAAE,kBAAkB;YACxB,MAAM,EAAE,kEAAkE;YAC1E,QAAQ,EAAE,CACN,KAAC,kBAAkB,IACf,KAAK,EAAC,gCAAgC,EACtC,KAAK,EAAE;oBACH,MAAM,EAAE,OAAO;oBACf,KAAK,EAAE,OAAO;iBACjB,GACH,CACL;SACJ;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAwC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IACnF,cAAc,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,YAAG,QAAQ,GAAa;IACtG,OAAO,EAAE;QACL;YACI,KAAK,EAAE,mBAAmB;YAC1B,SAAS,EAAE;gBACP,IAAI,EAAE,cAAc;gBACpB,MAAM,EAAE,gBAAgB;gBACxB,YAAY,EAAE;oBACV,KAAK,EAAE,oBAAoB;oBAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,6BAA6B,CAAC;iBACvD;gBACD,QAAQ,EAAE,SAAS;aACtB;SACJ;QACD,GAAG,OAAO;KACb;CACJ,CAAC,CAAC"}
@@ -1,11 +1,6 @@
1
+ import { ReactNode } from 'react';
1
2
  import { ElementProps } from '-/types/common';
2
3
  export type ExamplePlaceholderProps = {
3
- /**
4
- * Whether to hide the size text.
5
- *
6
- * @default false
7
- */
8
- hideSize?: boolean;
9
4
  /**
10
5
  * The height of the placeholder.
11
6
  *
@@ -20,12 +15,10 @@ export type ExamplePlaceholderProps = {
20
15
  * @type string
21
16
  */
22
17
  width?: number | string;
23
- /**
24
- * The direction of the placeholder.
25
- *
26
- * @default 'row'
27
- */
28
- direction?: 'column' | 'row';
18
+ /** An optional label for the placeholder. */
19
+ label?: string;
20
+ /** Optional children to display inside the placeholder instead of the label. */
21
+ children?: ReactNode;
29
22
  };
30
23
  /**
31
24
  * A utility component that serves as a placeholder for examples.
@@ -33,4 +26,4 @@ export type ExamplePlaceholderProps = {
33
26
  * @name ExamplePlaceholder
34
27
  * @phase Utility
35
28
  */
36
- export declare function ExamplePlaceholder({ hideSize, height, width, direction, ...props }: ElementProps<ExamplePlaceholderProps, 'div'>): import("react/jsx-runtime").JSX.Element;
29
+ export declare function ExamplePlaceholder({ height, width, label, children, ...props }: ElementProps<ExamplePlaceholderProps, 'div'>): import("react/jsx-runtime").JSX.Element;
@@ -1,5 +1,4 @@
1
1
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useRef } from 'react';
3
2
  import { Txt } from '../Txt';
4
3
  const dimension = (value) => (typeof value === 'number' ? `${value}px` : `${value}`);
5
4
  /**
@@ -8,13 +7,19 @@ const dimension = (value) => (typeof value === 'number' ? `${value}px` : `${valu
8
7
  * @name ExamplePlaceholder
9
8
  * @phase Utility
10
9
  */
11
- export function ExamplePlaceholder({ hideSize = false, height = 100, width = '100%', direction = 'row', ...props }) {
12
- const ref = useRef(null);
13
- return (_jsx("div", { ...props, "data-bspk-utility": "example-placeholder", "data-example-placeholder": true, ref: ref, style: {
14
- ...props.style,
10
+ export function ExamplePlaceholder({ height = 100, width = '100%', label, children, ...props }) {
11
+ return (_jsx("div", { ...props, "data-bspk-utility": "example-placeholder", style: {
12
+ flexDirection: 'column',
13
+ gap: 'var(--spacing-sizing-01)',
15
14
  width: dimension(width),
16
15
  height: dimension(height),
17
- flexDirection: direction,
18
- }, children: !hideSize && (_jsxs(_Fragment, { children: [_jsx(Txt, { variant: "labels-large", children: dimension(width) }), _jsx(Txt, { children: "\u00D7" }), _jsx(Txt, { variant: "labels-large", children: dimension(height) })] })) }));
16
+ background: 'var(--surface-neutral-t3-low)',
17
+ display: 'flex',
18
+ alignItems: 'center',
19
+ justifyContent: 'center',
20
+ textAlign: 'center',
21
+ font: 'var(--body-x-small)',
22
+ ...props.style,
23
+ }, children: children || label || (_jsxs(_Fragment, { children: [_jsx(Txt, { variant: "labels-large", children: dimension(width) }), _jsx(Txt, { children: "\u00D7" }), _jsx(Txt, { variant: "labels-large", children: dimension(height) })] })) }));
19
24
  }
20
25
  //# sourceMappingURL=ExamplePlaceholder.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ExamplePlaceholder.js","sourceRoot":"","sources":["../../../src/components/ExamplePlaceholder/ExamplePlaceholder.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAGvC,MAAM,SAAS,GAAG,CAAC,KAAsB,EAAE,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,EAAE,CAAC,CAAC;AA+BtG;;;;;GAKG;AACH,MAAM,UAAU,kBAAkB,CAAC,EAC/B,QAAQ,GAAG,KAAK,EAChB,MAAM,GAAG,GAAG,EACZ,KAAK,GAAG,MAAM,EACd,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACmC;IAC3C,MAAM,GAAG,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEhD,OAAO,CACH,iBACQ,KAAK,uBACS,qBAAqB,oCAEvC,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;YACH,GAAG,KAAK,CAAC,KAAK;YACd,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC;YACvB,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC;YACzB,aAAa,EAAE,SAAS;SAC3B,YAEA,CAAC,QAAQ,IAAI,CACV,8BACI,KAAC,GAAG,IAAC,OAAO,EAAC,cAAc,YAAE,SAAS,CAAC,KAAK,CAAC,GAAO,EACpD,KAAC,GAAG,yBAAc,EAClB,KAAC,GAAG,IAAC,OAAO,EAAC,cAAc,YAAE,SAAS,CAAC,MAAM,CAAC,GAAO,IACtD,CACN,GACC,CACT,CAAC;AACN,CAAC"}
1
+ {"version":3,"file":"ExamplePlaceholder.js","sourceRoot":"","sources":["../../../src/components/ExamplePlaceholder/ExamplePlaceholder.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAGvC,MAAM,SAAS,GAAG,CAAC,KAAsB,EAAE,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,EAAE,CAAC,CAAC;AAuBtG;;;;;GAKG;AACH,MAAM,UAAU,kBAAkB,CAAC,EAC/B,MAAM,GAAG,GAAG,EACZ,KAAK,GAAG,MAAM,EACd,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACmC;IAC3C,OAAO,CACH,iBACQ,KAAK,uBACS,qBAAqB,EACvC,KAAK,EAAE;YACH,aAAa,EAAE,QAAQ;YACvB,GAAG,EAAE,0BAA0B;YAC/B,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC;YACvB,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC;YACzB,UAAU,EAAE,+BAA+B;YAC3C,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,SAAS,EAAE,QAAQ;YACnB,IAAI,EAAE,qBAAqB;YAC3B,GAAG,KAAK,CAAC,KAAK;SACjB,YAEA,QAAQ,IAAI,KAAK,IAAI,CAClB,8BACI,KAAC,GAAG,IAAC,OAAO,EAAC,cAAc,YAAE,SAAS,CAAC,KAAK,CAAC,GAAO,EACpD,KAAC,GAAG,yBAAc,EAClB,KAAC,GAAG,IAAC,OAAO,EAAC,cAAc,YAAE,SAAS,CAAC,MAAM,CAAC,GAAO,IACtD,CACN,GACC,CACT,CAAC;AACN,CAAC"}
@@ -4,7 +4,7 @@ import { ButtonProps } from '-/components/Button';
4
4
  import { ElementProps } from '-/types/common';
5
5
  export type FabSize = 'medium' | 'small';
6
6
  export type FabVariant = 'neutral' | 'primary' | 'secondary';
7
- export type FabProps<As extends ElementType = ElementType> = Pick<ButtonProps<As>, 'as' | 'icon' | 'iconOnly' | 'innerRef' | 'onClick' | 'toolTip'> & Required<Pick<ButtonProps<As>, 'label'>> & {
7
+ export type FabProps<As extends ElementType = ElementType> = Pick<ButtonProps<As>, 'aria-label' | 'as' | 'icon' | 'iconOnly' | 'innerRef' | 'onClick' | 'tooltip'> & Required<Pick<ButtonProps<As>, 'label'>> & {
8
8
  /**
9
9
  * The size of the button.
10
10
  *
@@ -38,10 +38,12 @@ export type FabProps<As extends ElementType = ElementType> = Pick<ButtonProps<As
38
38
  * import { SvgBolt } from '@bspk/icons/Bolt';
39
39
  * import { Fab } from '@bspk/ui/Fab';
40
40
  *
41
- * <Fab icon={<SvgBolt />} label="Example label" placement="bottom-right" variant="neutral" />;
41
+ * <div style={{ width: '100%', height: 100 }}>
42
+ * <Fab icon={<SvgBolt />} label="Example label" placement="bottom-right" variant="neutral" />
43
+ * </div>;
42
44
  *
43
45
  * @name Fab
44
- * @phase UXReview
46
+ * @phase Stable
45
47
  */
46
48
  export declare function Fab<As extends ElementType = ElementType>(props: AriaAttributes & ElementProps<FabProps<As>, As>): import("react/jsx-runtime").JSX.Element;
47
49
  /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
@@ -10,16 +10,18 @@ import { Tooltip } from '../Tooltip';
10
10
  * import { SvgBolt } from '@bspk/icons/Bolt';
11
11
  * import { Fab } from '@bspk/ui/Fab';
12
12
  *
13
- * <Fab icon={<SvgBolt />} label="Example label" placement="bottom-right" variant="neutral" />;
13
+ * <div style={{ width: '100%', height: 100 }}>
14
+ * <Fab icon={<SvgBolt />} label="Example label" placement="bottom-right" variant="neutral" />
15
+ * </div>;
14
16
  *
15
17
  * @name Fab
16
- * @phase UXReview
18
+ * @phase Stable
17
19
  */
18
20
  export function Fab(props) {
19
- const { size = 'small', variant = 'primary', iconOnly: iconOnlyProp = false, as: As = 'button', placement = 'bottom-right', container = 'local', label, icon, toolTip, innerRef, ...otherProps } = props;
21
+ const { 'aria-label': ariaLabel, size = 'small', variant = 'primary', iconOnly: iconOnlyProp = false, as: As = 'button', placement = 'bottom-right', container = 'local', label, icon, tooltip, innerRef, ...otherProps } = props;
20
22
  // ignore iconOnly=true if there is no icon
21
23
  const iconOnly = iconOnlyProp === true && !!icon;
22
- const button = (triggerProps) => (_jsxs(As, { ...otherProps, ...triggerProps, "aria-label": label, "data-bspk": "fab", "data-container": container, "data-placement": placement, "data-position": container === 'page' ? 'fixed' : 'absolute', "data-round": iconOnly || undefined, "data-size": size, "data-variant": variant, onBlur: (e) => {
24
+ const button = (triggerProps) => (_jsxs(As, { ...otherProps, ...triggerProps, "aria-label": ariaLabel || label, "data-bspk": "fab", "data-container": container, "data-placement": placement, "data-position": container === 'page' ? 'fixed' : 'absolute', "data-round": iconOnly || undefined, "data-size": size, "data-variant": variant, onBlur: (e) => {
23
25
  triggerProps.onBlur?.();
24
26
  otherProps.onBlur?.(e);
25
27
  }, onFocus: (e) => {
@@ -32,8 +34,8 @@ export function Fab(props) {
32
34
  triggerProps.onMouseOver?.();
33
35
  otherProps.onMouseOver?.(e);
34
36
  }, ref: innerRef, children: [!!icon && isValidElement(icon) && (_jsx("span", { "aria-hidden": true, "data-fab-icon": true, children: icon })), !iconOnly && _jsx("span", { "data-fab-label": true, children: label })] }));
35
- if (toolTip || iconOnly)
36
- return (_jsx(Tooltip, { label: toolTip || label, placement: "top", children: button }));
37
+ if (tooltip || iconOnly)
38
+ return (_jsx(Tooltip, { label: tooltip || label, placement: "top", children: button }));
37
39
  return button({});
38
40
  }
39
41
  //# sourceMappingURL=Fab.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Fab.js","sourceRoot":"","sources":["../../../src/components/Fab/Fab.tsx"],"names":[],"mappings":";AAAA,OAAO,YAAY,CAAC;AACpB,OAAO,EAA+B,cAAc,EAAE,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AAsCpE;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,GAAG,CAAuC,KAAsD;IAC5G,MAAM,EACF,IAAI,GAAG,OAAO,EACd,OAAO,GAAG,SAAS,EACnB,QAAQ,EAAE,YAAY,GAAG,KAAK,EAC9B,EAAE,EAAE,EAAE,GAAG,QAAQ,EACjB,SAAS,GAAG,cAAc,EAC1B,SAAS,GAAG,OAAO,EACnB,KAAK,EACL,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,GAAG,UAAU,EAChB,GAAG,KAAK,CAAC;IAEV,2CAA2C;IAC3C,MAAM,QAAQ,GAAG,YAAY,KAAK,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC;IAEjD,MAAM,MAAM,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAClD,MAAC,EAAE,OACK,UAAU,KACV,YAAY,gBACJ,KAAK,eACP,KAAK,oBACC,SAAS,oBACT,SAAS,mBACV,SAAS,KAAK,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,gBAC9C,QAAQ,IAAI,SAAS,eACtB,IAAI,kBACD,OAAO,EACrB,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;YACV,YAAY,CAAC,MAAM,EAAE,EAAE,CAAC;YACxB,UAAU,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC;QAC3B,CAAC,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACX,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC;YACzB,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QAC5B,CAAC,EACD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAChB,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;YAC9B,UAAU,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC,EACD,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YACf,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC;YAC7B,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;QAChC,CAAC,EACD,GAAG,EAAE,QAAQ,aAEZ,CAAC,CAAC,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,CAC/B,8BAAmB,IAAI,mCAClB,IAAI,GACF,CACV,EACA,CAAC,QAAQ,IAAI,iDAAsB,KAAK,GAAQ,IAChD,CACR,CAAC;IAEF,IAAI,OAAO,IAAI,QAAQ;QACnB,OAAO,CACH,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,IAAI,KAAK,EAAE,SAAS,EAAC,KAAK,YAC5C,MAAM,GACD,CACb,CAAC;IAEN,OAAO,MAAM,CAAC,EAAE,CAAC,CAAC;AACtB,CAAC"}
1
+ {"version":3,"file":"Fab.js","sourceRoot":"","sources":["../../../src/components/Fab/Fab.tsx"],"names":[],"mappings":";AAAA,OAAO,YAAY,CAAC;AACpB,OAAO,EAA+B,cAAc,EAAE,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AAsCpE;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,GAAG,CAAuC,KAAsD;IAC5G,MAAM,EACF,YAAY,EAAE,SAAS,EACvB,IAAI,GAAG,OAAO,EACd,OAAO,GAAG,SAAS,EACnB,QAAQ,EAAE,YAAY,GAAG,KAAK,EAC9B,EAAE,EAAE,EAAE,GAAG,QAAQ,EACjB,SAAS,GAAG,cAAc,EAC1B,SAAS,GAAG,OAAO,EACnB,KAAK,EACL,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,GAAG,UAAU,EAChB,GAAG,KAAK,CAAC;IAEV,2CAA2C;IAC3C,MAAM,QAAQ,GAAG,YAAY,KAAK,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC;IAEjD,MAAM,MAAM,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAClD,MAAC,EAAE,OACK,UAAU,KACV,YAAY,gBACJ,SAAS,IAAI,KAAK,eACpB,KAAK,oBACC,SAAS,oBACT,SAAS,mBACV,SAAS,KAAK,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,gBAC9C,QAAQ,IAAI,SAAS,eACtB,IAAI,kBACD,OAAO,EACrB,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;YACV,YAAY,CAAC,MAAM,EAAE,EAAE,CAAC;YACxB,UAAU,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC;QAC3B,CAAC,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACX,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC;YACzB,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QAC5B,CAAC,EACD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAChB,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;YAC9B,UAAU,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;QACjC,CAAC,EACD,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YACf,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC;YAC7B,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;QAChC,CAAC,EACD,GAAG,EAAE,QAAQ,aAEZ,CAAC,CAAC,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,CAC/B,8BAAmB,IAAI,mCAClB,IAAI,GACF,CACV,EACA,CAAC,QAAQ,IAAI,iDAAsB,KAAK,GAAQ,IAChD,CACR,CAAC;IAEF,IAAI,OAAO,IAAI,QAAQ;QACnB,OAAO,CACH,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,IAAI,KAAK,EAAE,SAAS,EAAC,KAAK,YAC5C,MAAM,GACD,CACb,CAAC;IAEN,OAAO,MAAM,CAAC,EAAE,CAAC,CAAC;AACtB,CAAC"}
@@ -2,3 +2,4 @@ import { FabProps } from './Fab';
2
2
  import { ComponentExample } from '-/utils/demo';
3
3
  export declare const presets: import("-/utils/demo").Preset<import("../Button").ButtonProps>[];
4
4
  export declare const FabExample: ComponentExample<FabProps>;
5
+ export declare const Usage: () => import("react/jsx-runtime").JSX.Element;
@@ -1,3 +1,6 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { SvgBolt } from '@bspk/icons/Bolt';
3
+ import { Fab } from './Fab';
1
4
  import { ButtonExample } from '../Button/ButtonExample';
2
5
  export const presets = ButtonExample.presets || [];
3
6
  export const FabExample = {
@@ -23,4 +26,7 @@ export const FabExample = {
23
26
  },
24
27
  },
25
28
  };
29
+ export const Usage = () => {
30
+ return (_jsx("div", { style: { width: '100%', height: 100 }, children: _jsx(Fab, { icon: _jsx(SvgBolt, {}), label: "Example label", placement: "bottom-right", variant: "neutral" }) }));
31
+ };
26
32
  //# sourceMappingURL=FabExample.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FabExample.js","sourceRoot":"","sources":["../../../src/components/Fab/FabExample.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGlE,MAAM,CAAC,MAAM,OAAO,GAAG,aAAa,CAAC,OAAO,IAAI,EAAE,CAAC;AAEnD,MAAM,CAAC,MAAM,UAAU,GAA+B;IAClD,cAAc,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE;IACpE,OAAO,EAAE,aAAa,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;QAC7C,GAAG,MAAM;QACT,SAAS,EAAE;YACP,GAAG,MAAM,CAAC,SAAS;YACnB,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,SAAS;SACrB;KACJ,CAAC,CAAC;IACH,YAAY,EAAE;QACV,SAAS,EAAE,OAAO;QAClB,SAAS,EAAE,cAAc;KAC5B;IACD,QAAQ,EAAE;QACN,SAAS,EAAE,KAAK;QAChB,SAAS,EAAE,KAAK;QAChB,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,KAAK,EAAE,WAAW;SACrB;KACJ;CACJ,CAAC"}
1
+ {"version":3,"file":"FabExample.js","sourceRoot":"","sources":["../../../src/components/Fab/FabExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAY,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGlE,MAAM,CAAC,MAAM,OAAO,GAAG,aAAa,CAAC,OAAO,IAAI,EAAE,CAAC;AAEnD,MAAM,CAAC,MAAM,UAAU,GAA+B;IAClD,cAAc,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE;IACpE,OAAO,EAAE,aAAa,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;QAC7C,GAAG,MAAM;QACT,SAAS,EAAE;YACP,GAAG,MAAM,CAAC,SAAS;YACnB,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,SAAS;SACrB;KACJ,CAAC,CAAC;IACH,YAAY,EAAE;QACV,SAAS,EAAE,OAAO;QAClB,SAAS,EAAE,cAAc;KAC5B;IACD,QAAQ,EAAE;QACN,SAAS,EAAE,KAAK;QAChB,SAAS,EAAE,KAAK;QAChB,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,KAAK,EAAE,WAAW;SACrB;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,EAAE;IACtB,OAAO,CACH,cAAK,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,YACtC,KAAC,GAAG,IAAC,IAAI,EAAE,KAAC,OAAO,KAAG,EAAE,KAAK,EAAC,eAAe,EAAC,SAAS,EAAC,cAAc,EAAC,OAAO,EAAC,SAAS,GAAG,GACzF,CACT,CAAC;AACN,CAAC,CAAC"}
@@ -11,9 +11,6 @@
11
11
  z-index: var(--z-index-fab);
12
12
  box-shadow: var(--drop-shadow-float);
13
13
  border-radius: var(--radius-sm);
14
- background: var(--variant-background);
15
- color: var(--variant-foreground);
16
- --variant-gradient: linear-gradient(var(--variant-background), var(--variant-background));
17
14
  }
18
15
  [data-bspk=fab][data-container=page] {
19
16
  position: fixed;
@@ -75,6 +72,11 @@
75
72
  --variant-background: var(--surface-neutral-t1-base);
76
73
  --variant-foreground: var(--foreground-neutral-on-surface-variant-01);
77
74
  }
75
+ [data-bspk=fab] {
76
+ background: var(--variant-background);
77
+ color: var(--variant-foreground);
78
+ --variant-gradient: linear-gradient(var(--variant-background), var(--variant-background));
79
+ }
78
80
  [data-pseudo=hover] > [data-bspk=fab], [data-bspk=fab]:hover {
79
81
  background: linear-gradient(var(--interactions-brand-hover-opacity), var(--interactions-brand-hover-opacity)), var(--variant-gradient);
80
82
  }
@@ -14,9 +14,6 @@ style.appendChild(document.createTextNode(`[data-bspk=fab] {
14
14
  z-index: var(--z-index-fab);
15
15
  box-shadow: var(--drop-shadow-float);
16
16
  border-radius: var(--radius-sm);
17
- background: var(--variant-background);
18
- color: var(--variant-foreground);
19
- --variant-gradient: linear-gradient(var(--variant-background), var(--variant-background));
20
17
  }
21
18
  [data-bspk=fab][data-container=page] {
22
19
  position: fixed;
@@ -78,6 +75,11 @@ style.appendChild(document.createTextNode(`[data-bspk=fab] {
78
75
  --variant-background: var(--surface-neutral-t1-base);
79
76
  --variant-foreground: var(--foreground-neutral-on-surface-variant-01);
80
77
  }
78
+ [data-bspk=fab] {
79
+ background: var(--variant-background);
80
+ color: var(--variant-foreground);
81
+ --variant-gradient: linear-gradient(var(--variant-background), var(--variant-background));
82
+ }
81
83
  [data-pseudo=hover] > [data-bspk=fab], [data-bspk=fab]:hover {
82
84
  background: linear-gradient(var(--interactions-brand-hover-opacity), var(--interactions-brand-hover-opacity)), var(--variant-gradient);
83
85
  }
@@ -81,7 +81,7 @@ export type FileUploadProps = Pick<FileUploadItemProps, 'cancelButtonLabel' | 'o
81
81
  * };
82
82
  *
83
83
  * @name FileUpload
84
- * @phase UXReview
84
+ * @phase Stable
85
85
  */
86
86
  export declare function FileUpload({ dragAndDrop, multipleFiles, uploadSubtitle, maxFileSize, acceptedFileTypes, files, onUpload, onError, onCancel, cancelButtonLabel, }: FileUploadProps): import("react/jsx-runtime").JSX.Element;
87
87
  /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
@@ -32,7 +32,7 @@ const MB = 1048576;
32
32
  * };
33
33
  *
34
34
  * @name FileUpload
35
- * @phase UXReview
35
+ * @phase Stable
36
36
  */
37
37
  export function FileUpload({ dragAndDrop = false, multipleFiles = false, uploadSubtitle, maxFileSize = 2, acceptedFileTypes = [], files = [], onUpload, onError, onCancel, cancelButtonLabel = 'Cancel', }) {
38
38
  const fileInputRef = useRef(null);
@@ -30,7 +30,7 @@ export type FileUploadItemProps = FileEntry & {
30
30
  * />;
31
31
  *
32
32
  * @name FileUploadItem
33
- * @phase UXReview
33
+ * @phase Stable
34
34
  */
35
35
  export declare function FileUploadItem({ fileName, status, fileSize, onCancel, cancelButtonLabel: onCancelToolTip, progress, errorMessage, }: FileUploadItemProps): import("react/jsx-runtime").JSX.Element;
36
36
  /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
@@ -23,7 +23,7 @@ import { DEFAULT_ERROR_MESSAGE } from '../../utils/fileUploads';
23
23
  * />;
24
24
  *
25
25
  * @name FileUploadItem
26
- * @phase UXReview
26
+ * @phase Stable
27
27
  */
28
28
  export function FileUploadItem({ fileName = '', status, fileSize, onCancel, cancelButtonLabel: onCancelToolTip = 'Cancel', progress = 0, errorMessage = DEFAULT_ERROR_MESSAGE, }) {
29
29
  const subText = [fileSizeFormat(fileSize), status].filter(Boolean).join(' • ');
@@ -0,0 +1,55 @@
1
+ import { CSSProperties, ElementType, ReactNode } from 'react';
2
+ import { ElementProps } from '-/types/common';
3
+ import { SizingPixels } from '-/utils/sizing';
4
+ export type FlexProps<As extends ElementType = ElementType> = {
5
+ /**
6
+ * The content of the Flex.
7
+ *
8
+ * @required
9
+ */
10
+ children?: ReactNode;
11
+ /** The gap between the children. */
12
+ gap?: SizingPixels | 'auto';
13
+ /**
14
+ * The element type to render as.
15
+ *
16
+ * @default div
17
+ * @type ElementType
18
+ */
19
+ as?: As;
20
+ /**
21
+ * The align-items style to apply to the Flex.
22
+ *
23
+ * @default flex-start
24
+ */
25
+ align?: CSSProperties['alignItems'] | 'end' | 'start';
26
+ /**
27
+ * The justification style to apply to the Flex.
28
+ *
29
+ * @default flex-start
30
+ */
31
+ justify?: CSSProperties['justifyContent'];
32
+ /** The flex-wrap style to apply to the Flex. */
33
+ wrap?: CSSProperties['flexWrap'];
34
+ /** The flex-direction style to apply to the Flex. */
35
+ direction?: 'column-reverse' | 'column' | 'row-reverse' | 'row';
36
+ /** The padding to apply to the Flex. */
37
+ padding?: SizingPixels | SizingPixels[];
38
+ };
39
+ /**
40
+ * Utility component used within other components for layout purposes.
41
+ *
42
+ * @example
43
+ * import { Flex } from '@bspk/ui/Flex';
44
+ *
45
+ * <Flex gap="24" justify="center" style={{ width: '100%' }}>
46
+ * <div>Alpha</div>
47
+ * <div>Beta</div>
48
+ * <div>Gamma</div>
49
+ * </Flex>;
50
+ *
51
+ * @name Flex
52
+ * @phase Utility
53
+ */
54
+ export declare function Flex<As extends ElementType = ElementType>({ children, gap, style, as, align, justify, wrap, direction, padding, ...props }: ElementProps<FlexProps<As>, As>): import("react/jsx-runtime").JSX.Element;
55
+ /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
@@ -0,0 +1,38 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { numToSizingVar } from '../../utils/sizing';
3
+ /**
4
+ * Utility component used within other components for layout purposes.
5
+ *
6
+ * @example
7
+ * import { Flex } from '@bspk/ui/Flex';
8
+ *
9
+ * <Flex gap="24" justify="center" style={{ width: '100%' }}>
10
+ * <div>Alpha</div>
11
+ * <div>Beta</div>
12
+ * <div>Gamma</div>
13
+ * </Flex>;
14
+ *
15
+ * @name Flex
16
+ * @phase Utility
17
+ */
18
+ export function Flex({ children, gap, style, as, align = 'flex-start', justify = 'flex-start', wrap, direction = 'row', padding, ...props }) {
19
+ const As = as || 'div';
20
+ const alignItems = align === 'start' ? 'flex-start' : align === 'end' ? 'flex-end' : align;
21
+ const paddingValue = getPaddingValue(padding);
22
+ return (_jsx(As, { ...props, "data-bspk-utility": "flex", style: {
23
+ display: 'flex',
24
+ flexDirection: direction,
25
+ gap: numToSizingVar(gap),
26
+ alignItems,
27
+ justifyContent: justify || 'flex-start',
28
+ flexWrap: wrap ? 'wrap' : 'nowrap',
29
+ padding: paddingValue,
30
+ ...style,
31
+ }, children: children }));
32
+ }
33
+ function getPaddingValue(padding) {
34
+ if (!padding)
35
+ return undefined;
36
+ return (!Array.isArray(padding) ? [padding] : padding).map((p) => numToSizingVar(p)).join(' ');
37
+ }
38
+ //# sourceMappingURL=Flex.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Flex.js","sourceRoot":"","sources":["../../../src/components/Flex/Flex.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAgB,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAsC9D;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,IAAI,CAAuC,EACvD,QAAQ,EACR,GAAG,EACH,KAAK,EACL,EAAE,EACF,KAAK,GAAG,YAAY,EACpB,OAAO,GAAG,YAAY,EACtB,IAAI,EACJ,SAAS,GAAG,KAAK,EACjB,OAAO,EACP,GAAG,KAAK,EACsB;IAC9B,MAAM,EAAE,GAAgB,EAAE,IAAI,KAAK,CAAC;IAEpC,MAAM,UAAU,GAAG,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC;IAE3F,MAAM,YAAY,GAAG,eAAe,CAAC,OAAO,CAAC,CAAC;IAE9C,OAAO,CACH,KAAC,EAAE,OACK,KAAK,uBACS,MAAM,EACxB,KAAK,EAAE;YACH,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,SAAS;YACxB,GAAG,EAAE,cAAc,CAAC,GAAG,CAAC;YACxB,UAAU;YACV,cAAc,EAAE,OAAO,IAAI,YAAY;YACvC,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ;YAClC,OAAO,EAAE,YAAY;YACrB,GAAG,KAAK;SACX,YAEA,QAAQ,GACR,CACR,CAAC;AACN,CAAC;AAED,SAAS,eAAe,CAAC,OAAuC;IAC5D,IAAI,CAAC,OAAO;QAAE,OAAO,SAAS,CAAC;IAE/B,OAAO,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACnG,CAAC"}
@@ -0,0 +1,5 @@
1
+ import { FlexProps } from './Flex';
2
+ import { ComponentExample, Preset } from '-/utils/demo';
3
+ export declare const presets: Preset<FlexProps>[];
4
+ export declare const FlexExample: ComponentExample<FlexProps>;
5
+ export declare const Usage: () => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,13 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { Flex } from './Flex';
3
+ export const presets = [];
4
+ export const FlexExample = {
5
+ render: ({ props, Component }) => {
6
+ return (_jsxs(Component, { ...props, children: [_jsx("div", { children: "Alpha" }), _jsx("div", { children: "Beta" }), _jsx("div", { children: "Gamma" })] }));
7
+ },
8
+ presets,
9
+ };
10
+ export const Usage = () => {
11
+ return (_jsxs(Flex, { gap: "24", justify: "center", style: { width: '100%' }, children: [_jsx("div", { children: "Alpha" }), _jsx("div", { children: "Beta" }), _jsx("div", { children: "Gamma" })] }));
12
+ };
13
+ //# sourceMappingURL=FlexExample.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FlexExample.js","sourceRoot":"","sources":["../../../src/components/Flex/FlexExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAC;AAGzC,MAAM,CAAC,MAAM,OAAO,GAAwB,EAAE,CAAC;AAE/C,MAAM,CAAC,MAAM,WAAW,GAAgC;IACpD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,OAAO,CACH,MAAC,SAAS,OAAK,KAAK,aAChB,kCAAgB,EAChB,iCAAe,EACf,kCAAgB,IACR,CACf,CAAC;IACN,CAAC;IACD,OAAO;CACV,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,EAAE;IACtB,OAAO,CACH,MAAC,IAAI,IAAC,GAAG,EAAC,IAAI,EAAC,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,aACpD,kCAAgB,EAChB,iCAAe,EACf,kCAAgB,IACb,CACV,CAAC;AACN,CAAC,CAAC"}
@@ -0,0 +1 @@
1
+ export * from './Flex';
@@ -0,0 +1,2 @@
1
+ export * from './Flex';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Flex/index.tsx"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}
@@ -20,7 +20,6 @@ export const presets = [
20
20
  },
21
21
  ];
22
22
  export const FormFieldExample = {
23
- containerStyle: { width: '100%' },
24
23
  defaultState: {},
25
24
  disableProps: [],
26
25
  presets: presets,
@@ -1 +1 @@
1
- {"version":3,"file":"FormFieldExample.js","sourceRoot":"","sources":["../../../src/components/FormField/FormFieldExample.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"FormFieldExample.js","sourceRoot":"","sources":["../../../src/components/FormField/FormFieldExample.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,48 @@
1
+ import { ReactNode } from 'react';
2
+ import { SizingPixels } from '-/utils/sizing';
3
+ export type GridProps = {
4
+ /**
5
+ * The content of the grid.
6
+ *
7
+ * @required
8
+ */
9
+ children: ReactNode;
10
+ /**
11
+ * The number of columns in the grid or an array of column widths in fractions or other CSS units.
12
+ *
13
+ * Values may be "100px, auto, 2fr, 20%" for four columns with specific widths.
14
+ *
15
+ * @default 1
16
+ *
17
+ * @exampleType string
18
+ */
19
+ columns?: (number | string)[] | number;
20
+ /** The gap between the children. */
21
+ gap?: SizingPixels;
22
+ /** Additional styles for the grid container. */
23
+ style?: React.CSSProperties;
24
+ /**
25
+ * The minimum width of each column.
26
+ *
27
+ * @default auto
28
+ */
29
+ minColumnWidth?: string;
30
+ };
31
+ /**
32
+ * A utility component that arranges its children in a grid layout.
33
+ *
34
+ * @example
35
+ * import { Grid } from '@bspk/ui/Grid';
36
+ *
37
+ * <Grid columns={4} gap="8">
38
+ * <ExamplePlaceholder label="Cell 1" />
39
+ * <ExamplePlaceholder label="Cell 2" />
40
+ * <ExamplePlaceholder label="Cell 3" />
41
+ * <ExamplePlaceholder label="Cell 4" />
42
+ * </Grid>;
43
+ *
44
+ * @name Grid
45
+ * @phase Utility
46
+ */
47
+ export declare function Grid({ columns, children, gap, style, minColumnWidth }: GridProps): import("react/jsx-runtime").JSX.Element;
48
+ /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
@@ -0,0 +1,36 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { numToSizingVar } from '../../utils/sizing';
3
+ /**
4
+ * A utility component that arranges its children in a grid layout.
5
+ *
6
+ * @example
7
+ * import { Grid } from '@bspk/ui/Grid';
8
+ *
9
+ * <Grid columns={4} gap="8">
10
+ * <ExamplePlaceholder label="Cell 1" />
11
+ * <ExamplePlaceholder label="Cell 2" />
12
+ * <ExamplePlaceholder label="Cell 3" />
13
+ * <ExamplePlaceholder label="Cell 4" />
14
+ * </Grid>;
15
+ *
16
+ * @name Grid
17
+ * @phase Utility
18
+ */
19
+ export function Grid({ columns = 1, children, gap, style, minColumnWidth = 'auto' }) {
20
+ let gridTemplateColumns = `repeat(auto-fit, minmax(${minColumnWidth}, 1fr))`;
21
+ // If columns is an array, map it to a string of fractions
22
+ if (Array.isArray(columns))
23
+ gridTemplateColumns =
24
+ columns?.map((width) => (typeof width === 'string' ? width : `${width}fr`)).join(' ') || 'auto';
25
+ // If columns is not an array, use the default repeat pattern
26
+ else
27
+ gridTemplateColumns = `repeat(${columns}, minmax(${minColumnWidth}, 1fr))`;
28
+ return (_jsx("div", { "data-bspk-utility": "grid", style: {
29
+ width: '100%',
30
+ display: 'grid',
31
+ gridTemplateColumns,
32
+ gap: numToSizingVar(gap),
33
+ ...style,
34
+ }, children: children }));
35
+ }
36
+ //# sourceMappingURL=Grid.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Grid.js","sourceRoot":"","sources":["../../../src/components/Grid/Grid.tsx"],"names":[],"mappings":";AACA,OAAO,EAAgB,cAAc,EAAE,MAAM,gBAAgB,CAAC;AA+B9D;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,IAAI,CAAC,EAAE,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,cAAc,GAAG,MAAM,EAAa;IAC1F,IAAI,mBAAmB,GAAG,2BAA2B,cAAc,SAAS,CAAC;IAE7E,0DAA0D;IAC1D,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC;QACtB,mBAAmB;YACf,OAAO,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,MAAM,CAAC;IACxG,6DAA6D;;QACxD,mBAAmB,GAAG,UAAU,OAAO,YAAY,cAAc,SAAS,CAAC;IAEhF,OAAO,CACH,mCACsB,MAAM,EACxB,KAAK,EAAE;YACH,KAAK,EAAE,MAAM;YACb,OAAO,EAAE,MAAM;YACf,mBAAmB;YACnB,GAAG,EAAE,cAAc,CAAC,GAAG,CAAC;YACxB,GAAG,KAAK;SACX,YAEA,QAAQ,GACP,CACT,CAAC;AACN,CAAC"}
@@ -0,0 +1,3 @@
1
+ import { GridProps } from '.';
2
+ import { ComponentExample } from '-/utils/demo';
3
+ export declare const GridExample: ComponentExample<GridProps>;