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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (477) hide show
  1. package/build/cjs/index.js +21 -17
  2. package/build/cjs/index.js.map +1 -1
  3. package/build/esm/Alert/Alert.d.ts +2 -2
  4. package/build/esm/Alert/Alert.js +8 -8
  5. package/build/esm/Alert/Alert.js.map +1 -1
  6. package/build/esm/Alert/index.js +0 -0
  7. package/build/esm/AppBar/AppBar.d.ts +3 -3
  8. package/build/esm/AppBar/AppBar.js +24 -16
  9. package/build/esm/AppBar/AppBar.js.map +1 -1
  10. package/build/esm/AppBar/AppBarButton.d.ts +2 -2
  11. package/build/esm/AppBar/AppBarButton.js +8 -9
  12. package/build/esm/AppBar/AppBarButton.js.map +1 -1
  13. package/build/esm/AppBar/context.d.ts +1 -1
  14. package/build/esm/AppBar/context.js +6 -5
  15. package/build/esm/AppBar/context.js.map +1 -1
  16. package/build/esm/AppBar/index.js +0 -0
  17. package/build/esm/Badge/Badge.d.ts +2 -2
  18. package/build/esm/Badge/Badge.js +2 -2
  19. package/build/esm/Badge/Badge.js.map +1 -1
  20. package/build/esm/Badge/index.js +0 -0
  21. package/build/esm/BaseLine/BaseLine.js +4 -4
  22. package/build/esm/BaseLine/BaseLine.js.map +1 -1
  23. package/build/esm/BaseLine/index.js +0 -0
  24. package/build/esm/BottomSheet/BottomSheet.d.ts +2 -2
  25. package/build/esm/BottomSheet/BottomSheet.js +11 -13
  26. package/build/esm/BottomSheet/BottomSheet.js.map +1 -1
  27. package/build/esm/BottomSheet/BottomSheetSurface.d.ts +4 -4
  28. package/build/esm/BottomSheet/BottomSheetSurface.js +7 -8
  29. package/build/esm/BottomSheet/BottomSheetSurface.js.map +1 -1
  30. package/build/esm/BottomSheet/index.js +0 -0
  31. package/build/esm/Box/Box.d.ts +5 -5
  32. package/build/esm/Box/Box.js +27 -19
  33. package/build/esm/Box/Box.js.map +1 -1
  34. package/build/esm/Box/index.js +0 -0
  35. package/build/esm/Button/BaseButton.d.ts +3 -3
  36. package/build/esm/Button/BaseButton.js +11 -12
  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 +27 -22
  40. package/build/esm/Button/Button.js.map +1 -1
  41. package/build/esm/Button/ButtonGroup.d.ts +3 -3
  42. package/build/esm/Button/ButtonGroup.js +15 -12
  43. package/build/esm/Button/ButtonGroup.js.map +1 -1
  44. package/build/esm/Button/FilledButton.d.ts +2 -2
  45. package/build/esm/Button/FilledButton.js +57 -49
  46. package/build/esm/Button/FilledButton.js.map +1 -1
  47. package/build/esm/Button/FloatingActionButton.d.ts +1 -1
  48. package/build/esm/Button/FloatingActionButton.js +0 -0
  49. package/build/esm/Button/FloatingActionButton.js.map +1 -1
  50. package/build/esm/Button/IconButton.d.ts +1 -1
  51. package/build/esm/Button/IconButton.js +0 -0
  52. package/build/esm/Button/IconButton.js.map +1 -1
  53. package/build/esm/Button/OutlinedButton.d.ts +1 -1
  54. package/build/esm/Button/OutlinedButton.js +27 -25
  55. package/build/esm/Button/OutlinedButton.js.map +1 -1
  56. package/build/esm/Button/TransparentButton.d.ts +2 -2
  57. package/build/esm/Button/TransparentButton.js +45 -41
  58. package/build/esm/Button/TransparentButton.js.map +1 -1
  59. package/build/esm/Button/context.d.ts +0 -0
  60. package/build/esm/Button/context.js +4 -2
  61. package/build/esm/Button/context.js.map +1 -1
  62. package/build/esm/Button/index.js +0 -0
  63. package/build/esm/CheckBox/CheckBox.d.ts +3 -3
  64. package/build/esm/CheckBox/CheckBox.js +42 -35
  65. package/build/esm/CheckBox/CheckBox.js.map +1 -1
  66. package/build/esm/CheckBox/CheckBoxIcon.d.ts +3 -3
  67. package/build/esm/CheckBox/CheckBoxIcon.js +15 -13
  68. package/build/esm/CheckBox/CheckBoxIcon.js.map +1 -1
  69. package/build/esm/CheckBox/CheckPath.js +15 -14
  70. package/build/esm/CheckBox/CheckPath.js.map +1 -1
  71. package/build/esm/CheckBox/IndeterminatePath.js +14 -13
  72. package/build/esm/CheckBox/IndeterminatePath.js.map +1 -1
  73. package/build/esm/CheckBox/index.js +0 -0
  74. package/build/esm/Chip/ButtonChip.d.ts +3 -3
  75. package/build/esm/Chip/ButtonChip.js +15 -15
  76. package/build/esm/Chip/ButtonChip.js.map +1 -1
  77. package/build/esm/Chip/Chip.js +0 -0
  78. package/build/esm/Chip/ChipBase.d.ts +3 -3
  79. package/build/esm/Chip/ChipBase.js +24 -19
  80. package/build/esm/Chip/ChipBase.js.map +1 -1
  81. package/build/esm/Chip/ChoiceChip.d.ts +3 -3
  82. package/build/esm/Chip/ChoiceChip.js +25 -26
  83. package/build/esm/Chip/ChoiceChip.js.map +1 -1
  84. package/build/esm/Chip/index.js +0 -0
  85. package/build/esm/ColorMode/ColorModeProvider.d.ts +1 -1
  86. package/build/esm/ColorMode/ColorModeProvider.js +32 -19
  87. package/build/esm/ColorMode/ColorModeProvider.js.map +1 -1
  88. package/build/esm/ColorMode/color-mode.js +3 -3
  89. package/build/esm/ColorMode/color-mode.js.map +1 -1
  90. package/build/esm/ColorMode/color-vars.js +20 -12
  91. package/build/esm/ColorMode/color-vars.js.map +1 -1
  92. package/build/esm/ColorMode/constants.js +3 -3
  93. package/build/esm/ColorMode/constants.js.map +1 -1
  94. package/build/esm/ColorMode/index.js +0 -0
  95. package/build/esm/Combobox/Combobox.d.ts +15 -15
  96. package/build/esm/Combobox/Combobox.js +50 -56
  97. package/build/esm/Combobox/Combobox.js.map +1 -1
  98. package/build/esm/Combobox/index.js +0 -0
  99. package/build/esm/Dialog/Dialog.d.ts +5 -5
  100. package/build/esm/Dialog/Dialog.js +22 -23
  101. package/build/esm/Dialog/Dialog.js.map +1 -1
  102. package/build/esm/Dialog/DialogBackdrop.d.ts +4 -4
  103. package/build/esm/Dialog/DialogBackdrop.js +10 -11
  104. package/build/esm/Dialog/DialogBackdrop.js.map +1 -1
  105. package/build/esm/Dialog/DialogContainer.d.ts +2 -2
  106. package/build/esm/Dialog/DialogContainer.js +4 -6
  107. package/build/esm/Dialog/DialogContainer.js.map +1 -1
  108. package/build/esm/Dialog/DialogSurface.d.ts +4 -4
  109. package/build/esm/Dialog/DialogSurface.js +14 -14
  110. package/build/esm/Dialog/DialogSurface.js.map +1 -1
  111. package/build/esm/Dialog/Scrim.d.ts +2 -2
  112. package/build/esm/Dialog/Scrim.js +4 -6
  113. package/build/esm/Dialog/Scrim.js.map +1 -1
  114. package/build/esm/Dialog/index.js +0 -0
  115. package/build/esm/Dialog/useDialogAnimation.js +19 -20
  116. package/build/esm/Dialog/useDialogAnimation.js.map +1 -1
  117. package/build/esm/Divider/Divider.d.ts +3 -3
  118. package/build/esm/Divider/Divider.js +9 -8
  119. package/build/esm/Divider/Divider.js.map +1 -1
  120. package/build/esm/Divider/index.js +0 -0
  121. package/build/esm/FloatingLabel/FloatingLabel.d.ts +1 -1
  122. package/build/esm/FloatingLabel/FloatingLabel.js +26 -22
  123. package/build/esm/FloatingLabel/FloatingLabel.js.map +1 -1
  124. package/build/esm/FloatingLabel/index.js +0 -0
  125. package/build/esm/LineRipple/LineRipple.d.ts +3 -3
  126. package/build/esm/LineRipple/LineRipple.js +27 -18
  127. package/build/esm/LineRipple/LineRipple.js.map +1 -1
  128. package/build/esm/LineRipple/index.js +0 -0
  129. package/build/esm/Link/Link.d.ts +3 -3
  130. package/build/esm/Link/Link.js +10 -9
  131. package/build/esm/Link/Link.js.map +1 -1
  132. package/build/esm/Link/index.js +0 -0
  133. package/build/esm/List/List.d.ts +3 -3
  134. package/build/esm/List/List.js +20 -13
  135. package/build/esm/List/List.js.map +1 -1
  136. package/build/esm/List/index.js +0 -0
  137. package/build/esm/ListItem/ListItem.d.ts +3 -3
  138. package/build/esm/ListItem/ListItem.js +24 -21
  139. package/build/esm/ListItem/ListItem.js.map +1 -1
  140. package/build/esm/ListItem/ListItemText.d.ts +1 -1
  141. package/build/esm/ListItem/ListItemText.js +8 -8
  142. package/build/esm/ListItem/ListItemText.js.map +1 -1
  143. package/build/esm/ListItem/context.js +0 -0
  144. package/build/esm/ListItem/index.js +0 -0
  145. package/build/esm/Menu/Menu.d.ts +10 -10
  146. package/build/esm/Menu/Menu.js +22 -25
  147. package/build/esm/Menu/Menu.js.map +1 -1
  148. package/build/esm/Menu/animation.d.ts +1 -1
  149. package/build/esm/Menu/animation.js +1 -1
  150. package/build/esm/Menu/animation.js.map +1 -1
  151. package/build/esm/Menu/index.js +0 -0
  152. package/build/esm/NotchedOutline/NotchedOutline.d.ts +1 -1
  153. package/build/esm/NotchedOutline/NotchedOutline.js +25 -21
  154. package/build/esm/NotchedOutline/NotchedOutline.js.map +1 -1
  155. package/build/esm/NotchedOutline/context.js +6 -5
  156. package/build/esm/NotchedOutline/context.js.map +1 -1
  157. package/build/esm/NotchedOutline/index.js +0 -0
  158. package/build/esm/NotchedOutline/styledComponents.js +53 -58
  159. package/build/esm/NotchedOutline/styledComponents.js.map +1 -1
  160. package/build/esm/Paper/Paper.d.ts +4 -3
  161. package/build/esm/Paper/Paper.js +15 -13
  162. package/build/esm/Paper/Paper.js.map +1 -1
  163. package/build/esm/Paper/index.js +0 -0
  164. package/build/esm/ProgressSpinner/ProgressSpinner.d.ts +2 -2
  165. package/build/esm/ProgressSpinner/ProgressSpinner.js +16 -16
  166. package/build/esm/ProgressSpinner/ProgressSpinner.js.map +1 -1
  167. package/build/esm/ProgressSpinner/index.js +0 -0
  168. package/build/esm/RadioButton/RadioButton.d.ts +1 -1
  169. package/build/esm/RadioButton/RadioButton.js +16 -19
  170. package/build/esm/RadioButton/RadioButton.js.map +1 -1
  171. package/build/esm/RadioButton/RadioButtonIcon.d.ts +1 -1
  172. package/build/esm/RadioButton/RadioButtonIcon.js +5 -6
  173. package/build/esm/RadioButton/RadioButtonIcon.js.map +1 -1
  174. package/build/esm/RadioButton/RadioGroup.d.ts +3 -3
  175. package/build/esm/RadioButton/RadioGroup.js +5 -4
  176. package/build/esm/RadioButton/RadioGroup.js.map +1 -1
  177. package/build/esm/RadioButton/index.js +0 -0
  178. package/build/esm/Ripple/Ripple.d.ts +1 -1
  179. package/build/esm/Ripple/Ripple.js +21 -20
  180. package/build/esm/Ripple/Ripple.js.map +1 -1
  181. package/build/esm/Ripple/RippleBox.d.ts +4 -4
  182. package/build/esm/Ripple/RippleBox.js +22 -15
  183. package/build/esm/Ripple/RippleBox.js.map +1 -1
  184. package/build/esm/Ripple/constants.js +7 -7
  185. package/build/esm/Ripple/constants.js.map +1 -1
  186. package/build/esm/Ripple/index.js +0 -0
  187. package/build/esm/Ripple/keyframes.d.ts +1 -1
  188. package/build/esm/Ripple/keyframes.js +3 -3
  189. package/build/esm/Ripple/keyframes.js.map +1 -1
  190. package/build/esm/Ripple/useRipple.js +55 -48
  191. package/build/esm/Ripple/useRipple.js.map +1 -1
  192. package/build/esm/Ripple/useRippleHandlers.d.ts +1 -1
  193. package/build/esm/Ripple/useRippleHandlers.js +13 -15
  194. package/build/esm/Ripple/useRippleHandlers.js.map +1 -1
  195. package/build/esm/Ripple/useRippleSurface.d.ts +1 -1
  196. package/build/esm/Ripple/useRippleSurface.js +39 -38
  197. package/build/esm/Ripple/useRippleSurface.js.map +1 -1
  198. package/build/esm/Select/Select.d.ts +4 -4
  199. package/build/esm/Select/Select.js +69 -47
  200. package/build/esm/Select/Select.js.map +1 -1
  201. package/build/esm/Select/SelectIcon.d.ts +3 -3
  202. package/build/esm/Select/SelectIcon.js +6 -7
  203. package/build/esm/Select/SelectIcon.js.map +1 -1
  204. package/build/esm/Select/context.js +7 -6
  205. package/build/esm/Select/context.js.map +1 -1
  206. package/build/esm/Select/defaultRender.js +12 -10
  207. package/build/esm/Select/defaultRender.js.map +1 -1
  208. package/build/esm/Select/index.js +0 -0
  209. package/build/esm/Select/styledComponents.d.ts +2 -2
  210. package/build/esm/Select/styledComponents.js +16 -19
  211. package/build/esm/Select/styledComponents.js.map +1 -1
  212. package/build/esm/SelectItem/SelectItem.d.ts +2 -2
  213. package/build/esm/SelectItem/SelectItem.js +18 -19
  214. package/build/esm/SelectItem/SelectItem.js.map +1 -1
  215. package/build/esm/SelectItem/index.js +0 -0
  216. package/build/esm/SelectionControl/SelectionControlLabel.d.ts +3 -3
  217. package/build/esm/SelectionControl/SelectionControlLabel.js +7 -7
  218. package/build/esm/SelectionControl/SelectionControlLabel.js.map +1 -1
  219. package/build/esm/SelectionControl/SelectionControlText.d.ts +3 -3
  220. package/build/esm/SelectionControl/SelectionControlText.js +8 -8
  221. package/build/esm/SelectionControl/SelectionControlText.js.map +1 -1
  222. package/build/esm/SelectionControl/index.js +0 -0
  223. package/build/esm/Skeleton/DelayAppearance.d.ts +4 -4
  224. package/build/esm/Skeleton/DelayAppearance.js +9 -9
  225. package/build/esm/Skeleton/DelayAppearance.js.map +1 -1
  226. package/build/esm/Skeleton/Skeleton.d.ts +3 -3
  227. package/build/esm/Skeleton/Skeleton.js +11 -10
  228. package/build/esm/Skeleton/Skeleton.js.map +1 -1
  229. package/build/esm/Skeleton/animation.d.ts +2 -2
  230. package/build/esm/Skeleton/animation.js +25 -22
  231. package/build/esm/Skeleton/animation.js.map +1 -1
  232. package/build/esm/Skeleton/index.js +0 -0
  233. package/build/esm/Snackbar/Snackbar.d.ts +3 -3
  234. package/build/esm/Snackbar/Snackbar.js +21 -21
  235. package/build/esm/Snackbar/Snackbar.js.map +1 -1
  236. package/build/esm/Snackbar/Stack.d.ts +2 -3
  237. package/build/esm/Snackbar/Stack.js +78 -65
  238. package/build/esm/Snackbar/Stack.js.map +1 -1
  239. package/build/esm/Snackbar/index.js +0 -0
  240. package/build/esm/Snackbar/useSnackbarAnimation.d.ts +1 -1
  241. package/build/esm/Snackbar/useSnackbarAnimation.js +113 -78
  242. package/build/esm/Snackbar/useSnackbarAnimation.js.map +1 -1
  243. package/build/esm/Switch/Switch.d.ts +3 -3
  244. package/build/esm/Switch/Switch.js +21 -22
  245. package/build/esm/Switch/Switch.js.map +1 -1
  246. package/build/esm/Switch/index.js +0 -0
  247. package/build/esm/Switch/styledComponents.js +23 -25
  248. package/build/esm/Switch/styledComponents.js.map +1 -1
  249. package/build/esm/Tab/Tab.d.ts +4 -4
  250. package/build/esm/Tab/Tab.js +17 -19
  251. package/build/esm/Tab/Tab.js.map +1 -1
  252. package/build/esm/Tab/TabList.d.ts +3 -3
  253. package/build/esm/Tab/TabList.js +18 -19
  254. package/build/esm/Tab/TabList.js.map +1 -1
  255. package/build/esm/Tab/TabPanel.d.ts +3 -3
  256. package/build/esm/Tab/TabPanel.js +8 -11
  257. package/build/esm/Tab/TabPanel.js.map +1 -1
  258. package/build/esm/Tab/TabPanels.js +0 -0
  259. package/build/esm/Tab/Tabs.js +0 -0
  260. package/build/esm/Tab/context.js +6 -5
  261. package/build/esm/Tab/context.js.map +1 -1
  262. package/build/esm/Tab/index.js +0 -0
  263. package/build/esm/TabIndicator/TabIndicator.d.ts +2 -2
  264. package/build/esm/TabIndicator/TabIndicator.js +22 -21
  265. package/build/esm/TabIndicator/TabIndicator.js.map +1 -1
  266. package/build/esm/TabIndicator/context.js +6 -5
  267. package/build/esm/TabIndicator/context.js.map +1 -1
  268. package/build/esm/TabIndicator/index.js +0 -0
  269. package/build/esm/Table/Table.d.ts +2 -2
  270. package/build/esm/Table/Table.js +8 -8
  271. package/build/esm/Table/Table.js.map +1 -1
  272. package/build/esm/Table/TableBody.d.ts +2 -2
  273. package/build/esm/Table/TableBody.js +4 -6
  274. package/build/esm/Table/TableBody.js.map +1 -1
  275. package/build/esm/Table/TableCell.d.ts +2 -2
  276. package/build/esm/Table/TableCell.js +6 -8
  277. package/build/esm/Table/TableCell.js.map +1 -1
  278. package/build/esm/Table/TableHead.d.ts +2 -2
  279. package/build/esm/Table/TableHead.js +5 -7
  280. package/build/esm/Table/TableHead.js.map +1 -1
  281. package/build/esm/Table/TableRow.d.ts +2 -2
  282. package/build/esm/Table/TableRow.js +5 -7
  283. package/build/esm/Table/TableRow.js.map +1 -1
  284. package/build/esm/Table/context.js +6 -5
  285. package/build/esm/Table/context.js.map +1 -1
  286. package/build/esm/Table/index.js +0 -0
  287. package/build/esm/Text/LoremIpsum.d.ts +1 -1
  288. package/build/esm/Text/LoremIpsum.js +6 -6
  289. package/build/esm/Text/LoremIpsum.js.map +1 -1
  290. package/build/esm/Text/Text.d.ts +3 -3
  291. package/build/esm/Text/Text.js +9 -9
  292. package/build/esm/Text/Text.js.map +1 -1
  293. package/build/esm/Text/index.js +0 -0
  294. package/build/esm/TextField/FilledContainer.d.ts +3 -3
  295. package/build/esm/TextField/FilledContainer.js +56 -53
  296. package/build/esm/TextField/FilledContainer.js.map +1 -1
  297. package/build/esm/TextField/HelperText.d.ts +3 -3
  298. package/build/esm/TextField/HelperText.js +14 -13
  299. package/build/esm/TextField/HelperText.js.map +1 -1
  300. package/build/esm/TextField/IconContainer.d.ts +2 -2
  301. package/build/esm/TextField/IconContainer.js +15 -23
  302. package/build/esm/TextField/IconContainer.js.map +1 -1
  303. package/build/esm/TextField/Input.d.ts +3 -3
  304. package/build/esm/TextField/Input.js +13 -13
  305. package/build/esm/TextField/Input.js.map +1 -1
  306. package/build/esm/TextField/OutlinedContainer.d.ts +4 -4
  307. package/build/esm/TextField/OutlinedContainer.js +28 -22
  308. package/build/esm/TextField/OutlinedContainer.js.map +1 -1
  309. package/build/esm/TextField/TextField.d.ts +4 -4
  310. package/build/esm/TextField/TextField.js +59 -41
  311. package/build/esm/TextField/TextField.js.map +1 -1
  312. package/build/esm/TextField/consts.d.ts +0 -0
  313. package/build/esm/TextField/consts.js +5 -5
  314. package/build/esm/TextField/consts.js.map +1 -1
  315. package/build/esm/TextField/index.js +0 -0
  316. package/build/esm/ThemeExplorer/ColorPicker.d.ts +4 -4
  317. package/build/esm/ThemeExplorer/ColorPicker.js +14 -14
  318. package/build/esm/ThemeExplorer/ColorPicker.js.map +1 -1
  319. package/build/esm/ThemeExplorer/TextFieldColorPicker.d.ts +2 -2
  320. package/build/esm/ThemeExplorer/TextFieldColorPicker.js +44 -24
  321. package/build/esm/ThemeExplorer/TextFieldColorPicker.js.map +1 -1
  322. package/build/esm/ThemeExplorer/ThemeColors.d.ts +1 -1
  323. package/build/esm/ThemeExplorer/ThemeColors.js +3 -3
  324. package/build/esm/ThemeExplorer/ThemeColors.js.map +1 -1
  325. package/build/esm/ThemeExplorer/components.d.ts +2 -1
  326. package/build/esm/ThemeExplorer/components.js +64 -56
  327. package/build/esm/ThemeExplorer/components.js.map +1 -1
  328. package/build/esm/ThemeExplorer/makeColorScheme.d.ts +1 -1
  329. package/build/esm/ThemeExplorer/makeColorScheme.js +0 -0
  330. package/build/esm/ThemeExplorer/makeColorScheme.js.map +1 -1
  331. package/build/esm/ThemeExplorer/useDeferredColor.d.ts +1 -1
  332. package/build/esm/ThemeExplorer/useDeferredColor.js +10 -3
  333. package/build/esm/ThemeExplorer/useDeferredColor.js.map +1 -1
  334. package/build/esm/ThemeExplorer/useLocalStorageCachedState.d.ts +0 -0
  335. package/build/esm/ThemeExplorer/useLocalStorageCachedState.js +9 -2
  336. package/build/esm/ThemeExplorer/useLocalStorageCachedState.js.map +1 -1
  337. package/build/esm/Tooltip/Tooltip.d.ts +3 -3
  338. package/build/esm/Tooltip/Tooltip.js +7 -8
  339. package/build/esm/Tooltip/Tooltip.js.map +1 -1
  340. package/build/esm/Tooltip/index.js +0 -0
  341. package/build/esm/color.d.ts +3 -3
  342. package/build/esm/color.js +19 -13
  343. package/build/esm/color.js.map +1 -1
  344. package/build/esm/css.js +0 -0
  345. package/build/esm/hooks/useAnimation.d.ts +1 -1
  346. package/build/esm/hooks/useAnimation.js +54 -41
  347. package/build/esm/hooks/useAnimation.js.map +1 -1
  348. package/build/esm/index.js +0 -0
  349. package/build/esm/theme/index.js +0 -0
  350. package/build/esm/theme/theme.js +1 -1
  351. package/build/esm/theme/theme.js.map +1 -1
  352. package/build/esm/theme/typography-raleway.js +1 -1
  353. package/build/esm/theme/typography-raleway.js.map +1 -1
  354. package/build/esm/theme/typography-roboto.js +1 -1
  355. package/build/esm/theme/typography-roboto.js.map +1 -1
  356. package/build/esm/theme/useTheme.d.ts +2 -472
  357. package/build/esm/theme/useTheme.js +1 -1
  358. package/build/esm/theme/useTheme.js.map +1 -1
  359. package/build/tsconfig.tsbuildinfo +1 -1
  360. package/package.json +6 -5
  361. package/src/Alert/Alert.tsx +3 -1
  362. package/src/AppBar/AppBar.story.tsx +7 -6
  363. package/src/AppBar/AppBar.tsx +5 -3
  364. package/src/AppBar/AppBarButton.tsx +3 -1
  365. package/src/AppBar/context.ts +2 -1
  366. package/src/Badge/Badge.tsx +3 -1
  367. package/src/BaseLine/BaseLine.tsx +15 -11
  368. package/src/BottomSheet/BottomSheet.story.tsx +1 -0
  369. package/src/BottomSheet/BottomSheet.tsx +2 -1
  370. package/src/BottomSheet/BottomSheetSurface.tsx +7 -4
  371. package/src/Box/Box.tsx +21 -18
  372. package/src/Button/BaseButton.tsx +4 -2
  373. package/src/Button/Button.story.tsx +1 -0
  374. package/src/Button/Button.tsx +3 -2
  375. package/src/Button/ButtonGroup.tsx +4 -2
  376. package/src/Button/FilledButton.tsx +3 -2
  377. package/src/Button/FloatingActionButton.tsx +1 -1
  378. package/src/Button/IconButton.tsx +1 -1
  379. package/src/Button/OutlinedButton.tsx +3 -2
  380. package/src/Button/SpinnerButton.story.tsx +9 -10
  381. package/src/Button/TransparentButton.tsx +4 -4
  382. package/src/Button/context.tsx +1 -0
  383. package/src/CheckBox/CheckBox.story.tsx +3 -2
  384. package/src/CheckBox/CheckBox.tsx +9 -5
  385. package/src/CheckBox/CheckBoxIcon.tsx +4 -2
  386. package/src/Chip/ButtonChip.tsx +6 -4
  387. package/src/Chip/Chip.story.tsx +0 -1
  388. package/src/Chip/ChipBase.tsx +7 -5
  389. package/src/Chip/ChoiceChip.tsx +10 -7
  390. package/src/ColorMode/ColorModeProvider.tsx +4 -2
  391. package/src/Combobox/Combobox.story.tsx +2 -1
  392. package/src/Combobox/Combobox.tsx +29 -17
  393. package/src/Dialog/Dialog.story.tsx +3 -1
  394. package/src/Dialog/Dialog.tsx +9 -4
  395. package/src/Dialog/DialogBackdrop.tsx +6 -6
  396. package/src/Dialog/DialogContainer.tsx +3 -1
  397. package/src/Dialog/DialogSurface.tsx +8 -6
  398. package/src/Dialog/Scrim.tsx +3 -1
  399. package/src/Divider/Divider.tsx +4 -2
  400. package/src/FloatingLabel/FloatingLabel.story.tsx +1 -0
  401. package/src/FloatingLabel/FloatingLabel.tsx +3 -2
  402. package/src/LineRipple/LineRipple.story.tsx +1 -0
  403. package/src/LineRipple/LineRipple.tsx +6 -3
  404. package/src/Link/Link.tsx +4 -2
  405. package/src/List/List.tsx +5 -2
  406. package/src/ListItem/ListItem.story.tsx +1 -0
  407. package/src/ListItem/ListItem.tsx +5 -3
  408. package/src/ListItem/ListItemText.tsx +2 -1
  409. package/src/Menu/Menu.tsx +20 -12
  410. package/src/Menu/animation.ts +1 -1
  411. package/src/NotchedOutline/NotchedOutline.story.tsx +2 -1
  412. package/src/NotchedOutline/NotchedOutline.tsx +2 -1
  413. package/src/NotchedOutline/styledComponents.ts +3 -2
  414. package/src/Paper/Paper.story.tsx +2 -1
  415. package/src/Paper/Paper.tsx +22 -9
  416. package/src/ProgressSpinner/ProgressSpinner.story.tsx +1 -0
  417. package/src/ProgressSpinner/ProgressSpinner.tsx +5 -2
  418. package/src/RadioButton/RadioButton.story.tsx +2 -1
  419. package/src/RadioButton/RadioButton.tsx +9 -7
  420. package/src/RadioButton/RadioButtonIcon.tsx +2 -1
  421. package/src/RadioButton/RadioGroup.tsx +5 -5
  422. package/src/Ripple/Ripple.story.tsx +8 -2
  423. package/src/Ripple/Ripple.tsx +2 -1
  424. package/src/Ripple/RippleBox.tsx +8 -4
  425. package/src/Ripple/keyframes.ts +2 -1
  426. package/src/Ripple/useRipple.ts +1 -0
  427. package/src/Ripple/useRippleHandlers.ts +3 -1
  428. package/src/Ripple/useRippleSurface.ts +9 -7
  429. package/src/Select/PaymentMethodSelect.story.tsx +3 -1
  430. package/src/Select/Select.story.tsx +1 -0
  431. package/src/Select/Select.tsx +6 -4
  432. package/src/Select/SelectIcon.tsx +6 -3
  433. package/src/Select/defaultRender.ts +13 -13
  434. package/src/Select/styledComponents.tsx +5 -3
  435. package/src/SelectItem/SelectItem.tsx +4 -2
  436. package/src/SelectionControl/SelectionControlLabel.tsx +6 -3
  437. package/src/SelectionControl/SelectionControlText.tsx +4 -2
  438. package/src/Skeleton/DelayAppearance.tsx +5 -3
  439. package/src/Skeleton/Skeleton.tsx +4 -2
  440. package/src/Skeleton/animation.ts +3 -2
  441. package/src/Snackbar/Snackbar.story.tsx +1 -0
  442. package/src/Snackbar/Snackbar.tsx +5 -3
  443. package/src/Snackbar/Stack.tsx +3 -3
  444. package/src/Snackbar/useSnackbarAnimation.ts +3 -1
  445. package/src/Switch/Switch.tsx +9 -5
  446. package/src/Switch/styledComponents.tsx +14 -11
  447. package/src/Tab/Tab.tsx +8 -4
  448. package/src/Tab/TabList.tsx +5 -5
  449. package/src/Tab/TabPanel.tsx +5 -5
  450. package/src/TabIndicator/TabIndicator.tsx +6 -3
  451. package/src/Table/Table.tsx +4 -1
  452. package/src/Table/TableBody.tsx +3 -1
  453. package/src/Table/TableCell.tsx +3 -1
  454. package/src/Table/TableHead.tsx +4 -2
  455. package/src/Table/TableRow.tsx +4 -2
  456. package/src/Text/LoremIpsum.tsx +2 -1
  457. package/src/Text/Text.tsx +4 -2
  458. package/src/TextField/FilledContainer.tsx +5 -3
  459. package/src/TextField/HelperText.tsx +3 -2
  460. package/src/TextField/IconContainer.tsx +3 -2
  461. package/src/TextField/Input.tsx +5 -3
  462. package/src/TextField/OutlinedContainer.tsx +5 -3
  463. package/src/TextField/TextField.story.tsx +1 -0
  464. package/src/TextField/TextField.tsx +6 -3
  465. package/src/ThemeExplorer/ColorPicker.tsx +19 -16
  466. package/src/ThemeExplorer/TextFieldColorPicker.tsx +5 -2
  467. package/src/ThemeExplorer/ThemeBuilder.story.tsx +8 -12
  468. package/src/ThemeExplorer/ThemeColors.tsx +2 -1
  469. package/src/ThemeExplorer/ThemeExplorer.story.tsx +1 -0
  470. package/src/ThemeExplorer/components.tsx +5 -18
  471. package/src/ThemeExplorer/makeColorScheme.tsx +2 -1
  472. package/src/ThemeExplorer/useDeferredColor.tsx +2 -1
  473. package/src/Tooltip/Tooltip.story.tsx +1 -0
  474. package/src/Tooltip/Tooltip.tsx +8 -4
  475. package/src/color.ts +18 -16
  476. package/src/hooks/useAnimation.ts +2 -1
  477. package/src/theme/useTheme.ts +3 -1
