@fountain-ui/core 3.0.0-alpha.3 → 3.0.0-alpha.30

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 (476) hide show
  1. package/build/commonjs/Accordion/Accordion.js +15 -8
  2. package/build/commonjs/Accordion/Accordion.js.map +1 -1
  3. package/build/commonjs/Accordion/AccordionProps.js.map +1 -1
  4. package/build/commonjs/Accordion/useVariantStyleMap.js +15 -8
  5. package/build/commonjs/Accordion/useVariantStyleMap.js.map +1 -1
  6. package/build/commonjs/AppBar/AppBar.js +7 -2
  7. package/build/commonjs/AppBar/AppBar.js.map +1 -1
  8. package/build/commonjs/Badge/Badge.js +4 -3
  9. package/build/commonjs/Badge/Badge.js.map +1 -1
  10. package/build/commonjs/Badge/BadgeProps.js.map +1 -1
  11. package/build/commonjs/Badge/useVariantStyleMap.js +2 -2
  12. package/build/commonjs/Badge/useVariantStyleMap.js.map +1 -1
  13. package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js +5 -2
  14. package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js.map +1 -1
  15. package/build/commonjs/BottomSheetTitle/BottomSheetTitleProps.js.map +1 -1
  16. package/build/commonjs/Button/Button.js +26 -12
  17. package/build/commonjs/Button/Button.js.map +1 -1
  18. package/build/commonjs/Button/ButtonProps.js.map +1 -1
  19. package/build/commonjs/ButtonBase/ButtonBase.js +1 -1
  20. package/build/commonjs/ButtonBase/ButtonBase.js.map +1 -1
  21. package/build/commonjs/ButtonBase/index.js +2 -2
  22. package/build/commonjs/ButtonBase/index.js.map +1 -1
  23. package/build/commonjs/Checkbox/Checkbox.js +4 -1
  24. package/build/commonjs/Checkbox/Checkbox.js.map +1 -1
  25. package/build/commonjs/Checkbox/useVariantStyleMap.js +6 -2
  26. package/build/commonjs/Checkbox/useVariantStyleMap.js.map +1 -1
  27. package/build/commonjs/Chip/Chip.js +25 -14
  28. package/build/commonjs/Chip/Chip.js.map +1 -1
  29. package/build/commonjs/Chip/ChipProps.js +3 -1
  30. package/build/commonjs/Chip/ChipProps.js.map +1 -1
  31. package/build/commonjs/Chip/index.js +6 -0
  32. package/build/commonjs/Chip/index.js.map +1 -1
  33. package/build/commonjs/Chip/useChipStyle.js +51 -31
  34. package/build/commonjs/Chip/useChipStyle.js.map +1 -1
  35. package/build/commonjs/Dialog/Dialog.js +10 -12
  36. package/build/commonjs/Dialog/Dialog.js.map +1 -1
  37. package/build/commonjs/Dialog/DialogProps.js +1 -1
  38. package/build/commonjs/Dialog/DialogProps.js.map +1 -1
  39. package/build/commonjs/Dialog/useDialogSectionStyle.js +6 -4
  40. package/build/commonjs/Dialog/useDialogSectionStyle.js.map +1 -1
  41. package/build/commonjs/Dialog/useDialogStyle.js +19 -8
  42. package/build/commonjs/Dialog/useDialogStyle.js.map +1 -1
  43. package/build/commonjs/DialogActions/DialogActions.js +0 -1
  44. package/build/commonjs/DialogActions/DialogActions.js.map +1 -1
  45. package/build/commonjs/DialogTitle/DialogLargeTitle.js +80 -0
  46. package/build/commonjs/DialogTitle/DialogLargeTitle.js.map +1 -0
  47. package/build/commonjs/DialogTitle/DialogTitle.js +8 -4
  48. package/build/commonjs/DialogTitle/DialogTitle.js.map +1 -1
  49. package/build/commonjs/Divider/Divider.js +17 -9
  50. package/build/commonjs/Divider/Divider.js.map +1 -1
  51. package/build/commonjs/Divider/DividerProps.js +1 -1
  52. package/build/commonjs/Divider/DividerProps.js.map +1 -1
  53. package/build/commonjs/Empty/Empty.js +1 -1
  54. package/build/commonjs/Empty/Empty.js.map +1 -1
  55. package/build/commonjs/Flexbox/Flexbox.js +2 -0
  56. package/build/commonjs/Flexbox/Flexbox.js.map +1 -1
  57. package/build/commonjs/Flexbox/FlexboxProps.js.map +1 -1
  58. package/build/commonjs/IconButton/IconButton.js +3 -0
  59. package/build/commonjs/IconButton/IconButton.js.map +1 -1
  60. package/build/commonjs/IconButton/IconButtonProps.js +1 -1
  61. package/build/commonjs/IconButton/IconButtonProps.js.map +1 -1
  62. package/build/commonjs/Image/Image.js +2 -2
  63. package/build/commonjs/Image/Image.js.map +1 -1
  64. package/build/commonjs/ImageCore/ImageCoreNative.js +1 -1
  65. package/build/commonjs/ImageCore/ImageCoreNative.js.map +1 -1
  66. package/build/commonjs/ListItem/ListItem.js +38 -26
  67. package/build/commonjs/ListItem/ListItem.js.map +1 -1
  68. package/build/commonjs/ListItem/ListItemProps.js.map +1 -1
  69. package/build/commonjs/ListItemIcon/ListItemIcon.js +1 -2
  70. package/build/commonjs/ListItemIcon/ListItemIcon.js.map +1 -1
  71. package/build/commonjs/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
  72. package/build/commonjs/ListItemSecondaryAction/ListItemSecondaryAction.js.map +1 -1
  73. package/build/commonjs/ListItemText/ListItemText.js +20 -21
  74. package/build/commonjs/ListItemText/ListItemText.js.map +1 -1
  75. package/build/commonjs/ListItemText/ListItemTextProps.js.map +1 -1
  76. package/build/commonjs/ListSubheader/ListSubheader.js +1 -1
  77. package/build/commonjs/ListSubheader/ListSubheader.js.map +1 -1
  78. package/build/commonjs/Pagination/NumberPagination.js +4 -2
  79. package/build/commonjs/Pagination/NumberPagination.js.map +1 -1
  80. package/build/commonjs/Pagination/Pagination.js +2 -0
  81. package/build/commonjs/Pagination/Pagination.js.map +1 -1
  82. package/build/commonjs/Pagination/PaginationProps.js +3 -1
  83. package/build/commonjs/Pagination/PaginationProps.js.map +1 -1
  84. package/build/commonjs/Pagination/index.js +6 -0
  85. package/build/commonjs/Pagination/index.js.map +1 -1
  86. package/build/commonjs/PaginationItem/PaginationItem.js +32 -22
  87. package/build/commonjs/PaginationItem/PaginationItem.js.map +1 -1
  88. package/build/commonjs/PaginationItem/PaginationItemProps.js.map +1 -1
  89. package/build/commonjs/Radio/Radio.js +11 -4
  90. package/build/commonjs/Radio/Radio.js.map +1 -1
  91. package/build/commonjs/RadioGroup/RadioGroup.js +2 -27
  92. package/build/commonjs/RadioGroup/RadioGroup.js.map +1 -1
  93. package/build/commonjs/Section/Section.js +32 -0
  94. package/build/commonjs/Section/Section.js.map +1 -0
  95. package/build/commonjs/Section/SectionProps.js +2 -0
  96. package/build/commonjs/Section/SectionProps.js.map +1 -0
  97. package/build/commonjs/Section/index.js +16 -0
  98. package/build/commonjs/Section/index.js.map +1 -0
  99. package/build/commonjs/ShadowView/ShadowView.native.js +4 -0
  100. package/build/commonjs/ShadowView/ShadowView.native.js.map +1 -1
  101. package/build/commonjs/SnackbarContent/SnackbarContent.js +26 -9
  102. package/build/commonjs/SnackbarContent/SnackbarContent.js.map +1 -1
  103. package/build/commonjs/Tab/Tab.js +21 -19
  104. package/build/commonjs/Tab/Tab.js.map +1 -1
  105. package/build/commonjs/Tab/TabProps.js +4 -2
  106. package/build/commonjs/Tab/TabProps.js.map +1 -1
  107. package/build/commonjs/Tab/index.js +14 -0
  108. package/build/commonjs/Tab/index.js.map +1 -1
  109. package/build/commonjs/Tab/useVariantStyleMap.js +59 -18
  110. package/build/commonjs/Tab/useVariantStyleMap.js.map +1 -1
  111. package/build/commonjs/TabBase/TabBase.js +1 -8
  112. package/build/commonjs/TabBase/TabBase.js.map +1 -1
  113. package/build/commonjs/TabBase/TabBaseProps.js.map +1 -1
  114. package/build/commonjs/Tabs/Tabs.js +23 -7
  115. package/build/commonjs/Tabs/Tabs.js.map +1 -1
  116. package/build/commonjs/Tabs/TabsProps.js.map +1 -1
  117. package/build/commonjs/Tabs/index.js.map +1 -1
  118. package/build/commonjs/Tabs/useTabsStyle.js +80 -0
  119. package/build/commonjs/Tabs/useTabsStyle.js.map +1 -0
  120. package/build/commonjs/TextField/TextField.js +48 -12
  121. package/build/commonjs/TextField/TextField.js.map +1 -1
  122. package/build/commonjs/TextField/useVariantStyleMap.js +29 -29
  123. package/build/commonjs/TextField/useVariantStyleMap.js.map +1 -1
  124. package/build/commonjs/Toolbar/BackButton/BackButton.js +47 -0
  125. package/build/commonjs/Toolbar/BackButton/BackButton.js.map +1 -0
  126. package/build/commonjs/Toolbar/BackButton/BackButtonProps.js +2 -0
  127. package/build/commonjs/Toolbar/BackButton/BackButtonProps.js.map +1 -0
  128. package/build/commonjs/Toolbar/BackButton/index.js +16 -0
  129. package/build/commonjs/Toolbar/BackButton/index.js.map +1 -0
  130. package/build/commonjs/Toolbar/Toolbar.js +8 -4
  131. package/build/commonjs/Toolbar/Toolbar.js.map +1 -1
  132. package/build/commonjs/Tooltip/Beaks/index.js +32 -0
  133. package/build/commonjs/Tooltip/Beaks/index.js.map +1 -1
  134. package/build/commonjs/Tooltip/Tooltip.js +11 -18
  135. package/build/commonjs/Tooltip/Tooltip.js.map +1 -1
  136. package/build/commonjs/Tooltip/index.js +19 -0
  137. package/build/commonjs/Tooltip/index.js.map +1 -1
  138. package/build/commonjs/Typography/Typography.js +9 -2
  139. package/build/commonjs/Typography/Typography.js.map +1 -1
  140. package/build/commonjs/Typography/TypographyProps.js.map +1 -1
  141. package/build/commonjs/hooks/useBreakpointUp.js +4 -1
  142. package/build/commonjs/hooks/useBreakpointUp.js.map +1 -1
  143. package/build/commonjs/hooks/useCollapsibleAppBar.js +3 -10
  144. package/build/commonjs/hooks/useCollapsibleAppBar.js.map +1 -1
  145. package/build/commonjs/hooks/useContentContainerStyle.js +39 -25
  146. package/build/commonjs/hooks/useContentContainerStyle.js.map +1 -1
  147. package/build/commonjs/hooks/useFadeInAppBar.js +2 -2
  148. package/build/commonjs/hooks/useFadeInAppBar.js.map +1 -1
  149. package/build/commonjs/index.js +21 -0
  150. package/build/commonjs/index.js.map +1 -1
  151. package/build/commonjs/internal/icons/AppBarChevronLeft.js +23 -0
  152. package/build/commonjs/internal/icons/AppBarChevronLeft.js.map +1 -0
  153. package/build/commonjs/internal/icons/ChevronLeft.js +4 -2
  154. package/build/commonjs/internal/icons/ChevronLeft.js.map +1 -1
  155. package/build/commonjs/internal/icons/ChevronRight.js +4 -2
  156. package/build/commonjs/internal/icons/ChevronRight.js.map +1 -1
  157. package/build/commonjs/internal/icons/ChipClose.js +23 -0
  158. package/build/commonjs/internal/icons/ChipClose.js.map +1 -0
  159. package/build/commonjs/internal/icons/Clear.js +3 -3
  160. package/build/commonjs/internal/icons/Clear.js.map +1 -1
  161. package/build/commonjs/internal/icons/Close.js +4 -2
  162. package/build/commonjs/internal/icons/Close.js.map +1 -1
  163. package/build/commonjs/internal/icons/Search.js +2 -2
  164. package/build/commonjs/internal/icons/Search.js.map +1 -1
  165. package/build/commonjs/internal/icons/index.js +16 -0
  166. package/build/commonjs/internal/icons/index.js.map +1 -1
  167. package/build/module/Accordion/Accordion.js +15 -8
  168. package/build/module/Accordion/Accordion.js.map +1 -1
  169. package/build/module/Accordion/AccordionProps.js.map +1 -1
  170. package/build/module/Accordion/useVariantStyleMap.js +15 -8
  171. package/build/module/Accordion/useVariantStyleMap.js.map +1 -1
  172. package/build/module/AppBar/AppBar.js +6 -2
  173. package/build/module/AppBar/AppBar.js.map +1 -1
  174. package/build/module/Badge/Badge.js +4 -3
  175. package/build/module/Badge/Badge.js.map +1 -1
  176. package/build/module/Badge/BadgeProps.js.map +1 -1
  177. package/build/module/Badge/useVariantStyleMap.js +2 -2
  178. package/build/module/Badge/useVariantStyleMap.js.map +1 -1
  179. package/build/module/BottomSheetTitle/BottomSheetTitle.js +5 -2
  180. package/build/module/BottomSheetTitle/BottomSheetTitle.js.map +1 -1
  181. package/build/module/BottomSheetTitle/BottomSheetTitleProps.js.map +1 -1
  182. package/build/module/Button/Button.js +27 -13
  183. package/build/module/Button/Button.js.map +1 -1
  184. package/build/module/Button/ButtonProps.js.map +1 -1
  185. package/build/module/ButtonBase/ButtonBase.js +1 -1
  186. package/build/module/ButtonBase/ButtonBase.js.map +1 -1
  187. package/build/module/ButtonBase/index.js +1 -1
  188. package/build/module/ButtonBase/index.js.map +1 -1
  189. package/build/module/Checkbox/Checkbox.js +4 -1
  190. package/build/module/Checkbox/Checkbox.js.map +1 -1
  191. package/build/module/Checkbox/useVariantStyleMap.js +6 -2
  192. package/build/module/Checkbox/useVariantStyleMap.js.map +1 -1
  193. package/build/module/Chip/Chip.js +21 -13
  194. package/build/module/Chip/Chip.js.map +1 -1
  195. package/build/module/Chip/ChipProps.js +1 -0
  196. package/build/module/Chip/ChipProps.js.map +1 -1
  197. package/build/module/Chip/index.js +1 -1
  198. package/build/module/Chip/index.js.map +1 -1
  199. package/build/module/Chip/useChipStyle.js +51 -31
  200. package/build/module/Chip/useChipStyle.js.map +1 -1
  201. package/build/module/Dialog/Dialog.js +10 -11
  202. package/build/module/Dialog/Dialog.js.map +1 -1
  203. package/build/module/Dialog/DialogProps.js +1 -1
  204. package/build/module/Dialog/DialogProps.js.map +1 -1
  205. package/build/module/Dialog/useDialogSectionStyle.js +6 -4
  206. package/build/module/Dialog/useDialogSectionStyle.js.map +1 -1
  207. package/build/module/Dialog/useDialogStyle.js +18 -8
  208. package/build/module/Dialog/useDialogStyle.js.map +1 -1
  209. package/build/module/DialogActions/DialogActions.js +0 -1
  210. package/build/module/DialogActions/DialogActions.js.map +1 -1
  211. package/build/module/DialogTitle/DialogLargeTitle.js +65 -0
  212. package/build/module/DialogTitle/DialogLargeTitle.js.map +1 -0
  213. package/build/module/DialogTitle/DialogTitle.js +6 -3
  214. package/build/module/DialogTitle/DialogTitle.js.map +1 -1
  215. package/build/module/Divider/Divider.js +7 -0
  216. package/build/module/Divider/Divider.js.map +1 -1
  217. package/build/module/Divider/DividerProps.js +1 -1
  218. package/build/module/Divider/DividerProps.js.map +1 -1
  219. package/build/module/Empty/Empty.js +1 -1
  220. package/build/module/Empty/Empty.js.map +1 -1
  221. package/build/module/Flexbox/Flexbox.js +2 -0
  222. package/build/module/Flexbox/Flexbox.js.map +1 -1
  223. package/build/module/Flexbox/FlexboxProps.js.map +1 -1
  224. package/build/module/IconButton/IconButton.js +3 -0
  225. package/build/module/IconButton/IconButton.js.map +1 -1
  226. package/build/module/IconButton/IconButtonProps.js +1 -1
  227. package/build/module/IconButton/IconButtonProps.js.map +1 -1
  228. package/build/module/Image/Image.js +2 -2
  229. package/build/module/Image/Image.js.map +1 -1
  230. package/build/module/ImageCore/ImageCoreNative.js +1 -1
  231. package/build/module/ImageCore/ImageCoreNative.js.map +1 -1
  232. package/build/module/ListItem/ListItem.js +36 -28
  233. package/build/module/ListItem/ListItem.js.map +1 -1
  234. package/build/module/ListItem/ListItemProps.js.map +1 -1
  235. package/build/module/ListItemIcon/ListItemIcon.js +1 -2
  236. package/build/module/ListItemIcon/ListItemIcon.js.map +1 -1
  237. package/build/module/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
  238. package/build/module/ListItemSecondaryAction/ListItemSecondaryAction.js.map +1 -1
  239. package/build/module/ListItemText/ListItemText.js +17 -19
  240. package/build/module/ListItemText/ListItemText.js.map +1 -1
  241. package/build/module/ListItemText/ListItemTextProps.js.map +1 -1
  242. package/build/module/ListSubheader/ListSubheader.js +1 -1
  243. package/build/module/ListSubheader/ListSubheader.js.map +1 -1
  244. package/build/module/Pagination/NumberPagination.js +4 -2
  245. package/build/module/Pagination/NumberPagination.js.map +1 -1
  246. package/build/module/Pagination/Pagination.js +2 -0
  247. package/build/module/Pagination/Pagination.js.map +1 -1
  248. package/build/module/Pagination/PaginationProps.js +1 -0
  249. package/build/module/Pagination/PaginationProps.js.map +1 -1
  250. package/build/module/Pagination/index.js +1 -1
  251. package/build/module/Pagination/index.js.map +1 -1
  252. package/build/module/PaginationItem/PaginationItem.js +28 -21
  253. package/build/module/PaginationItem/PaginationItem.js.map +1 -1
  254. package/build/module/PaginationItem/PaginationItemProps.js.map +1 -1
  255. package/build/module/Radio/Radio.js +10 -4
  256. package/build/module/Radio/Radio.js.map +1 -1
  257. package/build/module/RadioGroup/RadioGroup.js +2 -20
  258. package/build/module/RadioGroup/RadioGroup.js.map +1 -1
  259. package/build/module/Section/Section.js +19 -0
  260. package/build/module/Section/Section.js.map +1 -0
  261. package/build/module/Section/SectionProps.js +2 -0
  262. package/build/module/Section/SectionProps.js.map +1 -0
  263. package/build/module/Section/index.js +2 -0
  264. package/build/module/Section/index.js.map +1 -0
  265. package/build/module/ShadowView/ShadowView.native.js +4 -0
  266. package/build/module/ShadowView/ShadowView.native.js.map +1 -1
  267. package/build/module/SnackbarContent/SnackbarContent.js +26 -9
  268. package/build/module/SnackbarContent/SnackbarContent.js.map +1 -1
  269. package/build/module/Tab/Tab.js +22 -19
  270. package/build/module/Tab/Tab.js.map +1 -1
  271. package/build/module/Tab/TabProps.js +2 -1
  272. package/build/module/Tab/TabProps.js.map +1 -1
  273. package/build/module/Tab/index.js +1 -0
  274. package/build/module/Tab/index.js.map +1 -1
  275. package/build/module/Tab/useVariantStyleMap.js +59 -18
  276. package/build/module/Tab/useVariantStyleMap.js.map +1 -1
  277. package/build/module/TabBase/TabBase.js +1 -8
  278. package/build/module/TabBase/TabBase.js.map +1 -1
  279. package/build/module/TabBase/TabBaseProps.js.map +1 -1
  280. package/build/module/Tabs/Tabs.js +21 -7
  281. package/build/module/Tabs/Tabs.js.map +1 -1
  282. package/build/module/Tabs/TabsProps.js.map +1 -1
  283. package/build/module/Tabs/index.js.map +1 -1
  284. package/build/module/Tabs/useTabsStyle.js +70 -0
  285. package/build/module/Tabs/useTabsStyle.js.map +1 -0
  286. package/build/module/TextField/TextField.js +48 -12
  287. package/build/module/TextField/TextField.js.map +1 -1
  288. package/build/module/TextField/useVariantStyleMap.js +29 -29
  289. package/build/module/TextField/useVariantStyleMap.js.map +1 -1
  290. package/build/module/Toolbar/BackButton/BackButton.js +32 -0
  291. package/build/module/Toolbar/BackButton/BackButton.js.map +1 -0
  292. package/build/module/Toolbar/BackButton/BackButtonProps.js +2 -0
  293. package/build/module/Toolbar/BackButton/BackButtonProps.js.map +1 -0
  294. package/build/module/Toolbar/BackButton/index.js +2 -0
  295. package/build/module/Toolbar/BackButton/index.js.map +1 -0
  296. package/build/module/Toolbar/Toolbar.js +7 -3
  297. package/build/module/Toolbar/Toolbar.js.map +1 -1
  298. package/build/module/Tooltip/Beaks/index.js +4 -0
  299. package/build/module/Tooltip/Beaks/index.js.map +1 -1
  300. package/build/module/Tooltip/Tooltip.js +4 -10
  301. package/build/module/Tooltip/Tooltip.js.map +1 -1
  302. package/build/module/Tooltip/index.js +1 -0
  303. package/build/module/Tooltip/index.js.map +1 -1
  304. package/build/module/Typography/Typography.js +9 -2
  305. package/build/module/Typography/Typography.js.map +1 -1
  306. package/build/module/Typography/TypographyProps.js.map +1 -1
  307. package/build/module/hooks/useBreakpointUp.js +4 -1
  308. package/build/module/hooks/useBreakpointUp.js.map +1 -1
  309. package/build/module/hooks/useCollapsibleAppBar.js +4 -10
  310. package/build/module/hooks/useCollapsibleAppBar.js.map +1 -1
  311. package/build/module/hooks/useContentContainerStyle.js +43 -25
  312. package/build/module/hooks/useContentContainerStyle.js.map +1 -1
  313. package/build/module/hooks/useFadeInAppBar.js +2 -2
  314. package/build/module/hooks/useFadeInAppBar.js.map +1 -1
  315. package/build/module/index.js +2 -0
  316. package/build/module/index.js.map +1 -1
  317. package/build/module/internal/icons/AppBarChevronLeft.js +9 -0
  318. package/build/module/internal/icons/AppBarChevronLeft.js.map +1 -0
  319. package/build/module/internal/icons/ChevronLeft.js +4 -2
  320. package/build/module/internal/icons/ChevronLeft.js.map +1 -1
  321. package/build/module/internal/icons/ChevronRight.js +4 -2
  322. package/build/module/internal/icons/ChevronRight.js.map +1 -1
  323. package/build/module/internal/icons/ChipClose.js +9 -0
  324. package/build/module/internal/icons/ChipClose.js.map +1 -0
  325. package/build/module/internal/icons/Clear.js +3 -3
  326. package/build/module/internal/icons/Clear.js.map +1 -1
  327. package/build/module/internal/icons/Close.js +4 -2
  328. package/build/module/internal/icons/Close.js.map +1 -1
  329. package/build/module/internal/icons/Search.js +2 -2
  330. package/build/module/internal/icons/Search.js.map +1 -1
  331. package/build/module/internal/icons/index.js +2 -0
  332. package/build/module/internal/icons/index.js.map +1 -1
  333. package/build/typescript/Accordion/AccordionProps.d.ts +4 -1
  334. package/build/typescript/Accordion/useVariantStyleMap.d.ts +1 -0
  335. package/build/typescript/Badge/BadgeProps.d.ts +10 -5
  336. package/build/typescript/BottomSheetTitle/BottomSheetTitleProps.d.ts +1 -0
  337. package/build/typescript/Button/ButtonProps.d.ts +5 -0
  338. package/build/typescript/ButtonBase/index.d.ts +1 -1
  339. package/build/typescript/Checkbox/useVariantStyleMap.d.ts +1 -0
  340. package/build/typescript/Chip/ChipProps.d.ts +11 -4
  341. package/build/typescript/Chip/index.d.ts +1 -1
  342. package/build/typescript/Chip/useChipStyle.d.ts +6 -3
  343. package/build/typescript/Dialog/DialogProps.d.ts +1 -6
  344. package/build/typescript/Dialog/useDialogStyle.d.ts +1 -1
  345. package/build/typescript/DialogTitle/DialogLargeTitle.d.ts +9 -0
  346. package/build/typescript/DialogTitle/DialogTitle.d.ts +6 -1
  347. package/build/typescript/Divider/DividerProps.d.ts +1 -1
  348. package/build/typescript/Flexbox/FlexboxProps.d.ts +4 -0
  349. package/build/typescript/IconButton/IconButtonProps.d.ts +1 -1
  350. package/build/typescript/ListItem/ListItem.d.ts +1 -1
  351. package/build/typescript/ListItem/ListItemProps.d.ts +4 -0
  352. package/build/typescript/ListItemText/ListItemTextProps.d.ts +2 -9
  353. package/build/typescript/Pagination/PaginationProps.d.ts +12 -0
  354. package/build/typescript/Pagination/index.d.ts +2 -2
  355. package/build/typescript/PaginationItem/PaginationItemProps.d.ts +6 -0
  356. package/build/typescript/Section/Section.d.ts +3 -0
  357. package/build/typescript/Section/SectionProps.d.ts +6 -0
  358. package/build/typescript/Section/index.d.ts +2 -0
  359. package/build/typescript/Tab/TabProps.d.ts +21 -2
  360. package/build/typescript/Tab/index.d.ts +2 -1
  361. package/build/typescript/Tab/useVariantStyleMap.d.ts +4 -2
  362. package/build/typescript/TabBase/TabBaseProps.d.ts +0 -5
  363. package/build/typescript/Tabs/Tabs.d.ts +1 -1
  364. package/build/typescript/Tabs/TabsProps.d.ts +6 -1
  365. package/build/typescript/Tabs/index.d.ts +1 -1
  366. package/build/typescript/Tabs/useTabsStyle.d.ts +8 -0
  367. package/build/typescript/TextField/useVariantStyleMap.d.ts +2 -0
  368. package/build/typescript/Toolbar/BackButton/BackButton.d.ts +3 -0
  369. package/build/typescript/Toolbar/BackButton/BackButtonProps.d.ts +4 -0
  370. package/build/typescript/Toolbar/BackButton/index.d.ts +2 -0
  371. package/build/typescript/Toolbar/Toolbar.d.ts +6 -1
  372. package/build/typescript/Tooltip/Beaks/index.d.ts +4 -0
  373. package/build/typescript/Tooltip/index.d.ts +1 -0
  374. package/build/typescript/Typography/TypographyProps.d.ts +4 -0
  375. package/build/typescript/hooks/useCollapsibleAppBar.d.ts +0 -1
  376. package/build/typescript/hooks/useContentContainerStyle.d.ts +5 -8
  377. package/build/typescript/index.d.ts +2 -0
  378. package/build/typescript/internal/icons/AppBarChevronLeft.d.ts +131 -0
  379. package/build/typescript/internal/icons/ChipClose.d.ts +131 -0
  380. package/build/typescript/internal/icons/index.d.ts +2 -0
  381. package/package.json +5 -5
  382. package/src/Accordion/Accordion.tsx +18 -9
  383. package/src/Accordion/AccordionProps.ts +4 -2
  384. package/src/Accordion/useVariantStyleMap.ts +14 -6
  385. package/src/AppBar/AppBar.tsx +5 -1
  386. package/src/Badge/Badge.tsx +4 -3
  387. package/src/Badge/BadgeProps.ts +12 -6
  388. package/src/Badge/useVariantStyleMap.ts +2 -2
  389. package/src/BottomSheetTitle/BottomSheetTitle.tsx +4 -1
  390. package/src/BottomSheetTitle/BottomSheetTitleProps.ts +1 -0
  391. package/src/Button/Button.tsx +28 -12
  392. package/src/Button/ButtonProps.ts +6 -0
  393. package/src/ButtonBase/ButtonBase.tsx +1 -1
  394. package/src/ButtonBase/index.ts +1 -1
  395. package/src/Checkbox/Checkbox.tsx +11 -8
  396. package/src/Checkbox/useVariantStyleMap.ts +6 -1
  397. package/src/Chip/Chip.tsx +24 -13
  398. package/src/Chip/ChipProps.ts +13 -4
  399. package/src/Chip/index.ts +1 -1
  400. package/src/Chip/useChipStyle.ts +59 -29
  401. package/src/Dialog/Dialog.tsx +12 -11
  402. package/src/Dialog/DialogProps.ts +1 -7
  403. package/src/Dialog/useDialogSectionStyle.ts +6 -4
  404. package/src/Dialog/useDialogStyle.ts +19 -7
  405. package/src/DialogActions/DialogActions.tsx +0 -1
  406. package/src/DialogTitle/DialogLargeTitle.tsx +95 -0
  407. package/src/DialogTitle/DialogTitle.tsx +6 -1
  408. package/src/Divider/Divider.tsx +5 -0
  409. package/src/Divider/DividerProps.ts +1 -1
  410. package/src/Empty/Empty.tsx +1 -1
  411. package/src/Flexbox/Flexbox.tsx +2 -0
  412. package/src/Flexbox/FlexboxProps.ts +5 -0
  413. package/src/IconButton/IconButton.tsx +2 -0
  414. package/src/IconButton/IconButtonProps.ts +1 -0
  415. package/src/Image/Image.tsx +3 -3
  416. package/src/ImageCore/ImageCoreNative.tsx +1 -1
  417. package/src/ListItem/ListItem.tsx +61 -30
  418. package/src/ListItem/ListItemProps.ts +5 -0
  419. package/src/ListItemIcon/ListItemIcon.tsx +1 -2
  420. package/src/ListItemSecondaryAction/ListItemSecondaryAction.tsx +2 -0
  421. package/src/ListItemText/ListItemText.tsx +20 -28
  422. package/src/ListItemText/ListItemTextProps.ts +2 -10
  423. package/src/ListSubheader/ListSubheader.tsx +1 -1
  424. package/src/Pagination/NumberPagination.tsx +7 -2
  425. package/src/Pagination/Pagination.tsx +3 -2
  426. package/src/Pagination/PaginationProps.ts +15 -0
  427. package/src/Pagination/index.ts +2 -2
  428. package/src/PaginationItem/PaginationItem.tsx +31 -24
  429. package/src/PaginationItem/PaginationItemProps.ts +7 -0
  430. package/src/Radio/Radio.tsx +12 -3
  431. package/src/RadioGroup/RadioGroup.tsx +2 -28
  432. package/src/Section/Section.tsx +26 -0
  433. package/src/Section/SectionProps.ts +6 -0
  434. package/src/Section/index.ts +2 -0
  435. package/src/ShadowView/ShadowView.native.tsx +4 -0
  436. package/src/SnackbarContent/SnackbarContent.tsx +36 -15
  437. package/src/Tab/Tab.tsx +32 -22
  438. package/src/Tab/TabProps.ts +25 -2
  439. package/src/Tab/index.ts +2 -1
  440. package/src/Tab/useVariantStyleMap.ts +72 -19
  441. package/src/TabBase/TabBase.tsx +1 -9
  442. package/src/TabBase/TabBaseProps.ts +0 -6
  443. package/src/Tabs/Tabs.tsx +26 -8
  444. package/src/Tabs/TabsProps.ts +7 -1
  445. package/src/Tabs/index.ts +1 -1
  446. package/src/Tabs/useTabsStyle.ts +77 -0
  447. package/src/TextField/TextField.tsx +69 -26
  448. package/src/TextField/useVariantStyleMap.ts +29 -27
  449. package/src/Toolbar/BackButton/BackButton.tsx +44 -0
  450. package/src/Toolbar/BackButton/BackButtonProps.ts +4 -0
  451. package/src/Toolbar/BackButton/index.ts +2 -0
  452. package/src/Toolbar/Toolbar.tsx +6 -1
  453. package/src/Tooltip/Beaks/index.ts +4 -0
  454. package/src/Tooltip/Tooltip.tsx +4 -9
  455. package/src/Tooltip/index.ts +1 -0
  456. package/src/Typography/Typography.tsx +3 -1
  457. package/src/Typography/TypographyProps.ts +5 -0
  458. package/src/hooks/useBreakpointUp.ts +3 -1
  459. package/src/hooks/useCollapsibleAppBar.ts +4 -23
  460. package/src/hooks/useContentContainerStyle.ts +43 -31
  461. package/src/hooks/useFadeInAppBar.ts +2 -2
  462. package/src/index.ts +3 -0
  463. package/src/internal/icons/AppBarChevronLeft.tsx +15 -0
  464. package/src/internal/icons/ChevronLeft.tsx +4 -1
  465. package/src/internal/icons/ChevronRight.tsx +4 -1
  466. package/src/internal/icons/ChipClose.tsx +13 -0
  467. package/src/internal/icons/Clear.tsx +3 -3
  468. package/src/internal/icons/Close.tsx +4 -1
  469. package/src/internal/icons/Search.tsx +2 -2
  470. package/src/internal/icons/index.ts +2 -0
  471. package/build/commonjs/ButtonBase/LegacyButtonBase.js +0 -126
  472. package/build/commonjs/ButtonBase/LegacyButtonBase.js.map +0 -1
  473. package/build/module/ButtonBase/LegacyButtonBase.js +0 -106
  474. package/build/module/ButtonBase/LegacyButtonBase.js.map +0 -1
  475. package/build/typescript/ButtonBase/LegacyButtonBase.d.ts +0 -5
  476. package/src/ButtonBase/LegacyButtonBase.tsx +0 -135
