@povio/ui 2.3.2 → 3.0.0-rc.1

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 (352) hide show
  1. package/dist/assets/icons/AlignCenter.js +26 -11
  2. package/dist/assets/icons/AlignLeft.js +26 -11
  3. package/dist/assets/icons/AlignLeftRight.js +26 -11
  4. package/dist/assets/icons/AlignRight.js +26 -11
  5. package/dist/assets/icons/ArrowDropDown.js +26 -11
  6. package/dist/assets/icons/ArrowDropUp.js +26 -11
  7. package/dist/assets/icons/ArrowLeft.js +26 -11
  8. package/dist/assets/icons/ArrowRight.js +26 -11
  9. package/dist/assets/icons/Bold.js +26 -11
  10. package/dist/assets/icons/BulletedList.js +26 -11
  11. package/dist/assets/icons/Calendar.js +28 -13
  12. package/dist/assets/icons/Check.js +28 -13
  13. package/dist/assets/icons/CheckCircle.js +26 -11
  14. package/dist/assets/icons/CheckboxCheckmark.js +29 -14
  15. package/dist/assets/icons/CheckboxIndeterminate.js +29 -14
  16. package/dist/assets/icons/ChevronDown.js +28 -13
  17. package/dist/assets/icons/ChevronLeft.js +28 -13
  18. package/dist/assets/icons/ChevronRight.js +28 -13
  19. package/dist/assets/icons/ChevronUp.js +28 -13
  20. package/dist/assets/icons/ChevronsLeft.js +28 -13
  21. package/dist/assets/icons/ChevronsRight.js +28 -13
  22. package/dist/assets/icons/Clock.js +26 -11
  23. package/dist/assets/icons/Close.js +26 -11
  24. package/dist/assets/icons/DateTime.js +35 -14
  25. package/dist/assets/icons/DragIndicator.js +26 -11
  26. package/dist/assets/icons/File.js +28 -13
  27. package/dist/assets/icons/Highlight.js +26 -11
  28. package/dist/assets/icons/HighlightOn.js +49 -15
  29. package/dist/assets/icons/Home.js +26 -11
  30. package/dist/assets/icons/Info.js +37 -16
  31. package/dist/assets/icons/Italic.js +26 -11
  32. package/dist/assets/icons/Link.js +26 -11
  33. package/dist/assets/icons/Menu.js +26 -11
  34. package/dist/assets/icons/NumberedList.js +26 -11
  35. package/dist/assets/icons/PointerHorizontal.js +26 -11
  36. package/dist/assets/icons/PointerVertical.js +26 -11
  37. package/dist/assets/icons/Search.js +26 -11
  38. package/dist/assets/icons/Send.js +28 -13
  39. package/dist/assets/icons/Strikethrough.js +26 -11
  40. package/dist/assets/icons/TextColor.js +48 -14
  41. package/dist/assets/icons/Today.js +26 -11
  42. package/dist/assets/icons/Underlined.js +28 -13
  43. package/dist/assets/icons/Upload.js +35 -14
  44. package/dist/assets/icons/Visibility.js +26 -11
  45. package/dist/assets/icons/VisibilityOff.js +26 -11
  46. package/dist/assets/icons/WarningFilled.js +28 -13
  47. package/dist/assets/locales/sl/translation.json.js +2 -2
  48. package/dist/components/Breadcrumbs/Breadcrumbs.js +215 -64
  49. package/dist/components/Breadcrumbs/breadcrumbs.cva.d.ts +40 -14
  50. package/dist/components/Breadcrumbs/breadcrumbs.cva.js +21 -18
  51. package/dist/components/Menu/Menu.js +18 -2
  52. package/dist/components/Menu/MenuDesktop.js +41 -7
  53. package/dist/components/Menu/MenuItem.js +35 -12
  54. package/dist/components/Menu/MenuMobile.js +103 -44
  55. package/dist/components/Menu/MenuPopover.js +110 -34
  56. package/dist/components/Menu/menu.cva.d.ts +35 -13
  57. package/dist/components/Menu/menu.cva.js +30 -24
  58. package/dist/components/buttons/Button/Button.js +7 -7
  59. package/dist/components/buttons/Button/button.cva.d.ts +95 -26
  60. package/dist/components/buttons/Button/button.cva.js +601 -589
  61. package/dist/components/buttons/IconButton/IconButton.js +40 -8
  62. package/dist/components/buttons/InlineIconButton/InlineIconButton.d.ts +2 -1
  63. package/dist/components/buttons/InlineIconButton/InlineIconButton.js +34 -9
  64. package/dist/components/buttons/PillButton/PillButton.js +59 -21
  65. package/dist/components/buttons/PillButton/pillButton.cva.d.ts +33 -9
  66. package/dist/components/buttons/PillButton/pillButton.cva.js +247 -239
  67. package/dist/components/buttons/SplitButton/SplitButton.js +103 -18
  68. package/dist/components/buttons/TextButton/TextButton.js +30 -8
  69. package/dist/components/buttons/ToggleButton/ToggleButton.js +28 -8
  70. package/dist/components/buttons/shared/ButtonContent.js +83 -25
  71. package/dist/components/buttons/shared/buttonContent.cva.d.ts +3 -5
  72. package/dist/components/buttons/shared/buttonContent.cva.js +1 -8
  73. package/dist/components/inputs/Checkbox/Checkbox.d.ts +1 -0
  74. package/dist/components/inputs/Checkbox/Checkbox.js +203 -37
  75. package/dist/components/inputs/Checkbox/CheckboxCheckmark.js +28 -14
  76. package/dist/components/inputs/Checkbox/checkbox.cva.d.ts +26 -10
  77. package/dist/components/inputs/Checkbox/checkbox.cva.js +47 -40
  78. package/dist/components/inputs/DateTime/DatePicker/DatePicker.d.ts +12 -5
  79. package/dist/components/inputs/DateTime/DatePicker/DatePicker.js +371 -75
  80. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.d.ts +12 -5
  81. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js +596 -218
  82. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.d.ts +13 -5
  83. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js +267 -47
  84. package/dist/components/inputs/DateTime/TimePicker/TimePicker.d.ts +7 -3
  85. package/dist/components/inputs/DateTime/TimePicker/TimePicker.js +611 -121
  86. package/dist/components/inputs/DateTime/shared/Calendar.d.ts +5 -2
  87. package/dist/components/inputs/DateTime/shared/Calendar.js +338 -119
  88. package/dist/components/inputs/DateTime/shared/CalendarCell.d.ts +4 -2
  89. package/dist/components/inputs/DateTime/shared/CalendarCell.js +310 -103
  90. package/dist/components/inputs/DateTime/shared/CalendarGrid.d.ts +4 -2
  91. package/dist/components/inputs/DateTime/shared/CalendarGrid.js +150 -33
  92. package/dist/components/inputs/DateTime/shared/CalendarHeader.js +249 -93
  93. package/dist/components/inputs/DateTime/shared/CalendarSelectHeader.js +318 -137
  94. package/dist/components/inputs/DateTime/shared/DateField.js +286 -112
  95. package/dist/components/inputs/DateTime/shared/DatePickerInput.d.ts +13 -3
  96. package/dist/components/inputs/DateTime/shared/DatePickerInput.js +387 -143
  97. package/dist/components/inputs/DateTime/shared/DateSegmentItem.d.ts +15 -0
  98. package/dist/components/inputs/DateTime/shared/DateSegmentItem.js +96 -11
  99. package/dist/components/inputs/DateTime/shared/DateTimeDialog.js +84 -30
  100. package/dist/components/inputs/DateTime/shared/DateTimeDialogFooter.js +59 -10
  101. package/dist/components/inputs/DateTime/shared/MonthPicker.js +103 -58
  102. package/dist/components/inputs/DateTime/shared/RangeCalendar.js +193 -82
  103. package/dist/components/inputs/DateTime/shared/TimeField.js +27 -8
  104. package/dist/components/inputs/DateTime/shared/TimePickerForm.js +279 -110
  105. package/dist/components/inputs/DateTime/shared/TimePickerInput.d.ts +4 -1
  106. package/dist/components/inputs/DateTime/shared/TimePickerInput.js +214 -69
  107. package/dist/components/inputs/DateTime/shared/YearPicker.js +119 -68
  108. package/dist/components/inputs/DateTime/shared/datePicker.types.d.ts +5 -0
  109. package/dist/components/inputs/DateTime/shared/datePickerInput.cva.d.ts +27 -0
  110. package/dist/components/inputs/DateTime/shared/datePickerInput.cva.js +15 -0
  111. package/dist/components/inputs/DateTime/shared/datePickerTodayIcon.d.ts +15 -0
  112. package/dist/components/inputs/DateTime/shared/datePickerTodayIcon.js +32 -0
  113. package/dist/components/inputs/DateTime/shared/dateSegment.utils.d.ts +2 -0
  114. package/dist/components/inputs/DateTime/shared/dateSegment.utils.spec.d.ts +1 -0
  115. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.d.ts +40 -0
  116. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.js +85 -0
  117. package/dist/components/inputs/DateTime/shared/staticDateTimeSegments.spec.d.ts +1 -0
  118. package/dist/components/inputs/File/FileUpload.js +87 -44
  119. package/dist/components/inputs/File/FileUploadContainer.js +15 -7
  120. package/dist/components/inputs/File/InputUpload.js +317 -79
  121. package/dist/components/inputs/File/shared/FileCard.js +104 -41
  122. package/dist/components/inputs/File/shared/FileCardList.js +47 -12
  123. package/dist/components/inputs/File/shared/FileUploadContent.js +175 -44
  124. package/dist/components/inputs/File/shared/FileUploadContentEmpty.js +149 -46
  125. package/dist/components/inputs/File/shared/FileUploadContentError.js +234 -93
  126. package/dist/components/inputs/File/shared/FileUploadContentFilled.js +230 -97
  127. package/dist/components/inputs/File/shared/FileUploadContentLoading.js +199 -55
  128. package/dist/components/inputs/File/shared/InputUploadContent.js +151 -37
  129. package/dist/components/inputs/File/shared/InputUploadFilled.js +51 -10
  130. package/dist/components/inputs/File/shared/ProgressBar.js +48 -9
  131. package/dist/components/inputs/File/shared/fileUpload.cva.d.ts +26 -9
  132. package/dist/components/inputs/File/shared/fileUpload.cva.js +48 -40
  133. package/dist/components/inputs/File/shared/inputUploadButton.cva.d.ts +23 -6
  134. package/dist/components/inputs/File/shared/inputUploadButton.cva.js +29 -20
  135. package/dist/components/inputs/FormField/FormField.d.ts +3 -3
  136. package/dist/components/inputs/FormField/FormField.js +119 -37
  137. package/dist/components/inputs/FormField/FormFieldError.js +27 -7
  138. package/dist/components/inputs/FormField/FormFieldHeader.d.ts +2 -2
  139. package/dist/components/inputs/FormField/FormFieldHeader.js +81 -22
  140. package/dist/components/inputs/FormField/FormFieldHeaderClose.js +31 -7
  141. package/dist/components/inputs/FormField/FormFieldHelper.js +28 -8
  142. package/dist/components/inputs/FormField/FormFieldLabel.d.ts +2 -2
  143. package/dist/components/inputs/FormField/FormFieldLabel.js +46 -15
  144. package/dist/components/inputs/FormField/formFieldError.cva.d.ts +12 -5
  145. package/dist/components/inputs/FormField/formFieldError.cva.js +11 -8
  146. package/dist/components/inputs/FormField/formFieldHeader.cva.d.ts +22 -0
  147. package/dist/components/inputs/FormField/formFieldHeader.cva.js +13 -0
  148. package/dist/components/inputs/FormField/formFieldHelper.cva.d.ts +12 -5
  149. package/dist/components/inputs/FormField/formFieldHelper.cva.js +11 -8
  150. package/dist/components/inputs/Input/NumberInput/NumberInput.d.ts +5 -2
  151. package/dist/components/inputs/Input/NumberInput/NumberInput.js +450 -100
  152. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeField.d.ts +45 -0
  153. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeField.js +571 -0
  154. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.d.ts +35 -0
  155. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js +575 -0
  156. package/dist/components/inputs/Input/PasswordInput/PasswordInput.js +48 -9
  157. package/dist/components/inputs/Input/TextArea/TextArea.cva.d.ts +12 -0
  158. package/dist/components/inputs/Input/TextArea/TextArea.cva.js +4 -0
  159. package/dist/components/inputs/Input/TextArea/TextArea.js +309 -94
  160. package/dist/components/inputs/Input/TextInput/TextInput.d.ts +3 -1
  161. package/dist/components/inputs/Input/TextInput/TextInput.js +422 -93
  162. package/dist/components/inputs/Input/shared/InputContent.js +196 -63
  163. package/dist/components/inputs/Input/shared/numberStatic.utils.d.ts +1 -0
  164. package/dist/components/inputs/Input/shared/numberStatic.utils.js +7 -0
  165. package/dist/components/inputs/Inputs/Form.js +40 -11
  166. package/dist/components/inputs/Inputs/InputItem.d.ts +15 -21
  167. package/dist/components/inputs/Inputs/InputItem.js +69 -14
  168. package/dist/components/inputs/Inputs/Inputs.js +37 -11
  169. package/dist/components/inputs/RadioGroup/RadioGroup.d.ts +3 -1
  170. package/dist/components/inputs/RadioGroup/RadioGroup.js +356 -64
  171. package/dist/components/inputs/RadioGroup/radio.cva.d.ts +101 -6
  172. package/dist/components/inputs/RadioGroup/radio.cva.js +74 -24
  173. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.d.ts +6 -2
  174. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.js +214 -22
  175. package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.d.ts +3 -18
  176. package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.js +104 -8
  177. package/dist/components/inputs/Selection/Autocomplete/queryAutocomplete.types.d.ts +36 -0
  178. package/dist/components/inputs/Selection/Select/QuerySelect.d.ts +14 -0
  179. package/dist/components/inputs/Selection/Select/QuerySelect.js +173 -0
  180. package/dist/components/inputs/Selection/Select/Select.d.ts +7 -3
  181. package/dist/components/inputs/Selection/Select/Select.js +225 -18
  182. package/dist/components/inputs/Selection/shared/SelectBase.d.ts +8 -1
  183. package/dist/components/inputs/Selection/shared/SelectBase.js +69 -18
  184. package/dist/components/inputs/Selection/shared/SelectDesktop.d.ts +1 -1
  185. package/dist/components/inputs/Selection/shared/SelectDesktop.js +396 -141
  186. package/dist/components/inputs/Selection/shared/SelectInput.d.ts +2 -2
  187. package/dist/components/inputs/Selection/shared/SelectInput.js +398 -119
  188. package/dist/components/inputs/Selection/shared/SelectInputTags.js +99 -25
  189. package/dist/components/inputs/Selection/shared/SelectListBox.d.ts +2 -2
  190. package/dist/components/inputs/Selection/shared/SelectListBox.js +164 -52
  191. package/dist/components/inputs/Selection/shared/SelectListBoxItem.js +88 -38
  192. package/dist/components/inputs/Selection/shared/SelectListBoxItemSelectAll.js +72 -19
  193. package/dist/components/inputs/Selection/shared/SelectListBoxLoadingItem.js +73 -24
  194. package/dist/components/inputs/Selection/shared/SelectListBoxSelectionBar.js +58 -9
  195. package/dist/components/inputs/Selection/shared/SelectMobile.d.ts +1 -1
  196. package/dist/components/inputs/Selection/shared/SelectMobile.js +9 -3
  197. package/dist/components/inputs/Selection/shared/StaticSelectTrailingContent.d.ts +9 -0
  198. package/dist/components/inputs/Selection/shared/StaticSelectTrailingContent.js +47 -0
  199. package/dist/components/inputs/Selection/shared/querySelect.utils.d.ts +12 -0
  200. package/dist/components/inputs/Selection/shared/querySelect.utils.js +36 -0
  201. package/dist/components/inputs/Selection/shared/select.context.d.ts +3 -2
  202. package/dist/components/inputs/Selection/shared/select.context.js +67 -36
  203. package/dist/components/inputs/Selection/shared/select.types.d.ts +3 -2
  204. package/dist/components/inputs/Selection/shared/selectDesktop.cva.d.ts +10 -0
  205. package/dist/components/inputs/Selection/shared/selectDesktop.cva.js +4 -0
  206. package/dist/components/inputs/Selection/shared/selectInput.cva.d.ts +5 -0
  207. package/dist/components/inputs/Selection/shared/selectInput.cva.js +5 -0
  208. package/dist/components/inputs/Selection/shared/selectItem.cva.d.ts +16 -6
  209. package/dist/components/inputs/Selection/shared/selectItem.cva.js +21 -18
  210. package/dist/components/inputs/Selection/shared/staticSelect.utils.d.ts +23 -0
  211. package/dist/components/inputs/Selection/shared/staticSelect.utils.js +37 -0
  212. package/dist/components/inputs/Selection/shared/staticSelect.utils.spec.d.ts +1 -0
  213. package/dist/components/inputs/Selection/shared/useSelectItems.js +109 -49
  214. package/dist/components/inputs/Skeleton/InputFrame.d.ts +82 -0
  215. package/dist/components/inputs/Skeleton/InputFrame.js +548 -0
  216. package/dist/components/inputs/Slider/Slider.d.ts +2 -1
  217. package/dist/components/inputs/Slider/Slider.js +265 -76
  218. package/dist/components/inputs/TextEditor/TextEditor.d.ts +1 -0
  219. package/dist/components/inputs/TextEditor/TextEditor.js +450 -101
  220. package/dist/components/inputs/TextEditor/Toolbar/ColorPicker.js +37 -11
  221. package/dist/components/inputs/TextEditor/Toolbar/ColorPickerDropdown.js +105 -33
  222. package/dist/components/inputs/TextEditor/Toolbar/HyperlinkAction.js +194 -45
  223. package/dist/components/inputs/TextEditor/Toolbar/TextAlignSelect.js +88 -28
  224. package/dist/components/inputs/TextEditor/Toolbar/TextColorSelect.js +48 -14
  225. package/dist/components/inputs/TextEditor/Toolbar/TextEditorToolbar.js +66 -19
  226. package/dist/components/inputs/TextEditor/Toolbar/TextHighlightSelect.js +49 -15
  227. package/dist/components/inputs/TextEditor/Toolbar/TextListActions.js +92 -32
  228. package/dist/components/inputs/TextEditor/Toolbar/TextMarksActions.js +126 -54
  229. package/dist/components/inputs/TextEditor/Toolbar/TextStyleSelect.js +141 -38
  230. package/dist/components/inputs/Toggle/Toggle.d.ts +1 -0
  231. package/dist/components/inputs/Toggle/Toggle.js +217 -40
  232. package/dist/components/inputs/Toggle/toggle.cva.d.ts +15 -6
  233. package/dist/components/inputs/Toggle/toggle.cva.js +25 -21
  234. package/dist/components/inputs/shared/CheckContent.d.ts +2 -1
  235. package/dist/components/inputs/shared/CheckContent.js +23 -13
  236. package/dist/components/inputs/shared/InputClear.d.ts +2 -1
  237. package/dist/components/inputs/shared/InputClear.js +88 -12
  238. package/dist/components/inputs/shared/TooltipWrapper.js +50 -11
  239. package/dist/components/inputs/shared/input.cva.d.ts +137 -16
  240. package/dist/components/inputs/shared/input.cva.js +317 -273
  241. package/dist/components/inputs/shared/label.cva.d.ts +15 -6
  242. package/dist/components/inputs/shared/label.cva.js +28 -25
  243. package/dist/components/inputs/shared/tooltipWrapper.cva.d.ts +12 -0
  244. package/dist/components/inputs/shared/tooltipWrapper.cva.js +4 -0
  245. package/dist/components/inputs/shared/useStaticInputHandoff.d.ts +14 -0
  246. package/dist/components/inputs/shared/useStaticInputHandoff.js +100 -0
  247. package/dist/components/navigation/Accordion/Accordion.js +71 -24
  248. package/dist/components/navigation/Accordion/AccordionItem.js +97 -52
  249. package/dist/components/navigation/Accordion/accordion.cva.d.ts +109 -44
  250. package/dist/components/navigation/Accordion/accordion.cva.js +114 -84
  251. package/dist/components/navigation/Stepper/Stepper.js +69 -24
  252. package/dist/components/navigation/Stepper/StepperItem.js +112 -39
  253. package/dist/components/navigation/Stepper/StepperSeparator.js +25 -7
  254. package/dist/components/navigation/Stepper/stepper.cva.d.ts +86 -30
  255. package/dist/components/navigation/Stepper/stepper.cva.js +104 -83
  256. package/dist/components/overlays/ActionModal/ActionModal.js +169 -35
  257. package/dist/components/overlays/BottomSheet/BottomSheet.js +96 -23
  258. package/dist/components/overlays/BottomSheet/BottomSheetHeader.js +48 -8
  259. package/dist/components/overlays/Drawer/Drawer.js +62 -20
  260. package/dist/components/overlays/Modal/Modal.js +5 -5
  261. package/dist/components/overlays/Modal/modal.cva.d.ts +34 -9
  262. package/dist/components/overlays/Modal/modal.cva.js +38 -27
  263. package/dist/components/overlays/ResponsivePopover/ResponsivePopover.js +86 -30
  264. package/dist/components/overlays/Tooltip/Tooltip.js +143 -34
  265. package/dist/components/overlays/Tooltip/TooltipEllipsis.js +37 -12
  266. package/dist/components/overlays/Tooltip/tooltip.cva.d.ts +45 -17
  267. package/dist/components/overlays/Tooltip/tooltip.cva.js +38 -26
  268. package/dist/components/segment/Segment.js +221 -60
  269. package/dist/components/segment/SegmentItem.js +70 -13
  270. package/dist/components/segment/segment.cva.d.ts +18 -7
  271. package/dist/components/segment/segment.cva.js +24 -21
  272. package/dist/components/shared/pagination/Pagination.js +108 -22
  273. package/dist/components/shared/pagination/PaginationList.js +167 -64
  274. package/dist/components/shared/popover.cva.d.ts +7 -3
  275. package/dist/components/shared/popover.cva.js +3 -3
  276. package/dist/components/status/Alert/Alert.js +103 -36
  277. package/dist/components/status/Alert/alert.cva.d.ts +18 -6
  278. package/dist/components/status/Alert/alert.cva.js +60 -57
  279. package/dist/components/status/Loader/Loader.js +77 -22
  280. package/dist/components/status/Loader/loader.cva.d.ts +23 -4
  281. package/dist/components/status/Loader/loader.cva.js +22 -13
  282. package/dist/components/status/Toast/Toast.js +27 -20
  283. package/dist/components/status/Toast/toast.cva.d.ts +61 -10
  284. package/dist/components/status/Toast/toast.cva.js +129 -64
  285. package/dist/components/status/Toast/useToast.js +62 -57
  286. package/dist/components/status/shared/status.cva.d.ts +30 -8
  287. package/dist/components/status/shared/status.cva.js +56 -50
  288. package/dist/components/table/CellText.js +3 -3
  289. package/dist/components/table/ColumnConfig.js +158 -54
  290. package/dist/components/table/HeaderText.js +3 -3
  291. package/dist/components/table/InfiniteTable.js +67 -16
  292. package/dist/components/table/PaginatedTable.js +84 -18
  293. package/dist/components/table/Table.js +34 -33
  294. package/dist/components/table/table.cva.d.ts +52 -19
  295. package/dist/components/table/table.cva.js +44 -35
  296. package/dist/components/text/Link/Link.js +22 -10
  297. package/dist/components/text/Link/link.cva.d.ts +11 -5
  298. package/dist/components/text/Link/link.cva.js +8 -5
  299. package/dist/components/text/Tag/Tag.js +3 -3
  300. package/dist/components/text/Tag/tag.cva.d.ts +15 -5
  301. package/dist/components/text/Tag/tag.cva.js +51 -48
  302. package/dist/components/text/Typography/Typography.js +25 -10
  303. package/dist/components/text/Typography/typography.cva.d.ts +93 -7
  304. package/dist/components/text/Typography/typography.cva.js +126 -122
  305. package/dist/config/confirmation.context.js +1 -1
  306. package/dist/config/link.context.js +23 -9
  307. package/dist/config/router.context.js +42 -16
  308. package/dist/config/theme.context.js +98 -45
  309. package/dist/config/uiConfig.context.d.ts +20 -6
  310. package/dist/config/uiConfig.context.js +68 -14
  311. package/dist/config/uiOverrides.context.d.ts +192 -0
  312. package/dist/config/uiOverrides.context.js +113 -0
  313. package/dist/helpers/dynamicInputs.d.ts +5 -5
  314. package/dist/helpers/dynamicInputs.js +3 -0
  315. package/dist/hooks/useAutosave.d.ts +2 -1
  316. package/dist/hooks/useAutosave.js +12 -4
  317. package/dist/hooks/useAutosave.spec.d.ts +1 -0
  318. package/dist/hooks/useBreakpoint.js +16 -3
  319. package/dist/hooks/useDebounceCallback.js +51 -17
  320. package/dist/hooks/useFilters.js +125 -64
  321. package/dist/hooks/useForm.js +42 -8
  322. package/dist/hooks/useFormAutosave.d.ts +3 -1
  323. package/dist/hooks/useFormAutosave.js +122 -30
  324. package/dist/hooks/useFormAutosave.spec.d.ts +1 -0
  325. package/dist/hooks/useIntersectionObserver.d.ts +1 -1
  326. package/dist/hooks/useIntersectionObserver.js +91 -24
  327. package/dist/hooks/useKeyInteractions.d.ts +20 -0
  328. package/dist/hooks/useKeyInteractions.js +54 -0
  329. package/dist/hooks/useKeyInteractions.spec.d.ts +1 -0
  330. package/dist/hooks/useLocalStorage.js +43 -10
  331. package/dist/hooks/useLongPressRepeat.js +55 -20
  332. package/dist/hooks/usePagination.js +49 -19
  333. package/dist/hooks/useQueryAutocomplete.d.ts +14 -0
  334. package/dist/hooks/useQueryAutocomplete.js +57 -0
  335. package/dist/hooks/useScrollableListBox.js +37 -16
  336. package/dist/hooks/useSorting.js +69 -28
  337. package/dist/hooks/useStateAndRef.js +21 -7
  338. package/dist/hooks/useTableColumnConfig.js +124 -31
  339. package/dist/hooks/useTranslationMemo.js +25 -5
  340. package/dist/index.d.ts +37 -1
  341. package/dist/index.js +34 -3
  342. package/dist/tw-ui-plugin.js +6 -0
  343. package/dist/utils/date-time.utils.d.ts +38 -10
  344. package/dist/utils/date-time.utils.js +136 -22
  345. package/dist/utils/query.utils.d.ts +4 -0
  346. package/dist/utils/query.utils.js +8 -0
  347. package/dist/utils/style-merge.util.d.ts +43 -0
  348. package/dist/utils/style-merge.util.js +233 -0
  349. package/dist/utils/style-merge.util.spec.d.ts +1 -0
  350. package/package.json +1 -1
  351. package/dist/config/uiStyle.context.d.ts +0 -162
  352. package/dist/config/uiStyle.context.js +0 -30
