@basic-ui/material 0.1.13 → 1.0.0-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (430) hide show
  1. package/build/cjs/index.js +634 -371
  2. package/build/cjs/index.js.map +1 -1
  3. package/build/esm/Alert/Alert.d.ts +1 -1
  4. package/build/esm/Alert/Alert.js +1 -1
  5. package/build/esm/Alert/Alert.js.map +1 -1
  6. package/build/esm/Alert/index.d.ts +0 -0
  7. package/build/esm/Alert/index.js.map +0 -0
  8. package/build/esm/AppBar/AppBar.d.ts +1 -1
  9. package/build/esm/AppBar/AppBar.js +1 -2
  10. package/build/esm/AppBar/AppBar.js.map +1 -1
  11. package/build/esm/AppBar/AppBarButton.d.ts +1 -1
  12. package/build/esm/AppBar/AppBarButton.js.map +0 -0
  13. package/build/esm/AppBar/context.d.ts +0 -0
  14. package/build/esm/AppBar/context.js.map +0 -0
  15. package/build/esm/AppBar/index.d.ts +0 -0
  16. package/build/esm/AppBar/index.js.map +0 -0
  17. package/build/esm/Badge/Badge.d.ts +1 -1
  18. package/build/esm/Badge/Badge.js.map +0 -0
  19. package/build/esm/Badge/index.d.ts +0 -0
  20. package/build/esm/Badge/index.js.map +0 -0
  21. package/build/esm/BaseLine/BaseLine.d.ts +0 -1
  22. package/build/esm/BaseLine/BaseLine.js.map +0 -0
  23. package/build/esm/BaseLine/index.d.ts +0 -0
  24. package/build/esm/BaseLine/index.js.map +0 -0
  25. package/build/esm/BottomSheet/BottomSheet.d.ts +1 -1
  26. package/build/esm/BottomSheet/BottomSheet.js.map +0 -0
  27. package/build/esm/BottomSheet/BottomSheetSurface.d.ts +1 -1
  28. package/build/esm/BottomSheet/BottomSheetSurface.js +1 -1
  29. package/build/esm/BottomSheet/BottomSheetSurface.js.map +1 -1
  30. package/build/esm/BottomSheet/index.d.ts +0 -0
  31. package/build/esm/BottomSheet/index.js.map +0 -0
  32. package/build/esm/Box/Box.d.ts +0 -0
  33. package/build/esm/Box/Box.js.map +0 -0
  34. package/build/esm/Box/index.d.ts +0 -0
  35. package/build/esm/Box/index.js.map +0 -0
  36. package/build/esm/Button/BaseButton.d.ts +2 -1
  37. package/build/esm/Button/BaseButton.js.map +1 -1
  38. package/build/esm/Button/Button.d.ts +3 -3
  39. package/build/esm/Button/Button.js +22 -6
  40. package/build/esm/Button/Button.js.map +1 -1
  41. package/build/esm/Button/ButtonGroup.d.ts +5 -0
  42. package/build/esm/Button/ButtonGroup.js +28 -0
  43. package/build/esm/Button/ButtonGroup.js.map +1 -0
  44. package/build/esm/Button/FilledButton.d.ts +2 -1
  45. package/build/esm/Button/FilledButton.js +36 -3
  46. package/build/esm/Button/FilledButton.js.map +1 -1
  47. package/build/esm/Button/IconButton.d.ts +1 -0
  48. package/build/esm/Button/IconButton.js +2 -1
  49. package/build/esm/Button/IconButton.js.map +1 -1
  50. package/build/esm/Button/OutlinedButton.d.ts +1 -1
  51. package/build/esm/Button/OutlinedButton.js +32 -2
  52. package/build/esm/Button/OutlinedButton.js.map +1 -1
  53. package/build/esm/Button/TransparentButton.d.ts +2 -1
  54. package/build/esm/Button/TransparentButton.js +32 -2
  55. package/build/esm/Button/TransparentButton.js.map +1 -1
  56. package/build/esm/Button/context.d.ts +8 -0
  57. package/build/esm/Button/context.js +5 -0
  58. package/build/esm/Button/context.js.map +1 -0
  59. package/build/esm/Button/index.d.ts +1 -0
  60. package/build/esm/Button/index.js +1 -0
  61. package/build/esm/Button/index.js.map +1 -1
  62. package/build/esm/CheckBox/CheckBox.d.ts +1 -1
  63. package/build/esm/CheckBox/CheckBox.js +1 -1
  64. package/build/esm/CheckBox/CheckBox.js.map +1 -1
  65. package/build/esm/CheckBox/CheckBoxIcon.d.ts +1 -1
  66. package/build/esm/CheckBox/CheckBoxIcon.js.map +0 -0
  67. package/build/esm/CheckBox/CheckPath.d.ts +0 -0
  68. package/build/esm/CheckBox/CheckPath.js.map +0 -0
  69. package/build/esm/CheckBox/IndeterminatePath.d.ts +0 -0
  70. package/build/esm/CheckBox/IndeterminatePath.js.map +0 -0
  71. package/build/esm/CheckBox/index.d.ts +0 -0
  72. package/build/esm/CheckBox/index.js.map +0 -0
  73. package/build/esm/Chip/ButtonChip.d.ts +3 -3
  74. package/build/esm/Chip/ButtonChip.js +41 -53
  75. package/build/esm/Chip/ButtonChip.js.map +1 -1
  76. package/build/esm/Chip/Chip.d.ts +0 -0
  77. package/build/esm/Chip/Chip.js.map +0 -0
  78. package/build/esm/Chip/ChipBase.d.ts +1 -1
  79. package/build/esm/Chip/ChipBase.js +23 -15
  80. package/build/esm/Chip/ChipBase.js.map +1 -1
  81. package/build/esm/Chip/ChoiceChip.d.ts +3 -2
  82. package/build/esm/Chip/ChoiceChip.js +18 -24
  83. package/build/esm/Chip/ChoiceChip.js.map +1 -1
  84. package/build/esm/Chip/index.d.ts +0 -0
  85. package/build/esm/Chip/index.js.map +0 -0
  86. package/build/esm/ColorMode/ColorModeProvider.d.ts +0 -0
  87. package/build/esm/ColorMode/ColorModeProvider.js.map +0 -0
  88. package/build/esm/ColorMode/color-mode.d.ts +0 -0
  89. package/build/esm/ColorMode/color-mode.js.map +0 -0
  90. package/build/esm/ColorMode/color-vars.d.ts +0 -0
  91. package/build/esm/ColorMode/color-vars.js.map +0 -0
  92. package/build/esm/ColorMode/constants.d.ts +0 -0
  93. package/build/esm/ColorMode/constants.js.map +0 -0
  94. package/build/esm/ColorMode/index.d.ts +0 -0
  95. package/build/esm/ColorMode/index.js.map +0 -0
  96. package/build/esm/Combobox/Combobox.d.ts +7 -7
  97. package/build/esm/Combobox/Combobox.js +2 -1
  98. package/build/esm/Combobox/Combobox.js.map +1 -1
  99. package/build/esm/Combobox/index.d.ts +0 -0
  100. package/build/esm/Combobox/index.js.map +0 -0
  101. package/build/esm/Dialog/Dialog.d.ts +1 -1
  102. package/build/esm/Dialog/Dialog.js.map +0 -0
  103. package/build/esm/Dialog/DialogBackdrop.d.ts +1 -1
  104. package/build/esm/Dialog/DialogBackdrop.js.map +0 -0
  105. package/build/esm/Dialog/DialogContainer.d.ts +1 -1
  106. package/build/esm/Dialog/DialogContainer.js.map +0 -0
  107. package/build/esm/Dialog/DialogSurface.d.ts +4 -2
  108. package/build/esm/Dialog/DialogSurface.js +19 -7
  109. package/build/esm/Dialog/DialogSurface.js.map +1 -1
  110. package/build/esm/Dialog/Scrim.d.ts +1 -1
  111. package/build/esm/Dialog/Scrim.js.map +0 -0
  112. package/build/esm/Dialog/index.d.ts +0 -0
  113. package/build/esm/Dialog/index.js.map +0 -0
  114. package/build/esm/Dialog/useDialogAnimation.d.ts +0 -0
  115. package/build/esm/Dialog/useDialogAnimation.js.map +0 -0
  116. package/build/esm/Divider/Divider.d.ts +1 -1
  117. package/build/esm/Divider/Divider.js.map +0 -0
  118. package/build/esm/Divider/index.d.ts +0 -0
  119. package/build/esm/Divider/index.js.map +0 -0
  120. package/build/esm/FloatingLabel/FloatingLabel.d.ts +0 -1
  121. package/build/esm/FloatingLabel/FloatingLabel.js +1 -3
  122. package/build/esm/FloatingLabel/FloatingLabel.js.map +1 -1
  123. package/build/esm/FloatingLabel/index.d.ts +0 -0
  124. package/build/esm/FloatingLabel/index.js.map +0 -0
  125. package/build/esm/LineRipple/LineRipple.d.ts +1 -1
  126. package/build/esm/LineRipple/LineRipple.js.map +0 -0
  127. package/build/esm/LineRipple/index.d.ts +0 -0
  128. package/build/esm/LineRipple/index.js.map +0 -0
  129. package/build/esm/Link/Link.d.ts +1 -1
  130. package/build/esm/Link/Link.js.map +0 -0
  131. package/build/esm/Link/index.d.ts +0 -0
  132. package/build/esm/Link/index.js.map +0 -0
  133. package/build/esm/List/List.d.ts +1 -1
  134. package/build/esm/List/List.js.map +0 -0
  135. package/build/esm/List/index.d.ts +0 -0
  136. package/build/esm/List/index.js.map +0 -0
  137. package/build/esm/ListItem/ListItem.d.ts +1 -1
  138. package/build/esm/ListItem/ListItem.js +52 -33
  139. package/build/esm/ListItem/ListItem.js.map +1 -1
  140. package/build/esm/ListItem/ListItemText.d.ts +0 -0
  141. package/build/esm/ListItem/ListItemText.js +2 -7
  142. package/build/esm/ListItem/ListItemText.js.map +1 -1
  143. package/build/esm/ListItem/context.d.ts +0 -0
  144. package/build/esm/ListItem/context.js.map +0 -0
  145. package/build/esm/ListItem/index.d.ts +0 -0
  146. package/build/esm/ListItem/index.js.map +0 -0
  147. package/build/esm/Menu/Menu.d.ts +4 -4
  148. package/build/esm/Menu/Menu.js +2 -2
  149. package/build/esm/Menu/Menu.js.map +1 -1
  150. package/build/esm/Menu/animation.d.ts +0 -0
  151. package/build/esm/Menu/animation.js.map +0 -0
  152. package/build/esm/Menu/index.d.ts +0 -0
  153. package/build/esm/Menu/index.js.map +0 -0
  154. package/build/esm/NotchedOutline/NotchedOutline.d.ts +0 -0
  155. package/build/esm/NotchedOutline/NotchedOutline.js.map +0 -0
  156. package/build/esm/NotchedOutline/context.d.ts +0 -0
  157. package/build/esm/NotchedOutline/context.js.map +0 -0
  158. package/build/esm/NotchedOutline/index.d.ts +0 -0
  159. package/build/esm/NotchedOutline/index.js.map +0 -0
  160. package/build/esm/NotchedOutline/styledComponents.d.ts +96 -50
  161. package/build/esm/NotchedOutline/styledComponents.js +7 -7
  162. package/build/esm/NotchedOutline/styledComponents.js.map +1 -1
  163. package/build/esm/Paper/Paper.d.ts +1 -1
  164. package/build/esm/Paper/Paper.js +2 -2
  165. package/build/esm/Paper/Paper.js.map +1 -1
  166. package/build/esm/Paper/index.d.ts +0 -0
  167. package/build/esm/Paper/index.js.map +0 -0
  168. package/build/esm/ProgressSpinner/ProgressSpinner.d.ts +1 -1
  169. package/build/esm/ProgressSpinner/ProgressSpinner.js.map +0 -0
  170. package/build/esm/ProgressSpinner/index.d.ts +0 -0
  171. package/build/esm/ProgressSpinner/index.js.map +0 -0
  172. package/build/esm/RadioButton/RadioButton.d.ts +0 -0
  173. package/build/esm/RadioButton/RadioButton.js +1 -1
  174. package/build/esm/RadioButton/RadioButton.js.map +1 -1
  175. package/build/esm/RadioButton/RadioButtonIcon.d.ts +0 -0
  176. package/build/esm/RadioButton/RadioButtonIcon.js +2 -2
  177. package/build/esm/RadioButton/RadioButtonIcon.js.map +1 -1
  178. package/build/esm/RadioButton/RadioGroup.d.ts +1 -1
  179. package/build/esm/RadioButton/RadioGroup.js.map +0 -0
  180. package/build/esm/RadioButton/index.d.ts +0 -0
  181. package/build/esm/RadioButton/index.js.map +0 -0
  182. package/build/esm/Ripple/Ripple.d.ts +0 -0
  183. package/build/esm/Ripple/Ripple.js +2 -2
  184. package/build/esm/Ripple/Ripple.js.map +1 -1
  185. package/build/esm/Ripple/RippleBox.d.ts +0 -0
  186. package/build/esm/Ripple/RippleBox.js +1 -1
  187. package/build/esm/Ripple/RippleBox.js.map +1 -1
  188. package/build/esm/Ripple/constants.d.ts +0 -0
  189. package/build/esm/Ripple/constants.js.map +0 -0
  190. package/build/esm/Ripple/index.d.ts +0 -0
  191. package/build/esm/Ripple/index.js.map +0 -0
  192. package/build/esm/Ripple/keyframes.d.ts +0 -0
  193. package/build/esm/Ripple/keyframes.js.map +0 -0
  194. package/build/esm/Ripple/useRipple.d.ts +0 -0
  195. package/build/esm/Ripple/useRipple.js.map +0 -0
  196. package/build/esm/Ripple/useRippleHandlers.d.ts +0 -0
  197. package/build/esm/Ripple/useRippleHandlers.js.map +0 -0
  198. package/build/esm/Ripple/useRippleSurface.d.ts +5 -4
  199. package/build/esm/Ripple/useRippleSurface.js +30 -8
  200. package/build/esm/Ripple/useRippleSurface.js.map +1 -1
  201. package/build/esm/Select/Select.d.ts +3 -3
  202. package/build/esm/Select/Select.js +5 -14
  203. package/build/esm/Select/Select.js.map +1 -1
  204. package/build/esm/Select/SelectIcon.d.ts +1 -1
  205. package/build/esm/Select/SelectIcon.js +3 -1
  206. package/build/esm/Select/SelectIcon.js.map +1 -1
  207. package/build/esm/Select/context.d.ts +0 -0
  208. package/build/esm/Select/context.js.map +0 -0
  209. package/build/esm/Select/defaultRender.d.ts +0 -0
  210. package/build/esm/Select/defaultRender.js.map +0 -0
  211. package/build/esm/Select/index.d.ts +0 -0
  212. package/build/esm/Select/index.js.map +0 -0
  213. package/build/esm/Select/styledComponents.d.ts +0 -0
  214. package/build/esm/Select/styledComponents.js +9 -5
  215. package/build/esm/Select/styledComponents.js.map +1 -1
  216. package/build/esm/SelectItem/SelectItem.d.ts +1 -1
  217. package/build/esm/SelectItem/SelectItem.js.map +0 -0
  218. package/build/esm/SelectItem/index.d.ts +0 -0
  219. package/build/esm/SelectItem/index.js.map +0 -0
  220. package/build/esm/SelectionControl/SelectionControlLabel.d.ts +1 -1
  221. package/build/esm/SelectionControl/SelectionControlLabel.js.map +0 -0
  222. package/build/esm/SelectionControl/SelectionControlText.d.ts +1 -1
  223. package/build/esm/SelectionControl/SelectionControlText.js.map +0 -0
  224. package/build/esm/SelectionControl/index.d.ts +0 -0
  225. package/build/esm/SelectionControl/index.js.map +0 -0
  226. package/build/esm/Skeleton/DelayAppearance.d.ts +1 -1
  227. package/build/esm/Skeleton/DelayAppearance.js.map +0 -0
  228. package/build/esm/Skeleton/Skeleton.d.ts +1 -1
  229. package/build/esm/Skeleton/Skeleton.js.map +0 -0
  230. package/build/esm/Skeleton/animation.d.ts +0 -0
  231. package/build/esm/Skeleton/animation.js.map +0 -0
  232. package/build/esm/Skeleton/index.d.ts +0 -0
  233. package/build/esm/Skeleton/index.js.map +0 -0
  234. package/build/esm/Snackbar/Snackbar.d.ts +1 -1
  235. package/build/esm/Snackbar/Snackbar.js +4 -4
  236. package/build/esm/Snackbar/Snackbar.js.map +1 -1
  237. package/build/esm/Snackbar/Stack.d.ts +0 -0
  238. package/build/esm/Snackbar/Stack.js.map +0 -0
  239. package/build/esm/Snackbar/index.d.ts +0 -0
  240. package/build/esm/Snackbar/index.js.map +0 -0
  241. package/build/esm/Snackbar/useSnackbarAnimation.d.ts +0 -0
  242. package/build/esm/Snackbar/useSnackbarAnimation.js.map +0 -0
  243. package/build/esm/Switch/Switch.d.ts +1 -1
  244. package/build/esm/Switch/Switch.js +8 -6
  245. package/build/esm/Switch/Switch.js.map +1 -1
  246. package/build/esm/Switch/index.d.ts +0 -0
  247. package/build/esm/Switch/index.js.map +0 -0
  248. package/build/esm/Switch/styledComponents.d.ts +2 -2
  249. package/build/esm/Switch/styledComponents.js +54 -26
  250. package/build/esm/Switch/styledComponents.js.map +1 -1
  251. package/build/esm/Tab/Tab.d.ts +1 -1
  252. package/build/esm/Tab/Tab.js.map +0 -0
  253. package/build/esm/Tab/TabList.d.ts +1 -1
  254. package/build/esm/Tab/TabList.js.map +0 -0
  255. package/build/esm/Tab/TabPanel.d.ts +1 -1
  256. package/build/esm/Tab/TabPanel.js.map +0 -0
  257. package/build/esm/Tab/TabPanels.d.ts +0 -0
  258. package/build/esm/Tab/TabPanels.js.map +0 -0
  259. package/build/esm/Tab/Tabs.d.ts +0 -0
  260. package/build/esm/Tab/Tabs.js.map +0 -0
  261. package/build/esm/Tab/context.d.ts +0 -0
  262. package/build/esm/Tab/context.js.map +0 -0
  263. package/build/esm/Tab/index.d.ts +0 -0
  264. package/build/esm/Tab/index.js.map +0 -0
  265. package/build/esm/TabIndicator/TabIndicator.d.ts +1 -1
  266. package/build/esm/TabIndicator/TabIndicator.js.map +0 -0
  267. package/build/esm/TabIndicator/context.d.ts +0 -0
  268. package/build/esm/TabIndicator/context.js.map +0 -0
  269. package/build/esm/TabIndicator/index.d.ts +0 -0
  270. package/build/esm/TabIndicator/index.js.map +0 -0
  271. package/build/esm/Table/Table.d.ts +1 -1
  272. package/build/esm/Table/Table.js +1 -1
  273. package/build/esm/Table/Table.js.map +1 -1
  274. package/build/esm/Table/TableBody.d.ts +1 -1
  275. package/build/esm/Table/TableBody.js.map +0 -0
  276. package/build/esm/Table/TableCell.d.ts +1 -1
  277. package/build/esm/Table/TableCell.js.map +0 -0
  278. package/build/esm/Table/TableHead.d.ts +1 -1
  279. package/build/esm/Table/TableHead.js.map +0 -0
  280. package/build/esm/Table/TableRow.d.ts +1 -1
  281. package/build/esm/Table/TableRow.js.map +0 -0
  282. package/build/esm/Table/context.d.ts +0 -0
  283. package/build/esm/Table/context.js.map +0 -0
  284. package/build/esm/Table/index.d.ts +0 -0
  285. package/build/esm/Table/index.js.map +0 -0
  286. package/build/esm/Text/LoremIpsum.d.ts +4 -4
  287. package/build/esm/Text/LoremIpsum.js.map +1 -1
  288. package/build/esm/Text/Text.d.ts +1 -1
  289. package/build/esm/Text/Text.js.map +0 -0
  290. package/build/esm/Text/index.d.ts +0 -0
  291. package/build/esm/Text/index.js.map +0 -0
  292. package/build/esm/TextField/FilledContainer.d.ts +1 -1
  293. package/build/esm/TextField/FilledContainer.js +17 -10
  294. package/build/esm/TextField/FilledContainer.js.map +1 -1
  295. package/build/esm/TextField/HelperText.d.ts +1 -1
  296. package/build/esm/TextField/HelperText.js.map +0 -0
  297. package/build/esm/TextField/IconContainer.d.ts +2 -2
  298. package/build/esm/TextField/IconContainer.js +4 -2
  299. package/build/esm/TextField/IconContainer.js.map +1 -1
  300. package/build/esm/TextField/Input.d.ts +1 -1
  301. package/build/esm/TextField/Input.js +18 -10
  302. package/build/esm/TextField/Input.js.map +1 -1
  303. package/build/esm/TextField/OutlinedContainer.d.ts +1 -1
  304. package/build/esm/TextField/OutlinedContainer.js +7 -4
  305. package/build/esm/TextField/OutlinedContainer.js.map +1 -1
  306. package/build/esm/TextField/TextField.d.ts +1 -1
  307. package/build/esm/TextField/TextField.js +2 -2
  308. package/build/esm/TextField/TextField.js.map +1 -1
  309. package/build/esm/TextField/consts.d.ts +5 -0
  310. package/build/esm/TextField/consts.js +6 -0
  311. package/build/esm/TextField/consts.js.map +1 -0
  312. package/build/esm/TextField/index.d.ts +0 -0
  313. package/build/esm/TextField/index.js.map +0 -0
  314. package/build/esm/ThemeExplorer/ColorPicker.js +2 -2
  315. package/build/esm/ThemeExplorer/ColorPicker.js.map +1 -1
  316. package/build/esm/ThemeExplorer/TextFieldColorPicker.js +5 -5
  317. package/build/esm/ThemeExplorer/TextFieldColorPicker.js.map +1 -1
  318. package/build/esm/Tooltip/Tooltip.d.ts +1 -1
  319. package/build/esm/Tooltip/Tooltip.js.map +0 -0
  320. package/build/esm/Tooltip/index.d.ts +0 -0
  321. package/build/esm/Tooltip/index.js.map +0 -0
  322. package/build/esm/color.d.ts +2 -1
  323. package/build/esm/color.js +10 -6
  324. package/build/esm/color.js.map +1 -1
  325. package/build/esm/css.d.ts +0 -0
  326. package/build/esm/css.js.map +0 -0
  327. package/build/esm/hooks/useAnimation.d.ts +0 -0
  328. package/build/esm/hooks/useAnimation.js.map +0 -0
  329. package/build/esm/index.d.ts +0 -0
  330. package/build/esm/index.js.map +0 -0
  331. package/build/esm/theme/index.d.ts +0 -0
  332. package/build/esm/theme/index.js.map +0 -0
  333. package/build/esm/theme/theme.d.ts +96 -50
  334. package/build/esm/theme/theme.js +133 -93
  335. package/build/esm/theme/theme.js.map +1 -1
  336. package/build/esm/theme/typography-raleway.d.ts +0 -0
  337. package/build/esm/theme/typography-raleway.js.map +0 -0
  338. package/build/esm/theme/typography-roboto.d.ts +0 -0
  339. package/build/esm/theme/typography-roboto.js.map +0 -0
  340. package/build/esm/theme/useTheme.d.ts +471 -1
  341. package/build/esm/theme/useTheme.js.map +0 -0
  342. package/build/tsconfig.tsbuildinfo +1 -4757
  343. package/package.json +15 -14
  344. package/src/Alert/Alert.story.tsx +5 -6
  345. package/src/Alert/Alert.tsx +1 -1
  346. package/src/AppBar/AppBar.story.tsx +11 -20
  347. package/src/AppBar/AppBar.tsx +5 -6
  348. package/src/BottomSheet/BottomSheet.story.tsx +5 -6
  349. package/src/BottomSheet/BottomSheetSurface.tsx +1 -1
  350. package/src/Button/BaseButton.tsx +1 -0
  351. package/src/Button/Button.story.tsx +34 -47
  352. package/src/Button/Button.tsx +20 -6
  353. package/src/Button/ButtonGroup.story.tsx +106 -0
  354. package/src/Button/ButtonGroup.tsx +33 -0
  355. package/src/Button/FilledButton.tsx +38 -4
  356. package/src/Button/FloatingActionButton.tsx +9 -0
  357. package/src/Button/IconButton.tsx +1 -0
  358. package/src/Button/OutlinedButton.tsx +30 -2
  359. package/src/Button/SpinnerButton.story.tsx +7 -7
  360. package/src/Button/TransparentButton.tsx +32 -1
  361. package/src/Button/context.tsx +16 -0
  362. package/src/Button/index.ts +1 -0
  363. package/src/CheckBox/CheckBox.story.tsx +7 -6
  364. package/src/CheckBox/CheckBox.tsx +1 -1
  365. package/src/Chip/ButtonChip.tsx +42 -46
  366. package/src/Chip/Chip.story.tsx +98 -26
  367. package/src/Chip/ChipBase.tsx +40 -12
  368. package/src/Chip/ChoiceChip.tsx +18 -17
  369. package/src/Combobox/Combobox.story.tsx +12 -13
  370. package/src/Combobox/Combobox.tsx +2 -1
  371. package/src/Dialog/Dialog.story.tsx +7 -8
  372. package/src/Dialog/DialogSurface.tsx +20 -5
  373. package/src/Divider/Divider.story.tsx +6 -5
  374. package/src/FloatingLabel/FloatingLabel.story.tsx +10 -9
  375. package/src/FloatingLabel/FloatingLabel.tsx +0 -3
  376. package/src/LineRipple/LineRipple.story.tsx +5 -4
  377. package/src/Link/Link.story.tsx +3 -4
  378. package/src/ListItem/ListItem.story.tsx +6 -5
  379. package/src/ListItem/ListItem.tsx +55 -32
  380. package/src/ListItem/ListItemText.tsx +2 -4
  381. package/src/Menu/Menu.story.tsx +8 -7
  382. package/src/Menu/Menu.tsx +2 -2
  383. package/src/NotchedOutline/NotchedOutline.story.tsx +6 -5
  384. package/src/NotchedOutline/styledComponents.ts +6 -6
  385. package/src/Paper/Paper.story.tsx +21 -7
  386. package/src/Paper/Paper.tsx +6 -2
  387. package/src/ProgressSpinner/ProgressSpinner.story.tsx +5 -4
  388. package/src/RadioButton/RadioButton.story.tsx +12 -10
  389. package/src/RadioButton/RadioButton.tsx +1 -1
  390. package/src/RadioButton/RadioButtonIcon.tsx +2 -2
  391. package/src/Ripple/Ripple.story.tsx +6 -5
  392. package/src/Ripple/Ripple.tsx +1 -1
  393. package/src/Ripple/RippleBox.tsx +1 -0
  394. package/src/Ripple/useRippleSurface.ts +31 -7
  395. package/src/Select/PaymentMethodSelect.story.tsx +321 -0
  396. package/src/Select/Select.story.tsx +34 -8
  397. package/src/Select/Select.tsx +12 -34
  398. package/src/Select/SelectIcon.tsx +2 -1
  399. package/src/Select/styledComponents.tsx +8 -4
  400. package/src/Skeleton/Skeleton.story.tsx +9 -8
  401. package/src/Snackbar/Snackbar.story.tsx +7 -6
  402. package/src/Snackbar/Snackbar.tsx +4 -4
  403. package/src/Switch/Switch.story.tsx +5 -4
  404. package/src/Switch/Switch.tsx +7 -6
  405. package/src/Switch/styledComponents.tsx +69 -22
  406. package/src/Tab/Tab.story.tsx +7 -5
  407. package/src/Table/Table.story.tsx +5 -4
  408. package/src/Table/Table.tsx +1 -1
  409. package/src/Text/LoremIpsum.tsx +3 -1
  410. package/src/Text/Text.story.tsx +5 -4
  411. package/src/TextField/FilledContainer.tsx +30 -10
  412. package/src/TextField/IconContainer.tsx +5 -4
  413. package/src/TextField/Input.tsx +33 -10
  414. package/src/TextField/OutlinedContainer.tsx +18 -4
  415. package/src/TextField/TextField.story.tsx +21 -7
  416. package/src/TextField/TextField.tsx +2 -2
  417. package/src/TextField/consts.ts +7 -0
  418. package/src/ThemeExplorer/ColorPicker.tsx +101 -0
  419. package/src/ThemeExplorer/TextFieldColorPicker.tsx +112 -0
  420. package/src/ThemeExplorer/ThemeBuilder.story.tsx +169 -0
  421. package/src/ThemeExplorer/ThemeColors.tsx +88 -0
  422. package/src/ThemeExplorer/ThemeExplorer.story.tsx +42 -0
  423. package/src/ThemeExplorer/components.tsx +208 -0
  424. package/src/ThemeExplorer/makeColorScheme.tsx +73 -0
  425. package/src/ThemeExplorer/useDeferredColor.tsx +24 -0
  426. package/src/ThemeExplorer/useLocalStorageCachedState.ts +18 -0
  427. package/src/Tooltip/Tooltip.story.tsx +5 -4
  428. package/src/color.ts +18 -13
  429. package/src/theme/theme.ts +131 -92
  430. package/src/ListItem/context.ts +0 -13