@@ -1 +1 @@
1
- {"version":3,"names":["React","Text","View","typographyOf","createFontStyle","css","useTheme","ButtonBase","Column","Spacer","Typography","StatusIcon","useStyles","theme","root","flexDirection","alignItems","alignSelf","backgroundColor","palette","surface","accent","borderRadius","maxWidth","paddingBottom","spacing","paddingHorizontal","paddingTop","actionButton","marginLeft","SnackbarContent","props","actionContent","message","title","onPress","style","styleProp","status","startIcon","otherProps","styles","titleFontStyle","selector","_","fontSize","lineHeight","fontFamily","letterSpacing","color","text","strongInverse","messageFontStyle","labelFontStyle","hasActionButton","rootStyle","shape","radius","xl","undefined","width"],"sources":["SnackbarContent.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport { typographyOf } from '@fountain-ui/styles';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase/ButtonBase';\nimport Column from '../Column';\nimport Spacer from '../Spacer';\nimport Typography from '../Typography';\nimport type SnackbarContentProps from './SnackbarContentProps';\nimport StatusIcon from './StatusIcon';\n\ntype SnackBarContentStyles = NamedStylesStringUnion<'root' | 'actionButton'>;\n\nconst useStyles: UseStyles<SnackBarContentStyles> = function (): SnackBarContentStyles {\n const theme = useTheme();\n\n return {\n root: {\n flexDirection: 'row',\n alignItems: 'center',\n alignSelf: 'center',\n backgroundColor: theme.palette.surface.accent,\n borderRadius: 22,\n maxWidth: 400,\n paddingBottom: theme.spacing(2.25),\n paddingHorizontal: theme.spacing(4),\n paddingTop: theme.spacing(2),\n },\n actionButton: {\n marginLeft: theme.spacing(6),\n },\n };\n};\n\nexport default function SnackbarContent(props: SnackbarContentProps) {\n const {\n actionContent,\n message,\n title,\n onPress,\n style: styleProp,\n status = 'info',\n startIcon,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 14,\n lineHeight: 18.2,\n fontFamily: 'Pretendard-SemiBold',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strongInverse,\n });\n\n const messageFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 13,\n lineHeight: 16.9,\n fontFamily: 'Pretendard-Regular',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strongInverse,\n });\n\n const labelFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 13,\n lineHeight: 16.25,\n fontFamily: 'LexendDeca-SemiBold',\n letterSpacing: -0.26,\n }),\n color: theme.palette.text.accent,\n });\n\n const hasActionButton = !!(actionContent && onPress);\n\n const rootStyle = css([\n styles.root,\n startIcon ? { borderRadius: theme.shape.radius.xl } : undefined,\n hasActionButton ? { width: '100%' } : undefined,\n styleProp,\n ]);\n\n return (\n <ButtonBase\n disabled={!onPress}\n onPress={onPress}\n style={rootStyle}\n {...otherProps}\n >\n {startIcon ? (\n <React.Fragment>\n {startIcon}\n\n <Spacer size={3}/>\n </React.Fragment>\n ) : status !== 'info' ? (\n <React.Fragment>\n <StatusIcon status={status}/>\n\n <Spacer size={1.5}/>\n </React.Fragment>\n ) : null}\n\n <Column>\n {title ? (\n <Typography\n children={title}\n style={css([titleFontStyle])}\n />\n ) : null}\n\n <Text\n children={message}\n style={css([messageFontStyle])}\n />\n </Column>\n\n {actionContent ? (\n <React.Fragment>\n <Spacer flex={1}/>\n\n <View style={styles.actionButton}>\n {typeof actionContent === 'string' ? (\n <Text\n children={actionContent}\n style={labelFontStyle}\n />\n ) : (actionContent)}\n </View>\n </React.Fragment>\n ) : null}\n </ButtonBase>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AACA,SAASC,YAAT,QAA6B,qBAA7B;AAEA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,QAA/B,QAA+C,WAA/C;AACA,OAAOC,UAAP,MAAuB,0BAAvB;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AAEA,OAAOC,UAAP,MAAuB,cAAvB;;AAIA,MAAMC,SAA2C,GAAG,YAAmC;EACnF,MAAMC,KAAK,GAAGP,QAAQ,EAAtB;EAEA,OAAO;IACHQ,IAAI,EAAE;MACFC,aAAa,EAAE,KADb;MAEFC,UAAU,EAAE,QAFV;MAGFC,SAAS,EAAE,QAHT;MAIFC,eAAe,EAAEL,KAAK,CAACM,OAAN,CAAcC,OAAd,CAAsBC,MAJrC;MAKFC,YAAY,EAAE,EALZ;MAMFC,QAAQ,EAAE,GANR;MAOFC,aAAa,EAAEX,KAAK,CAACY,OAAN,CAAc,IAAd,CAPb;MAQFC,iBAAiB,EAAEb,KAAK,CAACY,OAAN,CAAc,CAAd,CARjB;MASFE,UAAU,EAAEd,KAAK,CAACY,OAAN,CAAc,CAAd;IATV,CADH;IAYHG,YAAY,EAAE;MACVC,UAAU,EAAEhB,KAAK,CAACY,OAAN,CAAc,CAAd;IADF;EAZX,CAAP;AAgBH,CAnBD;;AAqBA,eAAe,SAASK,eAAT,CAAyBC,KAAzB,EAAsD;EACjE,MAAM;IACFC,aADE;IAEFC,OAFE;IAGFC,KAHE;IAIFC,OAJE;IAKFC,KAAK,EAAEC,SALL;IAMFC,MAAM,GAAG,MANP;IAOFC,SAPE;IAQF,GAAGC;EARD,IASFT,KATJ;EAWA,MAAMU,MAAM,GAAG7B,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAGP,QAAQ,EAAtB;EAEA,MAAMoC,cAAc,GAAGtC,eAAe,CAACS,KAAD,EAAQ;IAC1C8B,QAAQ,EAAGC,CAAD,IAAOzC,YAAY,CAAC;MAC1B0C,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,qBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAD,CADa;IAO1CC,KAAK,EAAEpC,KAAK,CAACM,OAAN,CAAc+B,IAAd,CAAmBC;EAPgB,CAAR,CAAtC;EAUA,MAAMC,gBAAgB,GAAGhD,eAAe,CAACS,KAAD,EAAQ;IAC5C8B,QAAQ,EAAGC,CAAD,IAAOzC,YAAY,CAAC;MAC1B0C,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,oBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAD,CADe;IAO5CC,KAAK,EAAEpC,KAAK,CAACM,OAAN,CAAc+B,IAAd,CAAmBC;EAPkB,CAAR,CAAxC;EAUA,MAAME,cAAc,GAAGjD,eAAe,CAACS,KAAD,EAAQ;IAC1C8B,QAAQ,EAAGC,CAAD,IAAOzC,YAAY,CAAC;MAC1B0C,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,KAFc;MAG1BC,UAAU,EAAE,qBAHc;MAI1BC,aAAa,EAAE,CAAC;IAJU,CAAD,CADa;IAO1CC,KAAK,EAAEpC,KAAK,CAACM,OAAN,CAAc+B,IAAd,CAAmB7B;EAPgB,CAAR,CAAtC;EAUA,MAAMiC,eAAe,GAAG,CAAC,EAAEtB,aAAa,IAAIG,OAAnB,CAAzB;EAEA,MAAMoB,SAAS,GAAGlD,GAAG,CAAC,CAClBoC,MAAM,CAAC3B,IADW,EAElByB,SAAS,GAAG;IAAEjB,YAAY,EAAET,KAAK,CAAC2C,KAAN,CAAYC,MAAZ,CAAmBC;EAAnC,CAAH,GAA6CC,SAFpC,EAGlBL,eAAe,GAAG;IAAEM,KAAK,EAAE;EAAT,CAAH,GAAuBD,SAHpB,EAIlBtB,SAJkB,CAAD,CAArB;EAOA,oBACI,oBAAC,UAAD;IACI,QAAQ,EAAE,CAACF,OADf;IAEI,OAAO,EAAEA,OAFb;IAGI,KAAK,EAAEoB;EAHX,GAIQf,UAJR,GAMKD,SAAS,gBACN,oBAAC,KAAD,CAAO,QAAP,QACKA,SADL,eAGI,oBAAC,MAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADM,GAMND,MAAM,KAAK,MAAX,gBACA,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,UAAD;IAAY,MAAM,EAAEA;EAApB,EADJ,eAGI,oBAAC,MAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADA,GAMA,IAlBR,eAoBI,oBAAC,MAAD,QACKJ,KAAK,gBACF,oBAAC,UAAD;IACI,QAAQ,EAAEA,KADd;IAEI,KAAK,EAAE7B,GAAG,CAAC,CAACqC,cAAD,CAAD;EAFd,EADE,GAKF,IANR,eAQI,oBAAC,IAAD;IACI,QAAQ,EAAET,OADd;IAEI,KAAK,EAAE5B,GAAG,CAAC,CAAC+C,gBAAD,CAAD;EAFd,EARJ,CApBJ,EAkCKpB,aAAa,gBACV,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,MAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,oBAAC,IAAD;IAAM,KAAK,EAAES,MAAM,CAACb;EAApB,GACK,OAAOI,aAAP,KAAyB,QAAzB,gBACG,oBAAC,IAAD;IACI,QAAQ,EAAEA,aADd;IAEI,KAAK,EAAEqB;EAFX,EADH,GAKIrB,aANT,CAHJ,CADU,GAaV,IA/CR,CADJ;AAmDH;AAAA"}
1
+ {"version":3,"names":["React","Text","View","typographyOf","createFontStyle","css","useTheme","ButtonBase","Column","Spacer","Typography","StatusIcon","useStyles","theme","root","flexDirection","alignItems","alignSelf","backgroundColor","palette","surface","accent","borderRadius","maxWidth","paddingBottom","spacing","paddingHorizontal","paddingTop","actionButton","marginLeft","actionLabel","actionElement","paddingLeft","paddingVertical","SnackbarContent","props","actionContent","message","title","onPress","style","styleProp","status","startIcon","otherProps","styles","titleFontStyle","selector","_","fontSize","lineHeight","fontFamily","letterSpacing","color","text","strongInverse","messageFontStyle","labelFontStyle","hasActionButton","rootStyle","shape","radius","xl","undefined","width"],"sources":["SnackbarContent.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport { typographyOf } from '@fountain-ui/styles';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase/ButtonBase';\nimport Column from '../Column';\nimport Spacer from '../Spacer';\nimport Typography from '../Typography';\nimport type SnackbarContentProps from './SnackbarContentProps';\nimport StatusIcon from './StatusIcon';\n\ntype SnackBarContentStyles = NamedStylesStringUnion<'root' | 'actionButton' | 'actionLabel' | 'actionElement'>;\n\nconst useStyles: UseStyles<SnackBarContentStyles> = function (): SnackBarContentStyles {\n const theme = useTheme();\n\n return {\n root: {\n flexDirection: 'row',\n alignItems: 'center',\n alignSelf: 'center',\n backgroundColor: theme.palette.surface.accent,\n borderRadius: 22,\n maxWidth: 400,\n paddingBottom: theme.spacing(2.25),\n paddingHorizontal: theme.spacing(4),\n paddingTop: theme.spacing(2),\n },\n actionButton: {\n marginLeft: theme.spacing(6),\n },\n actionLabel: {\n paddingBottom: theme.spacing(1.5),\n paddingTop: theme.spacing(1.25),\n },\n actionElement: {\n paddingLeft: theme.spacing(2),\n paddingVertical: theme.spacing(1.25),\n },\n };\n};\n\nexport default function SnackbarContent(props: SnackbarContentProps) {\n const {\n actionContent,\n message,\n title,\n onPress,\n style: styleProp,\n status = 'info',\n startIcon,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 15,\n lineHeight: 19.5,\n fontFamily: 'PretendardStd-SemiBold',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strongInverse,\n });\n\n const messageFontStyle = createFontStyle(theme, {\n selector: (_) => title\n ? typographyOf({\n fontSize: 12,\n lineHeight: 15.6,\n fontFamily: 'PretendardStd-Regular',\n letterSpacing: 0,\n })\n : typographyOf({\n fontSize: 14,\n lineHeight: 18.2,\n fontFamily: 'PretendardStd-Regular',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strongInverse,\n });\n\n const labelFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 13,\n lineHeight: 16.25,\n fontFamily: 'LexendDeca-SemiBold',\n letterSpacing: -0.26,\n }),\n color: theme.palette.text.accent,\n });\n\n const hasActionButton = !!(actionContent && onPress);\n\n const rootStyle = css([\n styles.root,\n startIcon ? { borderRadius: theme.shape.radius.xl } : undefined,\n hasActionButton ? { width: '100%' } : undefined,\n styleProp,\n ]);\n\n return (\n <ButtonBase\n disabled={!onPress}\n onPress={onPress}\n style={rootStyle}\n {...otherProps}\n >\n {startIcon ? (\n <React.Fragment>\n {startIcon}\n\n <Spacer size={3}/>\n </React.Fragment>\n ) : status !== 'info' ? (\n <React.Fragment>\n <StatusIcon status={status}/>\n\n <Spacer size={1.5}/>\n </React.Fragment>\n ) : null}\n\n <Column>\n {title ? (\n <Typography\n children={title}\n style={css([titleFontStyle])}\n />\n ) : null}\n\n <Text\n children={message}\n style={css([messageFontStyle])}\n />\n </Column>\n\n {actionContent ? (\n <React.Fragment>\n <Spacer flex={1}/>\n\n <View style={styles.actionButton}>\n {typeof actionContent === 'string' ? (\n <View style={styles.actionLabel}>\n <Text\n children={actionContent}\n style={labelFontStyle}\n />\n </View>\n ) : (\n <View style={styles.actionElement}>\n {actionContent}\n </View>\n )}\n </View>\n </React.Fragment>\n ) : null}\n </ButtonBase>\n );\n};\n"],"mappings":"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"}
@@ -3,9 +3,8 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
3
3
  import React from 'react';
4
4
  import { Platform, Text, View } from 'react-native';
5
5
  import Badge from '../Badge';
6
- import Spacer from '../Spacer';
7
6
  import TabBase from '../TabBase';
8
- import { css, StyleSheet, useTheme } from '../styles';
7
+ import { css, StyleSheet } from '../styles';
9
8
  import { cloneElementSafely } from '../utils';
10
9
  import useVariantStyleMap from './useVariantStyleMap';
11
10
  const styles = StyleSheet.create({
@@ -25,41 +24,45 @@ export default function Tab(props) {
25
24
  children,
26
25
  enableIndicator = false,
27
26
  icon: defaultIcon,
27
+ parentColor = 'default',
28
28
  selected = false,
29
29
  selectedIcon,
30
+ size = 'medium',
30
31
  variant = 'default',
31
32
  style: styleProp,
33
+ innerStyle: innerStyleProp,
32
34
  onTabInnerLayout,
33
35
  ...otherProps
34
36
  } = props;
35
- const theme = useTheme();
36
- const vertical = variant === 'bottom-navigation';
37
37
  const {
38
38
  container: containerStyle,
39
+ iconContainer: iconContainerStyle,
39
40
  inner: innerStyle,
40
41
  label: labelStyle
41
- } = useVariantStyleMap(variant, selected);
42
+ } = useVariantStyleMap(variant, selected, size, parentColor);
42
43
  const tabBaseStyle = css([styles.root, containerStyle, styleProp]);
43
- const tabInnerStyle = css([styles.filledInner, innerStyle]);
44
- const pressEffect = selected ? 'none' : 'opacity';
44
+ const tabInnerStyle = css([styles.filledInner, innerStyle, innerStyleProp]);
45
45
  const icon = selected ? selectedIcon || defaultIcon : defaultIcon;
46
- const iconColor = selected ? theme.palette.icon.strong : theme.palette.icon.base;
47
- const iconElement = cloneElementSafely(icon, {
48
- fill: iconColor
49
- });
46
+ const iconElement = cloneElementSafely(icon);
50
47
  const tabElement = typeof children !== 'string' ? cloneElementSafely(children, {
51
48
  selected
52
49
  }) : /*#__PURE__*/React.createElement(React.Fragment, null, iconElement ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Badge, {
53
- invisible: !badgeVisible
54
- }, iconElement), /*#__PURE__*/React.createElement(Spacer, {
55
- size: 1.25
56
- })) : null, /*#__PURE__*/React.createElement(Text, {
50
+ horizontalOffset: -4,
51
+ invisible: !badgeVisible,
52
+ verticalOffset: -4
53
+ }, /*#__PURE__*/React.createElement(View, {
54
+ style: iconContainerStyle
55
+ }, iconElement)), /*#__PURE__*/React.createElement(Text, {
57
56
  style: css(labelStyle)
58
- }, children));
57
+ }, children)) : /*#__PURE__*/React.createElement(Badge, {
58
+ horizontalOffset: -7,
59
+ invisible: !badgeVisible,
60
+ verticalOffset: 3
61
+ }, /*#__PURE__*/React.createElement(Text, {
62
+ style: css(labelStyle)
63
+ }, children)));
59
64
  return /*#__PURE__*/React.createElement(TabBase, _extends({
60
- pressEffect: pressEffect,
61
- style: tabBaseStyle,
62
- vertical: vertical
65
+ style: tabBaseStyle
63
66
  }, otherProps), /*#__PURE__*/React.createElement(View, {
64
67
  onLayout: onTabInnerLayout,
65
68
  style: tabInnerStyle
@@ -1 +1 @@
1
- {"version":3,"names":["React","Platform","Text","View","Badge","Spacer","TabBase","css","StyleSheet","useTheme","cloneElementSafely","useVariantStyleMap","styles","create","root","OS","minWidth","filledInner","alignItems","justifyContent","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","selected","selectedIcon","variant","style","styleProp","onTabInnerLayout","otherProps","theme","vertical","container","containerStyle","inner","innerStyle","label","labelStyle","tabBaseStyle","tabInnerStyle","pressEffect","iconColor","palette","strong","base","iconElement","fill","tabElement"],"sources":["Tab.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform, Text, View } from 'react-native';\nimport Badge from '../Badge';\nimport Spacer from '../Spacer';\nimport TabBase from '../TabBase';\nimport { css, StyleSheet, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport type TabProps from './TabProps';\nimport type { TabVariant } from './TabProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nconst styles = StyleSheet.create({\n root: {\n // TODO: Remove redundant platform checking\n ...(Platform.OS === 'web' ? { minWidth: 'auto' } : {}),\n },\n filledInner: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n});\n\nexport default function Tab(props: TabProps) {\n const {\n badgeVisible = false,\n children,\n enableIndicator = false,\n icon: defaultIcon,\n selected = false,\n selectedIcon,\n variant = 'default' as TabVariant,\n style: styleProp,\n onTabInnerLayout,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const vertical = variant === 'bottom-navigation';\n\n const {\n container: containerStyle,\n inner: innerStyle,\n label: labelStyle,\n } = useVariantStyleMap(variant, selected);\n\n const tabBaseStyle = css([\n styles.root,\n containerStyle,\n styleProp,\n ]);\n\n const tabInnerStyle = css([\n styles.filledInner,\n innerStyle,\n ]);\n\n const pressEffect = selected ? 'none' : 'opacity';\n\n const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n const iconColor = selected ? theme.palette.icon.strong : theme.palette.icon.base;\n const iconElement = cloneElementSafely(icon, { fill: iconColor });\n\n const tabElement = typeof children !== 'string' ? (\n cloneElementSafely(children, {\n selected,\n })\n ) : (\n <React.Fragment>\n {iconElement ? (\n <React.Fragment>\n <Badge invisible={!badgeVisible}>\n {iconElement}\n </Badge>\n\n <Spacer size={1.25}/>\n </React.Fragment>\n ) : null}\n\n <Text style={css(labelStyle)}>\n {children}\n </Text>\n </React.Fragment>\n );\n\n return (\n <TabBase\n pressEffect={pressEffect}\n style={tabBaseStyle}\n vertical={vertical}\n {...otherProps}\n >\n <View onLayout={onTabInnerLayout} style={tabInnerStyle}>\n {tabElement}\n </View>\n </TabBase>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAT,EAAmBC,IAAnB,EAAyBC,IAAzB,QAAqC,cAArC;AACA,OAAOC,KAAP,MAAkB,UAAlB;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,OAAP,MAAoB,YAApB;AACA,SAASC,GAAT,EAAcC,UAAd,EAA0BC,QAA1B,QAA0C,WAA1C;AACA,SAASC,kBAAT,QAAmC,UAAnC;AAGA,OAAOC,kBAAP,MAA+B,sBAA/B;AAEA,MAAMC,MAAM,GAAGJ,UAAU,CAACK,MAAX,CAAkB;EAC7BC,IAAI,EAAE,EACF;IACA,IAAIb,QAAQ,CAACc,EAAT,KAAgB,KAAhB,GAAwB;MAAEC,QAAQ,EAAE;IAAZ,CAAxB,GAA+C,EAAnD;EAFE,CADuB;EAK7BC,WAAW,EAAE;IACTC,UAAU,EAAE,QADH;IAETC,cAAc,EAAE;EAFP;AALgB,CAAlB,CAAf;AAWA,eAAe,SAASC,GAAT,CAAaC,KAAb,EAA8B;EACzC,MAAM;IACFC,YAAY,GAAG,KADb;IAEFC,QAFE;IAGFC,eAAe,GAAG,KAHhB;IAIFC,IAAI,EAAEC,WAJJ;IAKFC,QAAQ,GAAG,KALT;IAMFC,YANE;IAOFC,OAAO,GAAG,SAPR;IAQFC,KAAK,EAAEC,SARL;IASFC,gBATE;IAUF,GAAGC;EAVD,IAWFZ,KAXJ;EAaA,MAAMa,KAAK,GAAGzB,QAAQ,EAAtB;EAEA,MAAM0B,QAAQ,GAAGN,OAAO,KAAK,mBAA7B;EAEA,MAAM;IACFO,SAAS,EAAEC,cADT;IAEFC,KAAK,EAAEC,UAFL;IAGFC,KAAK,EAAEC;EAHL,IAIF9B,kBAAkB,CAACkB,OAAD,EAAUF,QAAV,CAJtB;EAMA,MAAMe,YAAY,GAAGnC,GAAG,CAAC,CACrBK,MAAM,CAACE,IADc,EAErBuB,cAFqB,EAGrBN,SAHqB,CAAD,CAAxB;EAMA,MAAMY,aAAa,GAAGpC,GAAG,CAAC,CACtBK,MAAM,CAACK,WADe,EAEtBsB,UAFsB,CAAD,CAAzB;EAKA,MAAMK,WAAW,GAAGjB,QAAQ,GAAG,MAAH,GAAY,SAAxC;EAEA,MAAMF,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;EACA,MAAMmB,SAAS,GAAGlB,QAAQ,GAAGO,KAAK,CAACY,OAAN,CAAcrB,IAAd,CAAmBsB,MAAtB,GAA+Bb,KAAK,CAACY,OAAN,CAAcrB,IAAd,CAAmBuB,IAA5E;EACA,MAAMC,WAAW,GAAGvC,kBAAkB,CAACe,IAAD,EAAO;IAAEyB,IAAI,EAAEL;EAAR,CAAP,CAAtC;EAEA,MAAMM,UAAU,GAAG,OAAO5B,QAAP,KAAoB,QAApB,GACfb,kBAAkB,CAACa,QAAD,EAAW;IACzBI;EADyB,CAAX,CADH,gBAKf,oBAAC,KAAD,CAAO,QAAP,QACKsB,WAAW,gBACR,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,KAAD;IAAO,SAAS,EAAE,CAAC3B;EAAnB,GACK2B,WADL,CADJ,eAKI,oBAAC,MAAD;IAAQ,IAAI,EAAE;EAAd,EALJ,CADQ,GAQR,IATR,eAWI,oBAAC,IAAD;IAAM,KAAK,EAAE1C,GAAG,CAACkC,UAAD;EAAhB,GACKlB,QADL,CAXJ,CALJ;EAsBA,oBACI,oBAAC,OAAD;IACI,WAAW,EAAEqB,WADjB;IAEI,KAAK,EAAEF,YAFX;IAGI,QAAQ,EAAEP;EAHd,GAIQF,UAJR,gBAMI,oBAAC,IAAD;IAAM,QAAQ,EAAED,gBAAhB;IAAkC,KAAK,EAAEW;EAAzC,GACKQ,UADL,CANJ,CADJ;AAYH;AAAA"}
1
+ {"version":3,"names":["React","Platform","Text","View","Badge","TabBase","css","StyleSheet","cloneElementSafely","useVariantStyleMap","styles","create","root","OS","minWidth","filledInner","alignItems","justifyContent","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","parentColor","selected","selectedIcon","size","variant","style","styleProp","innerStyle","innerStyleProp","onTabInnerLayout","otherProps","container","containerStyle","iconContainer","iconContainerStyle","inner","label","labelStyle","tabBaseStyle","tabInnerStyle","iconElement","tabElement"],"sources":["Tab.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform, Text, View } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport type { TabsColor } from '../Tabs';\nimport { css, StyleSheet } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport type TabProps from './TabProps';\nimport type { TabSize, TabVariant } from './TabProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nconst styles = StyleSheet.create({\n root: {\n // TODO: Remove redundant platform checking\n ...(Platform.OS === 'web' ? { minWidth: 'auto' } : {}),\n },\n filledInner: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n});\n\nexport default function Tab(props: TabProps) {\n const {\n badgeVisible = false,\n children,\n enableIndicator = false,\n icon: defaultIcon,\n parentColor = 'default' as TabsColor,\n selected = false,\n selectedIcon,\n size = 'medium' as TabSize,\n variant = 'default' as TabVariant,\n style: styleProp,\n innerStyle: innerStyleProp,\n onTabInnerLayout,\n ...otherProps\n } = props;\n\n const {\n container: containerStyle,\n iconContainer: iconContainerStyle,\n inner: innerStyle,\n label: labelStyle,\n } = useVariantStyleMap(variant, selected, size, parentColor);\n\n const tabBaseStyle = css([\n styles.root,\n containerStyle,\n styleProp,\n ]);\n\n const tabInnerStyle = css([\n styles.filledInner,\n innerStyle,\n innerStyleProp,\n ]);\n\n const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n const iconElement = cloneElementSafely(icon);\n\n const tabElement = typeof children !== 'string' ? (\n cloneElementSafely(children, {\n selected,\n })\n ) : (\n <React.Fragment>\n {iconElement ? (\n <React.Fragment>\n <Badge\n horizontalOffset={-4}\n invisible={!badgeVisible}\n verticalOffset={-4}\n >\n <View style={iconContainerStyle}>\n {iconElement}\n </View>\n </Badge>\n\n <Text style={css(labelStyle)}>\n {children}\n </Text>\n </React.Fragment>\n ) : (\n <Badge\n horizontalOffset={-7}\n invisible={!badgeVisible}\n verticalOffset={3}\n >\n <Text style={css(labelStyle)}>\n {children}\n </Text>\n </Badge>\n )}\n </React.Fragment>\n );\n\n return (\n <TabBase\n style={tabBaseStyle}\n {...otherProps}\n >\n <View onLayout={onTabInnerLayout} style={tabInnerStyle}>\n {tabElement}\n </View>\n </TabBase>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAT,EAAmBC,IAAnB,EAAyBC,IAAzB,QAAqC,cAArC;AACA,OAAOC,KAAP,MAAkB,UAAlB;AACA,OAAOC,OAAP,MAAoB,YAApB;AAEA,SAASC,GAAT,EAAcC,UAAd,QAAgC,WAAhC;AACA,SAASC,kBAAT,QAAmC,UAAnC;AAGA,OAAOC,kBAAP,MAA+B,sBAA/B;AAEA,MAAMC,MAAM,GAAGH,UAAU,CAACI,MAAX,CAAkB;EAC7BC,IAAI,EAAE,EACF;IACA,IAAIX,QAAQ,CAACY,EAAT,KAAgB,KAAhB,GAAwB;MAAEC,QAAQ,EAAE;IAAZ,CAAxB,GAA+C,EAAnD;EAFE,CADuB;EAK7BC,WAAW,EAAE;IACTC,UAAU,EAAE,QADH;IAETC,cAAc,EAAE;EAFP;AALgB,CAAlB,CAAf;AAWA,eAAe,SAASC,GAAT,CAAaC,KAAb,EAA8B;EACzC,MAAM;IACFC,YAAY,GAAG,KADb;IAEFC,QAFE;IAGFC,eAAe,GAAG,KAHhB;IAIFC,IAAI,EAAEC,WAJJ;IAKFC,WAAW,GAAG,SALZ;IAMFC,QAAQ,GAAG,KANT;IAOFC,YAPE;IAQFC,IAAI,GAAG,QARL;IASFC,OAAO,GAAG,SATR;IAUFC,KAAK,EAAEC,SAVL;IAWFC,UAAU,EAAEC,cAXV;IAYFC,gBAZE;IAaF,GAAGC;EAbD,IAcFhB,KAdJ;EAgBA,MAAM;IACFiB,SAAS,EAAEC,cADT;IAEFC,aAAa,EAAEC,kBAFb;IAGFC,KAAK,EAAER,UAHL;IAIFS,KAAK,EAAEC;EAJL,IAKFjC,kBAAkB,CAACoB,OAAD,EAAUH,QAAV,EAAoBE,IAApB,EAA0BH,WAA1B,CALtB;EAOA,MAAMkB,YAAY,GAAGrC,GAAG,CAAC,CACrBI,MAAM,CAACE,IADc,EAErByB,cAFqB,EAGrBN,SAHqB,CAAD,CAAxB;EAMA,MAAMa,aAAa,GAAGtC,GAAG,CAAC,CACtBI,MAAM,CAACK,WADe,EAEtBiB,UAFsB,EAGtBC,cAHsB,CAAD,CAAzB;EAMA,MAAMV,IAAI,GAAGG,QAAQ,GAAIC,YAAY,IAAIH,WAApB,GAAmCA,WAAxD;EACA,MAAMqB,WAAW,GAAGrC,kBAAkB,CAACe,IAAD,CAAtC;EAEA,MAAMuB,UAAU,GAAG,OAAOzB,QAAP,KAAoB,QAApB,GACfb,kBAAkB,CAACa,QAAD,EAAW;IACzBK;EADyB,CAAX,CADH,gBAKf,oBAAC,KAAD,CAAO,QAAP,QACKmB,WAAW,gBACR,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,KAAD;IACI,gBAAgB,EAAE,CAAC,CADvB;IAEI,SAAS,EAAE,CAACzB,YAFhB;IAGI,cAAc,EAAE,CAAC;EAHrB,gBAKI,oBAAC,IAAD;IAAM,KAAK,EAAEmB;EAAb,GACKM,WADL,CALJ,CADJ,eAWI,oBAAC,IAAD;IAAM,KAAK,EAAEvC,GAAG,CAACoC,UAAD;EAAhB,GACKrB,QADL,CAXJ,CADQ,gBAiBR,oBAAC,KAAD;IACI,gBAAgB,EAAE,CAAC,CADvB;IAEI,SAAS,EAAE,CAACD,YAFhB;IAGI,cAAc,EAAE;EAHpB,gBAKI,oBAAC,IAAD;IAAM,KAAK,EAAEd,GAAG,CAACoC,UAAD;EAAhB,GACKrB,QADL,CALJ,CAlBR,CALJ;EAoCA,oBACI,oBAAC,OAAD;IACI,KAAK,EAAEsB;EADX,GAEQR,UAFR,gBAII,oBAAC,IAAD;IAAM,QAAQ,EAAED,gBAAhB;IAAkC,KAAK,EAAEU;EAAzC,GACKE,UADL,CAJJ,CADJ;AAUH;AAAA"}
@@ -1,2 +1,3 @@
1
- export const tabVariants = ['default', 'circular', 'bottom-navigation'];
1
+ export const tabSizes = ['small', 'medium'];
2
+ export const tabVariants = ['default', 'circular', 'circular-home', 'bottom-navigation'];
2
3
  //# sourceMappingURL=TabProps.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["tabVariants"],"sources":["TabProps.ts"],"sourcesContent":["import React from 'react';\nimport type { LayoutChangeEvent } from 'react-native';\nimport type { TabBaseProps } from '../TabBase';\nimport type { OverridableComponentProps } from '../types';\n\nexport const tabVariants = ['default', 'circular', 'bottom-navigation'] as const;\nexport type TabVariant = typeof tabVariants[number];\n\nexport default interface TabProps extends OverridableComponentProps<TabBaseProps, {\n /**\n * If `true`, the badge is visible.\n * @default false\n */\n badgeVisible?: boolean;\n\n /**\n * The label of the Tab.\n */\n children: string | React.ReactElement;\n\n /**\n * If `true`, the indicator is enabled.\n * @default false\n */\n enableIndicator?: boolean;\n\n /**\n * If `true`, the component is selected.\n * @default false\n */\n selected?: boolean;\n\n /**\n * Element placed before the children.\n */\n icon?: React.ReactElement;\n\n /**\n * If supplied, use this icon on selected state.\n */\n selectedIcon?: React.ReactElement;\n\n /**\n * The variant to use.\n * @default 'default'\n */\n variant?: TabVariant;\n\n /**\n * Function to be passed to the child component's onLayout prop.\n */\n onTabInnerLayout?: (event: LayoutChangeEvent) => void;\n}> {}\n"],"mappings":"AAKA,OAAO,MAAMA,WAAW,GAAG,CAAC,SAAD,EAAY,UAAZ,EAAwB,mBAAxB,CAApB"}
1
+ {"version":3,"names":["tabSizes","tabVariants"],"sources":["TabProps.ts"],"sourcesContent":["import React from 'react';\nimport type { LayoutChangeEvent } from 'react-native';\nimport type { TabBaseProps } from '../TabBase';\nimport type { TabsColor } from '../Tabs';\nimport type { ExtendedStyle, OverridableComponentProps } from '../types';\n\nexport const tabSizes = ['small', 'medium'] as const;\nexport type TabSize = typeof tabSizes[number];\n\nexport const tabVariants = ['default', 'circular', 'circular-home', 'bottom-navigation'] as const;\nexport type TabVariant = typeof tabVariants[number];\n\nexport default interface TabProps extends OverridableComponentProps<TabBaseProps, {\n /**\n * If `true`, the badge is visible.\n * @default false\n */\n badgeVisible?: boolean;\n\n /**\n * The label of the Tab.\n */\n children: string | React.ReactElement;\n\n /**\n * If `true`, the indicator is enabled.\n * @default false\n */\n enableIndicator?: boolean;\n\n /**\n * The color value inherited from the parent Tabs component.\n * This allows Tab components to apply consistent styling based on the Tabs container's color scheme.\n * @default 'default'\n */\n parentColor?: TabsColor;\n\n /**\n * If `true`, the component is selected.\n * @default false\n */\n selected?: boolean;\n\n /**\n * Element placed before the children.\n */\n icon?: React.ReactElement;\n\n /**\n * If supplied, use this icon on selected state.\n */\n selectedIcon?: React.ReactElement;\n\n /**\n * The size of the Tab.\n * @default 'medium'\n */\n size?: TabSize;\n\n /**\n * The variant to use.\n * @default 'default'\n */\n variant?: TabVariant;\n\n /**\n * Function to be passed to the child component's onLayout prop.\n */\n onTabInnerLayout?: (event: LayoutChangeEvent) => void;\n\n /**\n * Custom style to apply to the inner container of the Tab.\n * This allows customization of the tab's inner layout and appearance.\n */\n innerStyle?: ExtendedStyle | ExtendedStyle[];\n}> {}\n"],"mappings":"AAMA,OAAO,MAAMA,QAAQ,GAAG,CAAC,OAAD,EAAU,QAAV,CAAjB;AAGP,OAAO,MAAMC,WAAW,GAAG,CAAC,SAAD,EAAY,UAAZ,EAAwB,eAAxB,EAAyC,mBAAzC,CAApB"}
@@ -1,2 +1,3 @@
1
1
  export { default } from './Tab';
2
+ export { tabSizes, tabVariants } from './TabProps';
2
3
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["default"],"sources":["index.ts"],"sourcesContent":["export { default } from './Tab';\nexport type { default as TabProps, TabVariant } from './TabProps';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,OAAxB"}
1
+ {"version":3,"names":["default","tabSizes","tabVariants"],"sources":["index.ts"],"sourcesContent":["export { default } from './Tab';\nexport type { default as TabProps, TabSize, TabVariant } from './TabProps';\nexport { tabSizes, tabVariants } from './TabProps';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,OAAxB;AAEA,SAASC,QAAT,EAAmBC,WAAnB,QAAsC,YAAtC"}
@@ -1,7 +1,7 @@
1
1
  import { useMemo } from 'react';
2
2
  import { typographyOf } from '@fountain-ui/styles';
3
3
  import { createFontStyle, useTheme } from '../styles';
4
- export default function useVariantStyleMap(variant, selected) {
4
+ export default function useVariantStyleMap(variant, selected, size, parentColor) {
5
5
  const theme = useTheme();
6
6
  return useMemo(() => {
7
7
  switch (variant) {
@@ -12,19 +12,50 @@ export default function useVariantStyleMap(variant, selected) {
12
12
  paddingVertical: theme.spacing(1)
13
13
  },
14
14
  inner: {
15
- backgroundColor: selected ? theme.palette.fill.base : theme.palette.fill.weaker,
15
+ backgroundColor: selected ? theme.palette.fill.base : parentColor === 'alt' ? theme.palette.surface.base : theme.palette.fill.weaker,
16
16
  borderRadius: theme.shape.radius.full,
17
- paddingHorizontal: theme.spacing(4),
18
- paddingVertical: theme.spacing(1.75)
17
+ flexDirection: 'row',
18
+ gap: 5,
19
+ paddingBottom: 7.5,
20
+ paddingHorizontal: 14,
21
+ paddingTop: 6.5
22
+ },
23
+ label: createFontStyle(theme, {
24
+ selector: _ => typographyOf({
25
+ fontSize: size === 'small' ? 14 : 15,
26
+ lineHeight: size === 'small' ? 18.2 : 19.5,
27
+ fontFamily: 'PretendardStd-SemiBold',
28
+ letterSpacing: 0
29
+ }),
30
+ color: selected ? theme.palette.text.strongInverse : theme.palette.text.base
31
+ })
32
+ };
33
+
34
+ case 'circular-home':
35
+ return {
36
+ container: {
37
+ paddingBottom: 4,
38
+ paddingHorizontal: 3
39
+ },
40
+ inner: {
41
+ backgroundColor: selected ? theme.palette.fill.base : theme.palette.surface.base,
42
+ borderRadius: theme.shape.radius.full,
43
+ borderWidth: selected ? undefined : 0.5,
44
+ borderColor: selected ? undefined : theme.palette.border.weak,
45
+ flexDirection: 'row',
46
+ gap: 5,
47
+ paddingBottom: 7.5,
48
+ paddingHorizontal: 14,
49
+ paddingTop: 6.5
19
50
  },
20
51
  label: createFontStyle(theme, {
21
52
  selector: _ => typographyOf({
22
53
  fontSize: 14,
23
54
  lineHeight: 18.2,
24
- fontFamily: 'Pretendard-SemiBold',
25
- letterSpacing: 0
55
+ fontFamily: 'LexendDeca-Medium',
56
+ letterSpacing: -0.28
26
57
  }),
27
- color: selected ? theme.palette.text.strongInverse : theme.palette.text.strong
58
+ color: selected ? theme.palette.text.strongInverse : theme.palette.text.base
28
59
  })
29
60
  };
30
61
 
@@ -34,15 +65,19 @@ export default function useVariantStyleMap(variant, selected) {
34
65
  alignItems: 'center',
35
66
  height: 49,
36
67
  justifyContent: 'flex-start',
37
- paddingTop: theme.spacing(2.625),
38
- width: 48
68
+ maxWidth: 64,
69
+ paddingTop: 10
70
+ },
71
+ inner: {
72
+ flexDirection: 'column',
73
+ gap: 5
39
74
  },
40
75
  label: createFontStyle(theme, {
41
76
  selector: _ => typographyOf({
42
- fontSize: 10,
43
- lineHeight: 10,
44
- fontFamily: 'Pretendard-Medium',
45
- letterSpacing: -0.1
77
+ fontSize: 10.5,
78
+ lineHeight: 10.5,
79
+ fontFamily: 'PretendardStd-Medium',
80
+ letterSpacing: -0.105
46
81
  }),
47
82
  color: selected ? theme.palette.text.strong : theme.palette.text.base
48
83
  })
@@ -52,19 +87,25 @@ export default function useVariantStyleMap(variant, selected) {
52
87
  default:
53
88
  return {
54
89
  container: {
55
- padding: theme.spacing(2.5)
90
+ paddingHorizontal: 10
91
+ },
92
+ inner: {
93
+ flexDirection: 'row',
94
+ gap: 5,
95
+ paddingHorizontal: 1,
96
+ paddingVertical: 10
56
97
  },
57
98
  label: createFontStyle(theme, {
58
99
  selector: _ => typographyOf({
59
- fontSize: 15,
60
- lineHeight: 18.75,
61
- fontFamily: 'Pretendard-SemiBold',
100
+ fontSize: size === 'small' ? 15 : 16,
101
+ lineHeight: size === 'small' ? 18.75 : 20,
102
+ fontFamily: selected ? 'PretendardStd-SemiBold' : 'PretendardStd-Medium',
62
103
  letterSpacing: 0
63
104
  }),
64
105
  color: selected ? theme.palette.text.strong : theme.palette.text.base
65
106
  })
66
107
  };
67
108
  }
68
- }, [theme, variant, selected]);
109
+ }, [theme, variant, selected, size, parentColor]);
69
110
  }
70
111
  //# sourceMappingURL=useVariantStyleMap.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["useMemo","typographyOf","createFontStyle","useTheme","useVariantStyleMap","variant","selected","theme","container","paddingHorizontal","spacing","paddingVertical","inner","backgroundColor","palette","fill","base","weaker","borderRadius","shape","radius","full","label","selector","_","fontSize","lineHeight","fontFamily","letterSpacing","color","text","strongInverse","strong","alignItems","height","justifyContent","paddingTop","width","padding"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { TabVariant } from './TabProps';\n\ninterface VariantStyle {\n container: FountainUiStyle;\n inner?: FountainUiStyle;\n label: TextStyle;\n}\n\nexport default function useVariantStyleMap(variant: TabVariant, selected: boolean): VariantStyle {\n const theme = useTheme();\n\n return useMemo<VariantStyle>(() => {\n switch (variant) {\n case 'circular':\n return {\n container: {\n paddingHorizontal: theme.spacing(0.75),\n paddingVertical: theme.spacing(1),\n },\n inner: {\n backgroundColor: selected\n ? theme.palette.fill.base\n : theme.palette.fill.weaker,\n borderRadius: theme.shape.radius.full,\n paddingHorizontal: theme.spacing(4),\n paddingVertical: theme.spacing(1.75),\n },\n label: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 14,\n lineHeight: 18.2,\n fontFamily: 'Pretendard-SemiBold',\n letterSpacing: 0,\n }),\n color: selected\n ? theme.palette.text.strongInverse\n : theme.palette.text.strong,\n }),\n };\n case 'bottom-navigation':\n return {\n container: {\n alignItems: 'center',\n height: 49,\n justifyContent: 'flex-start',\n paddingTop: theme.spacing(2.625),\n width: 48,\n },\n label: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 10,\n lineHeight: 10,\n fontFamily: 'Pretendard-Medium',\n letterSpacing: -0.1,\n }),\n color: selected\n ? theme.palette.text.strong\n : theme.palette.text.base,\n }),\n };\n case 'default':\n default:\n return {\n container: {\n padding: theme.spacing(2.5),\n },\n label: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 15,\n lineHeight: 18.75,\n fontFamily: 'Pretendard-SemiBold',\n letterSpacing: 0,\n }),\n color: selected\n ? theme.palette.text.strong\n : theme.palette.text.base,\n }),\n };\n }\n }, [theme, variant, selected]);\n}\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,OAAxB;AAGA,SAASC,YAAT,QAA6B,qBAA7B;AACA,SAASC,eAAT,EAA0BC,QAA1B,QAA0C,WAA1C;AASA,eAAe,SAASC,kBAAT,CAA4BC,OAA5B,EAAiDC,QAAjD,EAAkF;EAC7F,MAAMC,KAAK,GAAGJ,QAAQ,EAAtB;EAEA,OAAOH,OAAO,CAAe,MAAM;IAC/B,QAAQK,OAAR;MACI,KAAK,UAAL;QACI,OAAO;UACHG,SAAS,EAAE;YACPC,iBAAiB,EAAEF,KAAK,CAACG,OAAN,CAAc,IAAd,CADZ;YAEPC,eAAe,EAAEJ,KAAK,CAACG,OAAN,CAAc,CAAd;UAFV,CADR;UAKHE,KAAK,EAAE;YACHC,eAAe,EAAEP,QAAQ,GACnBC,KAAK,CAACO,OAAN,CAAcC,IAAd,CAAmBC,IADA,GAEnBT,KAAK,CAACO,OAAN,CAAcC,IAAd,CAAmBE,MAHtB;YAIHC,YAAY,EAAEX,KAAK,CAACY,KAAN,CAAYC,MAAZ,CAAmBC,IAJ9B;YAKHZ,iBAAiB,EAAEF,KAAK,CAACG,OAAN,CAAc,CAAd,CALhB;YAMHC,eAAe,EAAEJ,KAAK,CAACG,OAAN,CAAc,IAAd;UANd,CALJ;UAaHY,KAAK,EAAEpB,eAAe,CAACK,KAAD,EAAQ;YAC1BgB,QAAQ,EAAGC,CAAD,IAAOvB,YAAY,CAAC;cAC1BwB,QAAQ,EAAE,EADgB;cAE1BC,UAAU,EAAE,IAFc;cAG1BC,UAAU,EAAE,qBAHc;cAI1BC,aAAa,EAAE;YAJW,CAAD,CADH;YAO1BC,KAAK,EAAEvB,QAAQ,GACTC,KAAK,CAACO,OAAN,CAAcgB,IAAd,CAAmBC,aADV,GAETxB,KAAK,CAACO,OAAN,CAAcgB,IAAd,CAAmBE;UATC,CAAR;QAbnB,CAAP;;MAyBJ,KAAK,mBAAL;QACI,OAAO;UACHxB,SAAS,EAAE;YACPyB,UAAU,EAAE,QADL;YAEPC,MAAM,EAAE,EAFD;YAGPC,cAAc,EAAE,YAHT;YAIPC,UAAU,EAAE7B,KAAK,CAACG,OAAN,CAAc,KAAd,CAJL;YAKP2B,KAAK,EAAE;UALA,CADR;UAQHf,KAAK,EAAEpB,eAAe,CAACK,KAAD,EAAQ;YAC1BgB,QAAQ,EAAGC,CAAD,IAAOvB,YAAY,CAAC;cAC1BwB,QAAQ,EAAE,EADgB;cAE1BC,UAAU,EAAE,EAFc;cAG1BC,UAAU,EAAE,mBAHc;cAI1BC,aAAa,EAAE,CAAC;YAJU,CAAD,CADH;YAO1BC,KAAK,EAAEvB,QAAQ,GACTC,KAAK,CAACO,OAAN,CAAcgB,IAAd,CAAmBE,MADV,GAETzB,KAAK,CAACO,OAAN,CAAcgB,IAAd,CAAmBd;UATC,CAAR;QARnB,CAAP;;MAoBJ,KAAK,SAAL;MACA;QACI,OAAO;UACHR,SAAS,EAAE;YACP8B,OAAO,EAAE/B,KAAK,CAACG,OAAN,CAAc,GAAd;UADF,CADR;UAIHY,KAAK,EAAEpB,eAAe,CAACK,KAAD,EAAQ;YAC1BgB,QAAQ,EAAGC,CAAD,IAAOvB,YAAY,CAAC;cAC1BwB,QAAQ,EAAE,EADgB;cAE1BC,UAAU,EAAE,KAFc;cAG1BC,UAAU,EAAE,qBAHc;cAI1BC,aAAa,EAAE;YAJW,CAAD,CADH;YAO1BC,KAAK,EAAEvB,QAAQ,GACTC,KAAK,CAACO,OAAN,CAAcgB,IAAd,CAAmBE,MADV,GAETzB,KAAK,CAACO,OAAN,CAAcgB,IAAd,CAAmBd;UATC,CAAR;QAJnB,CAAP;IAlDR;EAmEH,CApEa,EAoEX,CAACT,KAAD,EAAQF,OAAR,EAAiBC,QAAjB,CApEW,CAAd;AAqEH"}
1
+ {"version":3,"names":["useMemo","typographyOf","createFontStyle","useTheme","useVariantStyleMap","variant","selected","size","parentColor","theme","container","paddingHorizontal","spacing","paddingVertical","inner","backgroundColor","palette","fill","base","surface","weaker","borderRadius","shape","radius","full","flexDirection","gap","paddingBottom","paddingTop","label","selector","_","fontSize","lineHeight","fontFamily","letterSpacing","color","text","strongInverse","borderWidth","undefined","borderColor","border","weak","alignItems","height","justifyContent","maxWidth","strong"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport type { TabsColor } from '../Tabs';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { TabSize, TabVariant } from './TabProps';\n\ninterface VariantStyle {\n container: FountainUiStyle;\n iconContainer?: FountainUiStyle;\n inner?: FountainUiStyle;\n label: TextStyle;\n}\n\nexport default function useVariantStyleMap(\n variant: TabVariant,\n selected: boolean,\n size: TabSize,\n parentColor: TabsColor,\n): VariantStyle {\n const theme = useTheme();\n\n return useMemo<VariantStyle>(() => {\n switch (variant) {\n case 'circular':\n return {\n container: {\n paddingHorizontal: theme.spacing(0.75),\n paddingVertical: theme.spacing(1),\n },\n inner: {\n backgroundColor: selected\n ? theme.palette.fill.base\n : parentColor === 'alt'\n ? theme.palette.surface.base\n : theme.palette.fill.weaker,\n borderRadius: theme.shape.radius.full,\n flexDirection: 'row',\n gap: 5,\n paddingBottom: 7.5,\n paddingHorizontal: 14,\n paddingTop: 6.5,\n },\n label: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: size === 'small' ? 14 : 15,\n lineHeight: size === 'small' ? 18.2 : 19.5,\n fontFamily: 'PretendardStd-SemiBold',\n letterSpacing: 0,\n }),\n color: selected\n ? theme.palette.text.strongInverse\n : theme.palette.text.base,\n }),\n };\n case 'circular-home':\n return {\n container: {\n paddingBottom: 4,\n paddingHorizontal: 3,\n },\n inner: {\n backgroundColor: selected\n ? theme.palette.fill.base\n : theme.palette.surface.base,\n borderRadius: theme.shape.radius.full,\n borderWidth: selected ? undefined : 0.5,\n borderColor: selected ? undefined : theme.palette.border.weak,\n flexDirection: 'row',\n gap: 5,\n paddingBottom: 7.5,\n paddingHorizontal: 14,\n paddingTop: 6.5,\n },\n label: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 14,\n lineHeight: 18.2,\n fontFamily: 'LexendDeca-Medium',\n letterSpacing: -0.28,\n }),\n color: selected\n ? theme.palette.text.strongInverse\n : theme.palette.text.base,\n }),\n };\n case 'bottom-navigation':\n return {\n container: {\n alignItems: 'center',\n height: 49,\n justifyContent: 'flex-start',\n maxWidth: 64,\n paddingTop: 10,\n },\n inner: {\n flexDirection: 'column',\n gap: 5,\n },\n label: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 10.5,\n lineHeight: 10.5,\n fontFamily: 'PretendardStd-Medium',\n letterSpacing: -0.105,\n }),\n color: selected\n ? theme.palette.text.strong\n : theme.palette.text.base,\n }),\n };\n case 'default':\n default:\n return {\n container: {\n paddingHorizontal: 10,\n },\n inner: {\n flexDirection: 'row',\n gap: 5,\n paddingHorizontal: 1,\n paddingVertical: 10,\n },\n label: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: size === 'small' ? 15 : 16,\n lineHeight: size === 'small' ? 18.75 : 20,\n fontFamily: selected ? 'PretendardStd-SemiBold' : 'PretendardStd-Medium',\n letterSpacing: 0,\n }),\n color: selected\n ? theme.palette.text.strong\n : theme.palette.text.base,\n }),\n };\n }\n }, [theme, variant, selected, size, parentColor]);\n}\n"],"mappings":"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"}
@@ -9,12 +9,6 @@ const useStyles = function () {
9
9
  root: {
10
10
  alignItems: 'center',
11
11
  justifyContent: 'center'
12
- },
13
- row: {
14
- flexDirection: 'row'
15
- },
16
- column: {
17
- flexDirection: 'column'
18
12
  }
19
13
  };