@@ -1,16 +1,16 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
3
  import { forwardRef } from 'react';
4
+ import * as React from 'react';
4
5
  import { Text } from '../Text';
5
6
  import { alpha } from '../color';
6
7
  import { jsx as _jsx } from "react/jsx-runtime";
7
- export const SelectionControlText = /*#__PURE__*/forwardRef(function SelectionControlText(props, forwardedRef) {
8
- const {
9
- as = 'span',
10
- disabled,
11
- __css
12
- } = props,
13
- otherProps = _objectWithoutPropertiesLoose(props, ["as", "disabled", "__css"]);
8
+ export var SelectionControlText = /*#__PURE__*/forwardRef(function SelectionControlText(props, forwardedRef) {
9
+ var _props$as = props.as,
10
+ as = _props$as === void 0 ? 'span' : _props$as,
11
+ disabled = props.disabled,
12
+ __css = props.__css,
13
+ otherProps = _objectWithoutProperties(props, ["as", "disabled", "__css"]);
14
14
 
15
15
  return /*#__PURE__*/_jsx(Text, _extends({
16
16
  ref: forwardedRef,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/SelectionControl/SelectionControlText.tsx"],"names":["forwardRef","Text","alpha","SelectionControlText","props","forwardedRef","as","disabled","__css","otherProps","p","color","cursor"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,IAAT,QAAgC,SAAhC;AACA,SAASC,KAAT,QAAsB,UAAtB;;AAQA,OAAO,MAAMC,oBAAoB,gBAAGH,UAAU,CAG5C,SAASG,oBAAT,CAA8BC,KAA9B,EAAqCC,YAArC,EAAmD;AACnD,QAAM;AAAEC,IAAAA,EAAE,GAAG,MAAP;AAAeC,IAAAA,QAAf;AAAyBC,IAAAA;AAAzB,MAAkDJ,KAAxD;AAAA,QAAyCK,UAAzC,iCAAwDL,KAAxD;;AAEA,sBACE,KAAC,IAAD;AACE,IAAA,GAAG,EAAEC,YADP;AAEE,IAAA,EAAE,EAAEC,EAFN;AAGE,IAAA,KAAK;AACHI,MAAAA,CAAC,EAAE;AADA,OAECH,QAAQ,GACR;AAAEI,MAAAA,KAAK,EAAET,KAAK,CAAC,YAAD,EAAe,IAAf;AAAd,KADQ,GAER;AACEU,MAAAA,MAAM,EAAE,SADV;AAEED,MAAAA,KAAK,EAAET,KAAK,CAAC,YAAD,EAAe,IAAf;AAFd,KAJD,EAQAM,KARA;AAHP,KAaMC,UAbN,EADF;AAiBD,CAvB6C,CAAvC","sourcesContent":["import { forwardRef } from 'react';\nimport type * as React from 'react';\nimport { Text, TextProps } from '../Text';\nimport { alpha } from '../color';\n\nexport interface SelectionControlTextProps extends TextProps {\n as?: React.ElementType<any>;\n children?: React.ReactNode;\n disabled?: boolean;\n}\n\nexport const SelectionControlText = forwardRef<\n HTMLSpanElement,\n SelectionControlTextProps\n>(function SelectionControlText(props, forwardedRef) {\n const { as = 'span', disabled, __css, ...otherProps } = props;\n\n return (\n <Text\n ref={forwardedRef as any}\n as={as}\n __css={{\n p: 1,\n ...(disabled\n ? { color: alpha('on.surface', 0.38) }\n : {\n cursor: 'pointer',\n color: alpha('on.surface', 0.87),\n }),\n ...__css,\n }}\n {...otherProps}\n />\n );\n});\n"],"file":"SelectionControlText.js"}
1
+ {"version":3,"sources":["../../../src/SelectionControl/SelectionControlText.tsx"],"names":["forwardRef","React","Text","alpha","SelectionControlText","props","forwardedRef","as","disabled","__css","otherProps","p","color","cursor"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AACA,OAAO,KAAKC,KAAZ,MAAuB,OAAvB;AAGA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,KAAT,QAAsB,UAAtB;;AAQA,OAAO,IAAMC,oBAAoB,gBAAGJ,UAAU,CAG5C,SAASI,oBAAT,CAA8BC,KAA9B,EAAqCC,YAArC,EAAmD;AAAA,kBACKD,KADL,CAC3CE,EAD2C;AAAA,MAC3CA,EAD2C,0BACtC,MADsC;AAAA,MAC9BC,QAD8B,GACKH,KADL,CAC9BG,QAD8B;AAAA,MACpBC,KADoB,GACKJ,KADL,CACpBI,KADoB;AAAA,MACVC,UADU,4BACKL,KADL;;AAGnD,sBACE,KAAC,IAAD;AACE,IAAA,GAAG,EAAEC,YADP;AAEE,IAAA,EAAE,EAAEC,EAFN;AAGE,IAAA,KAAK;AACHI,MAAAA,CAAC,EAAE;AADA,OAECH,QAAQ,GACR;AAAEI,MAAAA,KAAK,EAAET,KAAK,CAAC,YAAD,EAAe,IAAf;AAAd,KADQ,GAER;AACEU,MAAAA,MAAM,EAAE,SADV;AAEED,MAAAA,KAAK,EAAET,KAAK,CAAC,YAAD,EAAe,IAAf;AAFd,KAJD,EAQAM,KARA;AAHP,KAaMC,UAbN,EADF;AAiBD,CAvB6C,CAAvC","sourcesContent":["import { forwardRef } from 'react';\nimport * as React from 'react';\n\nimport type { TextProps } from '../Text';\nimport { Text } from '../Text';\nimport { alpha } from '../color';\n\nexport interface SelectionControlTextProps extends TextProps {\n as?: React.ElementType<any>;\n children?: React.ReactNode;\n disabled?: boolean;\n}\n\nexport const SelectionControlText = forwardRef<\n HTMLSpanElement,\n SelectionControlTextProps\n>(function SelectionControlText(props, forwardedRef) {\n const { as = 'span', disabled, __css, ...otherProps } = props;\n\n return (\n <Text\n ref={forwardedRef as any}\n as={as}\n __css={{\n p: 1,\n ...(disabled\n ? { color: alpha('on.surface', 0.38) }\n : {\n cursor: 'pointer',\n color: alpha('on.surface', 0.87),\n }),\n ...__css,\n }}\n {...otherProps}\n />\n );\n});\n"],"file":"SelectionControlText.js"}
File without changes
@@ -1,6 +1,6 @@
1
- import type * as React from 'react';
2
- import { BoxProps } from '../Box';
3
- import { Keyframes } from '@emotion/serialize';
1
+ import * as React from 'react';
2
+ import type { Keyframes } from '@emotion/serialize';
3
+ import type { BoxProps } from '../Box';
4
4
  export declare const appearAnimation: Keyframes;
5
5
  export interface DelayAppearanceProps extends BoxProps {
6
6
  timeoutInMilliseconds?: number;
@@ -10,4 +10,4 @@ export interface DelayAppearanceProps extends BoxProps {
10
10
  * Helper component to prevent an Skeleton component from appearing too fast.
11
11
  * https://reactjs.org/docs/concurrent-mode-patterns.html#delaying-a-pending-indicator
12
12
  */
13
- export declare const DelayAppearance: React.ForwardRefExoticComponent<Pick<DelayAppearanceProps, "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" | "p" | "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" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "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" | "timeoutInMilliseconds" | "key"> & React.RefAttributes<HTMLDivElement>>;
13
+ export declare const DelayAppearance: React.ForwardRefExoticComponent<Pick<DelayAppearanceProps, "children" | "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" | "timeoutInMilliseconds" | "key"> & React.RefAttributes<HTMLDivElement>>;
@@ -1,10 +1,11 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
3
  import { forwardRef } from 'react';
4
- import { Box } from '../Box';
4
+ import * as React from 'react';
5
5
  import { keyframes } from '@emotion/react';
6
+ import { Box } from '../Box';
6
7
  import { jsx as _jsx } from "react/jsx-runtime";
7
- export const appearAnimation = keyframes({
8
+ export var appearAnimation = keyframes({
8
9
  to: {
9
10
  visibility: 'visible'
10
11
  }
@@ -14,12 +15,11 @@ export const appearAnimation = keyframes({
14
15
  * Helper component to prevent an Skeleton component from appearing too fast.
15
16
  * https://reactjs.org/docs/concurrent-mode-patterns.html#delaying-a-pending-indicator
16
17
  */
17
- export const DelayAppearance = /*#__PURE__*/forwardRef(function DelayAppearance(props, forwardedRef) {
18
- const {
19
- timeoutInMilliseconds = 500,
20
- __css
21
- } = props,
22
- otherProps = _objectWithoutPropertiesLoose(props, ["timeoutInMilliseconds", "__css"]);
18
+ export var DelayAppearance = /*#__PURE__*/forwardRef(function DelayAppearance(props, forwardedRef) {
19
+ var _props$timeoutInMilli = props.timeoutInMilliseconds,
20
+ timeoutInMilliseconds = _props$timeoutInMilli === void 0 ? 500 : _props$timeoutInMilli,
21
+ __css = props.__css,
22
+ otherProps = _objectWithoutProperties(props, ["timeoutInMilliseconds", "__css"]);
23
23
 
24
24
  return /*#__PURE__*/_jsx(Box, _extends({
25
25
  ref: forwardedRef,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Skeleton/DelayAppearance.tsx"],"names":["forwardRef","Box","keyframes","appearAnimation","to","visibility","DelayAppearance","props","forwardedRef","timeoutInMilliseconds","__css","otherProps","animation"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAAmBC,GAAnB,QAA8B,QAA9B;AACA,SAASC,SAAT,QAA0B,gBAA1B;;AAGA,OAAO,MAAMC,eAA0B,GAAGD,SAAS,CAAC;AAClDE,EAAAA,EAAE,EAAE;AACFC,IAAAA,UAAU,EAAE;AADV;AAD8C,CAAD,CAA5C;;AAWP;AACA;AACA;AACA;AACA,OAAO,MAAMC,eAAe,gBAAGN,UAAU,CACvC,SAASM,eAAT,CAAyBC,KAAzB,EAAgCC,YAAhC,EAA8C;AAC5C,QAAM;AAAEC,IAAAA,qBAAqB,GAAG,GAA1B;AAA+BC,IAAAA;AAA/B,MAAwDH,KAA9D;AAAA,QAA+CI,UAA/C,iCAA8DJ,KAA9D;;AAEA,sBACE,KAAC,GAAD;AACE,IAAA,GAAG,EAAEC,YADP;AAEE,IAAA,qBAAqB,EAAEC,qBAFzB;AAGE,IAAA,KAAK;AACHG,MAAAA,SAAS,sBAAeH,qBAAf,yBAAmDN,eAAnD,CADN;AAEHE,MAAAA,UAAU,EAAE;AAFT,OAGAK,KAHA;AAHP,KAQMC,UARN,EADF;AAYD,CAhBsC,CAAlC","sourcesContent":["import { forwardRef } from 'react';\nimport type * as React from 'react';\nimport { BoxProps, Box } from '../Box';\nimport { keyframes } from '@emotion/react';\nimport { Keyframes } from '@emotion/serialize';\n\nexport const appearAnimation: Keyframes = keyframes({\n to: {\n visibility: 'visible',\n },\n});\n\nexport interface DelayAppearanceProps extends BoxProps {\n timeoutInMilliseconds?: number;\n children?: React.ReactNode;\n}\n\n/**\n * Helper component to prevent an Skeleton component from appearing too fast.\n * https://reactjs.org/docs/concurrent-mode-patterns.html#delaying-a-pending-indicator\n */\nexport const DelayAppearance = forwardRef<HTMLDivElement, DelayAppearanceProps>(\n function DelayAppearance(props, forwardedRef) {\n const { timeoutInMilliseconds = 500, __css, ...otherProps } = props;\n\n return (\n <Box\n ref={forwardedRef}\n timeoutInMilliseconds={timeoutInMilliseconds}\n __css={{\n animation: `0s linear ${timeoutInMilliseconds}ms forwards ${appearAnimation}`,\n visibility: 'hidden',\n ...__css,\n }}\n {...otherProps}\n />\n );\n }\n);\n"],"file":"DelayAppearance.js"}
1
+ {"version":3,"sources":["../../../src/Skeleton/DelayAppearance.tsx"],"names":["forwardRef","React","keyframes","Box","appearAnimation","to","visibility","DelayAppearance","props","forwardedRef","timeoutInMilliseconds","__css","otherProps","animation"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AACA,OAAO,KAAKC,KAAZ,MAAuB,OAAvB;AACA,SAASC,SAAT,QAA0B,gBAA1B;AAIA,SAASC,GAAT,QAAoB,QAApB;;AAEA,OAAO,IAAMC,eAA0B,GAAGF,SAAS,CAAC;AAClDG,EAAAA,EAAE,EAAE;AACFC,IAAAA,UAAU,EAAE;AADV;AAD8C,CAAD,CAA5C;;AAWP;AACA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,gBAAGP,UAAU,CACvC,SAASO,eAAT,CAAyBC,KAAzB,EAAgCC,YAAhC,EAA8C;AAAA,8BACkBD,KADlB,CACpCE,qBADoC;AAAA,MACpCA,qBADoC,sCACZ,GADY;AAAA,MACPC,KADO,GACkBH,KADlB,CACPG,KADO;AAAA,MACGC,UADH,4BACkBJ,KADlB;;AAG5C,sBACE,KAAC,GAAD;AACE,IAAA,GAAG,EAAEC,YADP;AAEE,IAAA,qBAAqB,EAAEC,qBAFzB;AAGE,IAAA,KAAK;AACHG,MAAAA,SAAS,sBAAeH,qBAAf,yBAAmDN,eAAnD,CADN;AAEHE,MAAAA,UAAU,EAAE;AAFT,OAGAK,KAHA;AAHP,KAQMC,UARN,EADF;AAYD,CAhBsC,CAAlC","sourcesContent":["import { forwardRef } from 'react';\nimport * as React from 'react';\nimport { keyframes } from '@emotion/react';\nimport type { Keyframes } from '@emotion/serialize';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\n\nexport const appearAnimation: Keyframes = keyframes({\n to: {\n visibility: 'visible',\n },\n});\n\nexport interface DelayAppearanceProps extends BoxProps {\n timeoutInMilliseconds?: number;\n children?: React.ReactNode;\n}\n\n/**\n * Helper component to prevent an Skeleton component from appearing too fast.\n * https://reactjs.org/docs/concurrent-mode-patterns.html#delaying-a-pending-indicator\n */\nexport const DelayAppearance = forwardRef<HTMLDivElement, DelayAppearanceProps>(\n function DelayAppearance(props, forwardedRef) {\n const { timeoutInMilliseconds = 500, __css, ...otherProps } = props;\n\n return (\n <Box\n ref={forwardedRef}\n timeoutInMilliseconds={timeoutInMilliseconds}\n __css={{\n animation: `0s linear ${timeoutInMilliseconds}ms forwards ${appearAnimation}`,\n visibility: 'hidden',\n ...__css,\n }}\n {...otherProps}\n />\n );\n }\n);\n"],"file":"DelayAppearance.js"}
@@ -1,9 +1,9 @@
1
- import type * as React from 'react';
2
- import { BoxProps } from '../Box';
1
+ import * as React from 'react';
2
+ import type { BoxProps } from '../Box';
3
3
  export interface SkeletonProps extends BoxProps<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>> {
4
4
  as?: React.ElementType<any>;
5
5
  innerAs?: React.ElementType<any>;
6
6
  children?: React.ReactNode;
7
7
  animation?: 'pulse' | 'wave';
8
8
  }
9
- export declare const Skeleton: React.ForwardRefExoticComponent<Pick<SkeletonProps, "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" | "animation" | "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" | "p" | "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" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "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" | "key" | "innerAs"> & React.RefAttributes<HTMLSpanElement>>;
9
+ export declare const Skeleton: React.ForwardRefExoticComponent<Pick<SkeletonProps, "children" | "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" | "animation" | "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" | "innerAs"> & React.RefAttributes<HTMLSpanElement>>;
@@ -1,20 +1,21 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
3
  import { forwardRef } from 'react';
4
+ import * as React from 'react';
4
5
  import { Box } from '../Box';
5
6
  import { alpha } from '../color';
6
7
  import { useTheme } from '../theme';
7
8
  import { pulseAnimationStyle, waveAnimationStyle } from './animation';
8
9
  import { jsx as _jsx } from "react/jsx-runtime";
9
- export const Skeleton = /*#__PURE__*/forwardRef(function Skeleton(props, forwardedRef) {
10
- const {
11
- as = 'span',
12
- __css,
13
- animation = 'pulse'
14
- } = props,
15
- otherProps = _objectWithoutPropertiesLoose(props, ["as", "__css", "animation"]);
10
+ export var Skeleton = /*#__PURE__*/forwardRef(function Skeleton(props, forwardedRef) {
11
+ var _props$as = props.as,
12
+ as = _props$as === void 0 ? 'span' : _props$as,
13
+ __css = props.__css,
14
+ _props$animation = props.animation,
15
+ animation = _props$animation === void 0 ? 'pulse' : _props$animation,
16
+ otherProps = _objectWithoutProperties(props, ["as", "__css", "animation"]);
16
17
 
17
- const theme = useTheme();
18
+ var theme = useTheme();
18
19
  return /*#__PURE__*/_jsx(Box, _extends({
19
20
  ref: forwardedRef,
20
21
  as: as,
@@ -23,7 +24,7 @@ export const Skeleton = /*#__PURE__*/forwardRef(function Skeleton(props, forward
23
24
  display: 'inline-block',
24
25
  backgroundColor: alpha('on.surface', 0.11)
25
26
  }, animation === 'pulse' ? pulseAnimationStyle() : waveAnimationStyle({
26
- theme
27
+ theme: theme
27
28
  }), __css)
28
29
  }, otherProps));
29
30
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Skeleton/Skeleton.tsx"],"names":["forwardRef","Box","alpha","useTheme","pulseAnimationStyle","waveAnimationStyle","Skeleton","props","forwardedRef","as","__css","animation","otherProps","theme","height","display","backgroundColor"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,GAAT,QAA8B,QAA9B;AACA,SAASC,KAAT,QAAsB,UAAtB;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,SAASC,mBAAT,EAA8BC,kBAA9B,QAAwD,aAAxD;;AAUA,OAAO,MAAMC,QAAQ,gBAAGN,UAAU,CAChC,SAASM,QAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAuC;AACrC,QAAM;AAAEC,IAAAA,EAAE,GAAG,MAAP;AAAeC,IAAAA,KAAf;AAAsBC,IAAAA,SAAS,GAAG;AAAlC,MAA6DJ,KAAnE;AAAA,QAAoDK,UAApD,iCAAmEL,KAAnE;;AACA,QAAMM,KAAK,GAAGV,QAAQ,EAAtB;AAEA,sBACE,KAAC,GAAD;AACE,IAAA,GAAG,EAAEK,YADP;AAEE,IAAA,EAAE,EAAEC,EAFN;AAGE,IAAA,KAAK;AACHK,MAAAA,MAAM,EAAE,OADL;AAEHC,MAAAA,OAAO,EAAE,cAFN;AAGHC,MAAAA,eAAe,EAAEd,KAAK,CAAC,YAAD,EAAe,IAAf;AAHnB,OAICS,SAAS,KAAK,OAAd,GACAP,mBAAmB,EADnB,GAEAC,kBAAkB,CAAC;AAAEQ,MAAAA;AAAF,KAAD,CANnB,EAOAH,KAPA;AAHP,KAYME,UAZN,EADF;AAgBD,CArB+B,CAA3B","sourcesContent":["import { forwardRef } from 'react';\nimport type * as React from 'react';\nimport { Box, BoxProps } from '../Box';\nimport { alpha } from '../color';\nimport { useTheme } from '../theme';\nimport { pulseAnimationStyle, waveAnimationStyle } from './animation';\n\nexport interface SkeletonProps\n extends BoxProps<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>> {\n as?: React.ElementType<any>;\n innerAs?: React.ElementType<any>;\n children?: React.ReactNode;\n animation?: 'pulse' | 'wave';\n}\n\nexport const Skeleton = forwardRef<HTMLSpanElement, SkeletonProps>(\n function Skeleton(props, forwardedRef) {\n const { as = 'span', __css, animation = 'pulse', ...otherProps } = props;\n const theme = useTheme();\n\n return (\n <Box<BoxProps<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>>>\n ref={forwardedRef}\n as={as}\n __css={{\n height: '1.2em',\n display: 'inline-block',\n backgroundColor: alpha('on.surface', 0.11),\n ...(animation === 'pulse'\n ? pulseAnimationStyle()\n : waveAnimationStyle({ theme })),\n ...__css,\n }}\n {...otherProps}\n />\n );\n }\n);\n"],"file":"Skeleton.js"}
1
+ {"version":3,"sources":["../../../src/Skeleton/Skeleton.tsx"],"names":["forwardRef","React","Box","alpha","useTheme","pulseAnimationStyle","waveAnimationStyle","Skeleton","props","forwardedRef","as","__css","animation","otherProps","theme","height","display","backgroundColor"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AACA,OAAO,KAAKC,KAAZ,MAAuB,OAAvB;AAGA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,KAAT,QAAsB,UAAtB;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,SAASC,mBAAT,EAA8BC,kBAA9B,QAAwD,aAAxD;;AAUA,OAAO,IAAMC,QAAQ,gBAAGP,UAAU,CAChC,SAASO,QAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAuC;AAAA,kBAC8BD,KAD9B,CAC7BE,EAD6B;AAAA,MAC7BA,EAD6B,0BACxB,MADwB;AAAA,MAChBC,KADgB,GAC8BH,KAD9B,CAChBG,KADgB;AAAA,yBAC8BH,KAD9B,CACTI,SADS;AAAA,MACTA,SADS,iCACG,OADH;AAAA,MACeC,UADf,4BAC8BL,KAD9B;;AAErC,MAAMM,KAAK,GAAGV,QAAQ,EAAtB;AAEA,sBACE,KAAC,GAAD;AACE,IAAA,GAAG,EAAEK,YADP;AAEE,IAAA,EAAE,EAAEC,EAFN;AAGE,IAAA,KAAK;AACHK,MAAAA,MAAM,EAAE,OADL;AAEHC,MAAAA,OAAO,EAAE,cAFN;AAGHC,MAAAA,eAAe,EAAEd,KAAK,CAAC,YAAD,EAAe,IAAf;AAHnB,OAICS,SAAS,KAAK,OAAd,GACAP,mBAAmB,EADnB,GAEAC,kBAAkB,CAAC;AAAEQ,MAAAA,KAAK,EAALA;AAAF,KAAD,CANnB,EAOAH,KAPA;AAHP,KAYME,UAZN,EADF;AAgBD,CArB+B,CAA3B","sourcesContent":["import { forwardRef } from 'react';\nimport * as React from 'react';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\nimport { alpha } from '../color';\nimport { useTheme } from '../theme';\nimport { pulseAnimationStyle, waveAnimationStyle } from './animation';\n\nexport interface SkeletonProps\n extends BoxProps<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>> {\n as?: React.ElementType<any>;\n innerAs?: React.ElementType<any>;\n children?: React.ReactNode;\n animation?: 'pulse' | 'wave';\n}\n\nexport const Skeleton = forwardRef<HTMLSpanElement, SkeletonProps>(\n function Skeleton(props, forwardedRef) {\n const { as = 'span', __css, animation = 'pulse', ...otherProps } = props;\n const theme = useTheme();\n\n return (\n <Box<BoxProps<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>>>\n ref={forwardedRef}\n as={as}\n __css={{\n height: '1.2em',\n display: 'inline-block',\n backgroundColor: alpha('on.surface', 0.11),\n ...(animation === 'pulse'\n ? pulseAnimationStyle()\n : waveAnimationStyle({ theme })),\n ...__css,\n }}\n {...otherProps}\n />\n );\n }\n);\n"],"file":"Skeleton.js"}
@@ -1,5 +1,5 @@
1
- import { Keyframes } from '@emotion/serialize';
2
- import { SystemStyleObject } from '@styled-system/css';
1
+ import type { Keyframes } from '@emotion/serialize';
2
+ import type { SystemStyleObject } from '@styled-system/css';
3
3
  export declare const pulseAnimation: Keyframes;
4
4
  export declare const pulseAnimationStyle: () => SystemStyleObject;
5
5
  export declare const waveAnimation: Keyframes;
@@ -1,6 +1,6 @@
1
1
  import { keyframes } from '@emotion/react';
2
2
  import { alpha } from '../color';
3
- export const pulseAnimation = keyframes({
3
+ export var pulseAnimation = keyframes({
4
4
  '0%': {
5
5
  opacity: 1
6
6
  },
@@ -11,10 +11,12 @@ export const pulseAnimation = keyframes({
11
11
  opacity: 1
12
12
  }
13
13
  });
14
- export const pulseAnimationStyle = () => ({
15
- animation: "".concat(pulseAnimation, " 1.5s ease-in-out 0.5s infinite")
16
- });
17
- export const waveAnimation = keyframes({
14
+ export var pulseAnimationStyle = function pulseAnimationStyle() {
15
+ return {
16
+ animation: "".concat(pulseAnimation, " 1.5s ease-in-out 0.5s infinite")
17
+ };
18
+ };
19
+ export var waveAnimation = keyframes({
18
20
  '0%': {
19
21
  transform: 'translateX(-100%)'
20
22
  },
@@ -25,21 +27,22 @@ export const waveAnimation = keyframes({
25
27
  transform: 'translateX(100%)'
26
28
  }
27
29
  });
28
- export const waveAnimationStyle = ({
29
- theme
30
- }) => ({
31
- overflow: 'hidden',
32
- position: 'relative',
33
- '&::after': {
34
- position: 'absolute',
35
- content: '""',
36
- top: 0,
37
- left: 0,
38
- right: 0,
39
- bottom: 0,
40
- animation: "".concat(waveAnimation, " 1.6s linear 0.5s infinite"),
41
- transform: 'translateX(-100%)',
42
- background: "linear-gradient(90deg, transparent, ".concat(alpha('on.surface', 0.04)(theme), ", transparent)")
43
- }
44
- });
30
+ export var waveAnimationStyle = function waveAnimationStyle(_ref) {
31
+ var theme = _ref.theme;
32
+ return {
33
+ overflow: 'hidden',
34
+ position: 'relative',
35
+ '&::after': {
36
+ position: 'absolute',
37
+ content: '""',
38
+ top: 0,
39
+ left: 0,
40
+ right: 0,
41
+ bottom: 0,
42
+ animation: "".concat(waveAnimation, " 1.6s linear 0.5s infinite"),
43
+ transform: 'translateX(-100%)',
44
+ background: "linear-gradient(90deg, transparent, ".concat(alpha('on.surface', 0.04)(theme), ", transparent)")
45
+ }
46
+ };
47
+ };
45
48
  //# sourceMappingURL=animation.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Skeleton/animation.ts"],"names":["keyframes","alpha","pulseAnimation","opacity","pulseAnimationStyle","animation","waveAnimation","transform","waveAnimationStyle","theme","overflow","position","content","top","left","right","bottom","background"],"mappings":"AAAA,SAASA,SAAT,QAA0B,gBAA1B;AAGA,SAASC,KAAT,QAAsB,UAAtB;AAEA,OAAO,MAAMC,cAAyB,GAAGF,SAAS,CAAC;AACjD,QAAM;AACJG,IAAAA,OAAO,EAAE;AADL,GAD2C;AAIjD,SAAO;AACLA,IAAAA,OAAO,EAAE;AADJ,GAJ0C;AAOjD,UAAQ;AACNA,IAAAA,OAAO,EAAE;AADH;AAPyC,CAAD,CAA3C;AAYP,OAAO,MAAMC,mBAA4C,GAAG,OAAO;AACjEC,EAAAA,SAAS,YAAKH,cAAL;AADwD,CAAP,CAArD;AAIP,OAAO,MAAMI,aAAwB,GAAGN,SAAS,CAAC;AAChD,QAAM;AACJO,IAAAA,SAAS,EAAE;AADP,GAD0C;AAIhD,SAAO;AACLA,IAAAA,SAAS,EAAE;AADN,GAJyC;AAOhD,UAAQ;AACNA,IAAAA,SAAS,EAAE;AADL;AAPwC,CAAD,CAA1C;AAYP,OAAO,MAAMC,kBAA8D,GAAG,CAAC;AAC7EC,EAAAA;AAD6E,CAAD,MAElE;AACVC,EAAAA,QAAQ,EAAE,QADA;AAEVC,EAAAA,QAAQ,EAAE,UAFA;AAGV,cAAY;AACVA,IAAAA,QAAQ,EAAE,UADA;AAEVC,IAAAA,OAAO,EAAE,IAFC;AAGVC,IAAAA,GAAG,EAAE,CAHK;AAIVC,IAAAA,IAAI,EAAE,CAJI;AAKVC,IAAAA,KAAK,EAAE,CALG;AAMVC,IAAAA,MAAM,EAAE,CANE;AAOVX,IAAAA,SAAS,YAAKC,aAAL,+BAPC;AAQVC,IAAAA,SAAS,EAAE,mBARD;AASVU,IAAAA,UAAU,gDAAyChB,KAAK,CACtD,YADsD,EAEtD,IAFsD,CAAL,CAGjDQ,KAHiD,CAAzC;AATA;AAHF,CAFkE,CAAvE","sourcesContent":["import { keyframes } from '@emotion/react';\nimport { Keyframes } from '@emotion/serialize';\nimport { SystemStyleObject } from '@styled-system/css';\nimport { alpha } from '../color';\n\nexport const pulseAnimation: Keyframes = keyframes({\n '0%': {\n opacity: 1,\n },\n '50%': {\n opacity: 0.4,\n },\n '100%': {\n opacity: 1,\n },\n});\n\nexport const pulseAnimationStyle: () => SystemStyleObject = () => ({\n animation: `${pulseAnimation} 1.5s ease-in-out 0.5s infinite`,\n});\n\nexport const waveAnimation: Keyframes = keyframes({\n '0%': {\n transform: 'translateX(-100%)',\n },\n '60%': {\n transform: 'translateX(100%)',\n },\n '100%': {\n transform: 'translateX(100%)',\n },\n});\n\nexport const waveAnimationStyle: (obj: { theme: any }) => SystemStyleObject = ({\n theme,\n}: any) => ({\n overflow: 'hidden',\n position: 'relative',\n '&::after': {\n position: 'absolute',\n content: '\"\"',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n animation: `${waveAnimation} 1.6s linear 0.5s infinite`,\n transform: 'translateX(-100%)',\n background: `linear-gradient(90deg, transparent, ${alpha(\n 'on.surface',\n 0.04\n )(theme)}, transparent)`,\n },\n});\n"],"file":"animation.js"}
1
+ {"version":3,"sources":["../../../src/Skeleton/animation.ts"],"names":["keyframes","alpha","pulseAnimation","opacity","pulseAnimationStyle","animation","waveAnimation","transform","waveAnimationStyle","theme","overflow","position","content","top","left","right","bottom","background"],"mappings":"AAAA,SAASA,SAAT,QAA0B,gBAA1B;AAIA,SAASC,KAAT,QAAsB,UAAtB;AAEA,OAAO,IAAMC,cAAyB,GAAGF,SAAS,CAAC;AACjD,QAAM;AACJG,IAAAA,OAAO,EAAE;AADL,GAD2C;AAIjD,SAAO;AACLA,IAAAA,OAAO,EAAE;AADJ,GAJ0C;AAOjD,UAAQ;AACNA,IAAAA,OAAO,EAAE;AADH;AAPyC,CAAD,CAA3C;AAYP,OAAO,IAAMC,mBAA4C,GAAG,SAA/CA,mBAA+C;AAAA,SAAO;AACjEC,IAAAA,SAAS,YAAKH,cAAL;AADwD,GAAP;AAAA,CAArD;AAIP,OAAO,IAAMI,aAAwB,GAAGN,SAAS,CAAC;AAChD,QAAM;AACJO,IAAAA,SAAS,EAAE;AADP,GAD0C;AAIhD,SAAO;AACLA,IAAAA,SAAS,EAAE;AADN,GAJyC;AAOhD,UAAQ;AACNA,IAAAA,SAAS,EAAE;AADL;AAPwC,CAAD,CAA1C;AAYP,OAAO,IAAMC,kBAA8D,GAAG,SAAjEA,kBAAiE;AAAA,MAC5EC,KAD4E,QAC5EA,KAD4E;AAAA,SAElE;AACVC,IAAAA,QAAQ,EAAE,QADA;AAEVC,IAAAA,QAAQ,EAAE,UAFA;AAGV,gBAAY;AACVA,MAAAA,QAAQ,EAAE,UADA;AAEVC,MAAAA,OAAO,EAAE,IAFC;AAGVC,MAAAA,GAAG,EAAE,CAHK;AAIVC,MAAAA,IAAI,EAAE,CAJI;AAKVC,MAAAA,KAAK,EAAE,CALG;AAMVC,MAAAA,MAAM,EAAE,CANE;AAOVX,MAAAA,SAAS,YAAKC,aAAL,+BAPC;AAQVC,MAAAA,SAAS,EAAE,mBARD;AASVU,MAAAA,UAAU,gDAAyChB,KAAK,CACtD,YADsD,EAEtD,IAFsD,CAAL,CAGjDQ,KAHiD,CAAzC;AATA;AAHF,GAFkE;AAAA,CAAvE","sourcesContent":["import { keyframes } from '@emotion/react';\nimport type { Keyframes } from '@emotion/serialize';\nimport type { SystemStyleObject } from '@styled-system/css';\n\nimport { alpha } from '../color';\n\nexport const pulseAnimation: Keyframes = keyframes({\n '0%': {\n opacity: 1,\n },\n '50%': {\n opacity: 0.4,\n },\n '100%': {\n opacity: 1,\n },\n});\n\nexport const pulseAnimationStyle: () => SystemStyleObject = () => ({\n animation: `${pulseAnimation} 1.5s ease-in-out 0.5s infinite`,\n});\n\nexport const waveAnimation: Keyframes = keyframes({\n '0%': {\n transform: 'translateX(-100%)',\n },\n '60%': {\n transform: 'translateX(100%)',\n },\n '100%': {\n transform: 'translateX(100%)',\n },\n});\n\nexport const waveAnimationStyle: (obj: { theme: any }) => SystemStyleObject = ({\n theme,\n}: any) => ({\n overflow: 'hidden',\n position: 'relative',\n '&::after': {\n position: 'absolute',\n content: '\"\"',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n animation: `${waveAnimation} 1.6s linear 0.5s infinite`,\n transform: 'translateX(-100%)',\n background: `linear-gradient(90deg, transparent, ${alpha(\n 'on.surface',\n 0.04\n )(theme)}, transparent)`,\n },\n});\n"],"file":"animation.js"}
File without changes
@@ -1,8 +1,8 @@
1
- import type * as React from 'react';
2
- import { PaperProps } from '../Paper';
1
+ import * as React from 'react';
2
+ import type { PaperProps } from '../Paper';
3
3
  export interface SnackbarProps extends PaperProps {
4
4
  action?: React.ReactElement;
5
5
  timeout?: number;
6
6
  dismissible?: boolean;
7
7
  }
8
- export declare const Snackbar: React.ForwardRefExoticComponent<Pick<SnackbarProps, "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" | "p" | "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" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "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" | "key" | "elevation" | "outlined" | "backgroundOverlay" | "action" | "timeout" | "dismissible"> & React.RefAttributes<HTMLDivElement>>;
8
+ export declare const Snackbar: React.ForwardRefExoticComponent<Pick<SnackbarProps, "children" | "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" | "elevation" | "outlined" | "backgroundOverlay" | "darkThemeBackgroundOverlay" | "action" | "timeout" | "dismissible"> & React.RefAttributes<HTMLDivElement>>;
@@ -1,7 +1,8 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
3
  import { assignMultipleRefs } from '@basic-ui/core';
4
4
  import { cloneElement, forwardRef, useRef } from 'react';
5
+ import * as React from 'react';
5
6
  import { Box } from '../Box';
6
7
  import { DARK_THEME_CLASS, DEFAULT_THEME_CLASS, useColorMode } from '../ColorMode';
7
8
  import { Paper } from '../Paper';
@@ -9,30 +10,29 @@ import { Text } from '../Text';
9
10
  import { useSnackbarAnimation } from './useSnackbarAnimation';
10
11
  import { jsx as _jsx } from "react/jsx-runtime";
11
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
12
- export const Snackbar = /*#__PURE__*/forwardRef(function Snackbar(props, forwardedRef) {
13
- const {
14
- colorMode
15
- } = useColorMode();
16
- const ref = useRef(null);
13
+ export var Snackbar = /*#__PURE__*/forwardRef(function Snackbar(props, forwardedRef) {
14
+ var _useColorMode = useColorMode(),
15
+ colorMode = _useColorMode.colorMode;
17
16
 
18
- const {
19
- __css,
20
- action,
21
- children,
22
- style: styleProp,
23
- timeout = 5000,
24
- dismissible
25
- } = props,
26
- otherProps = _objectWithoutPropertiesLoose(props, ["__css", "action", "children", "style", "timeout", "dismissible"]);
17
+ var ref = useRef(null);
18
+
19
+ var __css = props.__css,
20
+ action = props.action,
21
+ children = props.children,
22
+ styleProp = props.style,
23
+ _props$timeout = props.timeout,
24
+ timeout = _props$timeout === void 0 ? 5000 : _props$timeout,
25
+ dismissible = props.dismissible,
26
+ otherProps = _objectWithoutProperties(props, ["__css", "action", "children", "style", "timeout", "dismissible"]);
27
+
28
+ var _useSnackbarAnimation = useSnackbarAnimation(ref, timeout),
29
+ onClose = _useSnackbarAnimation.onClose,
30
+ placementStyle = _useSnackbarAnimation.placementStyle,
31
+ style = _useSnackbarAnimation.style;
27
32
 
28
- const {
29
- onClose,
30
- placementStyle,
31
- style
32
- } = useSnackbarAnimation(ref, timeout);
33
33
  return /*#__PURE__*/_jsxs(Paper, _extends({
34
34
  elevation: 4,
35
- backgroundOverlay: 4,
35
+ darkThemeBackgroundOverlay: 4,
36
36
  className: colorMode === 'default' ? DARK_THEME_CLASS : DEFAULT_THEME_CLASS,
37
37
  ref: assignMultipleRefs(forwardedRef, ref),
38
38
  __css: _extends({
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Snackbar/Snackbar.tsx"],"names":["assignMultipleRefs","cloneElement","forwardRef","useRef","Box","DARK_THEME_CLASS","DEFAULT_THEME_CLASS","useColorMode","Paper","Text","useSnackbarAnimation","Snackbar","props","forwardedRef","colorMode","ref","__css","action","children","style","styleProp","timeout","dismissible","otherProps","onClose","placementStyle","boxShadow","py","pl","pr","display","minWidth","maxWidth","borderRadius","color","flexDirection","willChange","onClick"],"mappings":";;AAAA,SAASA,kBAAT,QAAmC,gBAAnC;AAEA,SAASC,YAAT,EAAuBC,UAAvB,EAAmCC,MAAnC,QAAiD,OAAjD;AAEA,SAASC,GAAT,QAAoB,QAApB;AACA,SACEC,gBADF,EAEEC,mBAFF,EAGEC,YAHF,QAIO,cAJP;AAKA,SAASC,KAAT,QAAkC,UAAlC;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,oBAAT,QAAqC,wBAArC;;;AAQA,OAAO,MAAMC,QAAQ,gBAAGT,UAAU,CAChC,SAASS,QAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAuC;AACrC,QAAM;AAAEC,IAAAA;AAAF,MAAgBP,YAAY,EAAlC;AACA,QAAMQ,GAAG,GAAGZ,MAAM,CAAwB,IAAxB,CAAlB;;AACA,QAAM;AACJa,IAAAA,KADI;AAEJC,IAAAA,MAFI;AAGJC,IAAAA,QAHI;AAIJC,IAAAA,KAAK,EAAEC,SAJH;AAKJC,IAAAA,OAAO,GAAG,IALN;AAMJC,IAAAA;AANI,MAQFV,KARJ;AAAA,QAOKW,UAPL,iCAQIX,KARJ;;AAUA,QAAM;AAAEY,IAAAA,OAAF;AAAWC,IAAAA,cAAX;AAA2BN,IAAAA;AAA3B,MAAqCT,oBAAoB,CAC7DK,GAD6D,EAE7DM,OAF6D,CAA/D;AAKA,sBACE,MAAC,KAAD;AACE,IAAA,SAAS,EAAE,CADb;AAEE,IAAA,iBAAiB,EAAE,CAFrB;AAGE,IAAA,SAAS,EACPP,SAAS,KAAK,SAAd,GAA0BT,gBAA1B,GAA6CC,mBAJjD;AAME,IAAA,GAAG,EAAEN,kBAAkB,CAACa,YAAD,EAAeE,GAAf,CANzB;AAOE,IAAA,KAAK;AACHW,MAAAA,SAAS,EAAE,CADR;AAEHC,MAAAA,EAAE,YAFC;AAGHC,MAAAA,EAAE,EAAE,CAHD;AAIHC,MAAAA,EAAE,EAAE,CAJD;AAKHC,MAAAA,OAAO,EAAE,aALN;AAMHC,MAAAA,QAAQ,qCANL;AAOHC,MAAAA,QAAQ,EAAE,CAAC,MAAD,EAAS,OAAT,CAPP;AAQHC,MAAAA,YAAY,EAAE,aARX;AASHC,MAAAA,KAAK,EAAE,YATJ;AAUHC,MAAAA,aAAa,EAAE,KAVZ;AAWHC,MAAAA,UAAU,EAAE;AAXT,OAYAX,cAZA,EAaAT,KAbA,CAPP;AAsBE,IAAA,KAAK,eACAG,KADA,EAEAC,SAFA;AAtBP,KA0BMG,UA1BN;AAAA,4BA4BE,KAAC,IAAD;AAAM,MAAA,OAAO,EAAC,OAAd;AAAsB,MAAA,EAAE,EAAC,MAAzB;AAAgC,MAAA,EAAE,EAAE,CAApC;AAAA,gBACGL;AADH,MA5BF,EA+BGD,MAAM,iBACL,KAAC,GAAD;AAAK,MAAA,EAAE,EAAC,MAAR;AAAe,MAAA,EAAE,EAAE,CAAnB;AAAsB,MAAA,EAAE,EAAE,CAAC,CAA3B;AAA8B,MAAA,EAAE,EAAC,MAAjC;AAAwC,MAAA,QAAQ,EAAC,MAAjD;AAAA,gBACGK,WAAW,gBAAGrB,YAAY,CAACgB,MAAD,EAAS;AAAEoB,QAAAA,OAAO,EAAEb;AAAX,OAAT,CAAf,GAAgDP;AAD9D,MAhCJ;AAAA,KADF;AAuCD,CA1D+B,CAA3B","sourcesContent":["import { assignMultipleRefs } from '@basic-ui/core';\nimport { rem } from 'polished';\nimport { cloneElement, forwardRef, useRef } from 'react';\nimport type * as React from 'react';\nimport { Box } from '../Box';\nimport {\n DARK_THEME_CLASS,\n DEFAULT_THEME_CLASS,\n useColorMode,\n} from '../ColorMode';\nimport { Paper, PaperProps } from '../Paper';\nimport { Text } from '../Text';\nimport { useSnackbarAnimation } from './useSnackbarAnimation';\n\nexport interface SnackbarProps extends PaperProps {\n action?: React.ReactElement;\n timeout?: number;\n dismissible?: boolean;\n}\n\nexport const Snackbar = forwardRef<HTMLDivElement, SnackbarProps>(\n function Snackbar(props, forwardedRef) {\n const { colorMode } = useColorMode();\n const ref = useRef<HTMLDivElement | null>(null);\n const {\n __css,\n action,\n children,\n style: styleProp,\n timeout = 5000,\n dismissible,\n ...otherProps\n } = props;\n\n const { onClose, placementStyle, style } = useSnackbarAnimation(\n ref,\n timeout\n );\n\n return (\n <Paper\n elevation={4}\n backgroundOverlay={4}\n className={\n colorMode === 'default' ? DARK_THEME_CLASS : DEFAULT_THEME_CLASS\n }\n ref={assignMultipleRefs(forwardedRef, ref)}\n __css={{\n boxShadow: 4,\n py: rem(6),\n pl: 3,\n pr: 3,\n display: 'inline-flex',\n minWidth: `min(100%, ${rem(344)})`,\n maxWidth: ['100%', 'unset'],\n borderRadius: 'extra-small',\n color: 'on.surface',\n flexDirection: 'row',\n willChange: 'transform,opacity',\n ...placementStyle,\n ...__css,\n }}\n style={{\n ...style,\n ...styleProp,\n }}\n {...otherProps}\n >\n <Text variant=\"body2\" as=\"span\" py={2}>\n {children}\n </Text>\n {action && (\n <Box as=\"span\" pl={2} mr={-2} ml=\"auto\" minWidth=\"auto\">\n {dismissible ? cloneElement(action, { onClick: onClose }) : action}\n </Box>\n )}\n </Paper>\n );\n }\n);\n"],"file":"Snackbar.js"}
1
+ {"version":3,"sources":["../../../src/Snackbar/Snackbar.tsx"],"names":["assignMultipleRefs","cloneElement","forwardRef","useRef","React","Box","DARK_THEME_CLASS","DEFAULT_THEME_CLASS","useColorMode","Paper","Text","useSnackbarAnimation","Snackbar","props","forwardedRef","colorMode","ref","__css","action","children","styleProp","style","timeout","dismissible","otherProps","onClose","placementStyle","boxShadow","py","pl","pr","display","minWidth","maxWidth","borderRadius","color","flexDirection","willChange","onClick"],"mappings":";;AAAA,SAASA,kBAAT,QAAmC,gBAAnC;AAEA,SAASC,YAAT,EAAuBC,UAAvB,EAAmCC,MAAnC,QAAiD,OAAjD;AACA,OAAO,KAAKC,KAAZ,MAAuB,OAAvB;AAEA,SAASC,GAAT,QAAoB,QAApB;AACA,SACEC,gBADF,EAEEC,mBAFF,EAGEC,YAHF,QAIO,cAJP;AAMA,SAASC,KAAT,QAAsB,UAAtB;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,oBAAT,QAAqC,wBAArC;;;AAQA,OAAO,IAAMC,QAAQ,gBAAGV,UAAU,CAChC,SAASU,QAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAuC;AAAA,sBACfN,YAAY,EADG;AAAA,MAC7BO,SAD6B,iBAC7BA,SAD6B;;AAErC,MAAMC,GAAG,GAAGb,MAAM,CAAwB,IAAxB,CAAlB;;AAFqC,MAInCc,KAJmC,GAWjCJ,KAXiC,CAInCI,KAJmC;AAAA,MAKnCC,MALmC,GAWjCL,KAXiC,CAKnCK,MALmC;AAAA,MAMnCC,QANmC,GAWjCN,KAXiC,CAMnCM,QANmC;AAAA,MAO5BC,SAP4B,GAWjCP,KAXiC,CAOnCQ,KAPmC;AAAA,uBAWjCR,KAXiC,CAQnCS,OARmC;AAAA,MAQnCA,OARmC,+BAQzB,IARyB;AAAA,MASnCC,WATmC,GAWjCV,KAXiC,CASnCU,WATmC;AAAA,MAUhCC,UAVgC,4BAWjCX,KAXiC;;AAAA,8BAaMF,oBAAoB,CAC7DK,GAD6D,EAE7DM,OAF6D,CAb1B;AAAA,MAa7BG,OAb6B,yBAa7BA,OAb6B;AAAA,MAapBC,cAboB,yBAapBA,cAboB;AAAA,MAaJL,KAbI,yBAaJA,KAbI;;AAkBrC,sBACE,MAAC,KAAD;AACE,IAAA,SAAS,EAAE,CADb;AAEE,IAAA,0BAA0B,EAAE,CAF9B;AAGE,IAAA,SAAS,EACPN,SAAS,KAAK,SAAd,GAA0BT,gBAA1B,GAA6CC,mBAJjD;AAME,IAAA,GAAG,EAAEP,kBAAkB,CAACc,YAAD,EAAeE,GAAf,CANzB;AAOE,IAAA,KAAK;AACHW,MAAAA,SAAS,EAAE,CADR;AAEHC,MAAAA,EAAE,YAFC;AAGHC,MAAAA,EAAE,EAAE,CAHD;AAIHC,MAAAA,EAAE,EAAE,CAJD;AAKHC,MAAAA,OAAO,EAAE,aALN;AAMHC,MAAAA,QAAQ,qCANL;AAOHC,MAAAA,QAAQ,EAAE,CAAC,MAAD,EAAS,OAAT,CAPP;AAQHC,MAAAA,YAAY,EAAE,aARX;AASHC,MAAAA,KAAK,EAAE,YATJ;AAUHC,MAAAA,aAAa,EAAE,KAVZ;AAWHC,MAAAA,UAAU,EAAE;AAXT,OAYAX,cAZA,EAaAT,KAbA,CAPP;AAsBE,IAAA,KAAK,eACAI,KADA,EAEAD,SAFA;AAtBP,KA0BMI,UA1BN;AAAA,4BA4BE,KAAC,IAAD;AAAM,MAAA,OAAO,EAAC,OAAd;AAAsB,MAAA,EAAE,EAAC,MAAzB;AAAgC,MAAA,EAAE,EAAE,CAApC;AAAA,gBACGL;AADH,MA5BF,EA+BGD,MAAM,iBACL,KAAC,GAAD;AAAK,MAAA,EAAE,EAAC,MAAR;AAAe,MAAA,EAAE,EAAE,CAAnB;AAAsB,MAAA,EAAE,EAAE,CAAC,CAA3B;AAA8B,MAAA,EAAE,EAAC,MAAjC;AAAwC,MAAA,QAAQ,EAAC,MAAjD;AAAA,gBACGK,WAAW,gBAAGtB,YAAY,CAACiB,MAAD,EAAS;AAAEoB,QAAAA,OAAO,EAAEb;AAAX,OAAT,CAAf,GAAgDP;AAD9D,MAhCJ;AAAA,KADF;AAuCD,CA1D+B,CAA3B","sourcesContent":["import { assignMultipleRefs } from '@basic-ui/core';\nimport { rem } from 'polished';\nimport { cloneElement, forwardRef, useRef } from 'react';\nimport * as React from 'react';\n\nimport { Box } from '../Box';\nimport {\n DARK_THEME_CLASS,\n DEFAULT_THEME_CLASS,\n useColorMode,\n} from '../ColorMode';\nimport type { PaperProps } from '../Paper';\nimport { Paper } from '../Paper';\nimport { Text } from '../Text';\nimport { useSnackbarAnimation } from './useSnackbarAnimation';\n\nexport interface SnackbarProps extends PaperProps {\n action?: React.ReactElement;\n timeout?: number;\n dismissible?: boolean;\n}\n\nexport const Snackbar = forwardRef<HTMLDivElement, SnackbarProps>(\n function Snackbar(props, forwardedRef) {\n const { colorMode } = useColorMode();\n const ref = useRef<HTMLDivElement | null>(null);\n const {\n __css,\n action,\n children,\n style: styleProp,\n timeout = 5000,\n dismissible,\n ...otherProps\n } = props;\n\n const { onClose, placementStyle, style } = useSnackbarAnimation(\n ref,\n timeout\n );\n\n return (\n <Paper\n elevation={4}\n darkThemeBackgroundOverlay={4}\n className={\n colorMode === 'default' ? DARK_THEME_CLASS : DEFAULT_THEME_CLASS\n }\n ref={assignMultipleRefs(forwardedRef, ref)}\n __css={{\n boxShadow: 4,\n py: rem(6),\n pl: 3,\n pr: 3,\n display: 'inline-flex',\n minWidth: `min(100%, ${rem(344)})`,\n maxWidth: ['100%', 'unset'],\n borderRadius: 'extra-small',\n color: 'on.surface',\n flexDirection: 'row',\n willChange: 'transform,opacity',\n ...placementStyle,\n ...__css,\n }}\n style={{\n ...style,\n ...styleProp,\n }}\n {...otherProps}\n >\n <Text variant=\"body2\" as=\"span\" py={2}>\n {children}\n </Text>\n {action && (\n <Box as=\"span\" pl={2} mr={-2} ml=\"auto\" minWidth=\"auto\">\n {dismissible ? cloneElement(action, { onClick: onClose }) : action}\n </Box>\n )}\n </Paper>\n );\n }\n);\n"],"file":"Snackbar.js"}
@@ -1,6 +1,5 @@
1
- import { MutableRefObject, ReactElement } from 'react';
2
- import type * as React from 'react';
3
- import { FC } from 'react';
1
+ import type { MutableRefObject, ReactElement, FC } from 'react';
2
+ import * as React from 'react';
4
3
  export declare type StackPlacement = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left';
5
4
  export interface StackItemContextProps {
6
5
  posY: number | undefined;