@fountain-ui/core 3.0.0-alpha.4 → 3.0.0-alpha.40
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.
- package/build/commonjs/Accordion/Accordion.js +20 -13
- package/build/commonjs/Accordion/Accordion.js.map +1 -1
- package/build/commonjs/Accordion/AccordionProps.js.map +1 -1
- package/build/commonjs/Accordion/useVariantStyleMap.js +15 -8
- package/build/commonjs/Accordion/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/AppBar/AppBar.js +1 -1
- package/build/commonjs/AppBar/AppBar.js.map +1 -1
- package/build/commonjs/Badge/Badge.js +4 -3
- package/build/commonjs/Badge/Badge.js.map +1 -1
- package/build/commonjs/Badge/BadgeProps.js.map +1 -1
- package/build/commonjs/Badge/useVariantStyleMap.js +2 -2
- package/build/commonjs/Badge/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js +6 -2
- package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js.map +1 -1
- package/build/commonjs/BottomSheetTitle/BottomSheetTitleProps.js.map +1 -1
- package/build/commonjs/Button/Button.js +26 -12
- package/build/commonjs/Button/Button.js.map +1 -1
- package/build/commonjs/Button/ButtonProps.js.map +1 -1
- package/build/commonjs/Button/useVariantStyleMap.js +9 -0
- package/build/commonjs/Button/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/ButtonBase/ButtonBase.js +1 -1
- package/build/commonjs/ButtonBase/ButtonBase.js.map +1 -1
- package/build/commonjs/ButtonBase/index.js +2 -2
- package/build/commonjs/ButtonBase/index.js.map +1 -1
- package/build/commonjs/Checkbox/Checkbox.js +4 -1
- package/build/commonjs/Checkbox/Checkbox.js.map +1 -1
- package/build/commonjs/Checkbox/useVariantStyleMap.js +6 -2
- package/build/commonjs/Checkbox/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/Chip/Chip.js +25 -14
- package/build/commonjs/Chip/Chip.js.map +1 -1
- package/build/commonjs/Chip/ChipProps.js +3 -1
- package/build/commonjs/Chip/ChipProps.js.map +1 -1
- package/build/commonjs/Chip/index.js +6 -0
- package/build/commonjs/Chip/index.js.map +1 -1
- package/build/commonjs/Chip/useChipStyle.js +51 -31
- package/build/commonjs/Chip/useChipStyle.js.map +1 -1
- package/build/commonjs/Dialog/Dialog.js +10 -12
- package/build/commonjs/Dialog/Dialog.js.map +1 -1
- package/build/commonjs/Dialog/DialogProps.js +1 -1
- package/build/commonjs/Dialog/DialogProps.js.map +1 -1
- package/build/commonjs/Dialog/useDialogSectionStyle.js +6 -4
- package/build/commonjs/Dialog/useDialogSectionStyle.js.map +1 -1
- package/build/commonjs/Dialog/useDialogStyle.js +19 -8
- package/build/commonjs/Dialog/useDialogStyle.js.map +1 -1
- package/build/commonjs/DialogActions/DialogActions.js +0 -1
- package/build/commonjs/DialogActions/DialogActions.js.map +1 -1
- package/build/commonjs/DialogTitle/DialogLargeTitle.js +80 -0
- package/build/commonjs/DialogTitle/DialogLargeTitle.js.map +1 -0
- package/build/commonjs/DialogTitle/DialogTitle.js +8 -4
- package/build/commonjs/DialogTitle/DialogTitle.js.map +1 -1
- package/build/commonjs/Divider/Divider.js +17 -9
- package/build/commonjs/Divider/Divider.js.map +1 -1
- package/build/commonjs/Divider/DividerProps.js +1 -1
- package/build/commonjs/Divider/DividerProps.js.map +1 -1
- package/build/commonjs/Empty/Empty.js +1 -1
- package/build/commonjs/Empty/Empty.js.map +1 -1
- package/build/commonjs/Flexbox/Flexbox.js +2 -0
- package/build/commonjs/Flexbox/Flexbox.js.map +1 -1
- package/build/commonjs/Flexbox/FlexboxProps.js.map +1 -1
- package/build/commonjs/IconButton/IconButton.js +3 -0
- package/build/commonjs/IconButton/IconButton.js.map +1 -1
- package/build/commonjs/IconButton/IconButtonProps.js +1 -1
- package/build/commonjs/IconButton/IconButtonProps.js.map +1 -1
- package/build/commonjs/Image/Image.js +2 -2
- package/build/commonjs/Image/Image.js.map +1 -1
- package/build/commonjs/ImageCore/ImageCoreNative.js +1 -1
- package/build/commonjs/ImageCore/ImageCoreNative.js.map +1 -1
- package/build/commonjs/ListItem/ListItem.js +38 -26
- package/build/commonjs/ListItem/ListItem.js.map +1 -1
- package/build/commonjs/ListItem/ListItemProps.js.map +1 -1
- package/build/commonjs/ListItemIcon/ListItemIcon.js +1 -2
- package/build/commonjs/ListItemIcon/ListItemIcon.js.map +1 -1
- package/build/commonjs/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
- package/build/commonjs/ListItemSecondaryAction/ListItemSecondaryAction.js.map +1 -1
- package/build/commonjs/ListItemText/ListItemText.js +20 -21
- package/build/commonjs/ListItemText/ListItemText.js.map +1 -1
- package/build/commonjs/ListItemText/ListItemTextProps.js.map +1 -1
- package/build/commonjs/ListSubheader/ListSubheader.js +1 -1
- package/build/commonjs/ListSubheader/ListSubheader.js.map +1 -1
- package/build/commonjs/Modal/Modal.js +1 -1
- package/build/commonjs/Modal/Modal.js.map +1 -1
- package/build/commonjs/Pagination/NumberPagination.js +4 -2
- package/build/commonjs/Pagination/NumberPagination.js.map +1 -1
- package/build/commonjs/Pagination/Pagination.js +2 -0
- package/build/commonjs/Pagination/Pagination.js.map +1 -1
- package/build/commonjs/Pagination/PaginationProps.js +3 -1
- package/build/commonjs/Pagination/PaginationProps.js.map +1 -1
- package/build/commonjs/Pagination/index.js +6 -0
- package/build/commonjs/Pagination/index.js.map +1 -1
- package/build/commonjs/PaginationItem/PaginationItem.js +32 -22
- package/build/commonjs/PaginationItem/PaginationItem.js.map +1 -1
- package/build/commonjs/PaginationItem/PaginationItemProps.js.map +1 -1
- package/build/commonjs/Radio/Radio.js +11 -4
- package/build/commonjs/Radio/Radio.js.map +1 -1
- package/build/commonjs/RadioGroup/RadioGroup.js +2 -27
- package/build/commonjs/RadioGroup/RadioGroup.js.map +1 -1
- package/build/commonjs/Section/Section.js +32 -0
- package/build/commonjs/Section/Section.js.map +1 -0
- package/build/commonjs/Section/SectionProps.js +2 -0
- package/build/commonjs/Section/SectionProps.js.map +1 -0
- package/build/commonjs/Section/index.js +16 -0
- package/build/commonjs/Section/index.js.map +1 -0
- package/build/commonjs/ShadowView/ShadowView.native.js +4 -0
- package/build/commonjs/ShadowView/ShadowView.native.js.map +1 -1
- package/build/commonjs/SnackbarContent/SnackbarContent.js +26 -9
- package/build/commonjs/SnackbarContent/SnackbarContent.js.map +1 -1
- package/build/commonjs/Tab/Tab.js +21 -19
- package/build/commonjs/Tab/Tab.js.map +1 -1
- package/build/commonjs/Tab/TabProps.js +4 -2
- package/build/commonjs/Tab/TabProps.js.map +1 -1
- package/build/commonjs/Tab/index.js +14 -0
- package/build/commonjs/Tab/index.js.map +1 -1
- package/build/commonjs/Tab/useVariantStyleMap.js +59 -18
- package/build/commonjs/Tab/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/TabBase/TabBase.js +1 -8
- package/build/commonjs/TabBase/TabBase.js.map +1 -1
- package/build/commonjs/TabBase/TabBaseProps.js.map +1 -1
- package/build/commonjs/Tabs/Tabs.js +23 -7
- package/build/commonjs/Tabs/Tabs.js.map +1 -1
- package/build/commonjs/Tabs/TabsProps.js.map +1 -1
- package/build/commonjs/Tabs/index.js.map +1 -1
- package/build/commonjs/Tabs/useTabsStyle.js +81 -0
- package/build/commonjs/Tabs/useTabsStyle.js.map +1 -0
- package/build/commonjs/TextField/TextField.js +60 -15
- package/build/commonjs/TextField/TextField.js.map +1 -1
- package/build/commonjs/TextField/useVariantStyleMap.js +29 -29
- package/build/commonjs/TextField/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/Toolbar/BackButton/BackButton.js +47 -0
- package/build/commonjs/Toolbar/BackButton/BackButton.js.map +1 -0
- package/build/commonjs/Toolbar/BackButton/BackButtonProps.js +2 -0
- package/build/commonjs/Toolbar/BackButton/BackButtonProps.js.map +1 -0
- package/build/commonjs/Toolbar/BackButton/index.js +16 -0
- package/build/commonjs/Toolbar/BackButton/index.js.map +1 -0
- package/build/commonjs/Toolbar/Toolbar.js +22 -12
- package/build/commonjs/Toolbar/Toolbar.js.map +1 -1
- package/build/commonjs/Toolbar/ToolbarProps.js.map +1 -1
- package/build/commonjs/Tooltip/Beaks/index.js +32 -0
- package/build/commonjs/Tooltip/Beaks/index.js.map +1 -1
- package/build/commonjs/Tooltip/Tooltip.js +18 -22
- package/build/commonjs/Tooltip/Tooltip.js.map +1 -1
- package/build/commonjs/Tooltip/TooltipProps.js.map +1 -1
- package/build/commonjs/Tooltip/index.js +19 -0
- package/build/commonjs/Tooltip/index.js.map +1 -1
- package/build/commonjs/Typography/Typography.js +9 -2
- package/build/commonjs/Typography/Typography.js.map +1 -1
- package/build/commonjs/Typography/TypographyProps.js.map +1 -1
- package/build/commonjs/hooks/useBreakpointUp.js +4 -1
- package/build/commonjs/hooks/useBreakpointUp.js.map +1 -1
- package/build/commonjs/hooks/useCollapsibleAppBar.js +11 -13
- package/build/commonjs/hooks/useCollapsibleAppBar.js.map +1 -1
- package/build/commonjs/hooks/useContentContainerStyle.js +39 -25
- package/build/commonjs/hooks/useContentContainerStyle.js.map +1 -1
- package/build/commonjs/hooks/useFadeInAppBar.js +4 -4
- package/build/commonjs/hooks/useFadeInAppBar.js.map +1 -1
- package/build/commonjs/index.js +21 -0
- package/build/commonjs/index.js.map +1 -1
- package/build/commonjs/internal/icons/AppBarChevronLeft.js +23 -0
- package/build/commonjs/internal/icons/AppBarChevronLeft.js.map +1 -0
- package/build/commonjs/internal/icons/ChevronLeft.js +4 -2
- package/build/commonjs/internal/icons/ChevronLeft.js.map +1 -1
- package/build/commonjs/internal/icons/ChevronRight.js +4 -2
- package/build/commonjs/internal/icons/ChevronRight.js.map +1 -1
- package/build/commonjs/internal/icons/ChipClose.js +23 -0
- package/build/commonjs/internal/icons/ChipClose.js.map +1 -0
- package/build/commonjs/internal/icons/Clear.js +3 -3
- package/build/commonjs/internal/icons/Clear.js.map +1 -1
- package/build/commonjs/internal/icons/Close.js +4 -2
- package/build/commonjs/internal/icons/Close.js.map +1 -1
- package/build/commonjs/internal/icons/Search.js +2 -2
- package/build/commonjs/internal/icons/Search.js.map +1 -1
- package/build/commonjs/internal/icons/index.js +16 -0
- package/build/commonjs/internal/icons/index.js.map +1 -1
- package/build/module/Accordion/Accordion.js +20 -13
- package/build/module/Accordion/Accordion.js.map +1 -1
- package/build/module/Accordion/AccordionProps.js.map +1 -1
- package/build/module/Accordion/useVariantStyleMap.js +15 -8
- package/build/module/Accordion/useVariantStyleMap.js.map +1 -1
- package/build/module/AppBar/AppBar.js +1 -1
- package/build/module/AppBar/AppBar.js.map +1 -1
- package/build/module/Badge/Badge.js +4 -3
- package/build/module/Badge/Badge.js.map +1 -1
- package/build/module/Badge/BadgeProps.js.map +1 -1
- package/build/module/Badge/useVariantStyleMap.js +2 -2
- package/build/module/Badge/useVariantStyleMap.js.map +1 -1
- package/build/module/BottomSheetTitle/BottomSheetTitle.js +6 -2
- package/build/module/BottomSheetTitle/BottomSheetTitle.js.map +1 -1
- package/build/module/BottomSheetTitle/BottomSheetTitleProps.js.map +1 -1
- package/build/module/Button/Button.js +27 -13
- package/build/module/Button/Button.js.map +1 -1
- package/build/module/Button/ButtonProps.js.map +1 -1
- package/build/module/Button/useVariantStyleMap.js +9 -0
- package/build/module/Button/useVariantStyleMap.js.map +1 -1
- package/build/module/ButtonBase/ButtonBase.js +1 -1
- package/build/module/ButtonBase/ButtonBase.js.map +1 -1
- package/build/module/ButtonBase/index.js +1 -1
- package/build/module/ButtonBase/index.js.map +1 -1
- package/build/module/Checkbox/Checkbox.js +4 -1
- package/build/module/Checkbox/Checkbox.js.map +1 -1
- package/build/module/Checkbox/useVariantStyleMap.js +6 -2
- package/build/module/Checkbox/useVariantStyleMap.js.map +1 -1
- package/build/module/Chip/Chip.js +21 -13
- package/build/module/Chip/Chip.js.map +1 -1
- package/build/module/Chip/ChipProps.js +1 -0
- package/build/module/Chip/ChipProps.js.map +1 -1
- package/build/module/Chip/index.js +1 -1
- package/build/module/Chip/index.js.map +1 -1
- package/build/module/Chip/useChipStyle.js +51 -31
- package/build/module/Chip/useChipStyle.js.map +1 -1
- package/build/module/Dialog/Dialog.js +10 -11
- package/build/module/Dialog/Dialog.js.map +1 -1
- package/build/module/Dialog/DialogProps.js +1 -1
- package/build/module/Dialog/DialogProps.js.map +1 -1
- package/build/module/Dialog/useDialogSectionStyle.js +6 -4
- package/build/module/Dialog/useDialogSectionStyle.js.map +1 -1
- package/build/module/Dialog/useDialogStyle.js +18 -8
- package/build/module/Dialog/useDialogStyle.js.map +1 -1
- package/build/module/DialogActions/DialogActions.js +0 -1
- package/build/module/DialogActions/DialogActions.js.map +1 -1
- package/build/module/DialogTitle/DialogLargeTitle.js +65 -0
- package/build/module/DialogTitle/DialogLargeTitle.js.map +1 -0
- package/build/module/DialogTitle/DialogTitle.js +6 -3
- package/build/module/DialogTitle/DialogTitle.js.map +1 -1
- package/build/module/Divider/Divider.js +7 -0
- package/build/module/Divider/Divider.js.map +1 -1
- package/build/module/Divider/DividerProps.js +1 -1
- package/build/module/Divider/DividerProps.js.map +1 -1
- package/build/module/Empty/Empty.js +1 -1
- package/build/module/Empty/Empty.js.map +1 -1
- package/build/module/Flexbox/Flexbox.js +2 -0
- package/build/module/Flexbox/Flexbox.js.map +1 -1
- package/build/module/Flexbox/FlexboxProps.js.map +1 -1
- package/build/module/IconButton/IconButton.js +3 -0
- package/build/module/IconButton/IconButton.js.map +1 -1
- package/build/module/IconButton/IconButtonProps.js +1 -1
- package/build/module/IconButton/IconButtonProps.js.map +1 -1
- package/build/module/Image/Image.js +2 -2
- package/build/module/Image/Image.js.map +1 -1
- package/build/module/ImageCore/ImageCoreNative.js +1 -1
- package/build/module/ImageCore/ImageCoreNative.js.map +1 -1
- package/build/module/ListItem/ListItem.js +36 -28
- package/build/module/ListItem/ListItem.js.map +1 -1
- package/build/module/ListItem/ListItemProps.js.map +1 -1
- package/build/module/ListItemIcon/ListItemIcon.js +1 -2
- package/build/module/ListItemIcon/ListItemIcon.js.map +1 -1
- package/build/module/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
- package/build/module/ListItemSecondaryAction/ListItemSecondaryAction.js.map +1 -1
- package/build/module/ListItemText/ListItemText.js +17 -19
- package/build/module/ListItemText/ListItemText.js.map +1 -1
- package/build/module/ListItemText/ListItemTextProps.js.map +1 -1
- package/build/module/ListSubheader/ListSubheader.js +1 -1
- package/build/module/ListSubheader/ListSubheader.js.map +1 -1
- package/build/module/Modal/Modal.js +1 -1
- package/build/module/Modal/Modal.js.map +1 -1
- package/build/module/Pagination/NumberPagination.js +4 -2
- package/build/module/Pagination/NumberPagination.js.map +1 -1
- package/build/module/Pagination/Pagination.js +2 -0
- package/build/module/Pagination/Pagination.js.map +1 -1
- package/build/module/Pagination/PaginationProps.js +1 -0
- package/build/module/Pagination/PaginationProps.js.map +1 -1
- package/build/module/Pagination/index.js +1 -1
- package/build/module/Pagination/index.js.map +1 -1
- package/build/module/PaginationItem/PaginationItem.js +28 -21
- package/build/module/PaginationItem/PaginationItem.js.map +1 -1
- package/build/module/PaginationItem/PaginationItemProps.js.map +1 -1
- package/build/module/Radio/Radio.js +10 -4
- package/build/module/Radio/Radio.js.map +1 -1
- package/build/module/RadioGroup/RadioGroup.js +2 -20
- package/build/module/RadioGroup/RadioGroup.js.map +1 -1
- package/build/module/Section/Section.js +19 -0
- package/build/module/Section/Section.js.map +1 -0
- package/build/module/Section/SectionProps.js +2 -0
- package/build/module/Section/SectionProps.js.map +1 -0
- package/build/module/Section/index.js +2 -0
- package/build/module/Section/index.js.map +1 -0
- package/build/module/ShadowView/ShadowView.native.js +4 -0
- package/build/module/ShadowView/ShadowView.native.js.map +1 -1
- package/build/module/SnackbarContent/SnackbarContent.js +26 -9
- package/build/module/SnackbarContent/SnackbarContent.js.map +1 -1
- package/build/module/Tab/Tab.js +22 -19
- package/build/module/Tab/Tab.js.map +1 -1
- package/build/module/Tab/TabProps.js +2 -1
- package/build/module/Tab/TabProps.js.map +1 -1
- package/build/module/Tab/index.js +1 -0
- package/build/module/Tab/index.js.map +1 -1
- package/build/module/Tab/useVariantStyleMap.js +59 -18
- package/build/module/Tab/useVariantStyleMap.js.map +1 -1
- package/build/module/TabBase/TabBase.js +1 -8
- package/build/module/TabBase/TabBase.js.map +1 -1
- package/build/module/TabBase/TabBaseProps.js.map +1 -1
- package/build/module/Tabs/Tabs.js +21 -7
- package/build/module/Tabs/Tabs.js.map +1 -1
- package/build/module/Tabs/TabsProps.js.map +1 -1
- package/build/module/Tabs/index.js.map +1 -1
- package/build/module/Tabs/useTabsStyle.js +71 -0
- package/build/module/Tabs/useTabsStyle.js.map +1 -0
- package/build/module/TextField/TextField.js +60 -15
- package/build/module/TextField/TextField.js.map +1 -1
- package/build/module/TextField/useVariantStyleMap.js +29 -29
- package/build/module/TextField/useVariantStyleMap.js.map +1 -1
- package/build/module/Toolbar/BackButton/BackButton.js +32 -0
- package/build/module/Toolbar/BackButton/BackButton.js.map +1 -0
- package/build/module/Toolbar/BackButton/BackButtonProps.js +2 -0
- package/build/module/Toolbar/BackButton/BackButtonProps.js.map +1 -0
- package/build/module/Toolbar/BackButton/index.js +2 -0
- package/build/module/Toolbar/BackButton/index.js.map +1 -0
- package/build/module/Toolbar/Toolbar.js +20 -12
- package/build/module/Toolbar/Toolbar.js.map +1 -1
- package/build/module/Toolbar/ToolbarProps.js.map +1 -1
- package/build/module/Tooltip/Beaks/index.js +4 -0
- package/build/module/Tooltip/Beaks/index.js.map +1 -1
- package/build/module/Tooltip/Tooltip.js +11 -14
- package/build/module/Tooltip/Tooltip.js.map +1 -1
- package/build/module/Tooltip/TooltipProps.js.map +1 -1
- package/build/module/Tooltip/index.js +1 -0
- package/build/module/Tooltip/index.js.map +1 -1
- package/build/module/Typography/Typography.js +9 -2
- package/build/module/Typography/Typography.js.map +1 -1
- package/build/module/Typography/TypographyProps.js.map +1 -1
- package/build/module/hooks/useBreakpointUp.js +4 -1
- package/build/module/hooks/useBreakpointUp.js.map +1 -1
- package/build/module/hooks/useCollapsibleAppBar.js +12 -13
- package/build/module/hooks/useCollapsibleAppBar.js.map +1 -1
- package/build/module/hooks/useContentContainerStyle.js +43 -25
- package/build/module/hooks/useContentContainerStyle.js.map +1 -1
- package/build/module/hooks/useFadeInAppBar.js +4 -4
- package/build/module/hooks/useFadeInAppBar.js.map +1 -1
- package/build/module/index.js +2 -0
- package/build/module/index.js.map +1 -1
- package/build/module/internal/icons/AppBarChevronLeft.js +9 -0
- package/build/module/internal/icons/AppBarChevronLeft.js.map +1 -0
- package/build/module/internal/icons/ChevronLeft.js +4 -2
- package/build/module/internal/icons/ChevronLeft.js.map +1 -1
- package/build/module/internal/icons/ChevronRight.js +4 -2
- package/build/module/internal/icons/ChevronRight.js.map +1 -1
- package/build/module/internal/icons/ChipClose.js +9 -0
- package/build/module/internal/icons/ChipClose.js.map +1 -0
- package/build/module/internal/icons/Clear.js +3 -3
- package/build/module/internal/icons/Clear.js.map +1 -1
- package/build/module/internal/icons/Close.js +4 -2
- package/build/module/internal/icons/Close.js.map +1 -1
- package/build/module/internal/icons/Search.js +2 -2
- package/build/module/internal/icons/Search.js.map +1 -1
- package/build/module/internal/icons/index.js +2 -0
- package/build/module/internal/icons/index.js.map +1 -1
- package/build/typescript/Accordion/AccordionProps.d.ts +4 -1
- package/build/typescript/Accordion/useVariantStyleMap.d.ts +1 -0
- package/build/typescript/Badge/BadgeProps.d.ts +10 -5
- package/build/typescript/BottomSheetTitle/BottomSheetTitleProps.d.ts +1 -0
- package/build/typescript/Button/ButtonProps.d.ts +5 -0
- package/build/typescript/ButtonBase/index.d.ts +1 -1
- package/build/typescript/Checkbox/useVariantStyleMap.d.ts +1 -0
- package/build/typescript/Chip/ChipProps.d.ts +11 -4
- package/build/typescript/Chip/index.d.ts +1 -1
- package/build/typescript/Chip/useChipStyle.d.ts +6 -3
- package/build/typescript/Dialog/DialogProps.d.ts +1 -6
- package/build/typescript/Dialog/useDialogStyle.d.ts +1 -1
- package/build/typescript/DialogTitle/DialogLargeTitle.d.ts +9 -0
- package/build/typescript/DialogTitle/DialogTitle.d.ts +6 -1
- package/build/typescript/Divider/DividerProps.d.ts +1 -1
- package/build/typescript/Flexbox/FlexboxProps.d.ts +4 -0
- package/build/typescript/IconButton/IconButtonProps.d.ts +1 -1
- package/build/typescript/ListItem/ListItem.d.ts +1 -1
- package/build/typescript/ListItem/ListItemProps.d.ts +4 -0
- package/build/typescript/ListItemText/ListItemTextProps.d.ts +2 -9
- package/build/typescript/Pagination/PaginationProps.d.ts +12 -0
- package/build/typescript/Pagination/index.d.ts +2 -2
- package/build/typescript/PaginationItem/PaginationItemProps.d.ts +6 -0
- package/build/typescript/Section/Section.d.ts +3 -0
- package/build/typescript/Section/SectionProps.d.ts +6 -0
- package/build/typescript/Section/index.d.ts +2 -0
- package/build/typescript/Tab/TabProps.d.ts +21 -2
- package/build/typescript/Tab/index.d.ts +2 -1
- package/build/typescript/Tab/useVariantStyleMap.d.ts +4 -2
- package/build/typescript/TabBase/TabBaseProps.d.ts +0 -5
- package/build/typescript/Tabs/Tabs.d.ts +1 -1
- package/build/typescript/Tabs/TabsProps.d.ts +6 -1
- package/build/typescript/Tabs/index.d.ts +1 -1
- package/build/typescript/Tabs/useTabsStyle.d.ts +8 -0
- package/build/typescript/TextField/useVariantStyleMap.d.ts +2 -0
- package/build/typescript/Toolbar/BackButton/BackButton.d.ts +3 -0
- package/build/typescript/Toolbar/BackButton/BackButtonProps.d.ts +4 -0
- package/build/typescript/Toolbar/BackButton/index.d.ts +2 -0
- package/build/typescript/Toolbar/Toolbar.d.ts +6 -1
- package/build/typescript/Toolbar/ToolbarProps.d.ts +0 -5
- package/build/typescript/Tooltip/Beaks/index.d.ts +4 -0
- package/build/typescript/Tooltip/TooltipProps.d.ts +2 -2
- package/build/typescript/Tooltip/index.d.ts +1 -0
- package/build/typescript/Typography/TypographyProps.d.ts +4 -0
- package/build/typescript/hooks/useCollapsibleAppBar.d.ts +1 -1
- package/build/typescript/hooks/useContentContainerStyle.d.ts +5 -8
- package/build/typescript/index.d.ts +2 -0
- package/build/typescript/internal/icons/AppBarChevronLeft.d.ts +131 -0
- package/build/typescript/internal/icons/ChipClose.d.ts +131 -0
- package/build/typescript/internal/icons/index.d.ts +2 -0
- package/package.json +5 -5
- package/src/Accordion/Accordion.tsx +23 -14
- package/src/Accordion/AccordionProps.ts +4 -2
- package/src/Accordion/useVariantStyleMap.ts +14 -6
- package/src/AppBar/AppBar.tsx +2 -2
- package/src/Badge/Badge.tsx +4 -3
- package/src/Badge/BadgeProps.ts +12 -6
- package/src/Badge/useVariantStyleMap.ts +2 -2
- package/src/BottomSheetTitle/BottomSheetTitle.tsx +5 -1
- package/src/BottomSheetTitle/BottomSheetTitleProps.ts +1 -0
- package/src/Button/Button.tsx +28 -12
- package/src/Button/ButtonProps.ts +6 -0
- package/src/Button/useVariantStyleMap.ts +9 -0
- package/src/ButtonBase/ButtonBase.tsx +1 -1
- package/src/ButtonBase/index.ts +1 -1
- package/src/Checkbox/Checkbox.tsx +11 -8
- package/src/Checkbox/useVariantStyleMap.ts +6 -1
- package/src/Chip/Chip.tsx +24 -13
- package/src/Chip/ChipProps.ts +13 -4
- package/src/Chip/index.ts +1 -1
- package/src/Chip/useChipStyle.ts +59 -29
- package/src/Dialog/Dialog.tsx +12 -11
- package/src/Dialog/DialogProps.ts +1 -7
- package/src/Dialog/useDialogSectionStyle.ts +6 -4
- package/src/Dialog/useDialogStyle.ts +19 -7
- package/src/DialogActions/DialogActions.tsx +0 -1
- package/src/DialogTitle/DialogLargeTitle.tsx +95 -0
- package/src/DialogTitle/DialogTitle.tsx +6 -1
- package/src/Divider/Divider.tsx +5 -0
- package/src/Divider/DividerProps.ts +1 -1
- package/src/Empty/Empty.tsx +1 -1
- package/src/Flexbox/Flexbox.tsx +2 -0
- package/src/Flexbox/FlexboxProps.ts +5 -0
- package/src/IconButton/IconButton.tsx +2 -0
- package/src/IconButton/IconButtonProps.ts +1 -0
- package/src/Image/Image.tsx +3 -3
- package/src/ImageCore/ImageCoreNative.tsx +1 -1
- package/src/ListItem/ListItem.tsx +61 -30
- package/src/ListItem/ListItemProps.ts +5 -0
- package/src/ListItemIcon/ListItemIcon.tsx +1 -2
- package/src/ListItemSecondaryAction/ListItemSecondaryAction.tsx +2 -0
- package/src/ListItemText/ListItemText.tsx +20 -28
- package/src/ListItemText/ListItemTextProps.ts +2 -10
- package/src/ListSubheader/ListSubheader.tsx +1 -1
- package/src/Modal/Modal.tsx +1 -1
- package/src/Pagination/NumberPagination.tsx +7 -2
- package/src/Pagination/Pagination.tsx +3 -2
- package/src/Pagination/PaginationProps.ts +15 -0
- package/src/Pagination/index.ts +2 -2
- package/src/PaginationItem/PaginationItem.tsx +31 -24
- package/src/PaginationItem/PaginationItemProps.ts +7 -0
- package/src/Radio/Radio.tsx +12 -3
- package/src/RadioGroup/RadioGroup.tsx +2 -28
- package/src/Section/Section.tsx +26 -0
- package/src/Section/SectionProps.ts +6 -0
- package/src/Section/index.ts +2 -0
- package/src/ShadowView/ShadowView.native.tsx +4 -0
- package/src/SnackbarContent/SnackbarContent.tsx +36 -15
- package/src/Tab/Tab.tsx +32 -22
- package/src/Tab/TabProps.ts +25 -2
- package/src/Tab/index.ts +2 -1
- package/src/Tab/useVariantStyleMap.ts +72 -19
- package/src/TabBase/TabBase.tsx +1 -9
- package/src/TabBase/TabBaseProps.ts +0 -6
- package/src/Tabs/Tabs.tsx +26 -8
- package/src/Tabs/TabsProps.ts +7 -1
- package/src/Tabs/index.ts +1 -1
- package/src/Tabs/useTabsStyle.ts +79 -0
- package/src/TextField/TextField.tsx +99 -45
- package/src/TextField/useVariantStyleMap.ts +29 -27
- package/src/Toolbar/BackButton/BackButton.tsx +44 -0
- package/src/Toolbar/BackButton/BackButtonProps.ts +4 -0
- package/src/Toolbar/BackButton/index.ts +2 -0
- package/src/Toolbar/Toolbar.tsx +26 -17
- package/src/Toolbar/ToolbarProps.ts +0 -6
- package/src/Tooltip/Beaks/index.ts +4 -0
- package/src/Tooltip/Tooltip.tsx +10 -12
- package/src/Tooltip/TooltipProps.ts +2 -2
- package/src/Tooltip/index.ts +1 -0
- package/src/Typography/Typography.tsx +3 -1
- package/src/Typography/TypographyProps.ts +5 -0
- package/src/hooks/useBreakpointUp.ts +3 -1
- package/src/hooks/useCollapsibleAppBar.ts +10 -24
- package/src/hooks/useContentContainerStyle.ts +43 -31
- package/src/hooks/useFadeInAppBar.ts +4 -4
- package/src/index.ts +3 -0
- package/src/internal/icons/AppBarChevronLeft.tsx +15 -0
- package/src/internal/icons/ChevronLeft.tsx +4 -1
- package/src/internal/icons/ChevronRight.tsx +4 -1
- package/src/internal/icons/ChipClose.tsx +13 -0
- package/src/internal/icons/Clear.tsx +3 -3
- package/src/internal/icons/Close.tsx +4 -1
- package/src/internal/icons/Search.tsx +2 -2
- package/src/internal/icons/index.ts +2 -0
- package/build/commonjs/ButtonBase/LegacyButtonBase.js +0 -126
- package/build/commonjs/ButtonBase/LegacyButtonBase.js.map +0 -1
- package/build/module/ButtonBase/LegacyButtonBase.js +0 -106
- package/build/module/ButtonBase/LegacyButtonBase.js.map +0 -1
- package/build/typescript/ButtonBase/LegacyButtonBase.d.ts +0 -5
- package/src/ButtonBase/LegacyButtonBase.tsx +0 -135
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","createFontStyle","useTheme","useChipStyle","size","startElementVariant","isEndElement","theme","fontStyleMap","small","selector","typography","caption1","medium","color","palette","text","strong","large","body2","endElementStyleMap","height","marginLeft","spacing","width","baseContainerStyle","alignItems","backgroundColor","fill","weaker","borderRadius","shape","radius","full","flexDirection","overflow","isLarge","variantStyleMap","avatar","container","paddingLeft","paddingRight","paddingVertical","startElement","marginRight","icon","justifyContent","image","default","paddingBottom","paddingHorizontal","paddingTop","endElement","label"],"sources":["useChipStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { ChipSize, ChipStartElementVariant } from './ChipProps';\n\ninterface ChipStyle {\n container: FountainUiStyle;\n endElement?: FountainUiStyle;\n label: TextStyle;\n startElement?: FountainUiStyle;\n}\n\ntype VariantStyleMap = Record<ChipStartElementVariant, Partial<ChipStyle>>;\n\n// TODO: need to refactoring...\nexport default function useChipStyle(\n size: ChipSize,\n startElementVariant: ChipStartElementVariant,\n isEndElement: boolean,\n): ChipStyle {\n const theme = useTheme();\n\n return useMemo<ChipStyle>(() => {\n const fontStyleMap: Record<ChipSize, TextStyle> = {\n small: createFontStyle(theme, {\n selector: (typography) => typography.caption1.medium,\n color: theme.palette.text.strong,\n }),\n large: createFontStyle(theme, {\n selector: (typography) => typography.body2.medium,\n color: theme.palette.text.strong,\n }),\n };\n\n const endElementStyleMap: Record<ChipSize, FountainUiStyle> = {\n small: {\n height: 14,\n marginLeft: theme.spacing(2),\n width: 8.17,\n },\n large: {\n height: 16,\n marginLeft: theme.spacing(2.5),\n width: 9,\n },\n };\n\n const baseContainerStyle: FountainUiStyle = {\n alignItems: 'center',\n backgroundColor: theme.palette.fill.weaker,\n borderRadius: theme.shape.radius.full,\n flexDirection: 'row',\n overflow: 'hidden',\n };\n\n const isLarge = size === 'large';\n\n const variantStyleMap: VariantStyleMap = {\n avatar: {\n container: {\n paddingLeft: theme.spacing(isLarge ? 1.5 : 1.25),\n paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n paddingVertical: theme.spacing(isLarge ? 1.25 : 1),\n },\n startElement: {\n borderRadius: theme.shape.radius.full,\n height: isLarge ? 24 : 22,\n marginRight: theme.spacing(isLarge ? 1.5 : 1.25),\n width: isLarge ? 24 : 22,\n },\n },\n icon: {\n container: {\n paddingLeft: theme.spacing(1.5),\n paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n paddingVertical: theme.spacing(isLarge ? 1.5 : 1.25),\n },\n startElement: {\n alignItems: 'center',\n height: isLarge ? 22 : 20,\n justifyContent: 'center',\n marginRight: theme.spacing(isLarge ? 1 : 0.75),\n width: isLarge ? 22 : 20,\n },\n },\n image: {\n container: {\n alignItems: 'center',\n paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n },\n startElement: {\n borderRadius: theme.shape.radius.full,\n height: isLarge ? 34 : 30,\n marginRight: theme.spacing(1.5),\n width: isLarge ? 45 : 40,\n },\n },\n default: {\n container: {\n paddingBottom: theme.spacing(1.75),\n paddingHorizontal: theme.spacing(isLarge ? 3.5 : 3),\n paddingTop: theme.spacing(1.5),\n },\n },\n };\n\n return {\n container: {\n ...baseContainerStyle,\n ...variantStyleMap[startElementVariant]?.container,\n ...(isEndElement ? { paddingRight: theme.spacing(isLarge ? 2.5 : 2.25) } : {}),\n },\n endElement: endElementStyleMap[size],\n label: fontStyleMap[size],\n startElement: variantStyleMap[startElementVariant]?.startElement,\n };\n }, [theme, size, startElementVariant]);\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["useMemo","createFontStyle","useTheme","closeButtonContainerStyleMap","small","marginLeft","paddingTop","large","closeIconSize","height","width","useChipStyle","size","startElementVariant","color","selected","theme","fontStyleMap","selector","typography","caption1","medium","palette","text","strongInverse","strong","body2","baseContainerStyle","alignItems","backgroundColor","fill","base","surface","weaker","borderRadius","shape","radius","full","flexDirection","overflow","isLarge","variantStyleMap","avatar","container","paddingLeft","spacing","paddingRight","paddingVertical","startElement","startElementContainer","marginRight","icon","justifyContent","image","default","paddingBottom","closeButtonContainer","label"],"sources":["useChipStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport type { SvgIconProps } from '../SvgIcon';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { ChipColor, ChipSize, ChipStartElementVariant } from './ChipProps';\n\ninterface ChipStyle {\n container: FountainUiStyle;\n closeButtonContainer?: FountainUiStyle;\n closeIconSize?: Pick<SvgIconProps, 'height' | 'width'>;\n label: TextStyle;\n startElement?: FountainUiStyle;\n startElementContainer?: FountainUiStyle;\n}\n\ntype VariantStyleMap = Record<ChipStartElementVariant, Partial<ChipStyle>>;\n\nconst closeButtonContainerStyleMap: Record<ChipSize, FountainUiStyle> = {\n small: {\n marginLeft: 8,\n paddingTop: 1,\n },\n large: {\n marginLeft: 10,\n paddingTop: 1,\n },\n};\n\nconst closeIconSize: Record<ChipSize, ChipStyle['closeIconSize']> = {\n small: {\n height: 14,\n width: 8.17,\n },\n large: {\n height: 16,\n width: 9,\n },\n};\n\n// TODO: need to refactoring...\nexport default function useChipStyle(\n size: ChipSize,\n startElementVariant: ChipStartElementVariant,\n color: ChipColor,\n selected: boolean,\n): ChipStyle {\n const theme = useTheme();\n\n return useMemo<ChipStyle>(() => {\n const fontStyleMap: Record<ChipSize, TextStyle> = {\n small: createFontStyle(theme, {\n selector: (typography) => typography.caption1.medium,\n color: selected ? theme.palette.text.strongInverse : theme.palette.text.strong,\n }),\n large: createFontStyle(theme, {\n selector: (typography) => typography.body2.medium,\n color: selected ? theme.palette.text.strongInverse : theme.palette.text.strong,\n }),\n };\n\n const baseContainerStyle: FountainUiStyle = {\n alignItems: 'center',\n backgroundColor: selected ? theme.palette.fill.base\n : color === 'white'\n ? theme.palette.surface.base\n : theme.palette.fill.weaker,\n borderRadius: theme.shape.radius.full,\n flexDirection: 'row',\n overflow: 'hidden',\n };\n\n const isLarge = size === 'large';\n\n const variantStyleMap: VariantStyleMap = {\n avatar: {\n container: {\n paddingLeft: theme.spacing(isLarge ? 1.5 : 1.25),\n paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n paddingVertical: theme.spacing(isLarge ? 1.25 : 1),\n },\n startElement: {\n borderRadius: theme.shape.radius.full,\n height: isLarge ? 26 : 23,\n width: isLarge ? 26 : 23,\n },\n startElementContainer: {\n marginRight: theme.spacing(isLarge ? 1.5 : 1.25),\n },\n },\n icon: {\n container: {\n paddingLeft: theme.spacing(1.5),\n paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n paddingVertical: theme.spacing(isLarge ? 1.5 : 1.25),\n },\n startElement: {\n color: selected\n ? theme.palette.icon.strongInverse\n : theme.palette.icon.strong,\n height: isLarge ? 17 : 16,\n width: isLarge ? 17 : 16,\n },\n startElementContainer: {\n alignItems: 'center',\n height: isLarge ? 24 : 21,\n justifyContent: 'center',\n marginRight: theme.spacing(isLarge ? 1 : 0.75),\n width: isLarge ? 24 : 21,\n },\n },\n image: {\n container: {\n alignItems: 'center',\n paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n },\n startElement: {\n borderRadius: theme.shape.radius.full,\n height: isLarge ? 36 : 31,\n width: isLarge ? 48 : 40,\n },\n startElementContainer: {\n marginRight: theme.spacing(1.5),\n },\n },\n default: {\n container: {\n paddingBottom: theme.spacing(1.75),\n paddingLeft: theme.spacing(isLarge ? 3.5 : 3),\n paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n paddingTop: theme.spacing(1.5),\n },\n },\n };\n\n return {\n container: {\n ...baseContainerStyle,\n ...variantStyleMap[startElementVariant]?.container,\n ...(selected ? { paddingRight: theme.spacing(isLarge ? 2.5 : 2.25) } : {}),\n },\n closeButtonContainer: closeButtonContainerStyleMap[size],\n closeIconSize: closeIconSize[size],\n label: fontStyleMap[size],\n startElement: variantStyleMap[startElementVariant]?.startElement,\n startElementContainer: variantStyleMap[startElementVariant]?.startElementContainer,\n };\n }, [theme, size, startElementVariant, color, selected]);\n}\n"],"mappings":"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"}
|
|
@@ -8,12 +8,11 @@ import Modal, { ANIMATION_TYPE } from '../Modal';
|
|
|
8
8
|
import ShadowView from '../ShadowView';
|
|
9
9
|
import { DialogProvider } from './DialogContext';
|
|
10
10
|
import useDialogStyle from './useDialogStyle';
|
|
11
|
-
const
|
|
11
|
+
const TOP_ELEMENT_HIDDEN_OFFSET = 20;
|
|
12
12
|
export default function Dialog(props) {
|
|
13
13
|
const {
|
|
14
14
|
animationType = ANIMATION_TYPE.SLIDE,
|
|
15
15
|
children,
|
|
16
|
-
fullScreen = false,
|
|
17
16
|
hideBackdrop,
|
|
18
17
|
onClose,
|
|
19
18
|
style: styleProp,
|
|
@@ -22,7 +21,7 @@ export default function Dialog(props) {
|
|
|
22
21
|
topElement,
|
|
23
22
|
...otherProps
|
|
24
23
|
} = props;
|
|
25
|
-
const styles = useDialogStyle(size
|
|
24
|
+
const styles = useDialogStyle(size);
|
|
26
25
|
const {
|
|
27
26
|
height: screenHeight
|
|
28
27
|
} = useWindowDimensions();
|
|
@@ -40,8 +39,9 @@ export default function Dialog(props) {
|
|
|
40
39
|
return [];
|
|
41
40
|
}
|
|
42
41
|
|
|
42
|
+
const topElementHeightWithoutOffset = Math.max(0, topElementHeight - TOP_ELEMENT_HIDDEN_OFFSET);
|
|
43
43
|
return [{
|
|
44
|
-
toValue:
|
|
44
|
+
toValue: topElementHeightWithoutOffset / 2,
|
|
45
45
|
type: ANIMATION_TYPE.SLIDE
|
|
46
46
|
}];
|
|
47
47
|
}, [topElementHeight]);
|
|
@@ -51,7 +51,7 @@ export default function Dialog(props) {
|
|
|
51
51
|
toValue: 0,
|
|
52
52
|
type: ANIMATION_TYPE.FADE
|
|
53
53
|
}];
|
|
54
|
-
} else if (animationType === ANIMATION_TYPE.SLIDE
|
|
54
|
+
} else if (animationType === ANIMATION_TYPE.SLIDE) {
|
|
55
55
|
return [{
|
|
56
56
|
toValue: screenHeight,
|
|
57
57
|
type: ANIMATION_TYPE.SLIDE
|
|
@@ -67,14 +67,14 @@ export default function Dialog(props) {
|
|
|
67
67
|
toValue: screenHeight,
|
|
68
68
|
type: ANIMATION_TYPE.SLIDE
|
|
69
69
|
}];
|
|
70
|
-
}, [animationType,
|
|
70
|
+
}, [animationType, screenHeight]);
|
|
71
71
|
const openAnimation = useMemo(() => {
|
|
72
72
|
if (animationType === ANIMATION_TYPE.FADE) {
|
|
73
73
|
return [{
|
|
74
74
|
toValue: 1,
|
|
75
75
|
type: ANIMATION_TYPE.FADE
|
|
76
76
|
}];
|
|
77
|
-
} else if (animationType === ANIMATION_TYPE.SLIDE
|
|
77
|
+
} else if (animationType === ANIMATION_TYPE.SLIDE) {
|
|
78
78
|
return [{
|
|
79
79
|
toValue: 0,
|
|
80
80
|
type: ANIMATION_TYPE.SLIDE
|
|
@@ -90,8 +90,8 @@ export default function Dialog(props) {
|
|
|
90
90
|
toValue: 0,
|
|
91
91
|
type: ANIMATION_TYPE.SLIDE
|
|
92
92
|
}];
|
|
93
|
-
}, [animationType
|
|
94
|
-
const initialOpacity = animationType === ANIMATION_TYPE.SLIDE
|
|
93
|
+
}, [animationType]);
|
|
94
|
+
const initialOpacity = animationType === ANIMATION_TYPE.SLIDE ? 1 : undefined;
|
|
95
95
|
const initialTranslateY = animationType === ANIMATION_TYPE.FADE ? 0 : undefined;
|
|
96
96
|
const paperStyle = css([styles.paper, styleProp]);
|
|
97
97
|
return /*#__PURE__*/React.createElement(Modal, _extends({
|
|
@@ -110,7 +110,7 @@ export default function Dialog(props) {
|
|
|
110
110
|
size
|
|
111
111
|
}
|
|
112
112
|
}, topElement ? /*#__PURE__*/React.createElement(Column, {
|
|
113
|
-
style:
|
|
113
|
+
style: styles.topElementContainer
|
|
114
114
|
}, /*#__PURE__*/React.createElement(Column, {
|
|
115
115
|
style: styles.topElementContent,
|
|
116
116
|
onLayout: handleTopElementLayout
|
|
@@ -119,5 +119,4 @@ export default function Dialog(props) {
|
|
|
119
119
|
style: paperStyle
|
|
120
120
|
}, children)));
|
|
121
121
|
}
|
|
122
|
-
;
|
|
123
122
|
//# sourceMappingURL=Dialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useMemo","useState","useWindowDimensions","css","Column","Modal","ANIMATION_TYPE","ShadowView","DialogProvider","useDialogStyle","
|
|
1
|
+
{"version":3,"names":["React","useMemo","useState","useWindowDimensions","css","Column","Modal","ANIMATION_TYPE","ShadowView","DialogProvider","useDialogStyle","TOP_ELEMENT_HIDDEN_OFFSET","Dialog","props","animationType","SLIDE","children","hideBackdrop","onClose","style","styleProp","size","visible","topElement","otherProps","styles","height","screenHeight","topElementHeight","setTopElementHeight","handleTopElementLayout","event","nativeEvent","layout","offsetAnimation","topElementHeightWithoutOffset","Math","max","toValue","type","closeAnimation","FADE","duration","openAnimation","delay","initialOpacity","undefined","initialTranslateY","paperStyle","paper","container","root","topElementContainer","topElementContent"],"sources":["Dialog.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { LayoutChangeEvent, useWindowDimensions } from 'react-native';\nimport { css } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport Modal, { ANIMATION_TYPE, AnimationUnit } from '../Modal';\nimport ShadowView from '../ShadowView';\nimport type DialogProps from './DialogProps';\nimport { DialogProvider } from './DialogContext';\nimport useDialogStyle from './useDialogStyle';\n\nconst TOP_ELEMENT_HIDDEN_OFFSET = 20;\n\nexport default function Dialog(props: DialogProps) {\n const {\n animationType = ANIMATION_TYPE.SLIDE,\n children,\n hideBackdrop,\n onClose,\n style: styleProp,\n size = 'medium',\n visible,\n topElement,\n ...otherProps\n } = props;\n\n const styles = useDialogStyle(size);\n\n const { height: screenHeight } = useWindowDimensions();\n\n const [topElementHeight, setTopElementHeight] = useState(0);\n const handleTopElementLayout = (event: LayoutChangeEvent) => {\n const { height } = event.nativeEvent.layout;\n setTopElementHeight(height);\n };\n\n const offsetAnimation = useMemo<AnimationUnit[]>(() => {\n if (topElementHeight === 0) {\n return [];\n }\n\n const topElementHeightWithoutOffset = Math.max(0, topElementHeight - TOP_ELEMENT_HIDDEN_OFFSET);\n\n return [{\n toValue: (topElementHeightWithoutOffset) / 2,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [topElementHeight]);\n\n const closeAnimation = useMemo<AnimationUnit[]>(() => {\n if (animationType === ANIMATION_TYPE.FADE) {\n return [{\n toValue: 0,\n type: ANIMATION_TYPE.FADE,\n }];\n } else if (animationType === ANIMATION_TYPE.SLIDE) {\n return [\n {\n toValue: screenHeight,\n type: ANIMATION_TYPE.SLIDE,\n },\n {\n duration: 150,\n toValue: 0,\n type: ANIMATION_TYPE.FADE,\n },\n ];\n }\n\n return [{\n duration: 150,\n toValue: screenHeight,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [animationType, screenHeight]);\n\n const openAnimation = useMemo<AnimationUnit[]>(() => {\n if (animationType === ANIMATION_TYPE.FADE) {\n return [{\n toValue: 1,\n type: ANIMATION_TYPE.FADE,\n }];\n } else if (animationType === ANIMATION_TYPE.SLIDE) {\n return [\n {\n toValue: 0,\n type: ANIMATION_TYPE.SLIDE,\n },\n {\n delay: 50,\n duration: 150,\n toValue: 1,\n type: ANIMATION_TYPE.FADE,\n },\n ];\n }\n\n return [{\n toValue: 0,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [animationType]);\n\n const initialOpacity = animationType === ANIMATION_TYPE.SLIDE ? 1 : undefined;\n\n const initialTranslateY = animationType === ANIMATION_TYPE.FADE ? 0 : undefined;\n\n const paperStyle = css([\n styles.paper,\n styleProp,\n ]);\n\n return (\n <Modal\n animationStyle={styles.container}\n closeAnimation={closeAnimation}\n hideBackdrop={hideBackdrop || animationType === ANIMATION_TYPE.FADE}\n initialOpacity={initialOpacity}\n initialTranslateY={initialTranslateY}\n onClose={onClose}\n openAnimation={openAnimation}\n offsetAnimation={offsetAnimation}\n visible={visible}\n style={styles.root}\n {...otherProps}\n >\n <DialogProvider value={{ size }}>\n {topElement ? (\n <Column style={styles.topElementContainer}>\n <Column\n style={styles.topElementContent}\n onLayout={handleTopElementLayout}\n >\n {topElement}\n </Column>\n </Column>\n ) : null}\n\n <ShadowView\n variant={600}\n style={paperStyle}\n >\n {children}\n </ShadowView>\n </DialogProvider>\n </Modal>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export const dialogSizes = ['small', 'medium', 'large'];
|
|
1
|
+
export const dialogSizes = ['small', 'medium', 'large', 'full'];
|
|
2
2
|
//# sourceMappingURL=DialogProps.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["dialogSizes"],"sources":["DialogProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ModalProps } from '../Modal';\nimport type { OverridableComponentProps } from '../types';\nimport { ANIMATION_TYPE } from '../Modal';\n\nexport const dialogSizes = ['small', 'medium', 'large'] as const;\nexport type DialogSize = typeof dialogSizes[number];\n\nexport default interface DialogProps extends OverridableComponentProps<ModalProps, {\n /**\n * Type of animation used when the dialog opens and closes.\n * @default 'slide'\n */\n animationType?: ANIMATION_TYPE;\n\n /**\n * Dialog children, usually the included sub-components.\n */\n children?: React.ReactNode;\n\n /**\n *
|
|
1
|
+
{"version":3,"names":["dialogSizes"],"sources":["DialogProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ModalProps } from '../Modal';\nimport type { OverridableComponentProps } from '../types';\nimport { ANIMATION_TYPE } from '../Modal';\n\nexport const dialogSizes = ['small', 'medium', 'large', 'full'] as const;\nexport type DialogSize = typeof dialogSizes[number];\n\nexport default interface DialogProps extends OverridableComponentProps<ModalProps, {\n /**\n * Type of animation used when the dialog opens and closes.\n * @default 'slide'\n */\n animationType?: ANIMATION_TYPE;\n\n /**\n * Dialog children, usually the included sub-components.\n */\n children?: React.ReactNode;\n\n /**\n * Determines the minWidth of the Dialog.\n * @default 'medium'\n */\n size?: DialogSize;\n\n /**\n * Top element for displaying additional information on the dialog.\n */\n topElement?: React.ReactNode;\n}> {}\n"],"mappings":"AAKA,OAAO,MAAMA,WAAW,GAAG,CAAC,OAAD,EAAU,QAAV,EAAoB,OAApB,EAA6B,MAA7B,CAApB"}
|
|
@@ -13,14 +13,16 @@ export default function useDialogSectionStyle() {
|
|
|
13
13
|
return useMemo(() => {
|
|
14
14
|
const sizePaddingHorizontalMap = {
|
|
15
15
|
small: {
|
|
16
|
-
paddingHorizontal:
|
|
16
|
+
paddingHorizontal: 24
|
|
17
17
|
},
|
|
18
18
|
medium: {
|
|
19
|
-
|
|
20
|
-
paddingHorizontal: theme.spacing(windowWidth >= 448 ? 8 : 6)
|
|
19
|
+
paddingHorizontal: windowWidth >= 448 ? 32 : 24
|
|
21
20
|
},
|
|
22
21
|
large: {
|
|
23
|
-
paddingHorizontal:
|
|
22
|
+
paddingHorizontal: 32
|
|
23
|
+
},
|
|
24
|
+
full: {
|
|
25
|
+
paddingHorizontal: windowWidth >= 448 ? 32 : 24
|
|
24
26
|
}
|
|
25
27
|
};
|
|
26
28
|
return sizePaddingHorizontalMap[size];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","useWindowDimensions","useTheme","useDialogContext","useDialogSectionStyle","size","width","windowWidth","theme","sizePaddingHorizontalMap","small","paddingHorizontal","
|
|
1
|
+
{"version":3,"names":["useMemo","useWindowDimensions","useTheme","useDialogContext","useDialogSectionStyle","size","width","windowWidth","theme","sizePaddingHorizontalMap","small","paddingHorizontal","medium","large","full"],"sources":["useDialogSectionStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { useWindowDimensions } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport { useDialogContext } from './DialogContext';\nimport type { DialogSize } from './DialogProps';\n\nexport default function useDialogSectionStyle() {\n const { size } = useDialogContext();\n\n const { width: windowWidth } = useWindowDimensions();\n\n const theme = useTheme();\n\n return useMemo<FountainUiStyle>(() => {\n const sizePaddingHorizontalMap: Record<DialogSize, FountainUiStyle> = {\n small: {\n paddingHorizontal: 24,\n },\n medium: {\n paddingHorizontal: windowWidth >= 448 ? 32 : 24,\n },\n large: {\n paddingHorizontal: 32,\n },\n full: {\n paddingHorizontal: windowWidth >= 448 ? 32 : 24,\n },\n };\n\n return sizePaddingHorizontalMap[size];\n }, [size, theme, windowWidth]);\n}\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,OAAxB;AACA,SAASC,mBAAT,QAAoC,cAApC;AAEA,SAASC,QAAT,QAAyB,WAAzB;AACA,SAASC,gBAAT,QAAiC,iBAAjC;AAGA,eAAe,SAASC,qBAAT,GAAiC;EAC5C,MAAM;IAAEC;EAAF,IAAWF,gBAAgB,EAAjC;EAEA,MAAM;IAAEG,KAAK,EAAEC;EAAT,IAAyBN,mBAAmB,EAAlD;EAEA,MAAMO,KAAK,GAAGN,QAAQ,EAAtB;EAEA,OAAOF,OAAO,CAAkB,MAAM;IAClC,MAAMS,wBAA6D,GAAG;MAClEC,KAAK,EAAE;QACHC,iBAAiB,EAAE;MADhB,CAD2D;MAIlEC,MAAM,EAAE;QACJD,iBAAiB,EAAEJ,WAAW,IAAI,GAAf,GAAqB,EAArB,GAA0B;MADzC,CAJ0D;MAOlEM,KAAK,EAAE;QACHF,iBAAiB,EAAE;MADhB,CAP2D;MAUlEG,IAAI,EAAE;QACFH,iBAAiB,EAAEJ,WAAW,IAAI,GAAf,GAAqB,EAArB,GAA0B;MAD3C;IAV4D,CAAtE;IAeA,OAAOE,wBAAwB,CAACJ,IAAD,CAA/B;EACH,CAjBa,EAiBX,CAACA,IAAD,EAAOG,KAAP,EAAcD,WAAd,CAjBW,CAAd;AAkBH"}
|
|
@@ -1,12 +1,17 @@
|
|
|
1
1
|
import { useMemo } from 'react';
|
|
2
2
|
import { useWindowDimensions } from 'react-native';
|
|
3
|
+
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
3
4
|
import { useTheme } from '../styles';
|
|
4
|
-
export default function useDialogStyle(size
|
|
5
|
+
export default function useDialogStyle(size) {
|
|
5
6
|
const theme = useTheme();
|
|
6
7
|
const {
|
|
7
8
|
height: windowHeight,
|
|
8
9
|
width: windowWidth
|
|
9
10
|
} = useWindowDimensions();
|
|
11
|
+
const {
|
|
12
|
+
bottom: bottomSafeAreaInset,
|
|
13
|
+
top: topSafeAreaInset
|
|
14
|
+
} = useSafeAreaInsets();
|
|
10
15
|
return useMemo(() => {
|
|
11
16
|
var _sizeStyleMap$size;
|
|
12
17
|
|
|
@@ -21,31 +26,36 @@ export default function useDialogStyle(size, fullScreen) {
|
|
|
21
26
|
maxWidth: 512,
|
|
22
27
|
minHeight: 360,
|
|
23
28
|
width: 512
|
|
29
|
+
},
|
|
30
|
+
full: {
|
|
31
|
+
paddingBottom: bottomSafeAreaInset,
|
|
32
|
+
paddingTop: Math.max(0, topSafeAreaInset - 3)
|
|
24
33
|
}
|
|
25
34
|
};
|
|
26
|
-
const containerPaddingVertical =
|
|
35
|
+
const containerPaddingVertical = 24;
|
|
27
36
|
const dialogMaxHeight = windowHeight - containerPaddingVertical * 2;
|
|
28
37
|
const dialogMaxWidth = (_sizeStyleMap$size = sizeStyleMap[size]) === null || _sizeStyleMap$size === void 0 ? void 0 : _sizeStyleMap$size.maxWidth;
|
|
38
|
+
const isFullScreen = size === 'full';
|
|
29
39
|
return {
|
|
30
40
|
root: {
|
|
31
41
|
alignItems: 'center',
|
|
32
42
|
justifyContent: 'center',
|
|
33
43
|
zIndex: theme.zIndex.dialog
|
|
34
44
|
},
|
|
35
|
-
container:
|
|
45
|
+
container: isFullScreen ? {
|
|
36
46
|
height: '100%',
|
|
37
47
|
width: '100%'
|
|
38
48
|
} : {
|
|
39
49
|
alignItems: 'center',
|
|
40
|
-
|
|
41
|
-
paddingHorizontal: theme.spacing(windowWidth > 320 ? 6 : 4),
|
|
50
|
+
paddingHorizontal: windowWidth > theme.breakpoints.values.xs ? 24 : 16,
|
|
42
51
|
paddingVertical: containerPaddingVertical,
|
|
43
52
|
width: '100%'
|
|
44
53
|
},
|
|
45
|
-
paper:
|
|
54
|
+
paper: isFullScreen ? {
|
|
46
55
|
backgroundColor: theme.palette.surface.base,
|
|
47
56
|
height: '100%',
|
|
48
|
-
width: '100%'
|
|
57
|
+
width: '100%',
|
|
58
|
+
...sizeStyleMap[size]
|
|
49
59
|
} : {
|
|
50
60
|
backgroundColor: theme.palette.surface.base,
|
|
51
61
|
borderRadius: theme.shape.radius.xl,
|
|
@@ -64,6 +74,6 @@ export default function useDialogStyle(size, fullScreen) {
|
|
|
64
74
|
width: '100%'
|
|
65
75
|
}
|
|
66
76
|
};
|
|
67
|
-
}, [theme, windowHeight, windowWidth, size,
|
|
77
|
+
}, [theme, windowHeight, windowWidth, size, bottomSafeAreaInset, topSafeAreaInset]);
|
|
68
78
|
}
|
|
69
79
|
//# sourceMappingURL=useDialogStyle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","useWindowDimensions","useTheme","useDialogStyle","size","
|
|
1
|
+
{"version":3,"names":["useMemo","useWindowDimensions","useSafeAreaInsets","useTheme","useDialogStyle","size","theme","height","windowHeight","width","windowWidth","bottom","bottomSafeAreaInset","top","topSafeAreaInset","sizeStyleMap","small","maxWidth","medium","large","minHeight","full","paddingBottom","paddingTop","Math","max","containerPaddingVertical","dialogMaxHeight","dialogMaxWidth","isFullScreen","root","alignItems","justifyContent","zIndex","dialog","container","paddingHorizontal","breakpoints","values","xs","paddingVertical","paper","backgroundColor","palette","surface","base","borderRadius","shape","radius","xl","maxHeight","overflow","topElementContainer","topElementContent","position"],"sources":["useDialogStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { useWindowDimensions } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport type { FountainUiStyle, NamedStylesStringUnion } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport type { DialogSize } from './DialogProps';\n\ntype DialogStyleKeys =\n | 'root'\n | 'container'\n | 'paper'\n | 'topElementContainer'\n | 'topElementContent';\n\ntype DialogStyles = NamedStylesStringUnion<DialogStyleKeys>;\n\nexport default function useDialogStyle(size: DialogSize): DialogStyles {\n const theme = useTheme();\n\n const {\n height: windowHeight,\n width: windowWidth,\n } = useWindowDimensions();\n\n const {\n bottom: bottomSafeAreaInset,\n top: topSafeAreaInset,\n } = useSafeAreaInsets();\n\n return useMemo(() => {\n const sizeStyleMap: Record<DialogSize, FountainUiStyle> = {\n small: {\n maxWidth: 260,\n },\n medium: {\n maxWidth: 400,\n },\n large: {\n maxWidth: 512,\n minHeight: 360,\n width: 512,\n },\n full: {\n paddingBottom: bottomSafeAreaInset,\n paddingTop: Math.max(0, topSafeAreaInset - 3),\n },\n };\n\n const containerPaddingVertical = 24;\n const dialogMaxHeight = windowHeight - containerPaddingVertical * 2;\n const dialogMaxWidth = sizeStyleMap[size]?.maxWidth;\n\n const isFullScreen = size === 'full';\n\n return {\n root: {\n alignItems: 'center',\n justifyContent: 'center',\n zIndex: theme.zIndex.dialog,\n },\n container: isFullScreen ? {\n height: '100%',\n width: '100%',\n } : {\n alignItems: 'center',\n paddingHorizontal: windowWidth > theme.breakpoints.values.xs ? 24 : 16,\n paddingVertical: containerPaddingVertical,\n width: '100%',\n },\n paper: isFullScreen ? {\n backgroundColor: theme.palette.surface.base,\n height: '100%',\n width: '100%',\n ...sizeStyleMap[size],\n } : {\n backgroundColor: theme.palette.surface.base,\n borderRadius: theme.shape.radius.xl,\n maxHeight: dialogMaxHeight,\n overflow: 'hidden',\n width: '100%',\n ...sizeStyleMap[size],\n },\n topElementContainer: {\n maxWidth: dialogMaxWidth,\n width: '100%',\n },\n topElementContent: {\n position: 'absolute',\n bottom: 0,\n width: '100%',\n },\n };\n }, [theme, windowHeight, windowWidth, size, bottomSafeAreaInset, topSafeAreaInset]);\n}\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,OAAxB;AACA,SAASC,mBAAT,QAAoC,cAApC;AACA,SAASC,iBAAT,QAAkC,gCAAlC;AAEA,SAASC,QAAT,QAAyB,WAAzB;AAYA,eAAe,SAASC,cAAT,CAAwBC,IAAxB,EAAwD;EACnE,MAAMC,KAAK,GAAGH,QAAQ,EAAtB;EAEA,MAAM;IACFI,MAAM,EAAEC,YADN;IAEFC,KAAK,EAAEC;EAFL,IAGFT,mBAAmB,EAHvB;EAKA,MAAM;IACFU,MAAM,EAAEC,mBADN;IAEFC,GAAG,EAAEC;EAFH,IAGFZ,iBAAiB,EAHrB;EAKA,OAAOF,OAAO,CAAC,MAAM;IAAA;;IACjB,MAAMe,YAAiD,GAAG;MACtDC,KAAK,EAAE;QACHC,QAAQ,EAAE;MADP,CAD+C;MAItDC,MAAM,EAAE;QACJD,QAAQ,EAAE;MADN,CAJ8C;MAOtDE,KAAK,EAAE;QACHF,QAAQ,EAAE,GADP;QAEHG,SAAS,EAAE,GAFR;QAGHX,KAAK,EAAE;MAHJ,CAP+C;MAYtDY,IAAI,EAAE;QACFC,aAAa,EAAEV,mBADb;QAEFW,UAAU,EAAEC,IAAI,CAACC,GAAL,CAAS,CAAT,EAAYX,gBAAgB,GAAG,CAA/B;MAFV;IAZgD,CAA1D;IAkBA,MAAMY,wBAAwB,GAAG,EAAjC;IACA,MAAMC,eAAe,GAAGnB,YAAY,GAAGkB,wBAAwB,GAAG,CAAlE;IACA,MAAME,cAAc,yBAAGb,YAAY,CAACV,IAAD,CAAf,uDAAG,mBAAoBY,QAA3C;IAEA,MAAMY,YAAY,GAAGxB,IAAI,KAAK,MAA9B;IAEA,OAAO;MACHyB,IAAI,EAAE;QACFC,UAAU,EAAE,QADV;QAEFC,cAAc,EAAE,QAFd;QAGFC,MAAM,EAAE3B,KAAK,CAAC2B,MAAN,CAAaC;MAHnB,CADH;MAMHC,SAAS,EAAEN,YAAY,GAAG;QACtBtB,MAAM,EAAE,MADc;QAEtBE,KAAK,EAAE;MAFe,CAAH,GAGnB;QACAsB,UAAU,EAAE,QADZ;QAEAK,iBAAiB,EAAE1B,WAAW,GAAGJ,KAAK,CAAC+B,WAAN,CAAkBC,MAAlB,CAAyBC,EAAvC,GAA4C,EAA5C,GAAiD,EAFpE;QAGAC,eAAe,EAAEd,wBAHjB;QAIAjB,KAAK,EAAE;MAJP,CATD;MAeHgC,KAAK,EAAEZ,YAAY,GAAG;QAClBa,eAAe,EAAEpC,KAAK,CAACqC,OAAN,CAAcC,OAAd,CAAsBC,IADrB;QAElBtC,MAAM,EAAE,MAFU;QAGlBE,KAAK,EAAE,MAHW;QAIlB,GAAGM,YAAY,CAACV,IAAD;MAJG,CAAH,GAKf;QACAqC,eAAe,EAAEpC,KAAK,CAACqC,OAAN,CAAcC,OAAd,CAAsBC,IADvC;QAEAC,YAAY,EAAExC,KAAK,CAACyC,KAAN,CAAYC,MAAZ,CAAmBC,EAFjC;QAGAC,SAAS,EAAEvB,eAHX;QAIAwB,QAAQ,EAAE,QAJV;QAKA1C,KAAK,EAAE,MALP;QAMA,GAAGM,YAAY,CAACV,IAAD;MANf,CApBD;MA4BH+C,mBAAmB,EAAE;QACjBnC,QAAQ,EAAEW,cADO;QAEjBnB,KAAK,EAAE;MAFU,CA5BlB;MAgCH4C,iBAAiB,EAAE;QACfC,QAAQ,EAAE,UADK;QAEf3C,MAAM,EAAE,CAFO;QAGfF,KAAK,EAAE;MAHQ;IAhChB,CAAP;EAsCH,CA/Da,EA+DX,CAACH,KAAD,EAAQE,YAAR,EAAsBE,WAAtB,EAAmCL,IAAnC,EAAyCO,mBAAzC,EAA8DE,gBAA9D,CA/DW,CAAd;AAgEH"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Column","useDialogSectionStyle","css","useTheme","useStyles","theme","root","
|
|
1
|
+
{"version":3,"names":["React","Column","useDialogSectionStyle","css","useTheme","useStyles","theme","root","paddingBottom","spacing","DialogActions","props","children","style","styleProp","otherProps","styles","sectionStyle","rootStyle"],"sources":["DialogActions.tsx"],"sourcesContent":["import React from 'react';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport { useDialogSectionStyle } from '../Dialog';\nimport { css, useTheme } from '../styles';\nimport type DialogActionsProps from './DialogActionsProps';\n\ntype DialogActionsStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<DialogActionsStyles> = function (): DialogActionsStyles {\n const theme = useTheme();\n\n return {\n root: {\n paddingBottom: theme.spacing(4),\n },\n };\n};\n\nexport default function DialogActions(props: DialogActionsProps) {\n const {\n children,\n style: styleProp,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const sectionStyle = useDialogSectionStyle();\n\n const rootStyle = css([\n styles.root,\n sectionStyle,\n styleProp,\n ]);\n\n return (\n <Column\n style={rootStyle}\n {...otherProps}\n >\n {children}\n </Column>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,MAAP,MAAmB,WAAnB;AACA,SAASC,qBAAT,QAAsC,WAAtC;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;;AAKA,MAAMC,SAAyC,GAAG,YAAiC;EAC/E,MAAMC,KAAK,GAAGF,QAAQ,EAAtB;EAEA,OAAO;IACHG,IAAI,EAAE;MACFC,aAAa,EAAEF,KAAK,CAACG,OAAN,CAAc,CAAd;IADb;EADH,CAAP;AAKH,CARD;;AAUA,eAAe,SAASC,aAAT,CAAuBC,KAAvB,EAAkD;EAC7D,MAAM;IACFC,QADE;IAEFC,KAAK,EAAEC,SAFL;IAGF,GAAGC;EAHD,IAIFJ,KAJJ;EAMA,MAAMK,MAAM,GAAGX,SAAS,EAAxB;EAEA,MAAMY,YAAY,GAAGf,qBAAqB,EAA1C;EAEA,MAAMgB,SAAS,GAAGf,GAAG,CAAC,CAClBa,MAAM,CAACT,IADW,EAElBU,YAFkB,EAGlBH,SAHkB,CAAD,CAArB;EAMA,oBACI,oBAAC,MAAD;IACI,KAAK,EAAEI;EADX,GAEQH,UAFR,GAIKH,QAJL,CADJ;AAQH;AAAA"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { StyleSheet, Text, View } from 'react-native';
|
|
5
|
+
import { createFontStyle, css, useTheme } from '../styles';
|
|
6
|
+
import IconButton from '../IconButton';
|
|
7
|
+
import { ChevronLeft, Close } from '../internal';
|
|
8
|
+
const styles = StyleSheet.create({
|
|
9
|
+
root: {
|
|
10
|
+
alignItems: 'center',
|
|
11
|
+
height: 64,
|
|
12
|
+
justifyContent: 'center',
|
|
13
|
+
paddingHorizontal: 80,
|
|
14
|
+
width: '100%'
|
|
15
|
+
},
|
|
16
|
+
backButton: {
|
|
17
|
+
height: 40,
|
|
18
|
+
left: 20,
|
|
19
|
+
paddingLeft: 5,
|
|
20
|
+
paddingRight: 11,
|
|
21
|
+
paddingVertical: 8,
|
|
22
|
+
position: 'absolute',
|
|
23
|
+
width: 40
|
|
24
|
+
},
|
|
25
|
+
closeButton: {
|
|
26
|
+
height: 40,
|
|
27
|
+
left: 20,
|
|
28
|
+
padding: 8,
|
|
29
|
+
position: 'absolute',
|
|
30
|
+
width: 40
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
export default function DialogLargeTitle(props) {
|
|
34
|
+
const {
|
|
35
|
+
children,
|
|
36
|
+
closeButtonType = 'close',
|
|
37
|
+
onClose,
|
|
38
|
+
style: styleProp,
|
|
39
|
+
...otherProps
|
|
40
|
+
} = props;
|
|
41
|
+
const theme = useTheme();
|
|
42
|
+
const fontStyle = createFontStyle(theme, {
|
|
43
|
+
selector: typo => typo.header4.semiBold,
|
|
44
|
+
color: theme.palette.text.strong
|
|
45
|
+
});
|
|
46
|
+
const rootStyle = css([styles.root, styleProp]);
|
|
47
|
+
return /*#__PURE__*/React.createElement(View, _extends({
|
|
48
|
+
style: rootStyle
|
|
49
|
+
}, otherProps), typeof onClose === 'function' ? closeButtonType === 'back' ? /*#__PURE__*/React.createElement(IconButton, {
|
|
50
|
+
style: styles.backButton,
|
|
51
|
+
onPress: onClose
|
|
52
|
+
}, /*#__PURE__*/React.createElement(ChevronLeft, {
|
|
53
|
+
color: 'strong',
|
|
54
|
+
size: 'large'
|
|
55
|
+
})) : /*#__PURE__*/React.createElement(IconButton, {
|
|
56
|
+
style: styles.closeButton,
|
|
57
|
+
onPress: onClose
|
|
58
|
+
}, /*#__PURE__*/React.createElement(Close, {
|
|
59
|
+
color: 'strong',
|
|
60
|
+
size: 'large'
|
|
61
|
+
})) : null, /*#__PURE__*/React.createElement(Text, {
|
|
62
|
+
style: fontStyle
|
|
63
|
+
}, children));
|
|
64
|
+
}
|
|
65
|
+
//# sourceMappingURL=DialogLargeTitle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","StyleSheet","Text","View","createFontStyle","css","useTheme","IconButton","ChevronLeft","Close","styles","create","root","alignItems","height","justifyContent","paddingHorizontal","width","backButton","left","paddingLeft","paddingRight","paddingVertical","position","closeButton","padding","DialogLargeTitle","props","children","closeButtonType","onClose","style","styleProp","otherProps","theme","fontStyle","selector","typo","header4","semiBold","color","palette","text","strong","rootStyle"],"sources":["DialogLargeTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, View } from 'react-native';\nimport type { DialogProps } from '../Dialog';\nimport type DialogTitleProps from './DialogTitleProps';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport IconButton from '../IconButton';\nimport { ChevronLeft, Close } from '../internal';\n\nconst styles = StyleSheet.create({\n root: {\n alignItems: 'center',\n height: 64,\n justifyContent: 'center',\n paddingHorizontal: 80,\n width: '100%',\n },\n backButton: {\n height: 40,\n left: 20,\n paddingLeft: 5,\n paddingRight: 11,\n paddingVertical: 8,\n position: 'absolute',\n width: 40,\n },\n closeButton: {\n height: 40,\n left: 20,\n padding: 8,\n position: 'absolute',\n width: 40,\n },\n});\n\ninterface DialogLargeTitleProps extends DialogTitleProps {\n closeButtonType?: 'back' | 'close';\n onClose: DialogProps['onClose'];\n}\n\nexport default function DialogLargeTitle(props: DialogLargeTitleProps) {\n const {\n children,\n closeButtonType = 'close',\n onClose,\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.header4.semiBold,\n color: theme.palette.text.strong,\n });\n\n const rootStyle = css([\n styles.root,\n styleProp,\n ]);\n\n return (\n <View\n style={rootStyle}\n {...otherProps}\n >\n {typeof onClose === 'function' ? (\n closeButtonType === 'back' ? (\n <IconButton\n style={styles.backButton}\n onPress={onClose}\n >\n <ChevronLeft\n color={'strong'}\n size={'large'}\n />\n </IconButton>\n ) : (\n <IconButton\n style={styles.closeButton}\n onPress={onClose}\n >\n <Close\n color={'strong'}\n size={'large'}\n />\n </IconButton>\n )\n ) : null}\n\n <Text style={fontStyle}>\n {children}\n </Text>\n </View>\n );\n}\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,EAAqBC,IAArB,EAA2BC,IAA3B,QAAuC,cAAvC;AAGA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,QAA/B,QAA+C,WAA/C;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,WAAT,EAAsBC,KAAtB,QAAmC,aAAnC;AAEA,MAAMC,MAAM,GAAGT,UAAU,CAACU,MAAX,CAAkB;EAC7BC,IAAI,EAAE;IACFC,UAAU,EAAE,QADV;IAEFC,MAAM,EAAE,EAFN;IAGFC,cAAc,EAAE,QAHd;IAIFC,iBAAiB,EAAE,EAJjB;IAKFC,KAAK,EAAE;EALL,CADuB;EAQ7BC,UAAU,EAAE;IACRJ,MAAM,EAAE,EADA;IAERK,IAAI,EAAE,EAFE;IAGRC,WAAW,EAAE,CAHL;IAIRC,YAAY,EAAE,EAJN;IAKRC,eAAe,EAAE,CALT;IAMRC,QAAQ,EAAE,UANF;IAORN,KAAK,EAAE;EAPC,CARiB;EAiB7BO,WAAW,EAAE;IACTV,MAAM,EAAE,EADC;IAETK,IAAI,EAAE,EAFG;IAGTM,OAAO,EAAE,CAHA;IAITF,QAAQ,EAAE,UAJD;IAKTN,KAAK,EAAE;EALE;AAjBgB,CAAlB,CAAf;AA+BA,eAAe,SAASS,gBAAT,CAA0BC,KAA1B,EAAwD;EACnE,MAAM;IACFC,QADE;IAEFC,eAAe,GAAG,OAFhB;IAGFC,OAHE;IAIFC,KAAK,EAAEC,SAJL;IAKF,GAAGC;EALD,IAMFN,KANJ;EAQA,MAAMO,KAAK,GAAG5B,QAAQ,EAAtB;EAEA,MAAM6B,SAAS,GAAG/B,eAAe,CAAC8B,KAAD,EAAQ;IACrCE,QAAQ,EAAGC,IAAD,IAAUA,IAAI,CAACC,OAAL,CAAaC,QADI;IAErCC,KAAK,EAAEN,KAAK,CAACO,OAAN,CAAcC,IAAd,CAAmBC;EAFW,CAAR,CAAjC;EAKA,MAAMC,SAAS,GAAGvC,GAAG,CAAC,CAClBK,MAAM,CAACE,IADW,EAElBoB,SAFkB,CAAD,CAArB;EAKA,oBACI,oBAAC,IAAD;IACI,KAAK,EAAEY;EADX,GAEQX,UAFR,GAIK,OAAOH,OAAP,KAAmB,UAAnB,GACGD,eAAe,KAAK,MAApB,gBACI,oBAAC,UAAD;IACI,KAAK,EAAEnB,MAAM,CAACQ,UADlB;IAEI,OAAO,EAAEY;EAFb,gBAII,oBAAC,WAAD;IACI,KAAK,EAAE,QADX;IAEI,IAAI,EAAE;EAFV,EAJJ,CADJ,gBAWI,oBAAC,UAAD;IACI,KAAK,EAAEpB,MAAM,CAACc,WADlB;IAEI,OAAO,EAAEM;EAFb,gBAII,oBAAC,KAAD;IACI,KAAK,EAAE,QADX;IAEI,IAAI,EAAE;EAFV,EAJJ,CAZP,GAsBG,IA1BR,eA4BI,oBAAC,IAAD;IAAM,KAAK,EAAEK;EAAb,GACKP,QADL,CA5BJ,CADJ;AAkCH"}
|
|
@@ -4,6 +4,7 @@ import React from 'react';
|
|
|
4
4
|
import { Text, View } from 'react-native';
|
|
5
5
|
import { useDialogSectionStyle } from '../Dialog';
|
|
6
6
|
import { createFontStyle, css, useTheme } from '../styles';
|
|
7
|
+
import DialogLargeTitle from './DialogLargeTitle';
|
|
7
8
|
|
|
8
9
|
const useStyles = function () {
|
|
9
10
|
const theme = useTheme();
|
|
@@ -17,7 +18,7 @@ const useStyles = function () {
|
|
|
17
18
|
};
|
|
18
19
|
};
|
|
19
20
|
|
|
20
|
-
|
|
21
|
+
const DialogTitle = props => {
|
|
21
22
|
const {
|
|
22
23
|
children,
|
|
23
24
|
style: styleProp,
|
|
@@ -37,6 +38,8 @@ export default function DialogTitle(props) {
|
|
|
37
38
|
}), typeof children === 'string' ? /*#__PURE__*/React.createElement(Text, {
|
|
38
39
|
style: titleStyle
|
|
39
40
|
}, children) : children);
|
|
40
|
-
}
|
|
41
|
-
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
DialogTitle.Large = DialogLargeTitle;
|
|
44
|
+
export default DialogTitle;
|
|
42
45
|
//# sourceMappingURL=DialogTitle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Text","View","useDialogSectionStyle","createFontStyle","css","useTheme","useStyles","theme","root","paddingTop","spacing","title","textAlign","DialogTitle","props","children","style","styleProp","otherProps","styles","sectionStyle","rootStyle","titleFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle"],"sources":["DialogTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useDialogSectionStyle } from '../Dialog';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type DialogTitleProps from './DialogTitleProps';\n\ntype DialogTitleStyles = NamedStylesStringUnion<'root' | 'title'>;\n\nconst useStyles: UseStyles<DialogTitleStyles> = function (): DialogTitleStyles {\n const theme = useTheme();\n\n return {\n root: {\n paddingTop: theme.spacing(6.5),\n },\n title: {\n textAlign: 'center',\n },\n };\n};\n\
|
|
1
|
+
{"version":3,"names":["React","Text","View","useDialogSectionStyle","createFontStyle","css","useTheme","DialogLargeTitle","useStyles","theme","root","paddingTop","spacing","title","textAlign","DialogTitle","props","children","style","styleProp","otherProps","styles","sectionStyle","rootStyle","titleFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle","Large"],"sources":["DialogTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useDialogSectionStyle } from '../Dialog';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport DialogLargeTitle from './DialogLargeTitle';\nimport type DialogTitleProps from './DialogTitleProps';\n\ntype DialogTitleStyles = NamedStylesStringUnion<'root' | 'title'>;\n\nconst useStyles: UseStyles<DialogTitleStyles> = function (): DialogTitleStyles {\n const theme = useTheme();\n\n return {\n root: {\n paddingTop: theme.spacing(6.5),\n },\n title: {\n textAlign: 'center',\n },\n };\n};\n\nconst DialogTitle = (props: DialogTitleProps) => {\n const {\n children,\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const styles = useStyles();\n\n const sectionStyle = useDialogSectionStyle();\n\n const rootStyle = css([\n styles.root,\n sectionStyle,\n styleProp,\n ]);\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.header3.semiBold,\n color: theme.palette.text.strong,\n });\n\n const titleStyle = css([\n styles.title,\n titleFontStyle,\n ]);\n\n return (\n <View\n {...otherProps}\n style={rootStyle}\n >\n {typeof children === 'string' ? (\n <Text style={titleStyle}>\n {children}\n </Text>\n ) : (children)}\n </View>\n );\n};\n\nDialogTitle.Large = DialogLargeTitle;\n\nexport default DialogTitle;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AAEA,SAASC,qBAAT,QAAsC,WAAtC;AACA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,QAA/B,QAA+C,WAA/C;AACA,OAAOC,gBAAP,MAA6B,oBAA7B;;AAKA,MAAMC,SAAuC,GAAG,YAA+B;EAC3E,MAAMC,KAAK,GAAGH,QAAQ,EAAtB;EAEA,OAAO;IACHI,IAAI,EAAE;MACFC,UAAU,EAAEF,KAAK,CAACG,OAAN,CAAc,GAAd;IADV,CADH;IAIHC,KAAK,EAAE;MACHC,SAAS,EAAE;IADR;EAJJ,CAAP;AAQH,CAXD;;AAaA,MAAMC,WAAW,GAAIC,KAAD,IAA6B;EAC7C,MAAM;IACFC,QADE;IAEFC,KAAK,EAAEC,SAFL;IAGF,GAAGC;EAHD,IAIFJ,KAJJ;EAMA,MAAMP,KAAK,GAAGH,QAAQ,EAAtB;EAEA,MAAMe,MAAM,GAAGb,SAAS,EAAxB;EAEA,MAAMc,YAAY,GAAGnB,qBAAqB,EAA1C;EAEA,MAAMoB,SAAS,GAAGlB,GAAG,CAAC,CAClBgB,MAAM,CAACX,IADW,EAElBY,YAFkB,EAGlBH,SAHkB,CAAD,CAArB;EAMA,MAAMK,cAAc,GAAGpB,eAAe,CAACK,KAAD,EAAQ;IAC1CgB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAEpB,KAAK,CAACqB,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAR,CAAtC;EAKA,MAAMC,UAAU,GAAG5B,GAAG,CAAC,CACnBgB,MAAM,CAACR,KADY,EAEnBW,cAFmB,CAAD,CAAtB;EAKA,oBACI,oBAAC,IAAD,eACQJ,UADR;IAEI,KAAK,EAAEG;EAFX,IAIK,OAAON,QAAP,KAAoB,QAApB,gBACG,oBAAC,IAAD;IAAM,KAAK,EAAEgB;EAAb,GACKhB,QADL,CADH,GAIIA,QART,CADJ;AAYH,CAzCD;;AA2CAF,WAAW,CAACmB,KAAZ,GAAoB3B,gBAApB;AAEA,eAAeQ,WAAf"}
|
|
@@ -2,6 +2,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
|
|
|
2
2
|
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import { Text, View } from 'react-native';
|
|
5
|
+
import { commonColors } from '@fountain-ui/styles';
|
|
5
6
|
import { createFontStyle, css, StyleSheet, useTheme } from '../styles';
|
|
6
7
|
const styles = StyleSheet.create({
|
|
7
8
|
container: {
|
|
@@ -27,6 +28,12 @@ function selectBorderColor(theme, variant, vertical) {
|
|
|
27
28
|
|
|
28
29
|
case 'strong':
|
|
29
30
|
return vertical ? theme.palette.border.weak : theme.palette.border.base;
|
|
31
|
+
|
|
32
|
+
case 'strongStatic':
|
|
33
|
+
return commonColors.opacity.white['13'];
|
|
34
|
+
|
|
35
|
+
case 'baseStatic':
|
|
36
|
+
return commonColors.opacity.white['10'];
|
|
30
37
|
}
|
|
31
38
|
}
|
|
32
39
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Text","View","createFontStyle","css","StyleSheet","useTheme","styles","create","container","alignSelf","alignItems","row","flexDirection","column","divider","flexGrow","selectBorderColor","theme","variant","vertical","palette","border","weaker","weak","base","Divider","props","borderWidth","borderWidthProp","children","childrenProp","elementAlign","inset","marginBetweenChildren","style","otherProps","fontColor","text","borderColor","marginSize","spacing","insetSize","marginLeft","marginRight","marginTop","marginBottom","marginStyle","insetStyle","borderColorStyle","borderWidthStyle","borderRightWidth","borderBottomWidth","containerStyle","undefined","dividerStyle","dividerMarginSize","startDividerStyle","display","endDividerStyle","fontStyle","selector","typo","caption2","medium","color","element"],"sources":["Divider.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport type { Theme } from '@fountain-ui/styles';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport { ExtendedStyle } from '../types';\nimport type DividerProps from './DividerProps';\nimport type { DividerVariant } from './DividerProps';\n\nconst styles = StyleSheet.create({\n container: {\n alignSelf: 'stretch',\n alignItems: 'center',\n },\n row: {\n flexDirection: 'row',\n },\n column: {\n flexDirection: 'column',\n },\n divider: {\n flexGrow: 1,\n },\n});\n\nfunction selectBorderColor(theme: Theme, variant: DividerVariant, vertical: boolean) {\n switch (variant) {\n default:\n case 'base':\n return vertical ? theme.palette.border.weaker : theme.palette.border.weak;\n case 'strong':\n return vertical ? theme.palette.border.weak : theme.palette.border.base;\n }\n}\n\nexport default function Divider(props: DividerProps) {\n const {\n borderWidth: borderWidthProp,\n children: childrenProp,\n elementAlign = 'center',\n inset = 0,\n marginBetweenChildren = 2,\n style,\n variant = 'base' as DividerVariant,\n vertical = false,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const borderWidth = borderWidthProp ?? (vertical ? 1 : 0.5);\n const fontColor = theme.palette.text.weak;\n const borderColor = selectBorderColor(theme, variant, vertical);\n const marginSize = theme.spacing(1);\n const insetSize = theme.spacing(inset);\n\n const marginLeft = marginSize;\n const marginRight = marginSize;\n const marginTop = marginSize;\n const marginBottom = marginSize;\n\n const marginStyle = vertical\n ? { marginLeft, marginRight }\n : { marginTop, marginBottom };\n\n const insetStyle = vertical\n ? { marginTop: insetSize, marginBottom: insetSize }\n : { marginLeft: insetSize, marginRight: insetSize };\n\n const borderColorStyle = { borderColor };\n const borderWidthStyle = (vertical ? { borderRightWidth: borderWidth } : { borderBottomWidth: borderWidth });\n\n const containerStyle = css([\n insetStyle,\n marginStyle,\n styles.container,\n vertical ? styles.column : styles.row,\n childrenProp ? undefined : borderColorStyle,\n childrenProp ? undefined : borderWidthStyle,\n style,\n ]);\n\n const dividerStyle = css([\n borderColorStyle,\n borderWidthStyle,\n styles.divider,\n ]);\n\n const dividerMarginSize = theme.spacing(marginBetweenChildren);\n const startDividerStyle: ExtendedStyle = {\n display: elementAlign !== 'start' ? 'flex' : 'none',\n ...(vertical ? { marginBottom: dividerMarginSize } : { marginRight: dividerMarginSize }),\n };\n const endDividerStyle: ExtendedStyle = {\n display: elementAlign !== 'end' ? 'flex' : 'none',\n ...(vertical ? { marginTop: dividerMarginSize } : { marginLeft: dividerMarginSize }),\n };\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.caption2.medium,\n color: fontColor,\n });\n\n const element = typeof childrenProp === 'string'\n ? <Text style={css(fontStyle)}>{childrenProp}</Text>\n : childrenProp;\n\n const children = childrenProp ? (\n <React.Fragment>\n <View style={css([dividerStyle, startDividerStyle])}/>\n {element}\n <View style={css([dividerStyle, endDividerStyle])}/>\n </React.Fragment>\n ) : null;\n\n return (\n <View\n style={containerStyle}\n {...otherProps}\n >\n {children}\n </View>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AAEA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,UAA/B,EAA2CC,QAA3C,QAA2D,WAA3D;AAKA,MAAMC,MAAM,GAAGF,UAAU,CAACG,MAAX,CAAkB;EAC7BC,SAAS,EAAE;IACPC,SAAS,EAAE,SADJ;IAEPC,UAAU,EAAE;EAFL,CADkB;EAK7BC,GAAG,EAAE;IACDC,aAAa,EAAE;EADd,CALwB;EAQ7BC,MAAM,EAAE;IACJD,aAAa,EAAE;EADX,CARqB;EAW7BE,OAAO,EAAE;IACLC,QAAQ,EAAE;EADL;AAXoB,CAAlB,CAAf;;AAgBA,SAASC,iBAAT,CAA2BC,KAA3B,EAAyCC,OAAzC,EAAkEC,QAAlE,EAAqF;EACjF,QAAQD,OAAR;IACI;IACA,KAAK,MAAL;MACI,OAAOC,QAAQ,GAAGF,KAAK,CAACG,OAAN,CAAcC,MAAd,CAAqBC,MAAxB,GAAiCL,KAAK,CAACG,OAAN,CAAcC,MAAd,CAAqBE,IAArE;;IACJ,KAAK,QAAL;MACI,OAAOJ,QAAQ,GAAGF,KAAK,CAACG,OAAN,CAAcC,MAAd,CAAqBE,IAAxB,GAA+BN,KAAK,CAACG,OAAN,CAAcC,MAAd,CAAqBG,IAAnE;
|
|
1
|
+
{"version":3,"names":["React","Text","View","commonColors","createFontStyle","css","StyleSheet","useTheme","styles","create","container","alignSelf","alignItems","row","flexDirection","column","divider","flexGrow","selectBorderColor","theme","variant","vertical","palette","border","weaker","weak","base","opacity","white","Divider","props","borderWidth","borderWidthProp","children","childrenProp","elementAlign","inset","marginBetweenChildren","style","otherProps","fontColor","text","borderColor","marginSize","spacing","insetSize","marginLeft","marginRight","marginTop","marginBottom","marginStyle","insetStyle","borderColorStyle","borderWidthStyle","borderRightWidth","borderBottomWidth","containerStyle","undefined","dividerStyle","dividerMarginSize","startDividerStyle","display","endDividerStyle","fontStyle","selector","typo","caption2","medium","color","element"],"sources":["Divider.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport type { Theme } from '@fountain-ui/styles';\nimport { commonColors } from '@fountain-ui/styles';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport { ExtendedStyle } from '../types';\nimport type DividerProps from './DividerProps';\nimport type { DividerVariant } from './DividerProps';\n\nconst styles = StyleSheet.create({\n container: {\n alignSelf: 'stretch',\n alignItems: 'center',\n },\n row: {\n flexDirection: 'row',\n },\n column: {\n flexDirection: 'column',\n },\n divider: {\n flexGrow: 1,\n },\n});\n\nfunction selectBorderColor(theme: Theme, variant: DividerVariant, vertical: boolean) {\n switch (variant) {\n default:\n case 'base':\n return vertical ? theme.palette.border.weaker : theme.palette.border.weak;\n case 'strong':\n return vertical ? theme.palette.border.weak : theme.palette.border.base;\n case 'strongStatic':\n return commonColors.opacity.white['13'];\n case 'baseStatic':\n return commonColors.opacity.white['10'];\n }\n}\n\nexport default function Divider(props: DividerProps) {\n const {\n borderWidth: borderWidthProp,\n children: childrenProp,\n elementAlign = 'center',\n inset = 0,\n marginBetweenChildren = 2,\n style,\n variant = 'base' as DividerVariant,\n vertical = false,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const borderWidth = borderWidthProp ?? (vertical ? 1 : 0.5);\n const fontColor = theme.palette.text.weak;\n const borderColor = selectBorderColor(theme, variant, vertical);\n const marginSize = theme.spacing(1);\n const insetSize = theme.spacing(inset);\n\n const marginLeft = marginSize;\n const marginRight = marginSize;\n const marginTop = marginSize;\n const marginBottom = marginSize;\n\n const marginStyle = vertical\n ? { marginLeft, marginRight }\n : { marginTop, marginBottom };\n\n const insetStyle = vertical\n ? { marginTop: insetSize, marginBottom: insetSize }\n : { marginLeft: insetSize, marginRight: insetSize };\n\n const borderColorStyle = { borderColor };\n const borderWidthStyle = (vertical ? { borderRightWidth: borderWidth } : { borderBottomWidth: borderWidth });\n\n const containerStyle = css([\n insetStyle,\n marginStyle,\n styles.container,\n vertical ? styles.column : styles.row,\n childrenProp ? undefined : borderColorStyle,\n childrenProp ? undefined : borderWidthStyle,\n style,\n ]);\n\n const dividerStyle = css([\n borderColorStyle,\n borderWidthStyle,\n styles.divider,\n ]);\n\n const dividerMarginSize = theme.spacing(marginBetweenChildren);\n const startDividerStyle: ExtendedStyle = {\n display: elementAlign !== 'start' ? 'flex' : 'none',\n ...(vertical ? { marginBottom: dividerMarginSize } : { marginRight: dividerMarginSize }),\n };\n const endDividerStyle: ExtendedStyle = {\n display: elementAlign !== 'end' ? 'flex' : 'none',\n ...(vertical ? { marginTop: dividerMarginSize } : { marginLeft: dividerMarginSize }),\n };\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.caption2.medium,\n color: fontColor,\n });\n\n const element = typeof childrenProp === 'string'\n ? <Text style={css(fontStyle)}>{childrenProp}</Text>\n : childrenProp;\n\n const children = childrenProp ? (\n <React.Fragment>\n <View style={css([dividerStyle, startDividerStyle])}/>\n {element}\n <View style={css([dividerStyle, endDividerStyle])}/>\n </React.Fragment>\n ) : null;\n\n return (\n <View\n style={containerStyle}\n {...otherProps}\n >\n {children}\n </View>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AAEA,SAASC,YAAT,QAA6B,qBAA7B;AACA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,UAA/B,EAA2CC,QAA3C,QAA2D,WAA3D;AAKA,MAAMC,MAAM,GAAGF,UAAU,CAACG,MAAX,CAAkB;EAC7BC,SAAS,EAAE;IACPC,SAAS,EAAE,SADJ;IAEPC,UAAU,EAAE;EAFL,CADkB;EAK7BC,GAAG,EAAE;IACDC,aAAa,EAAE;EADd,CALwB;EAQ7BC,MAAM,EAAE;IACJD,aAAa,EAAE;EADX,CARqB;EAW7BE,OAAO,EAAE;IACLC,QAAQ,EAAE;EADL;AAXoB,CAAlB,CAAf;;AAgBA,SAASC,iBAAT,CAA2BC,KAA3B,EAAyCC,OAAzC,EAAkEC,QAAlE,EAAqF;EACjF,QAAQD,OAAR;IACI;IACA,KAAK,MAAL;MACI,OAAOC,QAAQ,GAAGF,KAAK,CAACG,OAAN,CAAcC,MAAd,CAAqBC,MAAxB,GAAiCL,KAAK,CAACG,OAAN,CAAcC,MAAd,CAAqBE,IAArE;;IACJ,KAAK,QAAL;MACI,OAAOJ,QAAQ,GAAGF,KAAK,CAACG,OAAN,CAAcC,MAAd,CAAqBE,IAAxB,GAA+BN,KAAK,CAACG,OAAN,CAAcC,MAAd,CAAqBG,IAAnE;;IACJ,KAAK,cAAL;MACI,OAAOvB,YAAY,CAACwB,OAAb,CAAqBC,KAArB,CAA2B,IAA3B,CAAP;;IACJ,KAAK,YAAL;MACI,OAAOzB,YAAY,CAACwB,OAAb,CAAqBC,KAArB,CAA2B,IAA3B,CAAP;EATR;AAWH;;AAED,eAAe,SAASC,OAAT,CAAiBC,KAAjB,EAAsC;EACjD,MAAM;IACFC,WAAW,EAAEC,eADX;IAEFC,QAAQ,EAAEC,YAFR;IAGFC,YAAY,GAAG,QAHb;IAIFC,KAAK,GAAG,CAJN;IAKFC,qBAAqB,GAAG,CALtB;IAMFC,KANE;IAOFlB,OAAO,GAAG,MAPR;IAQFC,QAAQ,GAAG,KART;IASF,GAAGkB;EATD,IAUFT,KAVJ;EAYA,MAAMX,KAAK,GAAGZ,QAAQ,EAAtB;EAEA,MAAMwB,WAAW,GAAGC,eAAe,KAAKX,QAAQ,GAAG,CAAH,GAAO,GAApB,CAAnC;EACA,MAAMmB,SAAS,GAAGrB,KAAK,CAACG,OAAN,CAAcmB,IAAd,CAAmBhB,IAArC;EACA,MAAMiB,WAAW,GAAGxB,iBAAiB,CAACC,KAAD,EAAQC,OAAR,EAAiBC,QAAjB,CAArC;EACA,MAAMsB,UAAU,GAAGxB,KAAK,CAACyB,OAAN,CAAc,CAAd,CAAnB;EACA,MAAMC,SAAS,GAAG1B,KAAK,CAACyB,OAAN,CAAcR,KAAd,CAAlB;EAEA,MAAMU,UAAU,GAAGH,UAAnB;EACA,MAAMI,WAAW,GAAGJ,UAApB;EACA,MAAMK,SAAS,GAAGL,UAAlB;EACA,MAAMM,YAAY,GAAGN,UAArB;EAEA,MAAMO,WAAW,GAAG7B,QAAQ,GACtB;IAAEyB,UAAF;IAAcC;EAAd,CADsB,GAEtB;IAAEC,SAAF;IAAaC;EAAb,CAFN;EAIA,MAAME,UAAU,GAAG9B,QAAQ,GACrB;IAAE2B,SAAS,EAAEH,SAAb;IAAwBI,YAAY,EAAEJ;EAAtC,CADqB,GAErB;IAAEC,UAAU,EAAED,SAAd;IAAyBE,WAAW,EAAEF;EAAtC,CAFN;EAIA,MAAMO,gBAAgB,GAAG;IAAEV;EAAF,CAAzB;EACA,MAAMW,gBAAgB,GAAIhC,QAAQ,GAAG;IAAEiC,gBAAgB,EAAEvB;EAApB,CAAH,GAAuC;IAAEwB,iBAAiB,EAAExB;EAArB,CAAzE;EAEA,MAAMyB,cAAc,GAAGnD,GAAG,CAAC,CACvB8C,UADuB,EAEvBD,WAFuB,EAGvB1C,MAAM,CAACE,SAHgB,EAIvBW,QAAQ,GAAGb,MAAM,CAACO,MAAV,GAAmBP,MAAM,CAACK,GAJX,EAKvBqB,YAAY,GAAGuB,SAAH,GAAeL,gBALJ,EAMvBlB,YAAY,GAAGuB,SAAH,GAAeJ,gBANJ,EAOvBf,KAPuB,CAAD,CAA1B;EAUA,MAAMoB,YAAY,GAAGrD,GAAG,CAAC,CACrB+C,gBADqB,EAErBC,gBAFqB,EAGrB7C,MAAM,CAACQ,OAHc,CAAD,CAAxB;EAMA,MAAM2C,iBAAiB,GAAGxC,KAAK,CAACyB,OAAN,CAAcP,qBAAd,CAA1B;EACA,MAAMuB,iBAAgC,GAAG;IACrCC,OAAO,EAAE1B,YAAY,KAAK,OAAjB,GAA2B,MAA3B,GAAoC,MADR;IAErC,IAAId,QAAQ,GAAG;MAAE4B,YAAY,EAAEU;IAAhB,CAAH,GAAyC;MAAEZ,WAAW,EAAEY;IAAf,CAArD;EAFqC,CAAzC;EAIA,MAAMG,eAA8B,GAAG;IACnCD,OAAO,EAAE1B,YAAY,KAAK,KAAjB,GAAyB,MAAzB,GAAkC,MADR;IAEnC,IAAId,QAAQ,GAAG;MAAE2B,SAAS,EAAEW;IAAb,CAAH,GAAsC;MAAEb,UAAU,EAAEa;IAAd,CAAlD;EAFmC,CAAvC;EAKA,MAAMI,SAAS,GAAG3D,eAAe,CAACe,KAAD,EAAQ;IACrC6C,QAAQ,EAAGC,IAAD,IAAUA,IAAI,CAACC,QAAL,CAAcC,MADG;IAErCC,KAAK,EAAE5B;EAF8B,CAAR,CAAjC;EAKA,MAAM6B,OAAO,GAAG,OAAOnC,YAAP,KAAwB,QAAxB,gBACV,oBAAC,IAAD;IAAM,KAAK,EAAE7B,GAAG,CAAC0D,SAAD;EAAhB,GAA8B7B,YAA9B,CADU,GAEVA,YAFN;EAIA,MAAMD,QAAQ,GAAGC,YAAY,gBACzB,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,IAAD;IAAM,KAAK,EAAE7B,GAAG,CAAC,CAACqD,YAAD,EAAeE,iBAAf,CAAD;EAAhB,EADJ,EAEKS,OAFL,eAGI,oBAAC,IAAD;IAAM,KAAK,EAAEhE,GAAG,CAAC,CAACqD,YAAD,EAAeI,eAAf,CAAD;EAAhB,EAHJ,CADyB,GAMzB,IANJ;EAQA,oBACI,oBAAC,IAAD;IACI,KAAK,EAAEN;EADX,GAEQjB,UAFR,GAIKN,QAJL,CADJ;AAQH;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["dividerElementAligns","dividerVariants"],"sources":["DividerProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport const dividerElementAligns = ['start', 'center', 'end'] as const;\nexport type DividerElementAlign = typeof dividerElementAligns[number];\n\nexport const dividerVariants = ['base', 'strong'] as const;\nexport type DividerVariant = typeof dividerVariants[number];\n\nexport default interface DividerProps extends OverridableComponentProps<ViewProps, {\n /**\n * The content of the component.\n */\n children?: React.ReactNode;\n\n /**\n * The size of the inset. It works as a multiplier factor based on spacing system.\n * @default 0\n */\n inset?: number;\n\n /**\n * If `true`, the divider orientation is set to vertical.\n * @default false\n */\n vertical?: boolean;\n\n /**\n * The size of margin between child element and the divider. It works as a multiplier factor based on spacing system.\n * @default 2\n */\n marginBetweenChildren?: number;\n\n /**\n * The size of border width. It works as an actual pixel-based border width value of a divider.\n * @default if vertical is true 1, otherwise 0.5\n */\n borderWidth?: number;\n\n /**\n * Set position of children.\n * @default center\n */\n elementAlign?: DividerElementAlign;\n\n /**\n * Select the style of the divider based on this value.\n * @default base\n */\n variant?: DividerVariant;\n}> {}\n"],"mappings":"AAIA,OAAO,MAAMA,oBAAoB,GAAG,CAAC,OAAD,EAAU,QAAV,EAAoB,KAApB,CAA7B;AAGP,OAAO,MAAMC,eAAe,GAAG,CAAC,MAAD,EAAS,QAAT,CAAxB"}
|
|
1
|
+
{"version":3,"names":["dividerElementAligns","dividerVariants"],"sources":["DividerProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport const dividerElementAligns = ['start', 'center', 'end'] as const;\nexport type DividerElementAlign = typeof dividerElementAligns[number];\n\nexport const dividerVariants = ['base', 'strong', 'baseStatic', 'strongStatic'] as const;\nexport type DividerVariant = typeof dividerVariants[number];\n\nexport default interface DividerProps extends OverridableComponentProps<ViewProps, {\n /**\n * The content of the component.\n */\n children?: React.ReactNode;\n\n /**\n * The size of the inset. It works as a multiplier factor based on spacing system.\n * @default 0\n */\n inset?: number;\n\n /**\n * If `true`, the divider orientation is set to vertical.\n * @default false\n */\n vertical?: boolean;\n\n /**\n * The size of margin between child element and the divider. It works as a multiplier factor based on spacing system.\n * @default 2\n */\n marginBetweenChildren?: number;\n\n /**\n * The size of border width. It works as an actual pixel-based border width value of a divider.\n * @default if vertical is true 1, otherwise 0.5\n */\n borderWidth?: number;\n\n /**\n * Set position of children.\n * @default center\n */\n elementAlign?: DividerElementAlign;\n\n /**\n * Select the style of the divider based on this value.\n * @default base\n */\n variant?: DividerVariant;\n}> {}\n"],"mappings":"AAIA,OAAO,MAAMA,oBAAoB,GAAG,CAAC,OAAD,EAAU,QAAV,EAAoB,KAApB,CAA7B;AAGP,OAAO,MAAMC,eAAe,GAAG,CAAC,MAAD,EAAS,QAAT,EAAmB,YAAnB,EAAiC,cAAjC,CAAxB"}
|
|
@@ -42,7 +42,7 @@ export default function Empty(props) {
|
|
|
42
42
|
color: theme.palette.text.strong
|
|
43
43
|
});
|
|
44
44
|
const descriptionFontStyle = createFontStyle(theme, {
|
|
45
|
-
selector: typography => typography.
|
|
45
|
+
selector: typography => typography.body3.regular,
|
|
46
46
|
color: theme.palette.text.base
|
|
47
47
|
});
|
|
48
48
|
return /*#__PURE__*/React.createElement(Column, _extends({
|