20
14
  };
@@ -25,7 +19,6 @@ export default function TabBase(props) {
25
19
  disabled = false,
26
20
  onPress,
27
21
  selected = false,
28
- vertical = false,
29
22
  style,
30
23
  ...otherProps
31
24
  } = props;
@@ -33,7 +26,7 @@ export default function TabBase(props) {
33
26
  return /*#__PURE__*/React.createElement(ButtonBase, _extends({
34
27
  onPress: onPress,
35
28
  disabled: disabled,
36
- style: css([styles.root, vertical ? styles.column : styles.row, style])
29
+ style: css([styles.root, style])
37
30
  }, otherProps), children);
38
31
  }
39
32
  ;
@@ -1 +1 @@
1
- {"version":3,"names":["React","css","ButtonBase","useStyles","root","alignItems","justifyContent","row","flexDirection","column","TabBase","props","children","disabled","onPress","selected","vertical","style","otherProps","styles"],"sources":["TabBase.tsx"],"sourcesContent":["import React from 'react';\nimport { css, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport type TabBaseProps from './TabBaseProps';\n\ntype TabBaseStyles = NamedStylesStringUnion<'root' | 'row' | 'column'>;\n\nconst useStyles: UseStyles<TabBaseStyles> = function (): TabBaseStyles {\n return {\n root: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n row: {\n flexDirection: 'row',\n },\n column: {\n flexDirection: 'column',\n },\n };\n};\n\nexport default function TabBase(props: TabBaseProps) {\n const {\n children,\n disabled = false,\n onPress,\n selected = false,\n vertical = false,\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n return (\n <ButtonBase\n onPress={onPress}\n disabled={disabled}\n style={css([\n styles.root,\n vertical ? styles.column : styles.row,\n style,\n ])}\n {...otherProps}\n >\n {children}\n </ButtonBase>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,GAAT,QAAuD,qBAAvD;AACA,OAAOC,UAAP,MAAuB,eAAvB;;AAKA,MAAMC,SAAmC,GAAG,YAA2B;EACnE,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,cAAc,EAAE;IAFd,CADH;IAKHC,GAAG,EAAE;MACDC,aAAa,EAAE;IADd,CALF;IAQHC,MAAM,EAAE;MACJD,aAAa,EAAE;IADX;EARL,CAAP;AAYH,CAbD;;AAeA,eAAe,SAASE,OAAT,CAAiBC,KAAjB,EAAsC;EACjD,MAAM;IACFC,QADE;IAEFC,QAAQ,GAAG,KAFT;IAGFC,OAHE;IAIFC,QAAQ,GAAG,KAJT;IAKFC,QAAQ,GAAG,KALT;IAMFC,KANE;IAOF,GAAGC;EAPD,IAQFP,KARJ;EAUA,MAAMQ,MAAM,GAAGhB,SAAS,EAAxB;EAEA,oBACI,oBAAC,UAAD;IACI,OAAO,EAAEW,OADb;IAEI,QAAQ,EAAED,QAFd;IAGI,KAAK,EAAEZ,GAAG,CAAC,CACPkB,MAAM,CAACf,IADA,EAEPY,QAAQ,GAAGG,MAAM,CAACV,MAAV,GAAmBU,MAAM,CAACZ,GAF3B,EAGPU,KAHO,CAAD;EAHd,GAQQC,UARR,GAUKN,QAVL,CADJ;AAcH;AAAA"}
1
+ {"version":3,"names":["React","css","ButtonBase","useStyles","root","alignItems","justifyContent","TabBase","props","children","disabled","onPress","selected","style","otherProps","styles"],"sources":["TabBase.tsx"],"sourcesContent":["import React from 'react';\nimport { css, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport type TabBaseProps from './TabBaseProps';\n\ntype TabBaseStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<TabBaseStyles> = function (): TabBaseStyles {\n return {\n root: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n };\n};\n\nexport default function TabBase(props: TabBaseProps) {\n const {\n children,\n disabled = false,\n onPress,\n selected = false,\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n return (\n <ButtonBase\n onPress={onPress}\n disabled={disabled}\n style={css([\n styles.root,\n style,\n ])}\n {...otherProps}\n >\n {children}\n </ButtonBase>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,GAAT,QAAuD,qBAAvD;AACA,OAAOC,UAAP,MAAuB,eAAvB;;AAKA,MAAMC,SAAmC,GAAG,YAA2B;EACnE,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,cAAc,EAAE;IAFd;EADH,CAAP;AAMH,CAPD;;AASA,eAAe,SAASC,OAAT,CAAiBC,KAAjB,EAAsC;EACjD,MAAM;IACFC,QADE;IAEFC,QAAQ,GAAG,KAFT;IAGFC,OAHE;IAIFC,QAAQ,GAAG,KAJT;IAKFC,KALE;IAMF,GAAGC;EAND,IAOFN,KAPJ;EASA,MAAMO,MAAM,GAAGZ,SAAS,EAAxB;EAEA,oBACI,oBAAC,UAAD;IACI,OAAO,EAAEQ,OADb;IAEI,QAAQ,EAAED,QAFd;IAGI,KAAK,EAAET,GAAG,CAAC,CACPc,MAAM,CAACX,IADA,EAEPS,KAFO,CAAD;EAHd,GAOQC,UAPR,GASKL,QATL,CADJ;AAaH;AAAA"}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["TabBaseProps.ts"],"sourcesContent":["import React from 'react';\nimport type { OverridableComponentProps } from '../types';\nimport type { ButtonBaseProps } from '../ButtonBase';\n\nexport default interface TabBaseProps extends OverridableComponentProps<ButtonBaseProps, {\n /**\n * Content of the TabBase.\n */\n children: React.ReactNode;\n\n /**\n * If `true`, the component is selected.\n * @default false\n */\n selected?: boolean;\n\n /**\n * Orientation of the TabBase. Default is horizontal.\n * @default false\n */\n vertical?: boolean;\n}> {}\n"],"mappings":""}
1
+ {"version":3,"names":[],"sources":["TabBaseProps.ts"],"sourcesContent":["import React from 'react';\nimport type { OverridableComponentProps } from '../types';\nimport type { ButtonBaseProps } from '../ButtonBase';\n\nexport default interface TabBaseProps extends OverridableComponentProps<ButtonBaseProps, {\n /**\n * Content of the TabBase.\n */\n children: React.ReactNode;\n\n /**\n * If `true`, the component is selected.\n * @default false\n */\n selected?: boolean;\n}> {}\n"],"mappings":""}
@@ -10,6 +10,8 @@ import useTabInnerContentsWidth from './useTabInnerContentsWidth';
10
10
  import useIndexStore from './useIndexStore';
11
11
  import InternalContext from './InternalContext';
12
12
  import { isEveryTabCoordinatesDefined } from './utils';
13
+ import { defaultCoordinate } from './TabCoordinate';
14
+ import useTabsStyle from './useTabsStyle';
13
15
 
14
16
  const useStyles = function () {
15
17
  const theme = useTheme();
@@ -21,9 +23,6 @@ const useStyles = function () {
21
23
  fixedTab: {
22
24
  flex: 1
23
25
  },
24
- scrollableContainer: {
25
- paddingHorizontal: theme.spacing(1)
26
- },
27
26
  bottomDivider: {
28
27
  borderBottomColor: theme.palette.border.base,
29
28
  borderBottomWidth: 0.5
@@ -46,6 +45,7 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
46
45
  scrollable = false,
47
46
  scrollViewContentContainerStyle,
48
47
  showDivider = false,
48
+ size = 'medium',
49
49
  style,
50
50
  variant = 'default',
51
51
  UNSTABLE_sharedIndex,
@@ -57,6 +57,10 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
57
57
  const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;
58
58
  const realInitialIndex = sharedIndex.initialValue;
59
59
  const currentIndexRef = useRef(initialIndex);
60
+ const {
61
+ container: containerStyle,
62
+ contentContainer: contentContainerStyle
63
+ } = useTabsStyle(variant, size, scrollable);
60
64
 
61
65
  const setTab = newIndex => {
62
66
  const currentIndex = currentIndexRef.current;
@@ -83,10 +87,16 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
83
87
  }
84
88
 
85
89
  return innerContentsWidthList.map((innerContentWidth, idx) => {
90
+ const outerCoordinate = outerCoordinates[idx];
91
+
92
+ if (!outerCoordinate) {
93
+ return defaultCoordinate;
94
+ }
95
+
86
96
  const {
87
97
  x1: outerX1,
88
98
  x2: outerX2
89
- } = outerCoordinates[idx];
99
+ } = outerCoordinate;
90
100
  const tabWidth = outerX2 - outerX1;
91
101
  const distanceFromParent = (tabWidth - innerContentWidth) / 2;
92
102
  const indicatorStartCoordinate = outerX1 + distanceFromParent;
@@ -141,15 +151,19 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
141
151
  }; // @ts-ignore
142
152
 
143
153
 
154
+ const tabStyle = child.props.style; // @ts-ignore
155
+
144
156
  const tabElement = /*#__PURE__*/cloneElement(child, {
145
157
  enableIndicator: !disableIndicator && !canRenderIndicator,
146
158
  onTabInnerLayout,
147
159
  onLayout,
148
160
  onPress,
149
161
  onMouseDown,
162
+ parentColor: color,
163
+ size,
150
164
  variant,
151
165
  indicatorSize,
152
- style: scrollable ? undefined : styles.fixedTab
166
+ style: css([scrollable ? undefined : styles.fixedTab, tabStyle])
153
167
  });
154
168
  return /*#__PURE__*/React.createElement(IndexAwareTab, {
155
169
  children: tabElement,
@@ -171,13 +185,13 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
171
185
  indexStore
172
186
  }
173
187
  }, /*#__PURE__*/React.createElement(View, {
174
- style: css([styles.root, {
188
+ style: css([styles.root, containerStyle, {
175
189
  backgroundColor: backgroundColorMap[color]
176
190
  }, showDivider ? styles.bottomDivider : undefined, scrollable ? undefined : styles.fixedRoot, style])
177
191
  }, scrollable ? /*#__PURE__*/React.createElement(ScrollableTabsView, {
178
192
  automaticallyAdjustContentInsets: false,
179
193
  bounces: false,
180
- contentContainerStyle: css([styles.scrollableContainer, scrollViewContentContainerStyle]),
194
+ contentContainerStyle: css([contentContainerStyle, scrollViewContentContainerStyle]),
181
195
  coordinates: coordinates,
182
196
  directionalLockEnabled: true,
183
197
  horizontal: true,
@@ -1 +1 @@
1
- {"version":3,"names":["React","cloneElement","forwardRef","useEffect","useImperativeHandle","useMemo","useRef","View","css","useTheme","useSyncAnimatedValue","TabIndicator","ScrollableTabsView","IndexAwareTab","useTabCoordinates","useTabInnerContentsWidth","useIndexStore","InternalContext","isEveryTabCoordinatesDefined","useStyles","theme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","bottomDivider","borderBottomColor","palette","border","base","borderBottomWidth","Tabs","props","ref","children","color","initialIndex","disableIndicator","indicatorSize","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","scrollViewContentContainerStyle","showDivider","style","variant","UNSTABLE_sharedIndex","onTabSelected","fallbackSharedIndex","initialValue","sharedIndex","realInitialIndex","currentIndexRef","setTab","newIndex","currentIndex","current","animatedValue","setValue","styles","outerCoordinates","updateCoordinate","innerContentsWidthList","updateInnerContentsWidth","canRenderIndicator","indexStore","coordinates","length","map","innerContentWidth","idx","x1","outerX1","x2","outerX2","tabWidth","distanceFromParent","indicatorStartCoordinate","subscribe","tabElements","Children","child","index","onTabInnerLayout","event","width","nativeEvent","layout","onLayout","x","onMouseDown","e","preventDefault","onPress","tabElement","enableIndicator","undefined","filter","Boolean","tabIndicator","backgroundColorMap","default","background","alt","backgroundColor"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type { TabVariant } from '../Tab';\nimport type TabsProps from './TabsProps';\nimport type { TabsColor } from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useTabInnerContentsWidth from './useTabInnerContentsWidth';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n | 'root'\n | 'fixedRoot'\n | 'fixedTab'\n | 'scrollableContainer'\n | 'bottomDivider';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {},\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n scrollableContainer: {\n paddingHorizontal: theme.spacing(1),\n },\n bottomDivider: {\n borderBottomColor: theme.palette.border.base,\n borderBottomWidth: 0.5,\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n color = 'default',\n initialIndex = 0,\n disableIndicator = false,\n indicatorSize = 'fit-content',\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n scrollViewContentContainerStyle,\n showDivider = false,\n style,\n variant = 'default' as TabVariant,\n UNSTABLE_sharedIndex,\n onTabSelected,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const currentIndexRef = useRef(initialIndex);\n\n const setTab = (newIndex: number) => {\n const currentIndex = currentIndexRef.current;\n onTabSelected?.(newIndex, currentIndex);\n\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const [outerCoordinates, updateCoordinate] = useTabCoordinates(children);\n const [innerContentsWidthList, updateInnerContentsWidth] = useTabInnerContentsWidth(children);\n\n const canRenderIndicator = indicatorSize === 'fit-content'\n ? isEveryTabCoordinatesDefined(innerContentsWidthList, children)\n : isEveryTabCoordinatesDefined(outerCoordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n const coordinates = useMemo(() => {\n if (outerCoordinates.length === 0) {\n return [];\n }\n\n if (indicatorSize !== 'fit-content') {\n return outerCoordinates;\n }\n\n return innerContentsWidthList.map((innerContentWidth, idx) => {\n const { x1: outerX1, x2: outerX2 } = outerCoordinates[idx];\n\n const tabWidth = outerX2 - outerX1;\n const distanceFromParent = (tabWidth - innerContentWidth) / 2;\n const indicatorStartCoordinate = outerX1 + distanceFromParent;\n\n return {\n x1: indicatorStartCoordinate,\n x2: indicatorStartCoordinate + innerContentWidth,\n };\n });\n }, [outerCoordinates, innerContentsWidthList]);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n currentIndexRef.current = newIndex;\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n if (!child) {\n return null;\n }\n\n const onTabInnerLayout = (event: LayoutChangeEvent) => {\n const { width } = event.nativeEvent.layout;\n\n updateInnerContentsWidth(index, width);\n };\n\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n\n // @ts-ignore\n child.props.onLayout?.(event);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onTabInnerLayout,\n onLayout,\n onPress,\n onMouseDown,\n variant,\n indicatorSize,\n style: scrollable ? undefined : styles.fixedTab,\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n })?.filter(Boolean);\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n />\n ) : null;\n\n const backgroundColorMap: Record<TabsColor, string> = {\n default: theme.palette.background.base,\n alt: theme.palette.background.alt,\n };\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n { backgroundColor: backgroundColorMap[color] },\n showDivider ? styles.bottomDivider : undefined,\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={css([\n styles.scrollableContainer,\n scrollViewContentContainerStyle,\n ])}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n initialIndex={realInitialIndex}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n showsVerticalScrollIndicator={false}\n keyboardDismissMode={keyboardDismissMode}\n keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n >\n {tabElements}\n {tabIndicator}\n </ScrollableTabsView>\n ) : (\n <React.Fragment>\n {tabElements}\n {tabIndicator}\n </React.Fragment>\n )}\n </View>\n </InternalContext.Provider>\n );\n});\n\nexport default Tabs;\n"],"mappings":"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"}
1
+ {"version":3,"names":["React","cloneElement","forwardRef","useEffect","useImperativeHandle","useMemo","useRef","View","css","useTheme","useSyncAnimatedValue","TabIndicator","ScrollableTabsView","IndexAwareTab","useTabCoordinates","useTabInnerContentsWidth","useIndexStore","InternalContext","isEveryTabCoordinatesDefined","defaultCoordinate","useTabsStyle","useStyles","theme","root","fixedRoot","flexDirection","fixedTab","flex","bottomDivider","borderBottomColor","palette","border","base","borderBottomWidth","Tabs","props","ref","children","color","initialIndex","disableIndicator","indicatorSize","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","scrollViewContentContainerStyle","showDivider","size","style","variant","UNSTABLE_sharedIndex","onTabSelected","fallbackSharedIndex","initialValue","sharedIndex","realInitialIndex","currentIndexRef","container","containerStyle","contentContainer","contentContainerStyle","setTab","newIndex","currentIndex","current","animatedValue","setValue","styles","outerCoordinates","updateCoordinate","innerContentsWidthList","updateInnerContentsWidth","canRenderIndicator","indexStore","coordinates","length","map","innerContentWidth","idx","outerCoordinate","x1","outerX1","x2","outerX2","tabWidth","distanceFromParent","indicatorStartCoordinate","subscribe","tabElements","Children","child","index","onTabInnerLayout","event","width","nativeEvent","layout","onLayout","x","onMouseDown","e","preventDefault","onPress","tabStyle","tabElement","enableIndicator","parentColor","undefined","filter","Boolean","tabIndicator","backgroundColorMap","default","background","alt","backgroundColor"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type { TabSize, TabVariant } from '../Tab';\nimport type TabsProps from './TabsProps';\nimport type { TabsColor } from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useTabInnerContentsWidth from './useTabInnerContentsWidth';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\nimport { defaultCoordinate } from './TabCoordinate';\nimport useTabsStyle from './useTabsStyle';\n\ntype TabsStyleKeys =\n | 'root'\n | 'fixedRoot'\n | 'fixedTab'\n | 'bottomDivider';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {},\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n bottomDivider: {\n borderBottomColor: theme.palette.border.base,\n borderBottomWidth: 0.5,\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n color = 'default',\n initialIndex = 0,\n disableIndicator = false,\n indicatorSize = 'fit-content',\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n scrollViewContentContainerStyle,\n showDivider = false,\n size = 'medium' as TabSize,\n style,\n variant = 'default' as TabVariant,\n UNSTABLE_sharedIndex,\n onTabSelected,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const currentIndexRef = useRef(initialIndex);\n\n const {\n container: containerStyle,\n contentContainer: contentContainerStyle,\n } = useTabsStyle(variant, size, scrollable);\n\n const setTab = (newIndex: number) => {\n const currentIndex = currentIndexRef.current;\n onTabSelected?.(newIndex, currentIndex);\n\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const [outerCoordinates, updateCoordinate] = useTabCoordinates(children);\n const [innerContentsWidthList, updateInnerContentsWidth] = useTabInnerContentsWidth(children);\n\n const canRenderIndicator = indicatorSize === 'fit-content'\n ? isEveryTabCoordinatesDefined(innerContentsWidthList, children)\n : isEveryTabCoordinatesDefined(outerCoordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n const coordinates = useMemo(() => {\n if (outerCoordinates.length === 0) {\n return [];\n }\n\n if (indicatorSize !== 'fit-content') {\n return outerCoordinates;\n }\n\n return innerContentsWidthList.map((innerContentWidth, idx) => {\n const outerCoordinate = outerCoordinates[idx];\n if (!outerCoordinate) {\n return defaultCoordinate;\n }\n\n const { x1: outerX1, x2: outerX2 } = outerCoordinate;\n\n const tabWidth = outerX2 - outerX1;\n const distanceFromParent = (tabWidth - innerContentWidth) / 2;\n const indicatorStartCoordinate = outerX1 + distanceFromParent;\n\n return {\n x1: indicatorStartCoordinate,\n x2: indicatorStartCoordinate + innerContentWidth,\n };\n });\n }, [outerCoordinates, innerContentsWidthList]);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n currentIndexRef.current = newIndex;\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n if (!child) {\n return null;\n }\n\n const onTabInnerLayout = (event: LayoutChangeEvent) => {\n const { width } = event.nativeEvent.layout;\n\n updateInnerContentsWidth(index, width);\n };\n\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n\n // @ts-ignore\n child.props.onLayout?.(event);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabStyle = child.props.style;\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onTabInnerLayout,\n onLayout,\n onPress,\n onMouseDown,\n parentColor: color,\n size,\n variant,\n indicatorSize,\n style: css([\n scrollable ? undefined : styles.fixedTab,\n tabStyle,\n ]),\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n })?.filter(Boolean);\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n />\n ) : null;\n\n const backgroundColorMap: Record<TabsColor, string> = {\n default: theme.palette.background.base,\n alt: theme.palette.background.alt,\n };\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n containerStyle,\n { backgroundColor: backgroundColorMap[color] },\n showDivider ? styles.bottomDivider : undefined,\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={css([\n contentContainerStyle,\n scrollViewContentContainerStyle,\n ])}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n initialIndex={realInitialIndex}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n showsVerticalScrollIndicator={false}\n keyboardDismissMode={keyboardDismissMode}\n keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n >\n {tabElements}\n {tabIndicator}\n </ScrollableTabsView>\n ) : (\n <React.Fragment>\n {tabElements}\n {tabIndicator}\n </React.Fragment>\n )}\n </View>\n </InternalContext.Provider>\n );\n});\n\nexport default Tabs;\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"names":["tabsColors","tabIndicatorSizes"],"sources":["TabsProps.ts"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport type { ViewProps } from 'react-native';\nimport type { TabVariant } from '../Tab';\nimport type { ExtendedStyle, OverridableComponentProps, SyncAnimatedValue } from '../types';\nimport type { KeyboardDismissMode, KeyboardShouldPersistTaps, TabsInstance } from './types';\n\nexport const tabsColors = ['default', 'alt'] as const;\nexport type TabsColor = typeof tabsColors[number];\n\nexport const tabIndicatorSizes = ['fit-content', 'full'] as const;\nexport type TabIndicatorSize = typeof tabIndicatorSizes[number];\n\nexport default interface TabsProps extends OverridableComponentProps<ViewProps, {\n ref?: Ref<TabsInstance>;\n\n /**\n * Collection of Tab components.\n */\n children: ReactNode;\n\n /**\n * The color of the component. It supports those theme colors that make sense for this component.\n * @default 'default'\n */\n color?: TabsColor;\n\n /**\n * If `true`, the indicator is disabled.\n * @default false\n */\n disableIndicator?: boolean;\n\n /**\n * The size of tab indicator.\n * 'full' adjusts the indicator to the size of the Tab,\n * while 'fit-content' adjusts the indicator to the size of the content inside the Tab.\n * @default 'fit-content'\n */\n indicatorSize?: TabIndicatorSize;\n\n /**\n * Index of initial tab that should be selected.\n * @default 0\n */\n initialIndex?: number;\n\n /**\n * keyboard dismissing condition of dragging.\n * @default 'none'\n */\n keyboardDismissMode?: KeyboardDismissMode,\n\n /**\n * keyboard persisting condition of tapping.\n * @default 'never'\n */\n keyboardShouldPersistTaps?: KeyboardShouldPersistTaps,\n\n /**\n * Callback fired when a tab is selected.\n */\n onChange?: (newIndex: number) => void;\n\n /**\n * If `true`, the component will be able to scroll.\n * @default false\n */\n scrollable?: boolean;\n\n /**\n * These styles will be applied to the scroll view content container which wraps all of the child views.\n */\n scrollViewContentContainerStyle?: ExtendedStyle | ExtendedStyle[];\n\n /**\n * Determines whether to display the bottom border.\n * @default false\n */\n showDivider?: boolean;\n\n /**\n * Unstable API.\n */\n UNSTABLE_sharedIndex?: SyncAnimatedValue;\n\n /**\n * The variant to use.\n * @default 'primary'\n */\n variant?: TabVariant;\n\n /**\n * Callback function executed when a Tab is selected.\n * Executed even if the index does not change when a Tab is pressed.\n * Receives the next tab index and the current tab index as parameters.\n */\n onTabSelected?: (newIndex: number, currentIndex: number) => void;\n}> {}\n"],"mappings":"AAMA,OAAO,MAAMA,UAAU,GAAG,CAAC,SAAD,EAAY,KAAZ,CAAnB;AAGP,OAAO,MAAMC,iBAAiB,GAAG,CAAC,aAAD,EAAgB,MAAhB,CAA1B"}
1
+ {"version":3,"names":["tabsColors","tabIndicatorSizes"],"sources":["TabsProps.ts"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport type { ViewProps } from 'react-native';\nimport type { TabSize, TabVariant } from '../Tab';\nimport type { ExtendedStyle, OverridableComponentProps, SyncAnimatedValue } from '../types';\nimport type { KeyboardDismissMode, KeyboardShouldPersistTaps, TabsInstance } from './types';\n\nexport const tabsColors = ['default', 'alt'] as const;\nexport type TabsColor = typeof tabsColors[number];\n\nexport const tabIndicatorSizes = ['fit-content', 'full'] as const;\nexport type TabIndicatorSize = typeof tabIndicatorSizes[number];\n\nexport default interface TabsProps extends OverridableComponentProps<ViewProps, {\n ref?: Ref<TabsInstance>;\n\n /**\n * Collection of Tab components.\n */\n children: ReactNode;\n\n /**\n * The color of the component. It supports those theme colors that make sense for this component.\n * @default 'default'\n */\n color?: TabsColor;\n\n /**\n * If `true`, the indicator is disabled.\n * @default false\n */\n disableIndicator?: boolean;\n\n /**\n * The size of tab indicator.\n * 'full' adjusts the indicator to the size of the Tab,\n * while 'fit-content' adjusts the indicator to the size of the content inside the Tab.\n * @default 'fit-content'\n */\n indicatorSize?: TabIndicatorSize;\n\n /**\n * Index of initial tab that should be selected.\n * @default 0\n */\n initialIndex?: number;\n\n /**\n * keyboard dismissing condition of dragging.\n * @default 'none'\n */\n keyboardDismissMode?: KeyboardDismissMode,\n\n /**\n * keyboard persisting condition of tapping.\n * @default 'never'\n */\n keyboardShouldPersistTaps?: KeyboardShouldPersistTaps,\n\n /**\n * Callback fired when a tab is selected.\n */\n onChange?: (newIndex: number) => void;\n\n /**\n * If `true`, the component will be able to scroll.\n * @default false\n */\n scrollable?: boolean;\n\n /**\n * These styles will be applied to the scroll view content container which wraps all of the child views.\n */\n scrollViewContentContainerStyle?: ExtendedStyle | ExtendedStyle[];\n\n /**\n * Determines whether to display the bottom border.\n * @default false\n */\n showDivider?: boolean;\n\n /**\n * The size of the Tab.\n * @default 'medium'\n */\n size?: TabSize;\n\n /**\n * Unstable API.\n */\n UNSTABLE_sharedIndex?: SyncAnimatedValue;\n\n /**\n * The variant to use.\n * @default 'primary'\n */\n variant?: TabVariant;\n\n /**\n * Callback function executed when a Tab is selected.\n * Executed even if the index does not change when a Tab is pressed.\n * Receives the next tab index and the current tab index as parameters.\n */\n onTabSelected?: (newIndex: number, currentIndex: number) => void;\n}> {}\n"],"mappings":"AAMA,OAAO,MAAMA,UAAU,GAAG,CAAC,SAAD,EAAY,KAAZ,CAAnB;AAGP,OAAO,MAAMC,iBAAiB,GAAG,CAAC,aAAD,EAAgB,MAAhB,CAA1B"}
@@ -1 +1 @@
1
- {"version":3,"names":["default","tabIndicatorSizes","tabsColors"],"sources":["index.ts"],"sourcesContent":["export { default } from './Tabs';\nexport type { default as TabsProps } from './TabsProps';\nexport { tabIndicatorSizes, tabsColors } from './TabsProps';\nexport type { TabsInstance } from './types';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,QAAxB;AAEA,SAASC,iBAAT,EAA4BC,UAA5B,QAA8C,aAA9C"}
1
+ {"version":3,"names":["default","tabIndicatorSizes","tabsColors"],"sources":["index.ts"],"sourcesContent":["export { default } from './Tabs';\nexport type { default as TabsProps, TabIndicatorSize, TabsColor } from './TabsProps';\nexport { tabIndicatorSizes, tabsColors } from './TabsProps';\nexport type { TabsInstance } from './types';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,QAAxB;AAEA,SAASC,iBAAT,EAA4BC,UAA5B,QAA8C,aAA9C"}