@@ -1,6 +1,6 @@
1
1
  import type * as React from 'react';
2
2
  import { BaseButtonProps } from './BaseButton';
3
- export declare type ButtonVariants = 'text' | 'outlined' | 'filled' | 'fab' | 'fab-mini' | 'fab-extended' | 'icon';
3
+ export declare type ButtonVariants = 'text' | 'outlined' | 'filled' | 'fab' | 'fab-mini' | 'fab-large' | 'fab-extended' | 'icon';
4
4
  export declare type ButtonColors = 'primary' | 'secondary' | string;
5
5
  export interface ButtonProps extends BaseButtonProps {
6
6
  as?: React.ElementType<any>;
@@ -8,6 +8,6 @@ export interface ButtonProps extends BaseButtonProps {
8
8
  variant?: ButtonVariants;
9
9
  color?: ButtonColors;
10
10
  disabled?: boolean;
11
- elevation?: 'none' | 'contained' | 'floating';
11
+ elevation?: 'none' | 'default' | 'contained' | 'floating' | 'elevated';
12
12
  }
13
- export declare const Button: React.ForwardRefExoticComponent<Pick<ButtonProps, "children" | "form" | "p" | "slot" | "style" | "title" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "disabled" | "type" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "elevation"> & React.RefAttributes<HTMLButtonElement>>;
13
+ export declare const Button: React.ForwardRefExoticComponent<Pick<ButtonProps, "bottom" | "top" | "hidden" | "left" | "right" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "margin" | "mt" | "marginTop" | "mr" | "marginRight" | "mb" | "marginBottom" | "ml" | "marginLeft" | "mx" | "marginX" | "my" | "marginY" | "p" | "padding" | "pt" | "paddingTop" | "pr" | "paddingRight" | "pb" | "paddingBottom" | "pl" | "paddingLeft" | "px" | "paddingX" | "py" | "paddingY" | "width" | "height" | "minWidth" | "minHeight" | "maxWidth" | "maxHeight" | "display" | "verticalAlign" | "size" | "overflow" | "overflowX" | "overflowY" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "letterSpacing" | "fontStyle" | "textAlign" | "color" | "bg" | "backgroundColor" | "opacity" | "alignItems" | "alignContent" | "justifyItems" | "justifyContent" | "flexWrap" | "flexDirection" | "flex" | "flexGrow" | "flexShrink" | "flexBasis" | "justifySelf" | "alignSelf" | "order" | "border" | "borderX" | "borderY" | "borderWidth" | "borderTopWidth" | "borderBottomWidth" | "borderLeftWidth" | "borderRightWidth" | "borderStyle" | "borderTopStyle" | "borderBottomStyle" | "borderLeftStyle" | "borderRightStyle" | "borderColor" | "borderTopColor" | "borderBottomColor" | "borderLeftColor" | "borderRightColor" | "borderRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "gridGap" | "gridColumnGap" | "gridRowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "background" | "backgroundImage" | "backgroundSize" | "backgroundPosition" | "backgroundRepeat" | "position" | "zIndex" | "boxShadow" | "textShadow" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "elevation" | "isGroupedButton" | "key"> & React.RefAttributes<HTMLButtonElement>>;
@@ -2,39 +2,54 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
3
3
  import { forwardRef } from 'react';
4
4
  import * as TransparentButton from './TransparentButton';
5
+ import * as FloatingActionButton from './FloatingActionButton';
5
6
  import * as FilledButton from './FilledButton';
6
7
  import * as OutlinedButton from './OutlinedButton';
7
8
  import * as IconButton from './IconButton';
8
9
  import { useTheme } from '../theme';
9
10
  import { useRippleSurface } from '../Ripple';
11
+ import { useButtonGroupContext } from './context';
10
12
  import { jsx as _jsx } from "react/jsx-runtime";
11
13
  const componentMapping = {
12
14
  text: TransparentButton.TransparentButton,
13
15
  outlined: OutlinedButton.OutlinedButton,
14
16
  filled: FilledButton.FilledButton,
15
17
  fab: FilledButton.FilledButton,
16
- 'fab-extended': FilledButton.FilledButton,
17
18
  'fab-mini': FilledButton.FilledButton,
19
+ 'fab-large': FilledButton.FilledButton,
20
+ 'fab-extended': FilledButton.FilledButton,
18
21
  icon: TransparentButton.TransparentButton
19
22
  };
20
23
  const rippleMapping = {
21
24
  text: TransparentButton.getRippleProperties,
22
25
  outlined: TransparentButton.getRippleProperties,
23
26
  filled: FilledButton.getRippleProperties,
24
- fab: FilledButton.getRippleProperties,
27
+ fab: FloatingActionButton.getRippleProperties,
28
+ 'fab-mini': FloatingActionButton.getRippleProperties,
29
+ 'fab-large': FloatingActionButton.getRippleProperties,
25
30
  'fab-extended': FilledButton.getRippleProperties,
26
- 'fab-mini': FilledButton.getRippleProperties,
27
31
  icon: IconButton.getRippleProperties
28
32
  };
33
+
34
+ function getFallbackElevation(variant = 'text') {
35
+ if (variant === 'text' || variant === 'outlined' || variant === 'icon') {
36
+ return 'none';
37
+ }
38
+
39
+ return 'default';
40
+ }
41
+
29
42
  export const Button = /*#__PURE__*/forwardRef(function Button(props, forwardedRef) {
43
+ const buttonGroup = useButtonGroupContext();
44
+
30
45
  const {
31
46
  children,
32
- variant = 'text',
47
+ variant = (buttonGroup == null ? void 0 : buttonGroup.variant) || 'text',
33
48
  onPointerDown: onPointerDownProp,
34
49
  onKeyDown: onKeyDownProp,
35
50
  color = 'primary',
36
51
  disabled = false,
37
- elevation = 'none',
52
+ elevation = getFallbackElevation(props.variant),
38
53
  style: styleProp
39
54
  } = props,
40
55
  otherProps = _objectWithoutPropertiesLoose(props, ["children", "variant", "onPointerDown", "onKeyDown", "color", "disabled", "elevation", "style"]);
@@ -56,7 +71,8 @@ export const Button = /*#__PURE__*/forwardRef(function Button(props, forwardedRe
56
71
  disabled: disabled,
57
72
  "aria-disabled": disabled ? 'true' : undefined,
58
73
  color: color,
59
- elevation: elevation
74
+ elevation: elevation,
75
+ isGroupedButton: Boolean(buttonGroup)
60
76
  }, rippleProps, otherProps, {
61
77
  children: children
62
78
  }));
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Button/Button.tsx"],"names":["forwardRef","TransparentButton","FilledButton","OutlinedButton","IconButton","useTheme","useRippleSurface","componentMapping","text","outlined","filled","fab","icon","rippleMapping","getRippleProperties","Button","props","forwardedRef","children","variant","onPointerDown","onPointerDownProp","onKeyDown","onKeyDownProp","color","disabled","elevation","style","styleProp","otherProps","theme","Comp","rippleProps","rippleColor","undefined"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,OAAO,KAAKC,iBAAZ,MAAmC,qBAAnC;AACA,OAAO,KAAKC,YAAZ,MAA8B,gBAA9B;AACA,OAAO,KAAKC,cAAZ,MAAgC,kBAAhC;AACA,OAAO,KAAKC,UAAZ,MAA4B,cAA5B;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,SAASC,gBAAT,QAAiC,WAAjC;;AAYA,MAAMC,gBAAgB,GAAG;AACvBC,EAAAA,IAAI,EAAEP,iBAAiB,CAACA,iBADD;AAEvBQ,EAAAA,QAAQ,EAAEN,cAAc,CAACA,cAFF;AAGvBO,EAAAA,MAAM,EAAER,YAAY,CAACA,YAHE;AAIvBS,EAAAA,GAAG,EAAET,YAAY,CAACA,YAJK;AAKvB,kBAAgBA,YAAY,CAACA,YALN;AAMvB,cAAYA,YAAY,CAACA,YANF;AAOvBU,EAAAA,IAAI,EAAEX,iBAAiB,CAACA;AAPD,CAAzB;AAUA,MAAMY,aAAa,GAAG;AACpBL,EAAAA,IAAI,EAAEP,iBAAiB,CAACa,mBADJ;AAEpBL,EAAAA,QAAQ,EAAER,iBAAiB,CAACa,mBAFR;AAGpBJ,EAAAA,MAAM,EAAER,YAAY,CAACY,mBAHD;AAIpBH,EAAAA,GAAG,EAAET,YAAY,CAACY,mBAJE;AAKpB,kBAAgBZ,YAAY,CAACY,mBALT;AAMpB,cAAYZ,YAAY,CAACY,mBANL;AAOpBF,EAAAA,IAAI,EAAER,UAAU,CAACU;AAPG,CAAtB;AAqBA,OAAO,MAAMC,MAAM,gBAAGf,UAAU,CAC9B,SAASe,MAAT,CAAgBC,KAAhB,EAAuBC,YAAvB,EAAqC;AACnC,QAAM;AACJC,IAAAA,QADI;AAEJC,IAAAA,OAAO,GAAG,MAFN;AAGJC,IAAAA,aAAa,EAAEC,iBAHX;AAIJC,IAAAA,SAAS,EAAEC,aAJP;AAKJC,IAAAA,KAAK,GAAG,SALJ;AAMJC,IAAAA,QAAQ,GAAG,KANP;AAOJC,IAAAA,SAAS,GAAG,MAPR;AAQJC,IAAAA,KAAK,EAAEC;AARH,MAUFZ,KAVJ;AAAA,QASKa,UATL,iCAUIb,KAVJ;;AAYA,QAAMc,KAAK,GAAGzB,QAAQ,EAAtB;AAEA,QAAM0B,IAA8B,GAAGxB,gBAAgB,CAACY,OAAD,CAAvD;AACA,QAAML,mBAAmB,GAAGD,aAAa,CAACM,OAAD,CAAzC;AAEA,QAAMa,WAAW,GAAG1B,gBAAgB,cAC/BQ,mBAAmB,CAACgB,KAAD,CADY;AAElCG,IAAAA,WAAW,EAAE,cAFqB;AAGlCR,IAAAA,QAHkC;AAIlCE,IAAAA,KAAK,EAAEC,SAJ2B;AAKlCN,IAAAA,SAAS,EAAEC,aALuB;AAMlCH,IAAAA,aAAa,EAAEC;AANmB,KAApC;AASA,sBACE,KAAC,IAAD;AACE,IAAA,GAAG,EAAEJ,YADP;AAEE,IAAA,OAAO,EAAEE,OAFX;AAGE,IAAA,KAAK,EAAEW,KAHT;AAIE,IAAA,QAAQ,EAAEL,QAJZ;AAKE,qBAAeA,QAAQ,GAAG,MAAH,GAAYS,SALrC;AAME,IAAA,KAAK,EAAEV,KANT;AAOE,IAAA,SAAS,EAAEE;AAPb,KAQMM,WARN,EASMH,UATN;AAAA,cAWGX;AAXH,KADF;AAeD,CA3C6B,CAAzB","sourcesContent":["import { forwardRef } from 'react';\nimport type * as React from 'react';\nimport * as TransparentButton from './TransparentButton';\nimport * as FilledButton from './FilledButton';\nimport * as OutlinedButton from './OutlinedButton';\nimport * as IconButton from './IconButton';\nimport { useTheme } from '../theme';\nimport { useRippleSurface } from '../Ripple';\nimport { BaseButtonProps } from './BaseButton';\n\nexport type ButtonVariants =\n | 'text'\n | 'outlined'\n | 'filled'\n | 'fab'\n | 'fab-mini'\n | 'fab-extended'\n | 'icon';\n\nconst componentMapping = {\n text: TransparentButton.TransparentButton,\n outlined: OutlinedButton.OutlinedButton,\n filled: FilledButton.FilledButton,\n fab: FilledButton.FilledButton,\n 'fab-extended': FilledButton.FilledButton,\n 'fab-mini': FilledButton.FilledButton,\n icon: TransparentButton.TransparentButton,\n};\n\nconst rippleMapping = {\n text: TransparentButton.getRippleProperties,\n outlined: TransparentButton.getRippleProperties,\n filled: FilledButton.getRippleProperties,\n fab: FilledButton.getRippleProperties,\n 'fab-extended': FilledButton.getRippleProperties,\n 'fab-mini': FilledButton.getRippleProperties,\n icon: IconButton.getRippleProperties,\n};\n\nexport type ButtonColors = 'primary' | 'secondary' | string;\n\nexport interface ButtonProps extends BaseButtonProps {\n as?: React.ElementType<any>;\n children?: React.ReactNode;\n variant?: ButtonVariants;\n color?: ButtonColors;\n disabled?: boolean;\n elevation?: 'none' | 'contained' | 'floating';\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(props, forwardedRef) {\n const {\n children,\n variant = 'text',\n onPointerDown: onPointerDownProp,\n onKeyDown: onKeyDownProp,\n color = 'primary',\n disabled = false,\n elevation = 'none',\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const Comp: React.ComponentType<any> = componentMapping[variant];\n const getRippleProperties = rippleMapping[variant];\n\n const rippleProps = useRippleSurface({\n ...getRippleProperties(theme),\n rippleColor: 'currentColor',\n disabled,\n style: styleProp,\n onKeyDown: onKeyDownProp,\n onPointerDown: onPointerDownProp,\n });\n\n return (\n <Comp\n ref={forwardedRef}\n variant={variant}\n theme={theme}\n disabled={disabled}\n aria-disabled={disabled ? 'true' : undefined}\n color={color}\n elevation={elevation}\n {...rippleProps}\n {...otherProps}\n >\n {children}\n </Comp>\n );\n }\n);\n"],"file":"Button.js"}
1
+ {"version":3,"sources":["../../../src/Button/Button.tsx"],"names":["forwardRef","TransparentButton","FloatingActionButton","FilledButton","OutlinedButton","IconButton","useTheme","useRippleSurface","useButtonGroupContext","componentMapping","text","outlined","filled","fab","icon","rippleMapping","getRippleProperties","getFallbackElevation","variant","Button","props","forwardedRef","buttonGroup","children","onPointerDown","onPointerDownProp","onKeyDown","onKeyDownProp","color","disabled","elevation","style","styleProp","otherProps","theme","Comp","rippleProps","rippleColor","undefined","Boolean"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,OAAO,KAAKC,iBAAZ,MAAmC,qBAAnC;AACA,OAAO,KAAKC,oBAAZ,MAAsC,wBAAtC;AACA,OAAO,KAAKC,YAAZ,MAA8B,gBAA9B;AACA,OAAO,KAAKC,cAAZ,MAAgC,kBAAhC;AACA,OAAO,KAAKC,UAAZ,MAA4B,cAA5B;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,SAASC,gBAAT,QAAiC,WAAjC;AAEA,SAASC,qBAAT,QAAsC,WAAtC;;AAYA,MAAMC,gBAAgB,GAAG;AACvBC,EAAAA,IAAI,EAAET,iBAAiB,CAACA,iBADD;AAEvBU,EAAAA,QAAQ,EAAEP,cAAc,CAACA,cAFF;AAGvBQ,EAAAA,MAAM,EAAET,YAAY,CAACA,YAHE;AAIvBU,EAAAA,GAAG,EAAEV,YAAY,CAACA,YAJK;AAKvB,cAAYA,YAAY,CAACA,YALF;AAMvB,eAAaA,YAAY,CAACA,YANH;AAOvB,kBAAgBA,YAAY,CAACA,YAPN;AAQvBW,EAAAA,IAAI,EAAEb,iBAAiB,CAACA;AARD,CAAzB;AAWA,MAAMc,aAAa,GAAG;AACpBL,EAAAA,IAAI,EAAET,iBAAiB,CAACe,mBADJ;AAEpBL,EAAAA,QAAQ,EAAEV,iBAAiB,CAACe,mBAFR;AAGpBJ,EAAAA,MAAM,EAAET,YAAY,CAACa,mBAHD;AAIpBH,EAAAA,GAAG,EAAEX,oBAAoB,CAACc,mBAJN;AAKpB,cAAYd,oBAAoB,CAACc,mBALb;AAMpB,eAAad,oBAAoB,CAACc,mBANd;AAOpB,kBAAgBb,YAAY,CAACa,mBAPT;AAQpBF,EAAAA,IAAI,EAAET,UAAU,CAACW;AARG,CAAtB;;AAsBA,SAASC,oBAAT,CAA8BC,OAAuB,GAAG,MAAxD,EAAgE;AAC9D,MAAIA,OAAO,KAAK,MAAZ,IAAsBA,OAAO,KAAK,UAAlC,IAAgDA,OAAO,KAAK,MAAhE,EAAwE;AACtE,WAAO,MAAP;AACD;;AACD,SAAO,SAAP;AACD;;AAED,OAAO,MAAMC,MAAM,gBAAGnB,UAAU,CAC9B,SAASmB,MAAT,CAAgBC,KAAhB,EAAuBC,YAAvB,EAAqC;AACnC,QAAMC,WAAW,GAAGd,qBAAqB,EAAzC;;AACA,QAAM;AACJe,IAAAA,QADI;AAEJL,IAAAA,OAAO,GAAG,CAAAI,WAAW,QAAX,YAAAA,WAAW,CAAEJ,OAAb,KAAwB,MAF9B;AAGJM,IAAAA,aAAa,EAAEC,iBAHX;AAIJC,IAAAA,SAAS,EAAEC,aAJP;AAKJC,IAAAA,KAAK,GAAG,SALJ;AAMJC,IAAAA,QAAQ,GAAG,KANP;AAOJC,IAAAA,SAAS,GAAGb,oBAAoB,CAACG,KAAK,CAACF,OAAP,CAP5B;AAQJa,IAAAA,KAAK,EAAEC;AARH,MAUFZ,KAVJ;AAAA,QASKa,UATL,iCAUIb,KAVJ;;AAYA,QAAMc,KAAK,GAAG5B,QAAQ,EAAtB;AAEA,QAAM6B,IAA8B,GAAG1B,gBAAgB,CAACS,OAAD,CAAvD;AACA,QAAMF,mBAAmB,GAAGD,aAAa,CAACG,OAAD,CAAzC;AAEA,QAAMkB,WAAW,GAAG7B,gBAAgB,cAC/BS,mBAAmB,CAACkB,KAAD,CADY;AAElCG,IAAAA,WAAW,EAAE,cAFqB;AAGlCR,IAAAA,QAHkC;AAIlCE,IAAAA,KAAK,EAAEC,SAJ2B;AAKlCN,IAAAA,SAAS,EAAEC,aALuB;AAMlCH,IAAAA,aAAa,EAAEC;AANmB,KAApC;AASA,sBACE,KAAC,IAAD;AACE,IAAA,GAAG,EAAEJ,YADP;AAEE,IAAA,OAAO,EAAEH,OAFX;AAGE,IAAA,KAAK,EAAEgB,KAHT;AAIE,IAAA,QAAQ,EAAEL,QAJZ;AAKE,qBAAeA,QAAQ,GAAG,MAAH,GAAYS,SALrC;AAME,IAAA,KAAK,EAAEV,KANT;AAOE,IAAA,SAAS,EAAEE,SAPb;AAQE,IAAA,eAAe,EAAES,OAAO,CAACjB,WAAD;AAR1B,KASMc,WATN,EAUMH,UAVN;AAAA,cAYGV;AAZH,KADF;AAgBD,CA7C6B,CAAzB","sourcesContent":["import { forwardRef } from 'react';\nimport type * as React from 'react';\nimport * as TransparentButton from './TransparentButton';\nimport * as FloatingActionButton from './FloatingActionButton';\nimport * as FilledButton from './FilledButton';\nimport * as OutlinedButton from './OutlinedButton';\nimport * as IconButton from './IconButton';\nimport { useTheme } from '../theme';\nimport { useRippleSurface } from '../Ripple';\nimport { BaseButtonProps } from './BaseButton';\nimport { useButtonGroupContext } from './context';\n\nexport type ButtonVariants =\n | 'text'\n | 'outlined'\n | 'filled'\n | 'fab'\n | 'fab-mini'\n | 'fab-large'\n | 'fab-extended'\n | 'icon';\n\nconst componentMapping = {\n text: TransparentButton.TransparentButton,\n outlined: OutlinedButton.OutlinedButton,\n filled: FilledButton.FilledButton,\n fab: FilledButton.FilledButton,\n 'fab-mini': FilledButton.FilledButton,\n 'fab-large': FilledButton.FilledButton,\n 'fab-extended': FilledButton.FilledButton,\n icon: TransparentButton.TransparentButton,\n};\n\nconst rippleMapping = {\n text: TransparentButton.getRippleProperties,\n outlined: TransparentButton.getRippleProperties,\n filled: FilledButton.getRippleProperties,\n fab: FloatingActionButton.getRippleProperties,\n 'fab-mini': FloatingActionButton.getRippleProperties,\n 'fab-large': FloatingActionButton.getRippleProperties,\n 'fab-extended': FilledButton.getRippleProperties,\n icon: IconButton.getRippleProperties,\n};\n\nexport type ButtonColors = 'primary' | 'secondary' | string;\n\nexport interface ButtonProps extends BaseButtonProps {\n as?: React.ElementType<any>;\n children?: React.ReactNode;\n variant?: ButtonVariants;\n color?: ButtonColors;\n disabled?: boolean;\n elevation?: 'none' | 'default' | 'contained' | 'floating' | 'elevated';\n}\n\nfunction getFallbackElevation(variant: ButtonVariants = 'text') {\n if (variant === 'text' || variant === 'outlined' || variant === 'icon') {\n return 'none';\n }\n return 'default';\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(props, forwardedRef) {\n const buttonGroup = useButtonGroupContext();\n const {\n children,\n variant = buttonGroup?.variant || 'text',\n onPointerDown: onPointerDownProp,\n onKeyDown: onKeyDownProp,\n color = 'primary',\n disabled = false,\n elevation = getFallbackElevation(props.variant),\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const Comp: React.ComponentType<any> = componentMapping[variant];\n const getRippleProperties = rippleMapping[variant];\n\n const rippleProps = useRippleSurface({\n ...getRippleProperties(theme),\n rippleColor: 'currentColor',\n disabled,\n style: styleProp,\n onKeyDown: onKeyDownProp,\n onPointerDown: onPointerDownProp,\n });\n\n return (\n <Comp\n ref={forwardedRef}\n variant={variant}\n theme={theme}\n disabled={disabled}\n aria-disabled={disabled ? 'true' : undefined}\n color={color}\n elevation={elevation}\n isGroupedButton={Boolean(buttonGroup)}\n {...rippleProps}\n {...otherProps}\n >\n {children}\n </Comp>\n );\n }\n);\n"],"file":"Button.js"}
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import { ButtonProps } from './Button';
3
+ import { ButtonGroupContextProps } from './context';
4
+ export declare type ButtonGroupProps = ButtonProps & ButtonGroupContextProps;
5
+ export declare const ButtonGroup: React.ForwardRefExoticComponent<Pick<ButtonGroupProps, "bottom" | "top" | "hidden" | "left" | "right" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "margin" | "mt" | "marginTop" | "mr" | "marginRight" | "mb" | "marginBottom" | "ml" | "marginLeft" | "mx" | "marginX" | "my" | "marginY" | "p" | "padding" | "pt" | "paddingTop" | "pr" | "paddingRight" | "pb" | "paddingBottom" | "pl" | "paddingLeft" | "px" | "paddingX" | "py" | "paddingY" | "width" | "height" | "minWidth" | "minHeight" | "maxWidth" | "maxHeight" | "display" | "verticalAlign" | "size" | "overflow" | "overflowX" | "overflowY" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "letterSpacing" | "fontStyle" | "textAlign" | "color" | "bg" | "backgroundColor" | "opacity" | "alignItems" | "alignContent" | "justifyItems" | "justifyContent" | "flexWrap" | "flexDirection" | "flex" | "flexGrow" | "flexShrink" | "flexBasis" | "justifySelf" | "alignSelf" | "order" | "border" | "borderX" | "borderY" | "borderWidth" | "borderTopWidth" | "borderBottomWidth" | "borderLeftWidth" | "borderRightWidth" | "borderStyle" | "borderTopStyle" | "borderBottomStyle" | "borderLeftStyle" | "borderRightStyle" | "borderColor" | "borderTopColor" | "borderBottomColor" | "borderLeftColor" | "borderRightColor" | "borderRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "gridGap" | "gridColumnGap" | "gridRowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "background" | "backgroundImage" | "backgroundSize" | "backgroundPosition" | "backgroundRepeat" | "position" | "zIndex" | "boxShadow" | "textShadow" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "elevation" | "isGroupedButton" | "key" | "direction"> & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,28 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
3
+ import React, { forwardRef, useMemo } from 'react';
4
+ import { ButtonGroupContext } from './context';
5
+ import { jsx as _jsx } from "react/jsx-runtime";
6
+ export const ButtonGroup = /*#__PURE__*/forwardRef(function ButtonGroup(props, forwardedRef) {
7
+ const {
8
+ as: Comp = 'div',
9
+ variant = 'text',
10
+ direction = 'row'
11
+ } = props,
12
+ otherProps = _objectWithoutPropertiesLoose(props, ["as", "variant", "direction"]);
13
+
14
+ const value = useMemo(() => ({
15
+ direction,
16
+ variant
17
+ }), [direction, variant]);
18
+ return /*#__PURE__*/_jsx(ButtonGroupContext.Provider, {
19
+ value: value,
20
+ children: /*#__PURE__*/_jsx(Comp, _extends({
21
+ ref: forwardedRef,
22
+ role: "group",
23
+ "data-button-group": "",
24
+ "data-button-group-direction": direction
25
+ }, otherProps))
26
+ });
27
+ });
28
+ //# sourceMappingURL=ButtonGroup.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/Button/ButtonGroup.tsx"],"names":["React","forwardRef","useMemo","ButtonGroupContext","ButtonGroup","props","forwardedRef","as","Comp","variant","direction","otherProps","value"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,EAA4BC,OAA5B,QAA2C,OAA3C;AAEA,SAASC,kBAAT,QAA4D,WAA5D;;AAIA,OAAO,MAAMC,WAAW,gBAAGH,UAAU,CACnC,SAASG,WAAT,CAAqBC,KAArB,EAA4BC,YAA5B,EAA0C;AACxC,QAAM;AACJC,IAAAA,EAAE,EAAEC,IAAI,GAAG,KADP;AAEJC,IAAAA,OAAO,GAAG,MAFN;AAGJC,IAAAA,SAAS,GAAG;AAHR,MAKFL,KALJ;AAAA,QAIKM,UAJL,iCAKIN,KALJ;;AAOA,QAAMO,KAA8B,GAAGV,OAAO,CAC5C,OAAO;AAAEQ,IAAAA,SAAF;AAAaD,IAAAA;AAAb,GAAP,CAD4C,EAE5C,CAACC,SAAD,EAAYD,OAAZ,CAF4C,CAA9C;AAKA,sBACE,KAAC,kBAAD,CAAoB,QAApB;AAA6B,IAAA,KAAK,EAAEG,KAApC;AAAA,2BACE,KAAC,IAAD;AACE,MAAA,GAAG,EAAEN,YADP;AAEE,MAAA,IAAI,EAAC,OAFP;AAGE,2BAAkB,EAHpB;AAIE,qCAA6BI;AAJ/B,OAKMC,UALN;AADF,IADF;AAWD,CAzBkC,CAA9B","sourcesContent":["import React, { forwardRef, useMemo } from 'react';\nimport { ButtonProps } from './Button';\nimport { ButtonGroupContext, ButtonGroupContextProps } from './context';\n\nexport type ButtonGroupProps = ButtonProps & ButtonGroupContextProps;\n\nexport const ButtonGroup = forwardRef<HTMLDivElement, ButtonGroupProps>(\n function ButtonGroup(props, forwardedRef) {\n const {\n as: Comp = 'div',\n variant = 'text',\n direction = 'row',\n ...otherProps\n } = props;\n\n const value: ButtonGroupContextProps = useMemo(\n () => ({ direction, variant }),\n [direction, variant]\n );\n\n return (\n <ButtonGroupContext.Provider value={value}>\n <Comp\n ref={forwardedRef}\n role=\"group\"\n data-button-group=\"\"\n data-button-group-direction={direction}\n {...otherProps}\n />\n </ButtonGroupContext.Provider>\n );\n }\n);\n"],"file":"ButtonGroup.js"}
@@ -1,10 +1,11 @@
1
1
  /// <reference types="react" />
2
2
  import { Theme } from '../theme';
3
- export declare const FilledButton: import("@emotion/styled").StyledComponent<Pick<import("./BaseButton").BaseButtonProps, "children" | "form" | "p" | "slot" | "style" | "title" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "disabled" | "type" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "elevation"> & import("react").RefAttributes<HTMLButtonElement> & {
3
+ export declare const FilledButton: import("@emotion/styled").StyledComponent<Pick<import("./BaseButton").BaseButtonProps, "bottom" | "top" | "hidden" | "left" | "right" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "margin" | "mt" | "marginTop" | "mr" | "marginRight" | "mb" | "marginBottom" | "ml" | "marginLeft" | "mx" | "marginX" | "my" | "marginY" | "p" | "padding" | "pt" | "paddingTop" | "pr" | "paddingRight" | "pb" | "paddingBottom" | "pl" | "paddingLeft" | "px" | "paddingX" | "py" | "paddingY" | "width" | "height" | "minWidth" | "minHeight" | "maxWidth" | "maxHeight" | "display" | "verticalAlign" | "size" | "overflow" | "overflowX" | "overflowY" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "letterSpacing" | "fontStyle" | "textAlign" | "color" | "bg" | "backgroundColor" | "opacity" | "alignItems" | "alignContent" | "justifyItems" | "justifyContent" | "flexWrap" | "flexDirection" | "flex" | "flexGrow" | "flexShrink" | "flexBasis" | "justifySelf" | "alignSelf" | "order" | "border" | "borderX" | "borderY" | "borderWidth" | "borderTopWidth" | "borderBottomWidth" | "borderLeftWidth" | "borderRightWidth" | "borderStyle" | "borderTopStyle" | "borderBottomStyle" | "borderLeftStyle" | "borderRightStyle" | "borderColor" | "borderTopColor" | "borderBottomColor" | "borderLeftColor" | "borderRightColor" | "borderRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "gridGap" | "gridColumnGap" | "gridRowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "background" | "backgroundImage" | "backgroundSize" | "backgroundPosition" | "backgroundRepeat" | "position" | "zIndex" | "boxShadow" | "textShadow" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "elevation" | "isGroupedButton" | "key"> & import("react").RefAttributes<HTMLButtonElement> & {
4
4
  theme?: import("@emotion/react").Theme | undefined;
5
5
  }, {}, {}>;
6
6
  export declare function getRippleProperties(theme: Theme): {
7
7
  hoverOpacity: any;
8
8
  focusOpacity: any;
9
9
  pressedOpacity: any;
10
+ rippleEnabled: boolean;
10
11
  };
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import _styled from "@emotion/styled/base";
3
3
  import { readableColor } from 'polished';
4
4
  import { BaseButton } from './BaseButton';
5
- import { alpha, getDarkThemeBackgroundOverlay } from '../color';
5
+ import { alpha, getBackgroundOverlay } from '../color';
6
6
  import { get, css } from '@styled-system/css';
7
7
  export const FilledButton = /*#__PURE__*/_styled(BaseButton, process.env.NODE_ENV === "production" ? {
8
8
  target: "ex8w9nt0"
@@ -20,17 +20,50 @@ export const FilledButton = /*#__PURE__*/_styled(BaseButton, process.env.NODE_EN
20
20
  background: "linear-gradient(".concat(get(theme, 'colors.surface'), ", ").concat(get(theme, 'colors.surface'), "), ").concat(alpha('on.surface', 0.12)(theme)),
21
21
  backgroundBlendMode: 'overlay',
22
22
  cursor: 'default'
23
+ },
24
+ '&:focus-visible': {
25
+ outlineColor: get(theme, "colors.".concat(String(color))) || color,
26
+ outlineWidth: 2,
27
+ outlineStyle: 'auto',
28
+ outlineOffset: '2px'
23
29
  }
24
30
  }), ({
25
31
  color = 'primary',
26
32
  elevation = 'none',
27
33
  theme
28
- }) => color === 'surface' && _extends({}, getDarkThemeBackgroundOverlay(theme, get(theme, "buttons.elevations.".concat(elevation, ".boxShadow"), 0))), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9CdXR0b24vRmlsbGVkQnV0dG9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPNEIiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL0J1dHRvbi9GaWxsZWRCdXR0b24udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgcmVhZGFibGVDb2xvciB9IGZyb20gJ3BvbGlzaGVkJztcbmltcG9ydCB7IEJhc2VCdXR0b24gfSBmcm9tICcuL0Jhc2VCdXR0b24nO1xuaW1wb3J0IHsgVGhlbWUgfSBmcm9tICcuLi90aGVtZSc7XG5pbXBvcnQgeyBhbHBoYSwgZ2V0RGFya1RoZW1lQmFja2dyb3VuZE92ZXJsYXkgfSBmcm9tICcuLi9jb2xvcic7XG5pbXBvcnQgeyBnZXQsIGNzcyB9IGZyb20gJ0BzdHlsZWQtc3lzdGVtL2Nzcyc7XG5cbmV4cG9ydCBjb25zdCBGaWxsZWRCdXR0b24gPSBzdHlsZWQoQmFzZUJ1dHRvbikoXG4gICh7IGNvbG9yID0gJ3ByaW1hcnknLCB0aGVtZSB9KSA9PlxuICAgIGNzcyh7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IGdldCh0aGVtZSwgYGNvbG9ycy4ke1N0cmluZyhjb2xvcil9YCkgfHwgY29sb3IsXG4gICAgICBjb2xvcjpcbiAgICAgICAgZ2V0KHRoZW1lLCBgY29sb3JzLm9uLiR7U3RyaW5nKGNvbG9yKX1gKSB8fFxuICAgICAgICAodHlwZW9mIGNvbG9yID09PSAnc3RyaW5nJyA/IHJlYWRhYmxlQ29sb3IoY29sb3IpIDogdW5kZWZpbmVkKSxcbiAgICAgICcmOmRpc2FibGVkJzoge1xuICAgICAgICBjb2xvcjogYWxwaGEoJ29uLnN1cmZhY2UnLCAwLjM4KSxcbiAgICAgICAgYmFja2dyb3VuZDogYGxpbmVhci1ncmFkaWVudCgke2dldCh0aGVtZSwgJ2NvbG9ycy5zdXJmYWNlJyl9LCAke2dldChcbiAgICAgICAgICB0aGVtZSxcbiAgICAgICAgICAnY29sb3JzLnN1cmZhY2UnXG4gICAgICAgICl9KSwgJHthbHBoYSgnb24uc3VyZmFjZScsIDAuMTIpKHRoZW1lKX1gLFxuICAgICAgICBiYWNrZ3JvdW5kQmxlbmRNb2RlOiAnb3ZlcmxheScsXG4gICAgICAgIGN1cnNvcjogJ2RlZmF1bHQnLFxuICAgICAgfSxcbiAgICB9KSxcbiAgKHsgY29sb3IgPSAncHJpbWFyeScsIGVsZXZhdGlvbiA9ICdub25lJywgdGhlbWUgfSkgPT5cbiAgICBjb2xvciA9PT0gJ3N1cmZhY2UnICYmIHtcbiAgICAgIC4uLmdldERhcmtUaGVtZUJhY2tncm91bmRPdmVybGF5KFxuICAgICAgICB0aGVtZSxcbiAgICAgICAgZ2V0KHRoZW1lLCBgYnV0dG9ucy5lbGV2YXRpb25zLiR7ZWxldmF0aW9ufS5ib3hTaGFkb3dgLCAwKVxuICAgICAgKSxcbiAgICB9XG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gZ2V0UmlwcGxlUHJvcGVydGllcyh0aGVtZTogVGhlbWUpIHtcbiAgcmV0dXJuIHtcbiAgICBob3Zlck9wYWNpdHk6IGdldCh0aGVtZSwgYGJ1dHRvbnMub3ZlcmxheXMuZmlsbGVkLmhvdmVyLm9wYWNpdHlgKSxcbiAgICBmb2N1c09wYWNpdHk6IGdldCh0aGVtZSwgYGJ1dHRvbnMub3ZlcmxheXMuZmlsbGVkLmZvY3VzLm9wYWNpdHlgKSxcbiAgICBwcmVzc2VkT3BhY2l0eTogZ2V0KHRoZW1lLCBgYnV0dG9ucy5vdmVybGF5cy5maWxsZWQucHJlc3NlZC5vcGFjaXR5YCksXG4gIH07XG59XG4iXX0= */");
34
+ }) => color === 'surface' && _extends({}, getBackgroundOverlay(theme, get(theme, "buttons.elevations.".concat(elevation, ".boxShadow"), 0), 'primary')), ({
35
+ color = 'primary',
36
+ theme,
37
+ isGroupedButton = false
38
+ }) => isGroupedButton && {
39
+ '[data-button-group=""] &': {
40
+ borderColor: get(theme, "colors.on.".concat(String(color))) || (typeof color === 'string' ? readableColor(color) : undefined),
41
+ ':first-of-type': {
42
+ borderTopRightRadius: 0,
43
+ borderBottomRightRadius: 0,
44
+ borderRightStyle: 'solid',
45
+ borderRightWidth: "0.0625rem"
46
+ },
47
+ ':not(:first-of-type):not(:last-of-type)': {
48
+ borderRadius: 0
49
+ },
50
+ ':last-of-type': {
51
+ borderTopLeftRadius: 0,
52
+ borderBottomLeftRadius: 0,
53
+ borderLeftStyle: 'solid',
54
+ borderLeftWidth: "0.0625rem"
55
+ },
56
+ ':last-of-type:nth-of-type(2)': {
57
+ borderLeftWidth: 0
58
+ }
59
+ }
60
+ }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9CdXR0b24vRmlsbGVkQnV0dG9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPNEIiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL0J1dHRvbi9GaWxsZWRCdXR0b24udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgcmVhZGFibGVDb2xvciwgcmVtIH0gZnJvbSAncG9saXNoZWQnO1xuaW1wb3J0IHsgQmFzZUJ1dHRvbiB9IGZyb20gJy4vQmFzZUJ1dHRvbic7XG5pbXBvcnQgeyBUaGVtZSB9IGZyb20gJy4uL3RoZW1lJztcbmltcG9ydCB7IGFscGhhLCBnZXRCYWNrZ3JvdW5kT3ZlcmxheSB9IGZyb20gJy4uL2NvbG9yJztcbmltcG9ydCB7IGdldCwgY3NzIH0gZnJvbSAnQHN0eWxlZC1zeXN0ZW0vY3NzJztcblxuZXhwb3J0IGNvbnN0IEZpbGxlZEJ1dHRvbiA9IHN0eWxlZChCYXNlQnV0dG9uKShcbiAgKHsgY29sb3IgPSAncHJpbWFyeScsIHRoZW1lIH0pID0+XG4gICAgY3NzKHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogZ2V0KHRoZW1lLCBgY29sb3JzLiR7U3RyaW5nKGNvbG9yKX1gKSB8fCBjb2xvcixcbiAgICAgIGNvbG9yOlxuICAgICAgICBnZXQodGhlbWUsIGBjb2xvcnMub24uJHtTdHJpbmcoY29sb3IpfWApIHx8XG4gICAgICAgICh0eXBlb2YgY29sb3IgPT09ICdzdHJpbmcnID8gcmVhZGFibGVDb2xvcihjb2xvcikgOiB1bmRlZmluZWQpLFxuICAgICAgJyY6ZGlzYWJsZWQnOiB7XG4gICAgICAgIGNvbG9yOiBhbHBoYSgnb24uc3VyZmFjZScsIDAuMzgpLFxuICAgICAgICBiYWNrZ3JvdW5kOiBgbGluZWFyLWdyYWRpZW50KCR7Z2V0KHRoZW1lLCAnY29sb3JzLnN1cmZhY2UnKX0sICR7Z2V0KFxuICAgICAgICAgIHRoZW1lLFxuICAgICAgICAgICdjb2xvcnMuc3VyZmFjZSdcbiAgICAgICAgKX0pLCAke2FscGhhKCdvbi5zdXJmYWNlJywgMC4xMikodGhlbWUpfWAsXG4gICAgICAgIGJhY2tncm91bmRCbGVuZE1vZGU6ICdvdmVybGF5JyxcbiAgICAgICAgY3Vyc29yOiAnZGVmYXVsdCcsXG4gICAgICB9LFxuICAgICAgJyY6Zm9jdXMtdmlzaWJsZSc6IHtcbiAgICAgICAgb3V0bGluZUNvbG9yOiBnZXQodGhlbWUsIGBjb2xvcnMuJHtTdHJpbmcoY29sb3IpfWApIHx8IGNvbG9yLFxuICAgICAgICBvdXRsaW5lV2lkdGg6IDIsXG4gICAgICAgIG91dGxpbmVTdHlsZTogJ2F1dG8nLFxuICAgICAgICBvdXRsaW5lT2Zmc2V0OiAnMnB4JyxcbiAgICAgIH0sXG4gICAgfSksXG4gICh7IGNvbG9yID0gJ3ByaW1hcnknLCBlbGV2YXRpb24gPSAnbm9uZScsIHRoZW1lIH0pID0+XG4gICAgY29sb3IgPT09ICdzdXJmYWNlJyAmJiB7XG4gICAgICAuLi5nZXRCYWNrZ3JvdW5kT3ZlcmxheShcbiAgICAgICAgdGhlbWUsXG4gICAgICAgIGdldCh0aGVtZSwgYGJ1dHRvbnMuZWxldmF0aW9ucy4ke2VsZXZhdGlvbn0uYm94U2hhZG93YCwgMCksXG4gICAgICAgICdwcmltYXJ5J1xuICAgICAgKSxcbiAgICB9LFxuICAoeyBjb2xvciA9ICdwcmltYXJ5JywgdGhlbWUsIGlzR3JvdXBlZEJ1dHRvbiA9IGZhbHNlIH0pID0+XG4gICAgaXNHcm91cGVkQnV0dG9uICYmIHtcbiAgICAgICdbZGF0YS1idXR0b24tZ3JvdXA9XCJcIl0gJic6IHtcbiAgICAgICAgYm9yZGVyQ29sb3I6XG4gICAgICAgICAgZ2V0KHRoZW1lLCBgY29sb3JzLm9uLiR7U3RyaW5nKGNvbG9yKX1gKSB8fFxuICAgICAgICAgICh0eXBlb2YgY29sb3IgPT09ICdzdHJpbmcnID8gcmVhZGFibGVDb2xvcihjb2xvcikgOiB1bmRlZmluZWQpLFxuICAgICAgICAnOmZpcnN0LW9mLXR5cGUnOiB7XG4gICAgICAgICAgYm9yZGVyVG9wUmlnaHRSYWRpdXM6IDAsXG4gICAgICAgICAgYm9yZGVyQm90dG9tUmlnaHRSYWRpdXM6IDAsXG4gICAgICAgICAgYm9yZGVyUmlnaHRTdHlsZTogJ3NvbGlkJyxcbiAgICAgICAgICBib3JkZXJSaWdodFdpZHRoOiByZW0oMSksXG4gICAgICAgIH0sXG4gICAgICAgICc6bm90KDpmaXJzdC1vZi10eXBlKTpub3QoOmxhc3Qtb2YtdHlwZSknOiB7XG4gICAgICAgICAgYm9yZGVyUmFkaXVzOiAwLFxuICAgICAgICB9LFxuICAgICAgICAnOmxhc3Qtb2YtdHlwZSc6IHtcbiAgICAgICAgICBib3JkZXJUb3BMZWZ0UmFkaXVzOiAwLFxuICAgICAgICAgIGJvcmRlckJvdHRvbUxlZnRSYWRpdXM6IDAsXG4gICAgICAgICAgYm9yZGVyTGVmdFN0eWxlOiAnc29saWQnLFxuICAgICAgICAgIGJvcmRlckxlZnRXaWR0aDogcmVtKDEpLFxuICAgICAgICB9LFxuICAgICAgICAnOmxhc3Qtb2YtdHlwZTpudGgtb2YtdHlwZSgyKSc6IHtcbiAgICAgICAgICBib3JkZXJMZWZ0V2lkdGg6IDAsXG4gICAgICAgIH0sXG4gICAgICB9LFxuICAgIH1cbik7XG5cbmV4cG9ydCBmdW5jdGlvbiBnZXRSaXBwbGVQcm9wZXJ0aWVzKHRoZW1lOiBUaGVtZSkge1xuICByZXR1cm4ge1xuICAgIGhvdmVyT3BhY2l0eTogZ2V0KHRoZW1lLCBgYnV0dG9ucy5vdmVybGF5cy5maWxsZWQuaG92ZXIub3BhY2l0eWApLFxuICAgIGZvY3VzT3BhY2l0eTogZ2V0KHRoZW1lLCBgYnV0dG9ucy5vdmVybGF5cy5maWxsZWQuZm9jdXMub3BhY2l0eWApLFxuICAgIHByZXNzZWRPcGFjaXR5OiBnZXQodGhlbWUsIGBidXR0b25zLm92ZXJsYXlzLmZpbGxlZC5wcmVzc2VkLm9wYWNpdHlgKSxcbiAgICByaXBwbGVFbmFibGVkOiBmYWxzZSxcbiAgfTtcbn1cbiJdfQ== */");
29
61
  export function getRippleProperties(theme) {
30
62
  return {
31
63
  hoverOpacity: get(theme, "buttons.overlays.filled.hover.opacity"),
32
64
  focusOpacity: get(theme, "buttons.overlays.filled.focus.opacity"),
33
- pressedOpacity: get(theme, "buttons.overlays.filled.pressed.opacity")
65
+ pressedOpacity: get(theme, "buttons.overlays.filled.pressed.opacity"),
66
+ rippleEnabled: false
34
67
  };
35
68
  }
36
69
  //# sourceMappingURL=FilledButton.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Button/FilledButton.tsx"],"names":["readableColor","BaseButton","alpha","getDarkThemeBackgroundOverlay","get","css","FilledButton","color","theme","backgroundColor","String","undefined","background","backgroundBlendMode","cursor","elevation","getRippleProperties","hoverOpacity","focusOpacity","pressedOpacity"],"mappings":";;AACA,SAASA,aAAT,QAA8B,UAA9B;AACA,SAASC,UAAT,QAA2B,cAA3B;AAEA,SAASC,KAAT,EAAgBC,6BAAhB,QAAqD,UAArD;AACA,SAASC,GAAT,EAAcC,GAAd,QAAyB,oBAAzB;AAEA,OAAO,MAAMC,YAAY,GAAG,qBAAOL,UAAP;AAAA;AAAA;AAAA;AAAA;AAAA,GAC1B,CAAC;AAAEM,EAAAA,KAAK,GAAG,SAAV;AAAqBC,EAAAA;AAArB,CAAD,KACEH,GAAG,CAAC;AACFI,EAAAA,eAAe,EAAEL,GAAG,CAACI,KAAD,mBAAkBE,MAAM,CAACH,KAAD,CAAxB,EAAH,IAAyCA,KADxD;AAEFA,EAAAA,KAAK,EACHH,GAAG,CAACI,KAAD,sBAAqBE,MAAM,CAACH,KAAD,CAA3B,EAAH,KACC,OAAOA,KAAP,KAAiB,QAAjB,GAA4BP,aAAa,CAACO,KAAD,CAAzC,GAAmDI,SADpD,CAHA;AAKF,gBAAc;AACZJ,IAAAA,KAAK,EAAEL,KAAK,CAAC,YAAD,EAAe,IAAf,CADA;AAEZU,IAAAA,UAAU,4BAAqBR,GAAG,CAACI,KAAD,EAAQ,gBAAR,CAAxB,eAAsDJ,GAAG,CACjEI,KADiE,EAEjE,gBAFiE,CAAzD,gBAGHN,KAAK,CAAC,YAAD,EAAe,IAAf,CAAL,CAA0BM,KAA1B,CAHG,CAFE;AAMZK,IAAAA,mBAAmB,EAAE,SANT;AAOZC,IAAAA,MAAM,EAAE;AAPI;AALZ,CAAD,CAFqB,EAiB1B,CAAC;AAAEP,EAAAA,KAAK,GAAG,SAAV;AAAqBQ,EAAAA,SAAS,GAAG,MAAjC;AAAyCP,EAAAA;AAAzC,CAAD,KACED,KAAK,KAAK,SAAV,iBACKJ,6BAA6B,CAC9BK,KAD8B,EAE9BJ,GAAG,CAACI,KAAD,+BAA8BO,SAA9B,iBAAqD,CAArD,CAF2B,CADlC,CAlBwB,qtEAArB;AA0BP,OAAO,SAASC,mBAAT,CAA6BR,KAA7B,EAA2C;AAChD,SAAO;AACLS,IAAAA,YAAY,EAAEb,GAAG,CAACI,KAAD,0CADZ;AAELU,IAAAA,YAAY,EAAEd,GAAG,CAACI,KAAD,0CAFZ;AAGLW,IAAAA,cAAc,EAAEf,GAAG,CAACI,KAAD;AAHd,GAAP;AAKD","sourcesContent":["import styled from '@emotion/styled';\nimport { readableColor } from 'polished';\nimport { BaseButton } from './BaseButton';\nimport { Theme } from '../theme';\nimport { alpha, getDarkThemeBackgroundOverlay } from '../color';\nimport { get, css } from '@styled-system/css';\n\nexport const FilledButton = styled(BaseButton)(\n ({ color = 'primary', theme }) =>\n css({\n backgroundColor: get(theme, `colors.${String(color)}`) || color,\n color:\n get(theme, `colors.on.${String(color)}`) ||\n (typeof color === 'string' ? readableColor(color) : undefined),\n '&:disabled': {\n color: alpha('on.surface', 0.38),\n background: `linear-gradient(${get(theme, 'colors.surface')}, ${get(\n theme,\n 'colors.surface'\n )}), ${alpha('on.surface', 0.12)(theme)}`,\n backgroundBlendMode: 'overlay',\n cursor: 'default',\n },\n }),\n ({ color = 'primary', elevation = 'none', theme }) =>\n color === 'surface' && {\n ...getDarkThemeBackgroundOverlay(\n theme,\n get(theme, `buttons.elevations.${elevation}.boxShadow`, 0)\n ),\n }\n);\n\nexport function getRippleProperties(theme: Theme) {\n return {\n hoverOpacity: get(theme, `buttons.overlays.filled.hover.opacity`),\n focusOpacity: get(theme, `buttons.overlays.filled.focus.opacity`),\n pressedOpacity: get(theme, `buttons.overlays.filled.pressed.opacity`),\n };\n}\n"],"file":"FilledButton.js"}
1
+ {"version":3,"sources":["../../../src/Button/FilledButton.tsx"],"names":["readableColor","BaseButton","alpha","getBackgroundOverlay","get","css","FilledButton","color","theme","backgroundColor","String","undefined","background","backgroundBlendMode","cursor","outlineColor","outlineWidth","outlineStyle","outlineOffset","elevation","isGroupedButton","borderColor","borderTopRightRadius","borderBottomRightRadius","borderRightStyle","borderRightWidth","borderRadius","borderTopLeftRadius","borderBottomLeftRadius","borderLeftStyle","borderLeftWidth","getRippleProperties","hoverOpacity","focusOpacity","pressedOpacity","rippleEnabled"],"mappings":";;AACA,SAASA,aAAT,QAAmC,UAAnC;AACA,SAASC,UAAT,QAA2B,cAA3B;AAEA,SAASC,KAAT,EAAgBC,oBAAhB,QAA4C,UAA5C;AACA,SAASC,GAAT,EAAcC,GAAd,QAAyB,oBAAzB;AAEA,OAAO,MAAMC,YAAY,GAAG,qBAAOL,UAAP;AAAA;AAAA;AAAA;AAAA;AAAA,GAC1B,CAAC;AAAEM,EAAAA,KAAK,GAAG,SAAV;AAAqBC,EAAAA;AAArB,CAAD,KACEH,GAAG,CAAC;AACFI,EAAAA,eAAe,EAAEL,GAAG,CAACI,KAAD,mBAAkBE,MAAM,CAACH,KAAD,CAAxB,EAAH,IAAyCA,KADxD;AAEFA,EAAAA,KAAK,EACHH,GAAG,CAACI,KAAD,sBAAqBE,MAAM,CAACH,KAAD,CAA3B,EAAH,KACC,OAAOA,KAAP,KAAiB,QAAjB,GAA4BP,aAAa,CAACO,KAAD,CAAzC,GAAmDI,SADpD,CAHA;AAKF,gBAAc;AACZJ,IAAAA,KAAK,EAAEL,KAAK,CAAC,YAAD,EAAe,IAAf,CADA;AAEZU,IAAAA,UAAU,4BAAqBR,GAAG,CAACI,KAAD,EAAQ,gBAAR,CAAxB,eAAsDJ,GAAG,CACjEI,KADiE,EAEjE,gBAFiE,CAAzD,gBAGHN,KAAK,CAAC,YAAD,EAAe,IAAf,CAAL,CAA0BM,KAA1B,CAHG,CAFE;AAMZK,IAAAA,mBAAmB,EAAE,SANT;AAOZC,IAAAA,MAAM,EAAE;AAPI,GALZ;AAcF,qBAAmB;AACjBC,IAAAA,YAAY,EAAEX,GAAG,CAACI,KAAD,mBAAkBE,MAAM,CAACH,KAAD,CAAxB,EAAH,IAAyCA,KADtC;AAEjBS,IAAAA,YAAY,EAAE,CAFG;AAGjBC,IAAAA,YAAY,EAAE,MAHG;AAIjBC,IAAAA,aAAa,EAAE;AAJE;AAdjB,CAAD,CAFqB,EAuB1B,CAAC;AAAEX,EAAAA,KAAK,GAAG,SAAV;AAAqBY,EAAAA,SAAS,GAAG,MAAjC;AAAyCX,EAAAA;AAAzC,CAAD,KACED,KAAK,KAAK,SAAV,iBACKJ,oBAAoB,CACrBK,KADqB,EAErBJ,GAAG,CAACI,KAAD,+BAA8BW,SAA9B,iBAAqD,CAArD,CAFkB,EAGrB,SAHqB,CADzB,CAxBwB,EA+B1B,CAAC;AAAEZ,EAAAA,KAAK,GAAG,SAAV;AAAqBC,EAAAA,KAArB;AAA4BY,EAAAA,eAAe,GAAG;AAA9C,CAAD,KACEA,eAAe,IAAI;AACjB,8BAA4B;AAC1BC,IAAAA,WAAW,EACTjB,GAAG,CAACI,KAAD,sBAAqBE,MAAM,CAACH,KAAD,CAA3B,EAAH,KACC,OAAOA,KAAP,KAAiB,QAAjB,GAA4BP,aAAa,CAACO,KAAD,CAAzC,GAAmDI,SADpD,CAFwB;AAI1B,sBAAkB;AAChBW,MAAAA,oBAAoB,EAAE,CADN;AAEhBC,MAAAA,uBAAuB,EAAE,CAFT;AAGhBC,MAAAA,gBAAgB,EAAE,OAHF;AAIhBC,MAAAA,gBAAgB;AAJA,KAJQ;AAU1B,+CAA2C;AACzCC,MAAAA,YAAY,EAAE;AAD2B,KAVjB;AAa1B,qBAAiB;AACfC,MAAAA,mBAAmB,EAAE,CADN;AAEfC,MAAAA,sBAAsB,EAAE,CAFT;AAGfC,MAAAA,eAAe,EAAE,OAHF;AAIfC,MAAAA,eAAe;AAJA,KAbS;AAmB1B,oCAAgC;AAC9BA,MAAAA,eAAe,EAAE;AADa;AAnBN;AADX,CAhCK,6nHAArB;AA2DP,OAAO,SAASC,mBAAT,CAA6BvB,KAA7B,EAA2C;AAChD,SAAO;AACLwB,IAAAA,YAAY,EAAE5B,GAAG,CAACI,KAAD,0CADZ;AAELyB,IAAAA,YAAY,EAAE7B,GAAG,CAACI,KAAD,0CAFZ;AAGL0B,IAAAA,cAAc,EAAE9B,GAAG,CAACI,KAAD,4CAHd;AAIL2B,IAAAA,aAAa,EAAE;AAJV,GAAP;AAMD","sourcesContent":["import styled from '@emotion/styled';\nimport { readableColor, rem } from 'polished';\nimport { BaseButton } from './BaseButton';\nimport { Theme } from '../theme';\nimport { alpha, getBackgroundOverlay } from '../color';\nimport { get, css } from '@styled-system/css';\n\nexport const FilledButton = styled(BaseButton)(\n ({ color = 'primary', theme }) =>\n css({\n backgroundColor: get(theme, `colors.${String(color)}`) || color,\n color:\n get(theme, `colors.on.${String(color)}`) ||\n (typeof color === 'string' ? readableColor(color) : undefined),\n '&:disabled': {\n color: alpha('on.surface', 0.38),\n background: `linear-gradient(${get(theme, 'colors.surface')}, ${get(\n theme,\n 'colors.surface'\n )}), ${alpha('on.surface', 0.12)(theme)}`,\n backgroundBlendMode: 'overlay',\n cursor: 'default',\n },\n '&:focus-visible': {\n outlineColor: get(theme, `colors.${String(color)}`) || color,\n outlineWidth: 2,\n outlineStyle: 'auto',\n outlineOffset: '2px',\n },\n }),\n ({ color = 'primary', elevation = 'none', theme }) =>\n color === 'surface' && {\n ...getBackgroundOverlay(\n theme,\n get(theme, `buttons.elevations.${elevation}.boxShadow`, 0),\n 'primary'\n ),\n },\n ({ color = 'primary', theme, isGroupedButton = false }) =>\n isGroupedButton && {\n '[data-button-group=\"\"] &': {\n borderColor:\n get(theme, `colors.on.${String(color)}`) ||\n (typeof color === 'string' ? readableColor(color) : undefined),\n ':first-of-type': {\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n borderRightStyle: 'solid',\n borderRightWidth: rem(1),\n },\n ':not(:first-of-type):not(:last-of-type)': {\n borderRadius: 0,\n },\n ':last-of-type': {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderLeftStyle: 'solid',\n borderLeftWidth: rem(1),\n },\n ':last-of-type:nth-of-type(2)': {\n borderLeftWidth: 0,\n },\n },\n }\n);\n\nexport function getRippleProperties(theme: Theme) {\n return {\n hoverOpacity: get(theme, `buttons.overlays.filled.hover.opacity`),\n focusOpacity: get(theme, `buttons.overlays.filled.focus.opacity`),\n pressedOpacity: get(theme, `buttons.overlays.filled.pressed.opacity`),\n rippleEnabled: false,\n };\n}\n"],"file":"FilledButton.js"}
@@ -1,6 +1,7 @@
1
1
  import { Theme } from '../theme';
2
2
  export declare function getRippleProperties(theme: Theme): {
3
3
  center: boolean;
4
+ rippleEnabled: boolean;
4
5
  hoverOpacity: any;
5
6
  focusOpacity: any;
6
7
  pressedOpacity: any;
@@ -2,7 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import { getRippleProperties as filledButtonGetProperties } from './FilledButton';
3
3
  export function getRippleProperties(theme) {
4
4
  return _extends({}, filledButtonGetProperties(theme), {
5
- center: true
5
+ center: true,
6
+ rippleEnabled: true
6
7
  });
7
8
  }
8
9
  //# sourceMappingURL=IconButton.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Button/IconButton.tsx"],"names":["getRippleProperties","filledButtonGetProperties","theme","center"],"mappings":";AAAA,SAASA,mBAAmB,IAAIC,yBAAhC,QAAiE,gBAAjE;AAGA,OAAO,SAASD,mBAAT,CAA6BE,KAA7B,EAA2C;AAChD,sBACKD,yBAAyB,CAACC,KAAD,CAD9B;AAEEC,IAAAA,MAAM,EAAE;AAFV;AAID","sourcesContent":["import { getRippleProperties as filledButtonGetProperties } from './FilledButton';\nimport { Theme } from '../theme';\n\nexport function getRippleProperties(theme: Theme) {\n return {\n ...filledButtonGetProperties(theme),\n center: true,\n };\n}\n"],"file":"IconButton.js"}
1
+ {"version":3,"sources":["../../../src/Button/IconButton.tsx"],"names":["getRippleProperties","filledButtonGetProperties","theme","center","rippleEnabled"],"mappings":";AAAA,SAASA,mBAAmB,IAAIC,yBAAhC,QAAiE,gBAAjE;AAGA,OAAO,SAASD,mBAAT,CAA6BE,KAA7B,EAA2C;AAChD,sBACKD,yBAAyB,CAACC,KAAD,CAD9B;AAEEC,IAAAA,MAAM,EAAE,IAFV;AAGEC,IAAAA,aAAa,EAAE;AAHjB;AAKD","sourcesContent":["import { getRippleProperties as filledButtonGetProperties } from './FilledButton';\nimport { Theme } from '../theme';\n\nexport function getRippleProperties(theme: Theme) {\n return {\n ...filledButtonGetProperties(theme),\n center: true,\n rippleEnabled: true,\n };\n}\n"],"file":"IconButton.js"}
@@ -1,4 +1,4 @@
1
1
  /// <reference types="react" />
2
- export declare const OutlinedButton: import("@emotion/styled").StyledComponent<Pick<import("./BaseButton").BaseButtonProps, "children" | "form" | "p" | "slot" | "style" | "title" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "disabled" | "type" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "elevation"> & import("react").RefAttributes<HTMLButtonElement> & {
2
+ export declare const OutlinedButton: import("@emotion/styled").StyledComponent<Pick<import("./BaseButton").BaseButtonProps, "bottom" | "top" | "hidden" | "left" | "right" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "margin" | "mt" | "marginTop" | "mr" | "marginRight" | "mb" | "marginBottom" | "ml" | "marginLeft" | "mx" | "marginX" | "my" | "marginY" | "p" | "padding" | "pt" | "paddingTop" | "pr" | "paddingRight" | "pb" | "paddingBottom" | "pl" | "paddingLeft" | "px" | "paddingX" | "py" | "paddingY" | "width" | "height" | "minWidth" | "minHeight" | "maxWidth" | "maxHeight" | "display" | "verticalAlign" | "size" | "overflow" | "overflowX" | "overflowY" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "letterSpacing" | "fontStyle" | "textAlign" | "color" | "bg" | "backgroundColor" | "opacity" | "alignItems" | "alignContent" | "justifyItems" | "justifyContent" | "flexWrap" | "flexDirection" | "flex" | "flexGrow" | "flexShrink" | "flexBasis" | "justifySelf" | "alignSelf" | "order" | "border" | "borderX" | "borderY" | "borderWidth" | "borderTopWidth" | "borderBottomWidth" | "borderLeftWidth" | "borderRightWidth" | "borderStyle" | "borderTopStyle" | "borderBottomStyle" | "borderLeftStyle" | "borderRightStyle" | "borderColor" | "borderTopColor" | "borderBottomColor" | "borderLeftColor" | "borderRightColor" | "borderRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "gridGap" | "gridColumnGap" | "gridRowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "background" | "backgroundImage" | "backgroundSize" | "backgroundPosition" | "backgroundRepeat" | "position" | "zIndex" | "boxShadow" | "textShadow" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "elevation" | "isGroupedButton" | "key"> & import("react").RefAttributes<HTMLButtonElement> & {
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
4
  }, {}, {}>;
@@ -10,11 +10,41 @@ export const OutlinedButton = /*#__PURE__*/_styled(TransparentButton, process.en
10
10
  })(css({
11
11
  borderStyle: 'solid',
12
12
  borderWidth: "0.0625rem",
13
- borderColor: alpha('on.surface', 0.12),
13
+ borderColor: 'outline',
14
+ boxShadow: 0,
15
+ '&:focus,:&active,:&hover': {
16
+ boxShadow: 0
17
+ },
18
+ '&:focus-visible,&:active': {
19
+ borderColor: 'currentColor'
20
+ },
14
21
  '&:disabled': {
15
22
  color: alpha('on.surface', 0.38),
16
23
  borderColor: alpha('on.surface', 0.12),
17
24
  cursor: 'default'
18
25
  }
19
- }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9CdXR0b24vT3V0bGluZWRCdXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU04QiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvQnV0dG9uL091dGxpbmVkQnV0dG9uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFRyYW5zcGFyZW50QnV0dG9uIH0gZnJvbSAnLi9UcmFuc3BhcmVudEJ1dHRvbic7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAc3R5bGVkLXN5c3RlbS9jc3MnO1xuaW1wb3J0IHsgYWxwaGEgfSBmcm9tICcuLi9jb2xvcic7XG5pbXBvcnQgeyByZW0gfSBmcm9tICdwb2xpc2hlZCc7XG5cbmV4cG9ydCBjb25zdCBPdXRsaW5lZEJ1dHRvbiA9IHN0eWxlZChUcmFuc3BhcmVudEJ1dHRvbikoXG4gIGNzcyh7XG4gICAgYm9yZGVyU3R5bGU6ICdzb2xpZCcsXG4gICAgYm9yZGVyV2lkdGg6IHJlbSgxKSxcbiAgICBib3JkZXJDb2xvcjogYWxwaGEoJ29uLnN1cmZhY2UnLCAwLjEyKSxcbiAgICAnJjpkaXNhYmxlZCc6IHtcbiAgICAgIGNvbG9yOiBhbHBoYSgnb24uc3VyZmFjZScsIDAuMzgpLFxuICAgICAgYm9yZGVyQ29sb3I6IGFscGhhKCdvbi5zdXJmYWNlJywgMC4xMiksXG4gICAgICBjdXJzb3I6ICdkZWZhdWx0JyxcbiAgICB9LFxuICB9KVxuKTtcbiJdfQ== */");
26
+ }), ({
27
+ isGroupedButton = false
28
+ }) => isGroupedButton && {
29
+ '[data-button-group=""] &': {
30
+ ':first-of-type': {
31
+ borderTopRightRadius: 0,
32
+ borderBottomRightRadius: 0
33
+ },
34
+ ':not(:first-of-type):not(:last-of-type)': {
35
+ borderRadius: 0,
36
+ borderRightWidth: 0,
37
+ borderLeftWidth: 0
38
+ },
39
+ ':last-of-type': {
40
+ borderTopLeftRadius: 0,
41
+ borderBottomLeftRadius: 0,
42
+ borderLeftStyle: 'solid',
43
+ borderLeftWidth: "0.0625rem"
44
+ },
45
+ ':last-of-type:nth-of-type(2)': {
46
+ borderLeftWidth: 0
47
+ }
48
+ }
49
+ }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9CdXR0b24vT3V0bGluZWRCdXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU04QiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvQnV0dG9uL091dGxpbmVkQnV0dG9uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFRyYW5zcGFyZW50QnV0dG9uIH0gZnJvbSAnLi9UcmFuc3BhcmVudEJ1dHRvbic7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAc3R5bGVkLXN5c3RlbS9jc3MnO1xuaW1wb3J0IHsgYWxwaGEgfSBmcm9tICcuLi9jb2xvcic7XG5pbXBvcnQgeyByZW0gfSBmcm9tICdwb2xpc2hlZCc7XG5cbmV4cG9ydCBjb25zdCBPdXRsaW5lZEJ1dHRvbiA9IHN0eWxlZChUcmFuc3BhcmVudEJ1dHRvbikoXG4gIGNzcyh7XG4gICAgYm9yZGVyU3R5bGU6ICdzb2xpZCcsXG4gICAgYm9yZGVyV2lkdGg6IHJlbSgxKSxcbiAgICBib3JkZXJDb2xvcjogJ291dGxpbmUnLFxuICAgIGJveFNoYWRvdzogMCxcbiAgICAnJjpmb2N1cyw6JmFjdGl2ZSw6JmhvdmVyJzogeyBib3hTaGFkb3c6IDAgfSxcbiAgICAnJjpmb2N1cy12aXNpYmxlLCY6YWN0aXZlJzoge1xuICAgICAgYm9yZGVyQ29sb3I6ICdjdXJyZW50Q29sb3InLFxuICAgIH0sXG4gICAgJyY6ZGlzYWJsZWQnOiB7XG4gICAgICBjb2xvcjogYWxwaGEoJ29uLnN1cmZhY2UnLCAwLjM4KSxcbiAgICAgIGJvcmRlckNvbG9yOiBhbHBoYSgnb24uc3VyZmFjZScsIDAuMTIpLFxuICAgICAgY3Vyc29yOiAnZGVmYXVsdCcsXG4gICAgfSxcbiAgfSksXG4gICh7IGlzR3JvdXBlZEJ1dHRvbiA9IGZhbHNlIH0pID0+XG4gICAgaXNHcm91cGVkQnV0dG9uICYmIHtcbiAgICAgICdbZGF0YS1idXR0b24tZ3JvdXA9XCJcIl0gJic6IHtcbiAgICAgICAgJzpmaXJzdC1vZi10eXBlJzoge1xuICAgICAgICAgIGJvcmRlclRvcFJpZ2h0UmFkaXVzOiAwLFxuICAgICAgICAgIGJvcmRlckJvdHRvbVJpZ2h0UmFkaXVzOiAwLFxuICAgICAgICB9LFxuICAgICAgICAnOm5vdCg6Zmlyc3Qtb2YtdHlwZSk6bm90KDpsYXN0LW9mLXR5cGUpJzoge1xuICAgICAgICAgIGJvcmRlclJhZGl1czogMCxcbiAgICAgICAgICBib3JkZXJSaWdodFdpZHRoOiAwLFxuICAgICAgICAgIGJvcmRlckxlZnRXaWR0aDogMCxcbiAgICAgICAgfSxcbiAgICAgICAgJzpsYXN0LW9mLXR5cGUnOiB7XG4gICAgICAgICAgYm9yZGVyVG9wTGVmdFJhZGl1czogMCxcbiAgICAgICAgICBib3JkZXJCb3R0b21MZWZ0UmFkaXVzOiAwLFxuICAgICAgICAgIGJvcmRlckxlZnRTdHlsZTogJ3NvbGlkJyxcbiAgICAgICAgICBib3JkZXJMZWZ0V2lkdGg6IHJlbSgxKSxcbiAgICAgICAgfSxcbiAgICAgICAgJzpsYXN0LW9mLXR5cGU6bnRoLW9mLXR5cGUoMiknOiB7XG4gICAgICAgICAgYm9yZGVyTGVmdFdpZHRoOiAwLFxuICAgICAgICB9LFxuICAgICAgfSxcbiAgICB9XG4pO1xuIl19 */");
20
50
  //# sourceMappingURL=OutlinedButton.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Button/OutlinedButton.tsx"],"names":["TransparentButton","css","alpha","OutlinedButton","borderStyle","borderWidth","borderColor","color","cursor"],"mappings":";AAAA,SAASA,iBAAT,QAAkC,qBAAlC;AAEA,SAASC,GAAT,QAAoB,oBAApB;AACA,SAASC,KAAT,QAAsB,UAAtB;AAGA,OAAO,MAAMC,cAAc,GAAG,qBAAOH,iBAAP;AAAA;AAAA;AAAA;AAAA;AAAA,GAC5BC,GAAG,CAAC;AACFG,EAAAA,WAAW,EAAE,OADX;AAEFC,EAAAA,WAAW,aAFT;AAGFC,EAAAA,WAAW,EAAEJ,KAAK,CAAC,YAAD,EAAe,IAAf,CAHhB;AAIF,gBAAc;AACZK,IAAAA,KAAK,EAAEL,KAAK,CAAC,YAAD,EAAe,IAAf,CADA;AAEZI,IAAAA,WAAW,EAAEJ,KAAK,CAAC,YAAD,EAAe,IAAf,CAFN;AAGZM,IAAAA,MAAM,EAAE;AAHI;AAJZ,CAAD,CADyB,qhCAAvB","sourcesContent":["import { TransparentButton } from './TransparentButton';\nimport styled from '@emotion/styled';\nimport { css } from '@styled-system/css';\nimport { alpha } from '../color';\nimport { rem } from 'polished';\n\nexport const OutlinedButton = styled(TransparentButton)(\n css({\n borderStyle: 'solid',\n borderWidth: rem(1),\n borderColor: alpha('on.surface', 0.12),\n '&:disabled': {\n color: alpha('on.surface', 0.38),\n borderColor: alpha('on.surface', 0.12),\n cursor: 'default',\n },\n })\n);\n"],"file":"OutlinedButton.js"}
1
+ {"version":3,"sources":["../../../src/Button/OutlinedButton.tsx"],"names":["TransparentButton","css","alpha","OutlinedButton","borderStyle","borderWidth","borderColor","boxShadow","color","cursor","isGroupedButton","borderTopRightRadius","borderBottomRightRadius","borderRadius","borderRightWidth","borderLeftWidth","borderTopLeftRadius","borderBottomLeftRadius","borderLeftStyle"],"mappings":";AAAA,SAASA,iBAAT,QAAkC,qBAAlC;AAEA,SAASC,GAAT,QAAoB,oBAApB;AACA,SAASC,KAAT,QAAsB,UAAtB;AAGA,OAAO,MAAMC,cAAc,GAAG,qBAAOH,iBAAP;AAAA;AAAA;AAAA;AAAA;AAAA,GAC5BC,GAAG,CAAC;AACFG,EAAAA,WAAW,EAAE,OADX;AAEFC,EAAAA,WAAW,aAFT;AAGFC,EAAAA,WAAW,EAAE,SAHX;AAIFC,EAAAA,SAAS,EAAE,CAJT;AAKF,8BAA4B;AAAEA,IAAAA,SAAS,EAAE;AAAb,GAL1B;AAMF,8BAA4B;AAC1BD,IAAAA,WAAW,EAAE;AADa,GAN1B;AASF,gBAAc;AACZE,IAAAA,KAAK,EAAEN,KAAK,CAAC,YAAD,EAAe,IAAf,CADA;AAEZI,IAAAA,WAAW,EAAEJ,KAAK,CAAC,YAAD,EAAe,IAAf,CAFN;AAGZO,IAAAA,MAAM,EAAE;AAHI;AATZ,CAAD,CADyB,EAgB5B,CAAC;AAAEC,EAAAA,eAAe,GAAG;AAApB,CAAD,KACEA,eAAe,IAAI;AACjB,8BAA4B;AAC1B,sBAAkB;AAChBC,MAAAA,oBAAoB,EAAE,CADN;AAEhBC,MAAAA,uBAAuB,EAAE;AAFT,KADQ;AAK1B,+CAA2C;AACzCC,MAAAA,YAAY,EAAE,CAD2B;AAEzCC,MAAAA,gBAAgB,EAAE,CAFuB;AAGzCC,MAAAA,eAAe,EAAE;AAHwB,KALjB;AAU1B,qBAAiB;AACfC,MAAAA,mBAAmB,EAAE,CADN;AAEfC,MAAAA,sBAAsB,EAAE,CAFT;AAGfC,MAAAA,eAAe,EAAE,OAHF;AAIfH,MAAAA,eAAe;AAJA,KAVS;AAgB1B,oCAAgC;AAC9BA,MAAAA,eAAe,EAAE;AADa;AAhBN;AADX,CAjBO,yjEAAvB","sourcesContent":["import { TransparentButton } from './TransparentButton';\nimport styled from '@emotion/styled';\nimport { css } from '@styled-system/css';\nimport { alpha } from '../color';\nimport { rem } from 'polished';\n\nexport const OutlinedButton = styled(TransparentButton)(\n css({\n borderStyle: 'solid',\n borderWidth: rem(1),\n borderColor: 'outline',\n boxShadow: 0,\n '&:focus,:&active,:&hover': { boxShadow: 0 },\n '&:focus-visible,&:active': {\n borderColor: 'currentColor',\n },\n '&:disabled': {\n color: alpha('on.surface', 0.38),\n borderColor: alpha('on.surface', 0.12),\n cursor: 'default',\n },\n }),\n ({ isGroupedButton = false }) =>\n isGroupedButton && {\n '[data-button-group=\"\"] &': {\n ':first-of-type': {\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n ':not(:first-of-type):not(:last-of-type)': {\n borderRadius: 0,\n borderRightWidth: 0,\n borderLeftWidth: 0,\n },\n ':last-of-type': {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderLeftStyle: 'solid',\n borderLeftWidth: rem(1),\n },\n ':last-of-type:nth-of-type(2)': {\n borderLeftWidth: 0,\n },\n },\n }\n);\n"],"file":"OutlinedButton.js"}