package/dist/components/buttons/Button/button.cva.js CHANGED
@@ -1,609 +1,621 @@
1
+ import { UIOverrides } from "../../../config/uiOverrides.context.js";
1
2
  import { uiOutlineClass } from "../../outline.clsx.js";
2
3
  import { compoundMapper } from "../../../utils/compoundMapper.js";
3
- import { cva } from "class-variance-authority";
4
4
  //#region src/components/buttons/Button/button.cva.ts
5
- var button = cva([
6
- "group inline-flex items-center justify-center border border-solid",
7
- uiOutlineClass,
8
- "group-data-[split]/split:data-[separator]:relative",
9
- "group-data-[split]/split:data-[separator]:after:content-['']",
10
- "group-data-[split]/split:data-[separator]:after:h-full",
11
- "group-data-[split]/split:data-[separator]:after:w-px",
12
- "group-data-[split]/split:data-[separator]:after:absolute",
13
- "group-data-[split]/split:data-[separator]:after:-right-px",
14
- "group-data-[split]/split:data-[separator]:after:border-t",
15
- "group-data-[split]/split:data-[separator]:after:border-b",
16
- "group-data-[split]/split:data-[separator]:after:box-content"
17
- ], {
18
- variants: {
19
- width: {
20
- fill: "w-full",
21
- hug: "w-auto"
22
- },
23
- size: {
24
- none: "",
25
- xs: "",
26
- s: "",
27
- m: "",
28
- l: ""
29
- },
30
- color: {
31
- primary: "",
32
- secondary: "",
33
- success: "",
34
- warning: "",
35
- error: "",
36
- dual: ""
37
- },
38
- variant: {
39
- contained: "",
40
- outlined: "",
41
- subtle: "",
42
- text: "group-data-[split]/split:data-[separator]:after:hidden",
43
- ghost: ""
44
- },
45
- inverted: {
46
- true: "",
47
- false: ""
48
- }
49
- },
50
- compoundVariants: [
51
- {
52
- variant: "contained",
53
- color: ["primary", "dual"],
54
- className: [
55
- "border-interactive-contained-primary-idle bg-interactive-contained-primary-idle text-interactive-contained-primary-on-idle",
56
- "hover:border-interactive-contained-primary-hover hover:bg-interactive-contained-primary-hover hover:text-interactive-contained-primary-on-hover",
57
- "pressed:border-interactive-contained-primary-pressed pressed:bg-interactive-contained-primary-pressed pressed:text-interactive-contained-primary-on-pressed",
58
- "disabled:border-interactive-contained-primary-disabled disabled:bg-interactive-contained-primary-disabled disabled:text-interactive-contained-primary-on-disabled",
59
- "focus-visible:outline-interactive-contained-primary-focus",
60
- "selected:border-interactive-contained-primary-toggled-idle selected:bg-interactive-contained-primary-toggled-idle selected:text-interactive-contained-primary-on-toggled-idle",
61
- "selected:hover:border-interactive-contained-primary-toggled-hover selected:hover:bg-interactive-contained-primary-toggled-hover selected:hover:text-interactive-contained-primary-on-toggled-hover",
62
- "selected:disabled:border-interactive-contained-primary-toggled-disabled selected:disabled:bg-interactive-contained-primary-toggled-disabled selected:disabled:text-interactive-contained-primary-on-toggled-disabled",
63
- "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-primary-on-idle!"
64
- ]
65
- },
66
- {
67
- variant: "outlined",
68
- color: ["primary", "dual"],
69
- className: [
70
- "border-interactive-outlined-primary-outline-idle bg-interactive-outlined-primary-idle text-interactive-outlined-primary-on-idle",
71
- "hover:border-interactive-outlined-primary-outline-hover hover:bg-interactive-outlined-primary-hover hover:text-interactive-outlined-primary-on-hover",
72
- "pressed:border-interactive-outlined-primary-outline-pressed pressed:bg-interactive-outlined-primary-pressed pressed:text-interactive-outlined-primary-on-pressed",
73
- "disabled:border-interactive-outlined-primary-outline-disabled disabled:bg-interactive-outlined-primary-disabled disabled:text-interactive-outlined-primary-on-disabled",
74
- "focus-visible:outline-interactive-outlined-primary-focus",
75
- "selected:border-interactive-outlined-primary-toggled-idle selected:bg-interactive-outlined-primary-toggled-idle selected:text-interactive-outlined-primary-on-toggled-idle",
76
- "selected:hover:border-interactive-outlined-primary-toggled-hover selected:hover:bg-interactive-outlined-primary-toggled-hover selected:hover:text-interactive-outlined-primary-on-toggled-hover",
77
- "selected:disabled:border-interactive-outlined-primary-toggled-disabled selected:disabled:bg-interactive-outlined-primary-toggled-disabled selected:disabled:text-interactive-outlined-primary-on-toggled-disabled"
78
- ]
79
- },
80
- {
81
- variant: "subtle",
82
- color: ["primary", "dual"],
83
- className: [
84
- "border-interactive-subtle-primary-idle bg-interactive-subtle-primary-idle text-interactive-subtle-primary-on-idle",
85
- "hover:border-interactive-subtle-primary-hover hover:bg-interactive-subtle-primary-hover hover:text-interactive-subtle-primary-on-hover",
86
- "pressed:border-interactive-subtle-primary-pressed pressed:bg-interactive-subtle-primary-pressed pressed:text-interactive-subtle-primary-on-pressed",
87
- "disabled:border-interactive-subtle-primary-disabled disabled:bg-interactive-subtle-primary-disabled disabled:text-interactive-subtle-primary-on-disabled",
88
- "focus-visible:outline-interactive-subtle-primary-focus",
89
- "selected:border-interactive-contained-primary-toggled-idle selected:bg-interactive-contained-primary-toggled-idle selected:text-interactive-contained-primary-on-toggled-idle",
90
- "selected:hover:border-interactive-subtle-primary-toggled-hover selected:hover:bg-interactive-subtle-primary-toggled-hover selected:hover:text-interactive-subtle-primary-on-toggled-hover",
91
- "selected:disabled:border-interactive-subtle-primary-toggled-disabled selected:disabled:bg-interactive-subtle-primary-toggled-disabled selected:disabled:text-interactive-subtle-primary-on-toggled-disabled",
92
- "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-primary-on-idle!"
93
- ]
5
+ var buttonDefinition = UIOverrides.defineConfig({
6
+ base: [
7
+ "group inline-flex items-center justify-center border border-solid",
8
+ uiOutlineClass,
9
+ "group-data-[split]/split:data-[separator]:relative",
10
+ "group-data-[split]/split:data-[separator]:after:content-['']",
11
+ "group-data-[split]/split:data-[separator]:after:h-full",
12
+ "group-data-[split]/split:data-[separator]:after:w-px",
13
+ "group-data-[split]/split:data-[separator]:after:absolute",
14
+ "group-data-[split]/split:data-[separator]:after:-right-px",
15
+ "group-data-[split]/split:data-[separator]:after:border-t",
16
+ "group-data-[split]/split:data-[separator]:after:border-b",
17
+ "group-data-[split]/split:data-[separator]:after:box-content"
18
+ ],
19
+ config: {
20
+ variants: {
21
+ width: {
22
+ fill: "w-full",
23
+ hug: "w-auto"
24
+ },
25
+ size: {
26
+ none: "",
27
+ xs: "",
28
+ s: "",
29
+ m: "",
30
+ l: ""
31
+ },
32
+ color: {
33
+ primary: "",
34
+ secondary: "",
35
+ success: "",
36
+ warning: "",
37
+ error: "",
38
+ dual: ""
39
+ },
40
+ variant: {
41
+ contained: "",
42
+ outlined: "",
43
+ subtle: "",
44
+ text: "group-data-[split]/split:data-[separator]:after:hidden",
45
+ ghost: ""
46
+ },
47
+ inverted: {
48
+ true: "",
49
+ false: ""
50
+ }
94
51
  },
95
- {
96
- variant: "ghost",
52
+ compoundVariants: [
53
+ {
54
+ variant: "contained",
55
+ color: ["primary", "dual"],
56
+ className: [
57
+ "border-interactive-contained-primary-idle bg-interactive-contained-primary-idle text-interactive-contained-primary-on-idle",
58
+ "hover:border-interactive-contained-primary-hover hover:bg-interactive-contained-primary-hover hover:text-interactive-contained-primary-on-hover",
59
+ "pressed:border-interactive-contained-primary-pressed pressed:bg-interactive-contained-primary-pressed pressed:text-interactive-contained-primary-on-pressed",
60
+ "disabled:border-interactive-contained-primary-disabled disabled:bg-interactive-contained-primary-disabled disabled:text-interactive-contained-primary-on-disabled",
61
+ "focus-visible:outline-interactive-contained-primary-focus",
62
+ "selected:border-interactive-contained-primary-toggled-idle selected:bg-interactive-contained-primary-toggled-idle selected:text-interactive-contained-primary-on-toggled-idle",
63
+ "selected:hover:border-interactive-contained-primary-toggled-hover selected:hover:bg-interactive-contained-primary-toggled-hover selected:hover:text-interactive-contained-primary-on-toggled-hover",
64
+ "selected:disabled:border-interactive-contained-primary-toggled-disabled selected:disabled:bg-interactive-contained-primary-toggled-disabled selected:disabled:text-interactive-contained-primary-on-toggled-disabled",
65
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-primary-on-idle!"
66
+ ]
67
+ },
68
+ {
69
+ variant: "outlined",
70
+ color: ["primary", "dual"],
71
+ className: [
72
+ "border-interactive-outlined-primary-outline-idle bg-interactive-outlined-primary-idle text-interactive-outlined-primary-on-idle",
73
+ "hover:border-interactive-outlined-primary-outline-hover hover:bg-interactive-outlined-primary-hover hover:text-interactive-outlined-primary-on-hover",
74
+ "pressed:border-interactive-outlined-primary-outline-pressed pressed:bg-interactive-outlined-primary-pressed pressed:text-interactive-outlined-primary-on-pressed",
75
+ "disabled:border-interactive-outlined-primary-outline-disabled disabled:bg-interactive-outlined-primary-disabled disabled:text-interactive-outlined-primary-on-disabled",
76
+ "focus-visible:outline-interactive-outlined-primary-focus",
77
+ "selected:border-interactive-outlined-primary-toggled-idle selected:bg-interactive-outlined-primary-toggled-idle selected:text-interactive-outlined-primary-on-toggled-idle",
78
+ "selected:hover:border-interactive-outlined-primary-toggled-hover selected:hover:bg-interactive-outlined-primary-toggled-hover selected:hover:text-interactive-outlined-primary-on-toggled-hover",
79
+ "selected:disabled:border-interactive-outlined-primary-toggled-disabled selected:disabled:bg-interactive-outlined-primary-toggled-disabled selected:disabled:text-interactive-outlined-primary-on-toggled-disabled"
80
+ ]
81
+ },
82
+ {
83
+ variant: "subtle",
84
+ color: ["primary", "dual"],
85
+ className: [
86
+ "border-interactive-subtle-primary-idle bg-interactive-subtle-primary-idle text-interactive-subtle-primary-on-idle",
87
+ "hover:border-interactive-subtle-primary-hover hover:bg-interactive-subtle-primary-hover hover:text-interactive-subtle-primary-on-hover",
88
+ "pressed:border-interactive-subtle-primary-pressed pressed:bg-interactive-subtle-primary-pressed pressed:text-interactive-subtle-primary-on-pressed",
89
+ "disabled:border-interactive-subtle-primary-disabled disabled:bg-interactive-subtle-primary-disabled disabled:text-interactive-subtle-primary-on-disabled",
90
+ "focus-visible:outline-interactive-subtle-primary-focus",
91
+ "selected:border-interactive-contained-primary-toggled-idle selected:bg-interactive-contained-primary-toggled-idle selected:text-interactive-contained-primary-on-toggled-idle",
92
+ "selected:hover:border-interactive-subtle-primary-toggled-hover selected:hover:bg-interactive-subtle-primary-toggled-hover selected:hover:text-interactive-subtle-primary-on-toggled-hover",
93
+ "selected:disabled:border-interactive-subtle-primary-toggled-disabled selected:disabled:bg-interactive-subtle-primary-toggled-disabled selected:disabled:text-interactive-subtle-primary-on-toggled-disabled",
94
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-primary-on-idle!"
95
+ ]
96
+ },
97
+ {
98
+ variant: "ghost",
99
+ color: "primary",
100
+ className: [
101
+ "border-interactive-ghost-primary-idle bg-interactive-ghost-primary-idle text-interactive-ghost-primary-on-idle",
102
+ "hover:border-interactive-ghost-primary-hover hover:bg-interactive-ghost-primary-hover hover:text-interactive-ghost-primary-on-hover",
103
+ "pressed:border-interactive-ghost-primary-pressed pressed:bg-interactive-ghost-primary-pressed pressed:text-interactive-ghost-primary-on-pressed",
104
+ "disabled:border-interactive-ghost-primary-disabled disabled:bg-interactive-ghost-primary-disabled disabled:text-interactive-ghost-primary-on-disabled",
105
+ "focus-visible:outline-interactive-ghost-primary-focus",
106
+ "selected:border-interactive-ghost-primary-toggled-idle selected:bg-interactive-ghost-primary-toggled-idle selected:text-interactive-ghost-primary-on-toggled-idle",
107
+ "selected:hover:border-interactive-ghost-primary-toggled-hover selected:hover:bg-interactive-ghost-primary-toggled-hover selected:hover:text-interactive-ghost-primary-on-toggled-hover",
108
+ "selected:disabled:border-interactive-ghost-primary-toggled-disabled selected:disabled:bg-interactive-ghost-primary-toggled-disabled selected:disabled:text-interactive-ghost-primary-on-toggled-disabled",
109
+ "group-data-[split]/split:data-[separator]:after:hidden"
110
+ ]
111
+ },
112
+ {
113
+ variant: "contained",
114
+ color: "secondary",
115
+ className: [
116
+ "border-interactive-contained-secondary-idle bg-interactive-contained-secondary-idle text-interactive-contained-secondary-on-idle",
117
+ "hover:border-interactive-contained-secondary-hover hover:bg-interactive-contained-secondary-hover hover:text-interactive-contained-secondary-on-hover",
118
+ "pressed:border-interactive-contained-secondary-pressed pressed:bg-interactive-contained-secondary-pressed pressed:text-interactive-contained-secondary-on-pressed",
119
+ "disabled:border-interactive-contained-secondary-disabled disabled:bg-interactive-contained-secondary-disabled disabled:text-interactive-contained-secondary-on-disabled",
120
+ "focus-visible:outline-interactive-contained-secondary-focus",
121
+ "selected:border-interactive-contained-secondary-toggled-idle selected:bg-interactive-contained-secondary-toggled-idle selected:text-interactive-contained-secondary-on-toggled-idle",
122
+ "selected:hover:border-interactive-contained-secondary-toggled-hover selected:hover:bg-interactive-contained-secondary-toggled-hover selected:hover:text-interactive-contained-secondary-on-toggled-hover",
123
+ "selected:disabled:border-interactive-contained-secondary-toggled-disabled selected:disabled:bg-interactive-contained-secondary-toggled-disabled selected:disabled:text-interactive-contained-secondary-on-toggled-disabled",
124
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-secondary-on-idle!"
125
+ ]
126
+ },
127
+ {
128
+ variant: "outlined",
129
+ color: "secondary",
130
+ className: [
131
+ "border-interactive-outlined-secondary-outline-idle bg-interactive-outlined-secondary-idle text-interactive-outlined-secondary-on-idle",
132
+ "hover:border-interactive-outlined-secondary-outline-hover hover:bg-interactive-outlined-secondary-hover hover:text-interactive-outlined-secondary-on-hover",
133
+ "pressed:border-interactive-outlined-secondary-outline-pressed pressed:bg-interactive-outlined-secondary-pressed pressed:text-interactive-outlined-secondary-on-pressed",
134
+ "disabled:border-interactive-outlined-secondary-outline-disabled disabled:bg-interactive-outlined-secondary-disabled disabled:text-interactive-outlined-secondary-on-disabled",
135
+ "focus-visible:outline-interactive-outlined-secondary-focus",
136
+ "selected:border-interactive-contained-secondary-toggled-idle selected:bg-interactive-contained-secondary-toggled-idle selected:text-interactive-contained-secondary-on-toggled-idle",
137
+ "selected:hover:border-interactive-contained-secondary-toggled-hover selected:hover:bg-interactive-contained-secondary-toggled-hover selected:hover:text-interactive-contained-secondary-on-toggled-hover",
138
+ "selected:disabled:border-interactive-contained-secondary-toggled-disabled selected:disabled:bg-interactive-contained-secondary-toggled-disabled selected:disabled:text-interactive-contained-secondary-on-toggled-disabled"
139
+ ]
140
+ },
141
+ {
142
+ variant: "subtle",
143
+ color: "secondary",
144
+ className: [
145
+ "border-interactive-subtle-secondary-idle bg-interactive-subtle-secondary-idle text-interactive-subtle-secondary-on-idle",
146
+ "hover:border-interactive-subtle-secondary-hover hover:bg-interactive-subtle-secondary-hover hover:text-interactive-subtle-secondary-on-hover",
147
+ "pressed:border-interactive-subtle-secondary-pressed pressed:bg-interactive-subtle-secondary-pressed pressed:text-interactive-subtle-secondary-on-pressed",
148
+ "disabled:border-interactive-subtle-secondary-disabled disabled:bg-interactive-subtle-secondary-disabled disabled:text-interactive-subtle-secondary-on-disabled",
149
+ "focus-visible:outline-interactive-subtle-secondary-focus",
150
+ "selected:border-interactive-subtle-secondary-toggled-idle selected:bg-interactive-subtle-secondary-toggled-idle selected:text-interactive-subtle-secondary-on-toggled-idle",
151
+ "selected:hover:border-interactive-subtle-secondary-toggled-hover selected:hover:bg-interactive-subtle-secondary-toggled-hover selected:hover:text-interactive-subtle-secondary-on-toggled-hover",
152
+ "selected:disabled:border-interactive-subtle-secondary-toggled-disabled selected:disabled:bg-interactive-subtle-secondary-toggled-disabled selected:disabled:text-interactive-subtle-secondary-on-toggled-disabled",
153
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-secondary-on-idle!"
154
+ ]
155
+ },
156
+ {
157
+ variant: "ghost",
158
+ color: "secondary",
159
+ className: [
160
+ "border-interactive-ghost-secondary-idle bg-interactive-ghost-secondary-idle text-interactive-ghost-secondary-on-idle",
161
+ "hover:border-interactive-ghost-secondary-hover hover:bg-interactive-ghost-secondary-hover hover:text-interactive-ghost-secondary-on-hover",
162
+ "pressed:border-interactive-ghost-secondary-pressed pressed:bg-interactive-ghost-secondary-pressed pressed:text-interactive-ghost-secondary-on-pressed",
163
+ "disabled:border-interactive-ghost-secondary-disabled disabled:bg-interactive-ghost-secondary-disabled disabled:text-interactive-ghost-secondary-on-disabled",
164
+ "focus-visible:outline-interactive-ghost-secondary-focus",
165
+ "selected:border-interactive-ghost-secondary-toggled-idle selected:bg-interactive-ghost-secondary-toggled-idle selected:text-interactive-ghost-secondary-on-toggled-idle",
166
+ "selected:hover:border-interactive-ghost-secondary-toggled-hover selected:hover:bg-interactive-ghost-secondary-toggled-hover selected:hover:text-interactive-ghost-secondary-on-toggled-hover",
167
+ "selected:disabled:border-interactive-ghost-secondary-toggled-disabled selected:disabled:bg-interactive-ghost-secondary-toggled-disabled selected:disabled:text-interactive-ghost-secondary-on-toggled-disabled",
168
+ "group-data-[split]/split:data-[separator]:after:hidden"
169
+ ]
170
+ },
171
+ {
172
+ variant: "contained",
173
+ color: "success",
174
+ className: [
175
+ "border-interactive-contained-success-idle bg-interactive-contained-success-idle text-interactive-contained-success-on-idle",
176
+ "hover:border-interactive-contained-success-hover hover:bg-interactive-contained-success-hover hover:text-interactive-contained-success-on-hover",
177
+ "pressed:border-interactive-contained-success-pressed pressed:bg-interactive-contained-success-pressed pressed:text-interactive-contained-success-on-pressed",
178
+ "disabled:border-interactive-contained-success-disabled disabled:bg-interactive-contained-success-disabled disabled:text-interactive-contained-success-on-disabled",
179
+ "focus-visible:outline-interactive-contained-success-focus",
180
+ "selected:border-interactive-contained-success-toggled-idle selected:bg-interactive-contained-success-toggled-idle selected:text-interactive-contained-success-on-toggled-idle",
181
+ "selected:hover:border-interactive-contained-success-toggled-hover selected:hover:bg-interactive-contained-success-toggled-hover selected:hover:text-interactive-contained-success-on-toggled-hover",
182
+ "selected:disabled:border-interactive-contained-success-toggled-disabled selected:disabled:bg-interactive-contained-success-toggled-disabled selected:disabled:text-interactive-contained-success-on-toggled-disabled",
183
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-success-on-idle!"
184
+ ]
185
+ },
186
+ {
187
+ variant: "outlined",
188
+ color: "success",
189
+ className: [
190
+ "border-interactive-outlined-success-outline-idle bg-interactive-outlined-success-idle text-interactive-outlined-success-on-idle",
191
+ "hover:border-interactive-outlined-success-outline-hover hover:bg-interactive-outlined-success-hover hover:text-interactive-outlined-success-on-hover",
192
+ "pressed:border-interactive-outlined-success-outline-pressed pressed:bg-interactive-outlined-success-pressed pressed:text-interactive-outlined-success-on-pressed",
193
+ "disabled:border-interactive-outlined-success-outline-disabled disabled:bg-interactive-outlined-success-disabled disabled:text-interactive-outlined-success-on-disabled",
194
+ "focus-visible:outline-interactive-outlined-success-focus",
195
+ "selected:border-interactive-outlined-success-toggled-idle selected:bg-interactive-outlined-success-toggled-idle selected:text-interactive-outlined-success-on-toggled-idle",
196
+ "selected:hover:border-interactive-outlined-success-toggled-hover selected:hover:bg-interactive-outlined-success-toggled-hover selected:hover:text-interactive-outlined-success-on-toggled-hover",
197
+ "selected:disabled:border-interactive-outlined-success-toggled-disabled selected:disabled:bg-interactive-outlined-success-toggled-disabled selected:disabled:text-interactive-outlined-success-on-toggled-disabled"
198
+ ]
199
+ },
200
+ {
201
+ variant: "subtle",
202
+ color: "success",
203
+ className: [
204
+ "border-interactive-subtle-success-idle bg-interactive-subtle-success-idle text-interactive-subtle-success-on-idle",
205
+ "hover:border-interactive-subtle-success-hover hover:bg-interactive-subtle-success-hover hover:text-interactive-subtle-success-on-hover",
206
+ "pressed:border-interactive-subtle-success-pressed pressed:bg-interactive-subtle-success-pressed pressed:text-interactive-subtle-success-on-pressed",
207
+ "disabled:border-interactive-subtle-success-disabled disabled:bg-interactive-subtle-success-disabled disabled:text-interactive-subtle-success-on-disabled",
208
+ "focus-visible:outline-interactive-subtle-success-focus",
209
+ "selected:border-interactive-subtle-success-toggled-idle selected:bg-interactive-subtle-success-toggled-idle selected:text-interactive-subtle-success-on-toggled-idle",
210
+ "selected:hover:border-interactive-subtle-success-toggled-hover selected:hover:bg-interactive-subtle-success-toggled-hover selected:hover:text-interactive-subtle-success-on-toggled-hover",
211
+ "selected:disabled:border-interactive-subtle-success-toggled-disabled selected:disabled:bg-interactive-subtle-success-toggled-disabled selected:disabled:text-interactive-subtle-success-on-toggled-disabled",
212
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-success-on-idle!"
213
+ ]
214
+ },
215
+ {
216
+ variant: "ghost",
217
+ color: "success",
218
+ className: [
219
+ "border-interactive-ghost-success-idle bg-interactive-ghost-success-idle text-interactive-ghost-success-on-idle",
220
+ "hover:border-interactive-ghost-success-hover hover:bg-interactive-ghost-success-hover hover:text-interactive-ghost-success-on-hover",
221
+ "pressed:border-interactive-ghost-success-pressed pressed:bg-interactive-ghost-success-pressed pressed:text-interactive-ghost-success-on-pressed",
222
+ "disabled:border-interactive-ghost-success-disabled disabled:bg-interactive-ghost-success-disabled disabled:text-interactive-ghost-success-on-disabled",
223
+ "focus-visible:outline-interactive-ghost-success-focus",
224
+ "selected:border-interactive-ghost-success-toggled-idle selected:bg-interactive-ghost-success-toggled-idle selected:text-interactive-ghost-success-on-toggled-idle",
225
+ "selected:hover:border-interactive-ghost-success-toggled-hover selected:hover:bg-interactive-ghost-success-toggled-hover selected:hover:text-interactive-ghost-success-on-toggled-hover",
226
+ "selected:disabled:border-interactive-ghost-success-toggled-disabled selected:disabled:bg-interactive-ghost-success-toggled-disabled selected:disabled:text-interactive-ghost-success-on-toggled-disabled",
227
+ "group-data-[split]/split:data-[separator]:after:hidden"
228
+ ]
229
+ },
230
+ {
231
+ variant: "contained",
232
+ color: "warning",
233
+ className: [
234
+ "border-interactive-contained-warning-idle bg-interactive-contained-warning-idle text-interactive-contained-warning-on-idle",
235
+ "hover:border-interactive-contained-warning-hover hover:bg-interactive-contained-warning-hover hover:text-interactive-contained-warning-on-hover",
236
+ "pressed:border-interactive-contained-warning-pressed pressed:bg-interactive-contained-warning-pressed pressed:text-interactive-contained-warning-on-pressed",
237
+ "disabled:border-interactive-contained-warning-disabled disabled:bg-interactive-contained-warning-disabled disabled:text-interactive-contained-warning-on-disabled",
238
+ "focus-visible:outline-interactive-contained-warning-focus",
239
+ "selected:border-interactive-contained-warning-toggled-idle selected:bg-interactive-contained-warning-toggled-idle selected:text-interactive-contained-warning-on-toggled-idle",
240
+ "selected:hover:border-interactive-contained-warning-toggled-hover selected:hover:bg-interactive-contained-warning-toggled-hover selected:hover:text-interactive-contained-warning-on-toggled-hover",
241
+ "selected:disabled:border-interactive-contained-warning-toggled-disabled selected:disabled:bg-interactive-contained-warning-toggled-disabled selected:disabled:text-interactive-contained-warning-on-toggled-disabled",
242
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-warning-on-idle!"
243
+ ]
244
+ },
245
+ {
246
+ variant: "outlined",
247
+ color: "warning",
248
+ className: [
249
+ "border-interactive-outlined-warning-outline-idle bg-interactive-outlined-warning-idle text-interactive-outlined-warning-on-idle",
250
+ "hover:border-interactive-outlined-warning-outline-hover hover:bg-interactive-outlined-warning-hover hover:text-interactive-outlined-warning-on-hover",
251
+ "pressed:border-interactive-outlined-warning-outline-pressed pressed:bg-interactive-outlined-warning-pressed pressed:text-interactive-outlined-warning-on-pressed",
252
+ "disabled:border-interactive-outlined-warning-outline-disabled disabled:bg-interactive-outlined-warning-disabled disabled:text-interactive-outlined-warning-on-disabled",
253
+ "focus-visible:outline-interactive-outlined-warning-focus",
254
+ "selected:border-interactive-outlined-warning-toggled-idle selected:bg-interactive-outlined-warning-toggled-idle selected:text-interactive-outlined-warning-on-toggled-idle",
255
+ "selected:hover:border-interactive-outlined-warning-toggled-hover selected:hover:bg-interactive-outlined-warning-toggled-hover selected:hover:text-interactive-outlined-warning-on-toggled-hover",
256
+ "selected:disabled:border-interactive-outlined-warning-toggled-disabled selected:disabled:bg-interactive-outlined-warning-toggled-disabled selected:disabled:text-interactive-outlined-warning-on-toggled-disabled"
257
+ ]
258
+ },
259
+ {
260
+ variant: "subtle",
261
+ color: "warning",
262
+ className: [
263
+ "border-interactive-subtle-warning-idle bg-interactive-subtle-warning-idle text-interactive-subtle-warning-on-idle",
264
+ "hover:border-interactive-subtle-warning-hover hover:bg-interactive-subtle-warning-hover hover:text-interactive-subtle-warning-on-hover",
265
+ "pressed:border-interactive-subtle-warning-pressed pressed:bg-interactive-subtle-warning-pressed pressed:text-interactive-subtle-warning-on-pressed",
266
+ "disabled:border-interactive-subtle-warning-disabled disabled:bg-interactive-subtle-warning-disabled disabled:text-interactive-subtle-warning-on-disabled",
267
+ "focus-visible:outline-interactive-subtle-warning-focus",
268
+ "selected:border-interactive-subtle-warning-toggled-idle selected:bg-interactive-subtle-warning-toggled-idle selected:text-interactive-subtle-warning-on-toggled-idle",
269
+ "selected:hover:border-interactive-subtle-warning-toggled-hover selected:hover:bg-interactive-subtle-warning-toggled-hover selected:hover:text-interactive-subtle-warning-on-toggled-hover",
270
+ "selected:disabled:border-interactive-subtle-warning-toggled-disabled selected:disabled:bg-interactive-subtle-warning-toggled-disabled selected:disabled:text-interactive-subtle-warning-on-toggled-disabled",
271
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-warning-on-idle!"
272
+ ]
273
+ },
274
+ {
275
+ variant: "ghost",
276
+ color: "warning",
277
+ className: [
278
+ "border-interactive-ghost-warning-idle bg-interactive-ghost-warning-idle text-interactive-ghost-warning-on-idle",
279
+ "hover:border-interactive-ghost-warning-hover hover:bg-interactive-ghost-warning-hover hover:text-interactive-ghost-warning-on-hover",
280
+ "pressed:border-interactive-ghost-warning-pressed pressed:bg-interactive-ghost-warning-pressed pressed:text-interactive-ghost-warning-on-pressed",
281
+ "disabled:border-interactive-ghost-warning-disabled disabled:bg-interactive-ghost-warning-disabled disabled:text-interactive-ghost-warning-on-disabled",
282
+ "focus-visible:outline-interactive-ghost-warning-focus",
283
+ "selected:border-interactive-ghost-warning-toggled-idle selected:bg-interactive-ghost-warning-toggled-idle selected:text-interactive-ghost-warning-on-toggled-idle",
284
+ "selected:hover:border-interactive-ghost-warning-toggled-hover selected:hover:bg-interactive-ghost-warning-toggled-hover selected:hover:text-interactive-ghost-warning-on-toggled-hover",
285
+ "selected:disabled:border-interactive-ghost-warning-toggled-disabled selected:disabled:bg-interactive-ghost-warning-toggled-disabled selected:disabled:text-interactive-ghost-warning-on-toggled-disabled",
286
+ "group-data-[split]/split:data-[separator]:after:hidden"
287
+ ]
288
+ },
289
+ {
290
+ variant: "contained",
291
+ color: "error",
292
+ className: [
293
+ "border-interactive-contained-error-idle bg-interactive-contained-error-idle text-interactive-contained-error-on-idle",
294
+ "hover:border-interactive-contained-error-hover hover:bg-interactive-contained-error-hover hover:text-interactive-contained-error-on-hover",
295
+ "pressed:border-interactive-contained-error-pressed pressed:bg-interactive-contained-error-pressed pressed:text-interactive-contained-error-on-pressed",
296
+ "disabled:border-interactive-contained-error-disabled disabled:bg-interactive-contained-error-disabled disabled:text-interactive-contained-error-on-disabled",
297
+ "focus-visible:outline-interactive-contained-error-focus",
298
+ "selected:border-interactive-contained-error-toggled-idle selected:bg-interactive-contained-error-toggled-idle selected:text-interactive-contained-error-on-toggled-idle",
299
+ "selected:hover:border-interactive-contained-error-toggled-hover selected:hover:bg-interactive-contained-error-toggled-hover selected:hover:text-interactive-contained-error-on-toggled-hover",
300
+ "selected:disabled:border-interactive-contained-error-toggled-disabled selected:disabled:bg-interactive-contained-error-toggled-disabled selected:disabled:text-interactive-contained-error-on-toggled-disabled",
301
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-error-on-idle!"
302
+ ]
303
+ },
304
+ {
305
+ variant: "outlined",
306
+ color: "error",
307
+ className: [
308
+ "border-interactive-outlined-error-outline-idle bg-interactive-outlined-error-idle text-interactive-outlined-error-on-idle",
309
+ "hover:border-interactive-outlined-error-outline-hover hover:bg-interactive-outlined-error-hover hover:text-interactive-outlined-error-on-hover",
310
+ "pressed:border-interactive-outlined-error-outline-pressed pressed:bg-interactive-outlined-error-pressed pressed:text-interactive-outlined-error-on-pressed",
311
+ "disabled:border-interactive-outlined-error-outline-disabled disabled:bg-interactive-outlined-error-disabled disabled:text-interactive-outlined-error-on-disabled",
312
+ "focus-visible:outline-interactive-outlined-error-focus",
313
+ "selected:border-interactive-outlined-error-toggled-idle selected:bg-interactive-outlined-error-toggled-idle selected:text-interactive-outlined-error-on-toggled-idle",
314
+ "selected:hover:border-interactive-outlined-error-toggled-hover selected:hover:bg-interactive-outlined-error-toggled-hover selected:hover:text-interactive-outlined-error-on-toggled-hover",
315
+ "selected:disabled:border-interactive-outlined-error-toggled-disabled selected:disabled:bg-interactive-outlined-error-toggled-disabled selected:disabled:text-interactive-outlined-error-on-toggled-disabled"
316
+ ]
317
+ },
318
+ {
319
+ variant: "subtle",
320
+ color: "error",
321
+ className: [
322
+ "border-interactive-subtle-error-idle bg-interactive-subtle-error-idle text-interactive-subtle-error-on-idle",
323
+ "hover:border-interactive-subtle-error-hover hover:bg-interactive-subtle-error-hover hover:text-interactive-subtle-error-on-hover",
324
+ "pressed:border-interactive-subtle-error-pressed pressed:bg-interactive-subtle-error-pressed pressed:text-interactive-subtle-error-on-pressed",
325
+ "disabled:border-interactive-subtle-error-disabled disabled:bg-interactive-subtle-error-disabled disabled:text-interactive-subtle-error-on-disabled",
326
+ "focus-visible:outline-interactive-subtle-error-focus",
327
+ "selected:border-interactive-subtle-error-toggled-idle selected:bg-interactive-subtle-error-toggled-idle selected:text-interactive-subtle-error-on-toggled-idle",
328
+ "selected:hover:border-interactive-subtle-error-toggled-hover selected:hover:bg-interactive-subtle-error-toggled-hover selected:hover:text-interactive-subtle-error-on-toggled-hover",
329
+ "selected:disabled:border-interactive-subtle-error-toggled-disabled selected:disabled:bg-interactive-subtle-error-toggled-disabled selected:disabled:text-interactive-subtle-error-on-toggled-disabled",
330
+ "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-error-on-idle!"
331
+ ]
332
+ },
333
+ {
334
+ variant: "ghost",
335
+ color: "error",
336
+ className: [
337
+ "border-interactive-ghost-error-idle bg-interactive-ghost-error-idle text-interactive-ghost-error-on-idle",
338
+ "hover:border-interactive-ghost-error-hover hover:bg-interactive-ghost-error-hover hover:text-interactive-ghost-error-on-hover",
339
+ "pressed:border-interactive-ghost-error-pressed pressed:bg-interactive-ghost-error-pressed pressed:text-interactive-ghost-error-on-pressed",
340
+ "disabled:border-interactive-ghost-error-disabled disabled:bg-interactive-ghost-error-disabled disabled:text-interactive-ghost-error-on-disabled",
341
+ "focus-visible:outline-interactive-ghost-error-focus",
342
+ "selected:border-interactive-ghost-error-toggled-idle selected:bg-interactive-ghost-error-toggled-idle selected:text-interactive-ghost-error-on-toggled-idle",
343
+ "selected:hover:border-interactive-ghost-error-toggled-hover selected:hover:bg-interactive-ghost-error-toggled-hover selected:hover:text-interactive-ghost-error-on-toggled-hover",
344
+ "selected:disabled:border-interactive-ghost-error-toggled-disabled selected:disabled:bg-interactive-ghost-error-toggled-disabled selected:disabled:text-interactive-ghost-error-on-toggled-disabled",
345
+ "group-data-[split]/split:data-[separator]:after:hidden"
346
+ ]
347
+ },
348
+ {
349
+ variant: "text",
350
+ color: "primary",
351
+ inverted: false,
352
+ className: [
353
+ "border-support-transparent-outline",
354
+ "text-interactive-text-primary-idle",
355
+ "hover:text-interactive-text-primary-hover",
356
+ "pressed:text-interactive-text-primary-pressed",
357
+ "disabled:text-interactive-text-primary-disabled",
358
+ "focus-visible:outline-interactive-text-primary-focus",
359
+ "selected:text-interactive-text-primary-toggled-idle",
360
+ "selected:hover:text-interactive-text-primary-toggled-hovered",
361
+ "selected:disabled:text-interactive-text-primary-toggled-disabled"
362
+ ]
363
+ },
364
+ {
365
+ variant: "text",
366
+ color: "secondary",
367
+ className: [
368
+ "border-support-transparent-outline",
369
+ "text-interactive-text-secondary-idle",
370
+ "hover:text-interactive-text-secondary-hover",
371
+ "pressed:text-interactive-text-secondary-pressed",
372
+ "disabled:text-interactive-text-secondary-disabled",
373
+ "focus-visible:outline-interactive-text-secondary-focus",
374
+ "selected:text-interactive-text-secondary-toggled-idle",
375
+ "selected:hover:text-interactive-text-secondary-toggled-hovered",
376
+ "selected:disabled:text-interactive-text-secondary-toggled-disabled"
377
+ ]
378
+ },
379
+ {
380
+ variant: "text",
381
+ color: "success",
382
+ inverted: false,
383
+ className: [
384
+ "border-support-transparent-outline",
385
+ "text-interactive-text-success-idle",
386
+ "hover:text-interactive-text-success-hover",
387
+ "pressed:text-interactive-text-success-pressed",
388
+ "disabled:text-interactive-text-success-disabled",
389
+ "focus-visible:outline-interactive-text-success-focus",
390
+ "selected:text-interactive-text-success-toggled-idle",
391
+ "selected:hover:text-interactive-text-success-toggled-hovered",
392
+ "selected:disabled:text-interactive-text-success-toggled-disabled"
393
+ ]
394
+ },
395
+ {
396
+ variant: "text",
397
+ color: "warning",
398
+ inverted: false,
399
+ className: [
400
+ "border-support-transparent-outline",
401
+ "text-interactive-text-warning-idle",
402
+ "hover:text-interactive-text-warning-hover",
403
+ "pressed:text-interactive-text-warning-pressed",
404
+ "disabled:text-interactive-text-warning-disabled",
405
+ "focus-visible:outline-interactive-text-warning-focus",
406
+ "selected:text-interactive-text-warning-toggled-idle",
407
+ "selected:hover:text-interactive-text-warning-toggled-hovered",
408
+ "selected:disabled:text-interactive-text-warning-toggled-disabled"
409
+ ]
410
+ },
411
+ {
412
+ variant: "text",
413
+ color: "error",
414
+ inverted: false,
415
+ className: [
416
+ "border-support-transparent-outline",
417
+ "text-interactive-text-error-idle",
418
+ "hover:text-interactive-text-error-hover",
419
+ "pressed:text-interactive-text-error-pressed",
420
+ "disabled:text-interactive-text-error-disabled",
421
+ "focus-visible:outline-interactive-text-error-focus",
422
+ "selected:text-interactive-text-error-toggled-idle",
423
+ "selected:hover:text-interactive-text-error-toggled-hovered",
424
+ "selected:disabled:text-interactive-text-error-toggled-disabled"
425
+ ]
426
+ },
427
+ {
428
+ variant: "text",
429
+ color: "primary",
430
+ inverted: true,
431
+ className: [
432
+ "border-support-transparent-outline",
433
+ "text-interactive-text-primary-idle-inverted",
434
+ "hover:text-interactive-text-primary-hover-inverted",
435
+ "pressed:text-interactive-text-primary-pressed-inverted",
436
+ "disabled:text-interactive-text-primary-disabled-inverted",
437
+ "focus-visible:outline-interactive-text-primary-focus-inverted",
438
+ "selected:text-interactive-text-primary-toggled-idle-inverted",
439
+ "selected:hover:text-interactive-text-primary-toggled-hovered-inverted",
440
+ "selected:disabled:text-interactive-text-primary-toggled-disabled-inverted"
441
+ ]
442
+ },
443
+ {
444
+ variant: "text",
445
+ color: "success",
446
+ inverted: true,
447
+ className: [
448
+ "border-support-transparent-outline",
449
+ "text-interactive-text-success-idle-inverted",
450
+ "hover:text-interactive-text-success-hover-inverted",
451
+ "pressed:text-interactive-text-success-pressed-inverted",
452
+ "disabled:text-interactive-text-success-disabled-inverted",
453
+ "focus-visible:outline-interactive-text-success-focus-inverted",
454
+ "selected:text-interactive-text-success-toggled-idle-inverted",
455
+ "selected:hover:text-interactive-text-success-toggled-hovered-inverted",
456
+ "selected:disabled:text-interactive-text-success-toggled-disabled-inverted"
457
+ ]
458
+ },
459
+ {
460
+ variant: "text",
461
+ color: "warning",
462
+ inverted: true,
463
+ className: [
464
+ "border-support-transparent-outline",
465
+ "text-interactive-text-warning-idle-inverted",
466
+ "hover:text-interactive-text-warning-hover-inverted",
467
+ "pressed:text-interactive-text-warning-pressed-inverted",
468
+ "disabled:text-interactive-text-warning-disabled-inverted",
469
+ "focus-visible:outline-interactive-text-warning-focus-inverted",
470
+ "selected:text-interactive-text-warning-toggled-idle-inverted",
471
+ "selected:hover:text-interactive-text-warning-toggled-hovered-inverted",
472
+ "selected:disabled:text-interactive-text-warning-toggled-disabled-inverted"
473
+ ]
474
+ },
475
+ {
476
+ variant: "text",
477
+ color: "error",
478
+ inverted: true,
479
+ className: [
480
+ "border-support-transparent-outline",
481
+ "text-interactive-text-error-idle-inverted",
482
+ "hover:text-interactive-text-error-hover-inverted",
483
+ "pressed:text-interactive-text-error-pressed-inverted",
484
+ "disabled:text-interactive-text-error-disabled-inverted",
485
+ "focus-visible:outline-interactive-text-error-focus-inverted",
486
+ "selected:text-interactive-text-error-toggled-idle-inverted",
487
+ "selected:hover:text-interactive-text-error-toggled-hovered-inverted",
488
+ "selected:disabled:text-interactive-text-error-toggled-disabled-inverted"
489
+ ]
490
+ },
491
+ {
492
+ variant: "text",
493
+ color: "dual",
494
+ className: [
495
+ "border-support-transparent-outline",
496
+ "text-interactive-text-secondary-idle [&_svg]:text-interactive-text-primary-idle",
497
+ "hover:text-interactive-text-primary-hover hover:[&_svg]:text-interactive-text-primary-hover",
498
+ "pressed:text-interactive-text-primary-pressed pressed:[&_svg]:text-interactive-text-primary-pressed",
499
+ "disabled:text-interactive-text-primary-disabled disabled:[&_svg]:text-interactive-text-primary-disabled",
500
+ "focus-visible:outline-interactive-text-primary-focus",
501
+ "selected:text-interactive-text-primery-toggled-idle selected:[&_svg]:text-interactive-text-primery-toggled-idle",
502
+ "selected:hover:text-interactive-text-primary-toggled-hovered selected:hover:[&_svg]:text-interactive-text-primary-toggled-hovered",
503
+ "selected:disabled:text-interactive-text-primary-toggled-disabled selected:disabled:[&_svg]:text-interactive-text-primary-toggled-disabled"
504
+ ]
505
+ }
506
+ ],
507
+ defaultVariants: {
508
+ width: "hug",
97
509
  color: "primary",
98
- className: [
99
- "border-interactive-ghost-primary-idle bg-interactive-ghost-primary-idle text-interactive-ghost-primary-on-idle",
100
- "hover:border-interactive-ghost-primary-hover hover:bg-interactive-ghost-primary-hover hover:text-interactive-ghost-primary-on-hover",
101
- "pressed:border-interactive-ghost-primary-pressed pressed:bg-interactive-ghost-primary-pressed pressed:text-interactive-ghost-primary-on-pressed",
102
- "disabled:border-interactive-ghost-primary-disabled disabled:bg-interactive-ghost-primary-disabled disabled:text-interactive-ghost-primary-on-disabled",
103
- "focus-visible:outline-interactive-ghost-primary-focus",
104
- "selected:border-interactive-ghost-primary-toggled-idle selected:bg-interactive-ghost-primary-toggled-idle selected:text-interactive-ghost-primary-on-toggled-idle",
105
- "selected:hover:border-interactive-ghost-primary-toggled-hover selected:hover:bg-interactive-ghost-primary-toggled-hover selected:hover:text-interactive-ghost-primary-on-toggled-hover",
106
- "selected:disabled:border-interactive-ghost-primary-toggled-disabled selected:disabled:bg-interactive-ghost-primary-toggled-disabled selected:disabled:text-interactive-ghost-primary-on-toggled-disabled",
107
- "group-data-[split]/split:data-[separator]:after:hidden"
108
- ]
109
- },
110
- {
111
- variant: "contained",
112
- color: "secondary",
113
- className: [
114
- "border-interactive-contained-secondary-idle bg-interactive-contained-secondary-idle text-interactive-contained-secondary-on-idle",
115
- "hover:border-interactive-contained-secondary-hover hover:bg-interactive-contained-secondary-hover hover:text-interactive-contained-secondary-on-hover",
116
- "pressed:border-interactive-contained-secondary-pressed pressed:bg-interactive-contained-secondary-pressed pressed:text-interactive-contained-secondary-on-pressed",
117
- "disabled:border-interactive-contained-secondary-disabled disabled:bg-interactive-contained-secondary-disabled disabled:text-interactive-contained-secondary-on-disabled",
118
- "focus-visible:outline-interactive-contained-secondary-focus",
119
- "selected:border-interactive-contained-secondary-toggled-idle selected:bg-interactive-contained-secondary-toggled-idle selected:text-interactive-contained-secondary-on-toggled-idle",
120
- "selected:hover:border-interactive-contained-secondary-toggled-hover selected:hover:bg-interactive-contained-secondary-toggled-hover selected:hover:text-interactive-contained-secondary-on-toggled-hover",
121
- "selected:disabled:border-interactive-contained-secondary-toggled-disabled selected:disabled:bg-interactive-contained-secondary-toggled-disabled selected:disabled:text-interactive-contained-secondary-on-toggled-disabled",
122
- "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-secondary-on-idle!"
123
- ]
124
- },
125
- {
126
- variant: "outlined",
127
- color: "secondary",
128
- className: [
129
- "border-interactive-outlined-secondary-outline-idle bg-interactive-outlined-secondary-idle text-interactive-outlined-secondary-on-idle",
130
- "hover:border-interactive-outlined-secondary-outline-hover hover:bg-interactive-outlined-secondary-hover hover:text-interactive-outlined-secondary-on-hover",
131
- "pressed:border-interactive-outlined-secondary-outline-pressed pressed:bg-interactive-outlined-secondary-pressed pressed:text-interactive-outlined-secondary-on-pressed",
132
- "disabled:border-interactive-outlined-secondary-outline-disabled disabled:bg-interactive-outlined-secondary-disabled disabled:text-interactive-outlined-secondary-on-disabled",
133
- "focus-visible:outline-interactive-outlined-secondary-focus",
134
- "selected:border-interactive-contained-secondary-toggled-idle selected:bg-interactive-contained-secondary-toggled-idle selected:text-interactive-contained-secondary-on-toggled-idle",
135
- "selected:hover:border-interactive-contained-secondary-toggled-hover selected:hover:bg-interactive-contained-secondary-toggled-hover selected:hover:text-interactive-contained-secondary-on-toggled-hover",
136
- "selected:disabled:border-interactive-contained-secondary-toggled-disabled selected:disabled:bg-interactive-contained-secondary-toggled-disabled selected:disabled:text-interactive-contained-secondary-on-toggled-disabled"
137
- ]
138
- },
139
- {
140
- variant: "subtle",
141
- color: "secondary",
142
- className: [
143
- "border-interactive-subtle-secondary-idle bg-interactive-subtle-secondary-idle text-interactive-subtle-secondary-on-idle",
144
- "hover:border-interactive-subtle-secondary-hover hover:bg-interactive-subtle-secondary-hover hover:text-interactive-subtle-secondary-on-hover",
145
- "pressed:border-interactive-subtle-secondary-pressed pressed:bg-interactive-subtle-secondary-pressed pressed:text-interactive-subtle-secondary-on-pressed",
146
- "disabled:border-interactive-subtle-secondary-disabled disabled:bg-interactive-subtle-secondary-disabled disabled:text-interactive-subtle-secondary-on-disabled",
147
- "focus-visible:outline-interactive-subtle-secondary-focus",
148
- "selected:border-interactive-subtle-secondary-toggled-idle selected:bg-interactive-subtle-secondary-toggled-idle selected:text-interactive-subtle-secondary-on-toggled-idle",
149
- "selected:hover:border-interactive-subtle-secondary-toggled-hover selected:hover:bg-interactive-subtle-secondary-toggled-hover selected:hover:text-interactive-subtle-secondary-on-toggled-hover",
150
- "selected:disabled:border-interactive-subtle-secondary-toggled-disabled selected:disabled:bg-interactive-subtle-secondary-toggled-disabled selected:disabled:text-interactive-subtle-secondary-on-toggled-disabled",
151
- "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-secondary-on-idle!"
152
- ]
153
- },
154
- {
155
- variant: "ghost",
156
- color: "secondary",
157
- className: [
158
- "border-interactive-ghost-secondary-idle bg-interactive-ghost-secondary-idle text-interactive-ghost-secondary-on-idle",
159
- "hover:border-interactive-ghost-secondary-hover hover:bg-interactive-ghost-secondary-hover hover:text-interactive-ghost-secondary-on-hover",
160
- "pressed:border-interactive-ghost-secondary-pressed pressed:bg-interactive-ghost-secondary-pressed pressed:text-interactive-ghost-secondary-on-pressed",
161
- "disabled:border-interactive-ghost-secondary-disabled disabled:bg-interactive-ghost-secondary-disabled disabled:text-interactive-ghost-secondary-on-disabled",
162
- "focus-visible:outline-interactive-ghost-secondary-focus",
163
- "selected:border-interactive-ghost-secondary-toggled-idle selected:bg-interactive-ghost-secondary-toggled-idle selected:text-interactive-ghost-secondary-on-toggled-idle",
164
- "selected:hover:border-interactive-ghost-secondary-toggled-hover selected:hover:bg-interactive-ghost-secondary-toggled-hover selected:hover:text-interactive-ghost-secondary-on-toggled-hover",
165
- "selected:disabled:border-interactive-ghost-secondary-toggled-disabled selected:disabled:bg-interactive-ghost-secondary-toggled-disabled selected:disabled:text-interactive-ghost-secondary-on-toggled-disabled",
166
- "group-data-[split]/split:data-[separator]:after:hidden"
167
- ]
168
- },
169
- {
170
510
  variant: "contained",
171
- color: "success",
172
- className: [
173
- "border-interactive-contained-success-idle bg-interactive-contained-success-idle text-interactive-contained-success-on-idle",
174
- "hover:border-interactive-contained-success-hover hover:bg-interactive-contained-success-hover hover:text-interactive-contained-success-on-hover",
175
- "pressed:border-interactive-contained-success-pressed pressed:bg-interactive-contained-success-pressed pressed:text-interactive-contained-success-on-pressed",
176
- "disabled:border-interactive-contained-success-disabled disabled:bg-interactive-contained-success-disabled disabled:text-interactive-contained-success-on-disabled",
177
- "focus-visible:outline-interactive-contained-success-focus",
178
- "selected:border-interactive-contained-success-toggled-idle selected:bg-interactive-contained-success-toggled-idle selected:text-interactive-contained-success-on-toggled-idle",
179
- "selected:hover:border-interactive-contained-success-toggled-hover selected:hover:bg-interactive-contained-success-toggled-hover selected:hover:text-interactive-contained-success-on-toggled-hover",
180
- "selected:disabled:border-interactive-contained-success-toggled-disabled selected:disabled:bg-interactive-contained-success-toggled-disabled selected:disabled:text-interactive-contained-success-on-toggled-disabled",
181
- "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-success-on-idle!"
182
- ]
183
- },
184
- {
185
- variant: "outlined",
186
- color: "success",
187
- className: [
188
- "border-interactive-outlined-success-outline-idle bg-interactive-outlined-success-idle text-interactive-outlined-success-on-idle",
189
- "hover:border-interactive-outlined-success-outline-hover hover:bg-interactive-outlined-success-hover hover:text-interactive-outlined-success-on-hover",
190
- "pressed:border-interactive-outlined-success-outline-pressed pressed:bg-interactive-outlined-success-pressed pressed:text-interactive-outlined-success-on-pressed",
191
- "disabled:border-interactive-outlined-success-outline-disabled disabled:bg-interactive-outlined-success-disabled disabled:text-interactive-outlined-success-on-disabled",
192
- "focus-visible:outline-interactive-outlined-success-focus",
193
- "selected:border-interactive-outlined-success-toggled-idle selected:bg-interactive-outlined-success-toggled-idle selected:text-interactive-outlined-success-on-toggled-idle",
194
- "selected:hover:border-interactive-outlined-success-toggled-hover selected:hover:bg-interactive-outlined-success-toggled-hover selected:hover:text-interactive-outlined-success-on-toggled-hover",
195
- "selected:disabled:border-interactive-outlined-success-toggled-disabled selected:disabled:bg-interactive-outlined-success-toggled-disabled selected:disabled:text-interactive-outlined-success-on-toggled-disabled"
196
- ]
197
- },
198
- {
199
- variant: "subtle",
200
- color: "success",
201
- className: [
202
- "border-interactive-subtle-success-idle bg-interactive-subtle-success-idle text-interactive-subtle-success-on-idle",
203
- "hover:border-interactive-subtle-success-hover hover:bg-interactive-subtle-success-hover hover:text-interactive-subtle-success-on-hover",
204
- "pressed:border-interactive-subtle-success-pressed pressed:bg-interactive-subtle-success-pressed pressed:text-interactive-subtle-success-on-pressed",
205
- "disabled:border-interactive-subtle-success-disabled disabled:bg-interactive-subtle-success-disabled disabled:text-interactive-subtle-success-on-disabled",
206
- "focus-visible:outline-interactive-subtle-success-focus",
207
- "selected:border-interactive-subtle-success-toggled-idle selected:bg-interactive-subtle-success-toggled-idle selected:text-interactive-subtle-success-on-toggled-idle",
208
- "selected:hover:border-interactive-subtle-success-toggled-hover selected:hover:bg-interactive-subtle-success-toggled-hover selected:hover:text-interactive-subtle-success-on-toggled-hover",
209
- "selected:disabled:border-interactive-subtle-success-toggled-disabled selected:disabled:bg-interactive-subtle-success-toggled-disabled selected:disabled:text-interactive-subtle-success-on-toggled-disabled",
210
- "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-success-on-idle!"
211
- ]
212
- },
213
- {
214
- variant: "ghost",
215
- color: "success",
216
- className: [
217
- "border-interactive-ghost-success-idle bg-interactive-ghost-success-idle text-interactive-ghost-success-on-idle",
218
- "hover:border-interactive-ghost-success-hover hover:bg-interactive-ghost-success-hover hover:text-interactive-ghost-success-on-hover",
219
- "pressed:border-interactive-ghost-success-pressed pressed:bg-interactive-ghost-success-pressed pressed:text-interactive-ghost-success-on-pressed",
220
- "disabled:border-interactive-ghost-success-disabled disabled:bg-interactive-ghost-success-disabled disabled:text-interactive-ghost-success-on-disabled",
221
- "focus-visible:outline-interactive-ghost-success-focus",
222
- "selected:border-interactive-ghost-success-toggled-idle selected:bg-interactive-ghost-success-toggled-idle selected:text-interactive-ghost-success-on-toggled-idle",
223
- "selected:hover:border-interactive-ghost-success-toggled-hover selected:hover:bg-interactive-ghost-success-toggled-hover selected:hover:text-interactive-ghost-success-on-toggled-hover",
224
- "selected:disabled:border-interactive-ghost-success-toggled-disabled selected:disabled:bg-interactive-ghost-success-toggled-disabled selected:disabled:text-interactive-ghost-success-on-toggled-disabled",
225
- "group-data-[split]/split:data-[separator]:after:hidden"
226
- ]
227
- },
228
- {
229
- variant: "contained",
230
- color: "warning",
231
- className: [
232
- "border-interactive-contained-warning-idle bg-interactive-contained-warning-idle text-interactive-contained-warning-on-idle",
233
- "hover:border-interactive-contained-warning-hover hover:bg-interactive-contained-warning-hover hover:text-interactive-contained-warning-on-hover",
234
- "pressed:border-interactive-contained-warning-pressed pressed:bg-interactive-contained-warning-pressed pressed:text-interactive-contained-warning-on-pressed",
235
- "disabled:border-interactive-contained-warning-disabled disabled:bg-interactive-contained-warning-disabled disabled:text-interactive-contained-warning-on-disabled",
236
- "focus-visible:outline-interactive-contained-warning-focus",
237
- "selected:border-interactive-contained-warning-toggled-idle selected:bg-interactive-contained-warning-toggled-idle selected:text-interactive-contained-warning-on-toggled-idle",
238
- "selected:hover:border-interactive-contained-warning-toggled-hover selected:hover:bg-interactive-contained-warning-toggled-hover selected:hover:text-interactive-contained-warning-on-toggled-hover",
239
- "selected:disabled:border-interactive-contained-warning-toggled-disabled selected:disabled:bg-interactive-contained-warning-toggled-disabled selected:disabled:text-interactive-contained-warning-on-toggled-disabled",
240
- "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-warning-on-idle!"
241
- ]
242
- },
243
- {
244
- variant: "outlined",
245
- color: "warning",
246
- className: [
247
- "border-interactive-outlined-warning-outline-idle bg-interactive-outlined-warning-idle text-interactive-outlined-warning-on-idle",
248
- "hover:border-interactive-outlined-warning-outline-hover hover:bg-interactive-outlined-warning-hover hover:text-interactive-outlined-warning-on-hover",
249
- "pressed:border-interactive-outlined-warning-outline-pressed pressed:bg-interactive-outlined-warning-pressed pressed:text-interactive-outlined-warning-on-pressed",
250
- "disabled:border-interactive-outlined-warning-outline-disabled disabled:bg-interactive-outlined-warning-disabled disabled:text-interactive-outlined-warning-on-disabled",
251
- "focus-visible:outline-interactive-outlined-warning-focus",
252
- "selected:border-interactive-outlined-warning-toggled-idle selected:bg-interactive-outlined-warning-toggled-idle selected:text-interactive-outlined-warning-on-toggled-idle",
253
- "selected:hover:border-interactive-outlined-warning-toggled-hover selected:hover:bg-interactive-outlined-warning-toggled-hover selected:hover:text-interactive-outlined-warning-on-toggled-hover",
254
- "selected:disabled:border-interactive-outlined-warning-toggled-disabled selected:disabled:bg-interactive-outlined-warning-toggled-disabled selected:disabled:text-interactive-outlined-warning-on-toggled-disabled"
255
- ]
256
- },
257
- {
258
- variant: "subtle",
259
- color: "warning",
260
- className: [
261
- "border-interactive-subtle-warning-idle bg-interactive-subtle-warning-idle text-interactive-subtle-warning-on-idle",
262
- "hover:border-interactive-subtle-warning-hover hover:bg-interactive-subtle-warning-hover hover:text-interactive-subtle-warning-on-hover",
263
- "pressed:border-interactive-subtle-warning-pressed pressed:bg-interactive-subtle-warning-pressed pressed:text-interactive-subtle-warning-on-pressed",
264
- "disabled:border-interactive-subtle-warning-disabled disabled:bg-interactive-subtle-warning-disabled disabled:text-interactive-subtle-warning-on-disabled",
265
- "focus-visible:outline-interactive-subtle-warning-focus",
266
- "selected:border-interactive-subtle-warning-toggled-idle selected:bg-interactive-subtle-warning-toggled-idle selected:text-interactive-subtle-warning-on-toggled-idle",
267
- "selected:hover:border-interactive-subtle-warning-toggled-hover selected:hover:bg-interactive-subtle-warning-toggled-hover selected:hover:text-interactive-subtle-warning-on-toggled-hover",
268
- "selected:disabled:border-interactive-subtle-warning-toggled-disabled selected:disabled:bg-interactive-subtle-warning-toggled-disabled selected:disabled:text-interactive-subtle-warning-on-toggled-disabled",
269
- "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-warning-on-idle!"
270
- ]
271
- },
272
- {
273
- variant: "ghost",
274
- color: "warning",
275
- className: [
276
- "border-interactive-ghost-warning-idle bg-interactive-ghost-warning-idle text-interactive-ghost-warning-on-idle",
277
- "hover:border-interactive-ghost-warning-hover hover:bg-interactive-ghost-warning-hover hover:text-interactive-ghost-warning-on-hover",
278
- "pressed:border-interactive-ghost-warning-pressed pressed:bg-interactive-ghost-warning-pressed pressed:text-interactive-ghost-warning-on-pressed",
279
- "disabled:border-interactive-ghost-warning-disabled disabled:bg-interactive-ghost-warning-disabled disabled:text-interactive-ghost-warning-on-disabled",
280
- "focus-visible:outline-interactive-ghost-warning-focus",
281
- "selected:border-interactive-ghost-warning-toggled-idle selected:bg-interactive-ghost-warning-toggled-idle selected:text-interactive-ghost-warning-on-toggled-idle",
282
- "selected:hover:border-interactive-ghost-warning-toggled-hover selected:hover:bg-interactive-ghost-warning-toggled-hover selected:hover:text-interactive-ghost-warning-on-toggled-hover",
283
- "selected:disabled:border-interactive-ghost-warning-toggled-disabled selected:disabled:bg-interactive-ghost-warning-toggled-disabled selected:disabled:text-interactive-ghost-warning-on-toggled-disabled",
284
- "group-data-[split]/split:data-[separator]:after:hidden"
285
- ]
286
- },
287
- {
288
- variant: "contained",
289
- color: "error",
290
- className: [
291
- "border-interactive-contained-error-idle bg-interactive-contained-error-idle text-interactive-contained-error-on-idle",
292
- "hover:border-interactive-contained-error-hover hover:bg-interactive-contained-error-hover hover:text-interactive-contained-error-on-hover",
293
- "pressed:border-interactive-contained-error-pressed pressed:bg-interactive-contained-error-pressed pressed:text-interactive-contained-error-on-pressed",
294
- "disabled:border-interactive-contained-error-disabled disabled:bg-interactive-contained-error-disabled disabled:text-interactive-contained-error-on-disabled",
295
- "focus-visible:outline-interactive-contained-error-focus",
296
- "selected:border-interactive-contained-error-toggled-idle selected:bg-interactive-contained-error-toggled-idle selected:text-interactive-contained-error-on-toggled-idle",
297
- "selected:hover:border-interactive-contained-error-toggled-hover selected:hover:bg-interactive-contained-error-toggled-hover selected:hover:text-interactive-contained-error-on-toggled-hover",
298
- "selected:disabled:border-interactive-contained-error-toggled-disabled selected:disabled:bg-interactive-contained-error-toggled-disabled selected:disabled:text-interactive-contained-error-on-toggled-disabled",
299
- "group-data-[split]/split:data-[separator]:after:bg-interactive-contained-error-on-idle!"
300
- ]
301
- },
302
- {
303
- variant: "outlined",
304
- color: "error",
305
- className: [
306
- "border-interactive-outlined-error-outline-idle bg-interactive-outlined-error-idle text-interactive-outlined-error-on-idle",
307
- "hover:border-interactive-outlined-error-outline-hover hover:bg-interactive-outlined-error-hover hover:text-interactive-outlined-error-on-hover",
308
- "pressed:border-interactive-outlined-error-outline-pressed pressed:bg-interactive-outlined-error-pressed pressed:text-interactive-outlined-error-on-pressed",
309
- "disabled:border-interactive-outlined-error-outline-disabled disabled:bg-interactive-outlined-error-disabled disabled:text-interactive-outlined-error-on-disabled",
310
- "focus-visible:outline-interactive-outlined-error-focus",
311
- "selected:border-interactive-outlined-error-toggled-idle selected:bg-interactive-outlined-error-toggled-idle selected:text-interactive-outlined-error-on-toggled-idle",
312
- "selected:hover:border-interactive-outlined-error-toggled-hover selected:hover:bg-interactive-outlined-error-toggled-hover selected:hover:text-interactive-outlined-error-on-toggled-hover",
313
- "selected:disabled:border-interactive-outlined-error-toggled-disabled selected:disabled:bg-interactive-outlined-error-toggled-disabled selected:disabled:text-interactive-outlined-error-on-toggled-disabled"
314
- ]
315
- },
316
- {
317
- variant: "subtle",
318
- color: "error",
319
- className: [
320
- "border-interactive-subtle-error-idle bg-interactive-subtle-error-idle text-interactive-subtle-error-on-idle",
321
- "hover:border-interactive-subtle-error-hover hover:bg-interactive-subtle-error-hover hover:text-interactive-subtle-error-on-hover",
322
- "pressed:border-interactive-subtle-error-pressed pressed:bg-interactive-subtle-error-pressed pressed:text-interactive-subtle-error-on-pressed",
323
- "disabled:border-interactive-subtle-error-disabled disabled:bg-interactive-subtle-error-disabled disabled:text-interactive-subtle-error-on-disabled",
324
- "focus-visible:outline-interactive-subtle-error-focus",
325
- "selected:border-interactive-subtle-error-toggled-idle selected:bg-interactive-subtle-error-toggled-idle selected:text-interactive-subtle-error-on-toggled-idle",
326
- "selected:hover:border-interactive-subtle-error-toggled-hover selected:hover:bg-interactive-subtle-error-toggled-hover selected:hover:text-interactive-subtle-error-on-toggled-hover",
327
- "selected:disabled:border-interactive-subtle-error-toggled-disabled selected:disabled:bg-interactive-subtle-error-toggled-disabled selected:disabled:text-interactive-subtle-error-on-toggled-disabled",
328
- "group-data-[split]/split:data-[separator]:after:bg-interactive-subtle-error-on-idle!"
329
- ]
330
- },
331
- {
332
- variant: "ghost",
333
- color: "error",
334
- className: [
335
- "border-interactive-ghost-error-idle bg-interactive-ghost-error-idle text-interactive-ghost-error-on-idle",
336
- "hover:border-interactive-ghost-error-hover hover:bg-interactive-ghost-error-hover hover:text-interactive-ghost-error-on-hover",
337
- "pressed:border-interactive-ghost-error-pressed pressed:bg-interactive-ghost-error-pressed pressed:text-interactive-ghost-error-on-pressed",
338
- "disabled:border-interactive-ghost-error-disabled disabled:bg-interactive-ghost-error-disabled disabled:text-interactive-ghost-error-on-disabled",
339
- "focus-visible:outline-interactive-ghost-error-focus",
340
- "selected:border-interactive-ghost-error-toggled-idle selected:bg-interactive-ghost-error-toggled-idle selected:text-interactive-ghost-error-on-toggled-idle",
341
- "selected:hover:border-interactive-ghost-error-toggled-hover selected:hover:bg-interactive-ghost-error-toggled-hover selected:hover:text-interactive-ghost-error-on-toggled-hover",
342
- "selected:disabled:border-interactive-ghost-error-toggled-disabled selected:disabled:bg-interactive-ghost-error-toggled-disabled selected:disabled:text-interactive-ghost-error-on-toggled-disabled",
343
- "group-data-[split]/split:data-[separator]:after:hidden"
344
- ]
345
- },
346
- {
347
- variant: "text",
348
- color: "primary",
349
- inverted: false,
350
- className: [
351
- "border-support-transparent-outline",
352
- "text-interactive-text-primary-idle",
353
- "hover:text-interactive-text-primary-hover",
354
- "pressed:text-interactive-text-primary-pressed",
355
- "disabled:text-interactive-text-primary-disabled",
356
- "focus-visible:outline-interactive-text-primary-focus",
357
- "selected:text-interactive-text-primary-toggled-idle",
358
- "selected:hover:text-interactive-text-primary-toggled-hovered",
359
- "selected:disabled:text-interactive-text-primary-toggled-disabled"
360
- ]
361
- },
362
- {
363
- variant: "text",
364
- color: "secondary",
365
- className: [
366
- "border-support-transparent-outline",
367
- "text-interactive-text-secondary-idle",
368
- "hover:text-interactive-text-secondary-hover",
369
- "pressed:text-interactive-text-secondary-pressed",
370
- "disabled:text-interactive-text-secondary-disabled",
371
- "focus-visible:outline-interactive-text-secondary-focus",
372
- "selected:text-interactive-text-secondary-toggled-idle",
373
- "selected:hover:text-interactive-text-secondary-toggled-hovered",
374
- "selected:disabled:text-interactive-text-secondary-toggled-disabled"
375
- ]
376
- },
377
- {
378
- variant: "text",
379
- color: "success",
380
- inverted: false,
381
- className: [
382
- "border-support-transparent-outline",
383
- "text-interactive-text-success-idle",
384
- "hover:text-interactive-text-success-hover",
385
- "pressed:text-interactive-text-success-pressed",
386
- "disabled:text-interactive-text-success-disabled",
387
- "focus-visible:outline-interactive-text-success-focus",
388
- "selected:text-interactive-text-success-toggled-idle",
389
- "selected:hover:text-interactive-text-success-toggled-hovered",
390
- "selected:disabled:text-interactive-text-success-toggled-disabled"
391
- ]
392
- },
393
- {
394
- variant: "text",
395
- color: "warning",
396
- inverted: false,
397
- className: [
398
- "border-support-transparent-outline",
399
- "text-interactive-text-warning-idle",
400
- "hover:text-interactive-text-warning-hover",
401
- "pressed:text-interactive-text-warning-pressed",
402
- "disabled:text-interactive-text-warning-disabled",
403
- "focus-visible:outline-interactive-text-warning-focus",
404
- "selected:text-interactive-text-warning-toggled-idle",
405
- "selected:hover:text-interactive-text-warning-toggled-hovered",
406
- "selected:disabled:text-interactive-text-warning-toggled-disabled"
407
- ]
408
- },
409
- {
410
- variant: "text",
411
- color: "error",
412
- inverted: false,
413
- className: [
414
- "border-support-transparent-outline",
415
- "text-interactive-text-error-idle",
416
- "hover:text-interactive-text-error-hover",
417
- "pressed:text-interactive-text-error-pressed",
418
- "disabled:text-interactive-text-error-disabled",
419
- "focus-visible:outline-interactive-text-error-focus",
420
- "selected:text-interactive-text-error-toggled-idle",
421
- "selected:hover:text-interactive-text-error-toggled-hovered",
422
- "selected:disabled:text-interactive-text-error-toggled-disabled"
423
- ]
424
- },
425
- {
426
- variant: "text",
427
- color: "primary",
428
- inverted: true,
429
- className: [
430
- "border-support-transparent-outline",
431
- "text-interactive-text-primary-idle-inverted",
432
- "hover:text-interactive-text-primary-hover-inverted",
433
- "pressed:text-interactive-text-primary-pressed-inverted",
434
- "disabled:text-interactive-text-primary-disabled-inverted",
435
- "focus-visible:outline-interactive-text-primary-focus-inverted",
436
- "selected:text-interactive-text-primary-toggled-idle-inverted",
437
- "selected:hover:text-interactive-text-primary-toggled-hovered-inverted",
438
- "selected:disabled:text-interactive-text-primary-toggled-disabled-inverted"
439
- ]
440
- },
441
- {
442
- variant: "text",
443
- color: "success",
444
- inverted: true,
445
- className: [
446
- "border-support-transparent-outline",
447
- "text-interactive-text-success-idle-inverted",
448
- "hover:text-interactive-text-success-hover-inverted",
449
- "pressed:text-interactive-text-success-pressed-inverted",
450
- "disabled:text-interactive-text-success-disabled-inverted",
451
- "focus-visible:outline-interactive-text-success-focus-inverted",
452
- "selected:text-interactive-text-success-toggled-idle-inverted",
453
- "selected:hover:text-interactive-text-success-toggled-hovered-inverted",
454
- "selected:disabled:text-interactive-text-success-toggled-disabled-inverted"
455
- ]
456
- },
457
- {
458
- variant: "text",
459
- color: "warning",
460
- inverted: true,
461
- className: [
462
- "border-support-transparent-outline",
463
- "text-interactive-text-warning-idle-inverted",
464
- "hover:text-interactive-text-warning-hover-inverted",
465
- "pressed:text-interactive-text-warning-pressed-inverted",
466
- "disabled:text-interactive-text-warning-disabled-inverted",
467
- "focus-visible:outline-interactive-text-warning-focus-inverted",
468
- "selected:text-interactive-text-warning-toggled-idle-inverted",
469
- "selected:hover:text-interactive-text-warning-toggled-hovered-inverted",
470
- "selected:disabled:text-interactive-text-warning-toggled-disabled-inverted"
471
- ]
472
- },
473
- {
474
- variant: "text",
475
- color: "error",
476
- inverted: true,
477
- className: [
478
- "border-support-transparent-outline",
479
- "text-interactive-text-error-idle-inverted",
480
- "hover:text-interactive-text-error-hover-inverted",
481
- "pressed:text-interactive-text-error-pressed-inverted",
482
- "disabled:text-interactive-text-error-disabled-inverted",
483
- "focus-visible:outline-interactive-text-error-focus-inverted",
484
- "selected:text-interactive-text-error-toggled-idle-inverted",
485
- "selected:hover:text-interactive-text-error-toggled-hovered-inverted",
486
- "selected:disabled:text-interactive-text-error-toggled-disabled-inverted"
487
- ]
488
- },
489
- {
490
- variant: "text",
491
- color: "dual",
492
- className: [
493
- "border-support-transparent-outline",
494
- "text-interactive-text-secondary-idle [&_svg]:text-interactive-text-primary-idle",
495
- "hover:text-interactive-text-primary-hover hover:[&_svg]:text-interactive-text-primary-hover",
496
- "pressed:text-interactive-text-primary-pressed pressed:[&_svg]:text-interactive-text-primary-pressed",
497
- "disabled:text-interactive-text-primary-disabled disabled:[&_svg]:text-interactive-text-primary-disabled",
498
- "focus-visible:outline-interactive-text-primary-focus",
499
- "selected:text-interactive-text-primery-toggled-idle selected:[&_svg]:text-interactive-text-primery-toggled-idle",
500
- "selected:hover:text-interactive-text-primary-toggled-hovered selected:hover:[&_svg]:text-interactive-text-primary-toggled-hovered",
501
- "selected:disabled:text-interactive-text-primary-toggled-disabled selected:disabled:[&_svg]:text-interactive-text-primary-toggled-disabled"
502
- ]
511
+ inverted: false
503
512
  }
504
- ],
505
- defaultVariants: {
506
- width: "hug",
507
- color: "primary",
508
- variant: "contained",
509
- inverted: false
510
513
  }
511
514
  });
512
- var buttonSize = cva("", {
513
- variants: {
514
- size: {
515
- none: "rounded-button-rounding-s p-0",
516
- xs: "rounded-button-rounding-s",
517
- s: "rounded-button-rounding-s",
518
- m: "rounded-button-rounding-m",
519
- l: "rounded-button-rounding-l"
520
- },
521
- iconOnly: {
522
- true: "",
523
- false: ""
524
- }
525
- },
526
- compoundVariants: [
527
- {
528
- size: "xs",
529
- iconOnly: false,
530
- className: "px-button-side-xs py-button-height-xs"
531
- },
532
- {
533
- size: "s",
534
- iconOnly: false,
535
- className: "px-button-side-s py-button-height-s"
536
- },
537
- {
538
- size: "m",
539
- iconOnly: false,
540
- className: "px-button-side-m py-button-height-m"
541
- },
542
- {
543
- size: "l",
544
- iconOnly: false,
545
- className: "px-button-side-l py-button-height-l"
546
- },
547
- {
548
- size: "xs",
549
- iconOnly: true,
550
- className: "p-button-height-xs"
551
- },
552
- {
553
- size: "s",
554
- iconOnly: true,
555
- className: "p-button-height-s"
515
+ var buttonSizeDefinition = UIOverrides.defineConfig({
516
+ base: [],
517
+ config: {
518
+ variants: {
519
+ size: {
520
+ none: "rounded-button-rounding-s p-0",
521
+ xs: "rounded-button-rounding-s",
522
+ s: "rounded-button-rounding-s",
523
+ m: "rounded-button-rounding-m",
524
+ l: "rounded-button-rounding-l"
525
+ },
526
+ iconOnly: {
527
+ true: "",
528
+ false: ""
529
+ }
556
530
  },
557
- {
531
+ compoundVariants: [
532
+ {
533
+ size: "xs",
534
+ iconOnly: false,
535
+ className: "px-button-side-xs py-button-height-xs"
536
+ },
537
+ {
538
+ size: "s",
539
+ iconOnly: false,
540
+ className: "px-button-side-s py-button-height-s"
541
+ },
542
+ {
543
+ size: "m",
544
+ iconOnly: false,
545
+ className: "px-button-side-m py-button-height-m"
546
+ },
547
+ {
548
+ size: "l",
549
+ iconOnly: false,
550
+ className: "px-button-side-l py-button-height-l"
551
+ },
552
+ {
553
+ size: "xs",
554
+ iconOnly: true,
555
+ className: "p-button-height-xs"
556
+ },
557
+ {
558
+ size: "s",
559
+ iconOnly: true,
560
+ className: "p-button-height-s"
561
+ },
562
+ {
563
+ size: "m",
564
+ iconOnly: true,
565
+ className: "p-button-height-m"
566
+ },
567
+ {
568
+ size: "l",
569
+ iconOnly: true,
570
+ className: "p-button-height-l"
571
+ }
572
+ ],
573
+ defaultVariants: {
558
574
  size: "m",
559
- iconOnly: true,
560
- className: "p-button-height-m"
561
- },
562
- {
563
- size: "l",
564
- iconOnly: true,
565
- className: "p-button-height-l"
575
+ iconOnly: false
566
576
  }
567
- ],
568
- defaultVariants: {
569
- size: "m",
570
- iconOnly: false
571
577
  }
572
578
  });
573
- var buttonContent = cva("", {
574
- variants: {
575
- size: {
576
- none: "gap-button-gap-icon-to-label",
577
- xs: "gap-button-gap-icon-to-label",
578
- s: "gap-button-gap-icon-to-label",
579
- m: "gap-button-gap-icon-to-label",
580
- l: "gap-button-gap-icon-to-label"
581
- },
582
- iconPosition: {
583
- left: "",
584
- right: "",
585
- none: ""
579
+ var buttonContentDefinition = UIOverrides.defineConfig({
580
+ base: [],
581
+ config: {
582
+ variants: {
583
+ size: {
584
+ none: "gap-button-gap-icon-to-label",
585
+ xs: "gap-button-gap-icon-to-label",
586
+ s: "gap-button-gap-icon-to-label",
587
+ m: "gap-button-gap-icon-to-label",
588
+ l: "gap-button-gap-icon-to-label"
589
+ },
590
+ iconPosition: {
591
+ left: "",
592
+ right: "",
593
+ none: ""
594
+ },
595
+ iconOnly: {
596
+ true: "",
597
+ false: ""
598
+ }
586
599
  },
587
- iconOnly: {
588
- true: "",
589
- false: ""
600
+ defaultVariants: {
601
+ size: "m",
602
+ iconPosition: "left",
603
+ iconOnly: false
590
604
  }
591
- },
592
- defaultVariants: {
593
- size: "m",
594
- iconPosition: "left",
595
- iconOnly: false
596
605
  }
597
606
  });
598
- var buttonIconSize = cva("", {
599
- variants: { size: {
600
- none: "h-6 w-6",
601
- xs: "h-6 w-6",
602
- s: "h-6 w-6",
603
- m: "h-6 w-6",
604
- l: "h-6 w-6"
605
- } },
606
- defaultVariants: { size: "m" }
607
+ var buttonIconSizeDefinition = UIOverrides.defineConfig({
608
+ base: [],
609
+ config: {
610
+ variants: { size: {
611
+ none: "h-6 w-6",
612
+ xs: "h-6 w-6",
613
+ s: "h-6 w-6",
614
+ m: "h-6 w-6",
615
+ l: "h-6 w-6"
616
+ } },
617
+ defaultVariants: { size: "m" }
618
+ }
607
619
  });
608
620
  var buttonTypography = compoundMapper({
609
621
  defaultVariants: { size: "m" },
@@ -646,4 +658,4 @@ var buttonTypography = compoundMapper({
646
658
  ]
647
659
  });
648
660
  //#endregion
649
- export { button, buttonContent, buttonIconSize, buttonSize, buttonTypography };
661
+ export { buttonContentDefinition, buttonDefinition, buttonIconSizeDefinition, buttonSizeDefinition, buttonTypography };