@fountain-ui/core 3.0.0-alpha.5 → 3.0.0-alpha.50
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 +13 -6
- 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/AspectRatio/AspectRatioNative.js +1 -1
- package/build/commonjs/AspectRatio/AspectRatioNative.js.map +1 -1
- package/build/commonjs/AspectRatio/AspectRatioWeb.js +1 -1
- package/build/commonjs/AspectRatio/AspectRatioWeb.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/BottomSheetTitle/BottomSheetTitle.js +7 -3
- 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 +18 -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 +27 -14
- package/build/commonjs/Chip/Chip.js.map +1 -1
- package/build/commonjs/Chip/ChipProps.js +5 -1
- package/build/commonjs/Chip/ChipProps.js.map +1 -1
- package/build/commonjs/Chip/index.js +12 -0
- package/build/commonjs/Chip/index.js.map +1 -1
- package/build/commonjs/Chip/useChipStyle.js +59 -32
- package/build/commonjs/Chip/useChipStyle.js.map +1 -1
- package/build/commonjs/Dialog/Dialog.js +11 -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 +13 -4
- package/build/commonjs/Image/Image.js.map +1 -1
- package/build/commonjs/Image/ImageProps.js.map +1 -1
- package/build/commonjs/Image/OverlayCloseButton/OverlayCloseButton.js +46 -0
- package/build/commonjs/Image/OverlayCloseButton/OverlayCloseButton.js.map +1 -0
- package/build/commonjs/Image/OverlayCloseButton/OverlayCloseButtonProps.js +2 -0
- package/build/commonjs/Image/OverlayCloseButton/OverlayCloseButtonProps.js.map +1 -0
- package/build/commonjs/Image/OverlayCloseButton/index.js +16 -0
- package/build/commonjs/Image/OverlayCloseButton/index.js.map +1 -0
- package/build/commonjs/Image/preload.js +10 -0
- package/build/commonjs/Image/preload.js.map +1 -0
- package/build/commonjs/Image/preload.native.js +22 -0
- package/build/commonjs/Image/preload.native.js.map +1 -0
- package/build/commonjs/ImageCore/ImageCoreNative.js +13 -10
- package/build/commonjs/ImageCore/ImageCoreNative.js.map +1 -1
- package/build/commonjs/ImageCore/ImageCoreProps.js.map +1 -1
- package/build/commonjs/ListItem/ListItem.js +5 -15
- package/build/commonjs/ListItem/ListItem.js.map +1 -1
- package/build/commonjs/ListItemText/ListItemText.js +2 -2
- package/build/commonjs/ListItemText/ListItemText.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 +29 -20
- package/build/commonjs/Modal/Modal.js.map +1 -1
- package/build/commonjs/Modal/ModalProps.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 +31 -8
- package/build/commonjs/Radio/Radio.js.map +1 -1
- package/build/commonjs/Radio/RadioProps.js.map +1 -1
- package/build/commonjs/RadioGroup/RadioGroup.js +2 -27
- package/build/commonjs/RadioGroup/RadioGroup.js.map +1 -1
- package/build/commonjs/ShadowView/ShadowView.native.js +1 -1
- package/build/commonjs/ShadowView/ShadowView.native.js.map +1 -1
- package/build/commonjs/Slider/Slider.js +22 -18
- package/build/commonjs/Slider/Slider.js.map +1 -1
- package/build/commonjs/SnackbarContent/SnackbarContent.js +24 -7
- 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 +57 -16
- 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 +32 -11
- 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 +99 -17
- package/build/commonjs/TextField/TextField.js.map +1 -1
- package/build/commonjs/TextField/TextFieldProps.js +3 -1
- package/build/commonjs/TextField/TextFieldProps.js.map +1 -1
- package/build/commonjs/TextField/useVariantStyleMap.js +50 -30
- 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 +23 -23
- 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/useCollapsibleAppBar.js +21 -13
- package/build/commonjs/hooks/useCollapsibleAppBar.js.map +1 -1
- package/build/commonjs/hooks/useContentContainerStyle.js +35 -17
- 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/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/CloseCircleFillPierced.js +23 -0
- package/build/commonjs/internal/icons/CloseCircleFillPierced.js.map +1 -0
- 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 +24 -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 +13 -6
- 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/AspectRatio/AspectRatioNative.js +1 -1
- package/build/module/AspectRatio/AspectRatioNative.js.map +1 -1
- package/build/module/AspectRatio/AspectRatioWeb.js +1 -1
- package/build/module/AspectRatio/AspectRatioWeb.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/BottomSheetTitle/BottomSheetTitle.js +7 -3
- 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 +18 -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 +23 -13
- package/build/module/Chip/Chip.js.map +1 -1
- package/build/module/Chip/ChipProps.js +2 -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 +59 -32
- package/build/module/Chip/useChipStyle.js.map +1 -1
- package/build/module/Dialog/Dialog.js +11 -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 +11 -4
- package/build/module/Image/Image.js.map +1 -1
- package/build/module/Image/ImageProps.js.map +1 -1
- package/build/module/Image/OverlayCloseButton/OverlayCloseButton.js +31 -0
- package/build/module/Image/OverlayCloseButton/OverlayCloseButton.js.map +1 -0
- package/build/module/Image/OverlayCloseButton/OverlayCloseButtonProps.js +2 -0
- package/build/module/Image/OverlayCloseButton/OverlayCloseButtonProps.js.map +1 -0
- package/build/module/Image/OverlayCloseButton/index.js +2 -0
- package/build/module/Image/OverlayCloseButton/index.js.map +1 -0
- package/build/module/Image/preload.js +3 -0
- package/build/module/Image/preload.js.map +1 -0
- package/build/module/Image/preload.native.js +12 -0
- package/build/module/Image/preload.native.js.map +1 -0
- package/build/module/ImageCore/ImageCoreNative.js +14 -10
- package/build/module/ImageCore/ImageCoreNative.js.map +1 -1
- package/build/module/ImageCore/ImageCoreProps.js.map +1 -1
- package/build/module/ListItem/ListItem.js +5 -15
- package/build/module/ListItem/ListItem.js.map +1 -1
- package/build/module/ListItemText/ListItemText.js +2 -2
- package/build/module/ListItemText/ListItemText.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 +30 -21
- package/build/module/Modal/Modal.js.map +1 -1
- package/build/module/Modal/ModalProps.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 +28 -8
- package/build/module/Radio/Radio.js.map +1 -1
- package/build/module/Radio/RadioProps.js.map +1 -1
- package/build/module/RadioGroup/RadioGroup.js +2 -20
- package/build/module/RadioGroup/RadioGroup.js.map +1 -1
- package/build/module/ShadowView/ShadowView.native.js +2 -2
- package/build/module/ShadowView/ShadowView.native.js.map +1 -1
- package/build/module/Slider/Slider.js +22 -18
- package/build/module/Slider/Slider.js.map +1 -1
- package/build/module/SnackbarContent/SnackbarContent.js +24 -7
- 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 +57 -16
- 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 +31 -12
- 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 +99 -18
- package/build/module/TextField/TextField.js.map +1 -1
- package/build/module/TextField/TextFieldProps.js +1 -0
- package/build/module/TextField/TextFieldProps.js.map +1 -1
- package/build/module/TextField/useVariantStyleMap.js +49 -30
- 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 +17 -16
- 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/useCollapsibleAppBar.js +22 -13
- package/build/module/hooks/useCollapsibleAppBar.js.map +1 -1
- package/build/module/hooks/useContentContainerStyle.js +32 -13
- 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/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/CloseCircleFillPierced.js +9 -0
- package/build/module/internal/icons/CloseCircleFillPierced.js.map +1 -0
- 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 +3 -0
- package/build/module/internal/icons/index.js.map +1 -1
- package/build/typescript/Accordion/Accordion.d.ts +0 -1
- package/build/typescript/Accordion/AccordionProps.d.ts +4 -1
- package/build/typescript/Accordion/useVariantStyleMap.d.ts +1 -0
- package/build/typescript/AspectRatio/AspectRatioNative.d.ts +0 -1
- package/build/typescript/AspectRatio/AspectRatioWeb.d.ts +0 -1
- package/build/typescript/Avatar/Avatar.d.ts +0 -1
- package/build/typescript/Badge/Badge.d.ts +0 -1
- package/build/typescript/Badge/BadgeProps.d.ts +10 -5
- package/build/typescript/BottomSheetActions/BottomSheetActions.d.ts +0 -1
- package/build/typescript/BottomSheetContent/BottomSheetContent.d.ts +0 -1
- package/build/typescript/BottomSheetTitle/BottomSheetTitle.d.ts +0 -1
- package/build/typescript/BottomSheetTitle/BottomSheetTitleProps.d.ts +3 -3
- package/build/typescript/Button/Button.d.ts +0 -1
- package/build/typescript/Button/ButtonProps.d.ts +5 -0
- package/build/typescript/ButtonBase/ButtonBase.d.ts +0 -1
- package/build/typescript/ButtonBase/index.d.ts +1 -1
- package/build/typescript/ButtonSet/ButtonSet.d.ts +0 -1
- package/build/typescript/Card/Card.d.ts +0 -1
- package/build/typescript/CardActions/CardActions.d.ts +0 -1
- package/build/typescript/CardContent/CardContent.d.ts +0 -1
- package/build/typescript/CardMedia/CardMedia.d.ts +0 -1
- package/build/typescript/Checkbox/Checkbox.d.ts +0 -1
- package/build/typescript/Checkbox/useVariantStyleMap.d.ts +1 -0
- package/build/typescript/Chip/Chip.d.ts +0 -1
- package/build/typescript/Chip/ChipProps.d.ts +18 -4
- package/build/typescript/Chip/index.d.ts +2 -2
- package/build/typescript/Chip/useChipStyle.d.ts +6 -3
- package/build/typescript/CircularProgress/CircularProgress.d.ts +0 -1
- package/build/typescript/Column/Column.d.ts +0 -1
- package/build/typescript/Dialog/Dialog.d.ts +0 -1
- package/build/typescript/Dialog/DialogProps.d.ts +1 -6
- package/build/typescript/Dialog/useDialogSectionStyle.d.ts +1 -2
- package/build/typescript/Dialog/useDialogStyle.d.ts +1 -1
- package/build/typescript/DialogActions/DialogActions.d.ts +0 -1
- package/build/typescript/DialogContent/DialogContent.d.ts +0 -1
- package/build/typescript/DialogMedia/DialogMedia.d.ts +0 -1
- package/build/typescript/DialogTitle/DialogLargeTitle.d.ts +8 -0
- package/build/typescript/DialogTitle/DialogTitle.d.ts +6 -2
- package/build/typescript/Divider/Divider.d.ts +0 -1
- package/build/typescript/Divider/DividerProps.d.ts +1 -1
- package/build/typescript/Empty/Empty.d.ts +0 -1
- package/build/typescript/Fab/Fab.d.ts +0 -1
- package/build/typescript/Flexbox/Flexbox.d.ts +0 -1
- package/build/typescript/Flexbox/FlexboxProps.d.ts +4 -0
- package/build/typescript/IconButton/IconButton.d.ts +0 -1
- package/build/typescript/IconButton/IconButtonProps.d.ts +1 -1
- package/build/typescript/Image/Image.d.ts +6 -2
- package/build/typescript/Image/ImageProps.d.ts +6 -0
- package/build/typescript/Image/OverlayCloseButton/OverlayCloseButton.d.ts +2 -0
- package/build/typescript/Image/OverlayCloseButton/OverlayCloseButtonProps.d.ts +3 -0
- package/build/typescript/Image/OverlayCloseButton/index.d.ts +2 -0
- package/build/typescript/Image/preload.d.ts +2 -0
- package/build/typescript/Image/preload.native.d.ts +2 -0
- package/build/typescript/ImageCore/ImageCoreNative.d.ts +0 -1
- package/build/typescript/ImageCore/ImageCoreProps.d.ts +1 -0
- package/build/typescript/ImageCore/ImageCoreWeb.d.ts +0 -1
- package/build/typescript/Link/Link.d.ts +0 -1
- package/build/typescript/List/List.d.ts +0 -1
- package/build/typescript/ListItem/ListItem.d.ts +0 -1
- package/build/typescript/ListItemIcon/ListItemIcon.d.ts +0 -1
- package/build/typescript/ListItemSecondaryAction/ListItemSecondaryAction.d.ts +0 -1
- package/build/typescript/ListItemText/ListItemText.d.ts +0 -1
- package/build/typescript/ListSubheader/ListSubheader.d.ts +0 -1
- package/build/typescript/Menu/Menu.d.ts +0 -1
- package/build/typescript/MenuItem/MenuItem.d.ts +0 -1
- package/build/typescript/Modal/AnimatedContainer/index.d.ts +0 -1
- package/build/typescript/Modal/Modal.d.ts +0 -1
- package/build/typescript/Modal/ModalProps.d.ts +8 -0
- package/build/typescript/Pagination/NumberPagination.d.ts +0 -1
- package/build/typescript/Pagination/Pagination.d.ts +0 -1
- 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/Portal/Portal.d.ts +0 -1
- package/build/typescript/Radio/Radio.d.ts +0 -1
- package/build/typescript/Radio/RadioProps.d.ts +4 -0
- package/build/typescript/RadioGroup/RadioGroup.d.ts +0 -1
- package/build/typescript/Row/Row.d.ts +0 -1
- package/build/typescript/Section/Section.d.ts +0 -1
- package/build/typescript/ShadowView/ShadowView.d.ts +0 -1
- package/build/typescript/ShadowView/ShadowView.native.d.ts +0 -1
- package/build/typescript/Slide/Slide.d.ts +0 -1
- package/build/typescript/Slider/Slider.d.ts +1 -1
- package/build/typescript/Snackbar/Snackbar.d.ts +0 -1
- package/build/typescript/SnackbarContent/SnackbarContent.d.ts +0 -1
- package/build/typescript/SnackbarContent/StatusIcon.d.ts +0 -1
- package/build/typescript/Spacer/Spacer.d.ts +0 -1
- package/build/typescript/SvgIcon/SvgIcon.d.ts +0 -1
- package/build/typescript/Switch/Switch.d.ts +0 -1
- package/build/typescript/Tab/Tab.d.ts +0 -1
- 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/TabBase.d.ts +0 -1
- package/build/typescript/TabBase/TabBaseProps.d.ts +0 -5
- package/build/typescript/Tabs/ScrollableTabsView.d.ts +0 -1
- package/build/typescript/Tabs/TabIndicator.d.ts +0 -1
- 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/TextFieldProps.d.ts +13 -0
- package/build/typescript/TextField/useVariantStyleMap.d.ts +4 -2
- package/build/typescript/Toggle/Toggle.d.ts +0 -1
- package/build/typescript/Toolbar/BackButton/BackButton.d.ts +2 -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 -2
- package/build/typescript/Toolbar/ToolbarProps.d.ts +0 -5
- package/build/typescript/Tooltip/Beaks/Beak.d.ts +0 -1
- package/build/typescript/Tooltip/Beaks/HorizontalLargeBeak.d.ts +0 -1
- package/build/typescript/Tooltip/Beaks/HorizontalSmallBeak.d.ts +0 -1
- package/build/typescript/Tooltip/Beaks/VerticalLargeBeak.d.ts +0 -1
- package/build/typescript/Tooltip/Beaks/VerticalSmallBeak.d.ts +0 -1
- package/build/typescript/Tooltip/Beaks/index.d.ts +4 -0
- package/build/typescript/Tooltip/Tooltip.d.ts +0 -1
- 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/animated/AnimatedAppBar.d.ts +1 -2
- package/build/typescript/animated/AnimatedFlatList.d.ts +1 -2
- package/build/typescript/animated/AnimatedTypography.d.ts +1 -2
- package/build/typescript/hooks/useCollapsibleAppBar.d.ts +2 -1
- package/build/typescript/hooks/useContentContainerStyle.d.ts +2 -1
- package/build/typescript/internal/icons/AppBarChevronLeft.d.ts +358 -0
- package/build/typescript/internal/icons/Check.d.ts +300 -73
- package/build/typescript/internal/icons/CheckCircle.d.ts +300 -73
- package/build/typescript/internal/icons/Checkbox.d.ts +300 -73
- package/build/typescript/internal/icons/CheckboxChecked.d.ts +300 -73
- package/build/typescript/internal/icons/CheckboxOn.d.ts +300 -73
- package/build/typescript/internal/icons/ChevronDown.d.ts +300 -73
- package/build/typescript/internal/icons/ChevronLeft.d.ts +300 -73
- package/build/typescript/internal/icons/ChevronRight.d.ts +300 -73
- package/build/typescript/internal/icons/ChipClose.d.ts +358 -0
- package/build/typescript/internal/icons/CircularProgress.d.ts +0 -1
- package/build/typescript/internal/icons/Clear.d.ts +300 -73
- package/build/typescript/internal/icons/Close.d.ts +300 -73
- package/build/typescript/internal/icons/CloseCircleFillPierced.d.ts +358 -0
- package/build/typescript/internal/icons/EyeOff.d.ts +300 -73
- package/build/typescript/internal/icons/EyeOn.d.ts +300 -73
- package/build/typescript/internal/icons/InfoCircle.d.ts +300 -73
- package/build/typescript/internal/icons/LoadingSpinner/index.d.ts +0 -1
- package/build/typescript/internal/icons/LoadingSpinner/index.native.d.ts +0 -1
- package/build/typescript/internal/icons/Radio.d.ts +300 -73
- package/build/typescript/internal/icons/RadioChecked.d.ts +300 -73
- package/build/typescript/internal/icons/Search.d.ts +300 -73
- package/build/typescript/internal/icons/index.d.ts +3 -0
- package/package.json +10 -10
- package/src/Accordion/Accordion.tsx +23 -14
- package/src/Accordion/AccordionProps.ts +4 -2
- package/src/Accordion/useVariantStyleMap.ts +12 -4
- package/src/AppBar/AppBar.tsx +2 -2
- package/src/AspectRatio/AspectRatioNative.tsx +2 -2
- package/src/AspectRatio/AspectRatioWeb.tsx +3 -3
- package/src/Badge/Badge.tsx +4 -3
- package/src/Badge/BadgeProps.ts +12 -6
- package/src/BottomSheetTitle/BottomSheetTitle.tsx +6 -2
- package/src/BottomSheetTitle/BottomSheetTitleProps.ts +3 -3
- package/src/Button/Button.tsx +28 -12
- package/src/Button/ButtonProps.ts +6 -0
- package/src/Button/useVariantStyleMap.ts +18 -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 +27 -13
- package/src/Chip/ChipProps.ts +22 -4
- package/src/Chip/index.ts +2 -2
- package/src/Chip/useChipStyle.ts +75 -29
- package/src/Dialog/Dialog.tsx +13 -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 +13 -4
- package/src/Image/ImageProps.ts +7 -0
- package/src/Image/OverlayCloseButton/OverlayCloseButton.tsx +41 -0
- package/src/Image/OverlayCloseButton/OverlayCloseButtonProps.ts +3 -0
- package/src/Image/OverlayCloseButton/index.ts +2 -0
- package/src/Image/preload.native.ts +6 -0
- package/src/Image/preload.ts +5 -0
- package/src/ImageCore/ImageCoreNative.tsx +13 -10
- package/src/ImageCore/ImageCoreProps.ts +1 -0
- package/src/ListItem/ListItem.tsx +5 -15
- package/src/ListItemText/ListItemText.tsx +2 -2
- package/src/ListSubheader/ListSubheader.tsx +1 -1
- package/src/Modal/Modal.tsx +12 -4
- package/src/Modal/ModalProps.ts +9 -0
- 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 +46 -17
- package/src/Radio/RadioProps.ts +6 -0
- package/src/RadioGroup/RadioGroup.tsx +2 -28
- package/src/ShadowView/ShadowView.native.tsx +2 -2
- package/src/Slider/Slider.tsx +1 -0
- package/src/SnackbarContent/SnackbarContent.tsx +35 -14
- 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 +70 -17
- package/src/TabBase/TabBase.tsx +1 -9
- package/src/TabBase/TabBaseProps.ts +0 -6
- package/src/Tabs/Tabs.tsx +40 -13
- 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 +142 -47
- package/src/TextField/TextFieldProps.ts +16 -0
- package/src/TextField/useVariantStyleMap.ts +57 -30
- package/src/Toolbar/BackButton/BackButton.tsx +42 -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 +16 -13
- 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/useCollapsibleAppBar.ts +27 -24
- package/src/hooks/useContentContainerStyle.ts +29 -12
- package/src/hooks/useFadeInAppBar.ts +4 -4
- 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/CloseCircleFillPierced.tsx +13 -0
- package/src/internal/icons/Search.tsx +2 -2
- package/src/internal/icons/index.ts +3 -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":["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 avoidKeyboard={size !== 'full'}\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":"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"}
|
|
@@ -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({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Text","Button","Column","Spacer","createFontStyle","css","useTheme","cloneElementSafely","useStyles","theme","root","alignItems","flex","justifyContent","paddingHorizontal","spacing","cta","alignSelf","Empty","props","buttonTitle","description","headerContent","headerContentProp","onButtonPress","style","styleProp","title","otherProps","styles","rootStyle","titleFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","descriptionFontStyle","
|
|
1
|
+
{"version":3,"names":["React","Text","Button","Column","Spacer","createFontStyle","css","useTheme","cloneElementSafely","useStyles","theme","root","alignItems","flex","justifyContent","paddingHorizontal","spacing","cta","alignSelf","Empty","props","buttonTitle","description","headerContent","headerContentProp","onButtonPress","style","styleProp","title","otherProps","styles","rootStyle","titleFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","descriptionFontStyle","body3","regular","base"],"sources":["Empty.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Button from '../Button/Button';\nimport Column from '../Column';\nimport Spacer from '../Spacer';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type { FalsyReactElement } from '../utils';\nimport { cloneElementSafely } from '../utils';\nimport type EmptyProps from './EmptyProps';\n\ntype EmptyStyles = NamedStylesStringUnion<'root' | 'cta'>;\n\nconst useStyles: UseStyles<EmptyStyles> = function (): EmptyStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'center',\n flex: 1,\n justifyContent: 'center',\n paddingHorizontal: theme.spacing(5),\n },\n cta: {\n alignSelf: 'center',\n },\n };\n};\n\nexport default function Empty(props: EmptyProps) {\n const {\n buttonTitle,\n description,\n headerContent: headerContentProp,\n onButtonPress,\n style: styleProp,\n title,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const rootStyle = css([\n styles.root,\n styleProp,\n ]);\n\n const headerContent = cloneElementSafely(headerContentProp as FalsyReactElement);\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.header3.semiBold,\n color: theme.palette.text.strong,\n });\n\n const descriptionFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.body3.regular,\n color: theme.palette.text.base,\n });\n\n return (\n <Column\n style={rootStyle}\n {...otherProps}\n >\n {headerContent ? (\n <React.Fragment>\n {headerContent}\n\n <Spacer size={6}/>\n </React.Fragment>\n ) : null}\n\n <Text\n children={title}\n style={titleFontStyle}\n />\n\n {description ? (\n <React.Fragment>\n <Spacer size={2}/>\n\n <Text\n children={description}\n style={descriptionFontStyle}\n />\n </React.Fragment>\n ) : null}\n\n {buttonTitle && onButtonPress ? (\n <React.Fragment>\n <Spacer size={6}/>\n\n <Button\n children={buttonTitle}\n color={'accent'}\n onPress={onButtonPress}\n style={styles.cta}\n variant={'capsuleSolid'}\n />\n </React.Fragment>\n ) : null}\n </Column>\n );\n}\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,OAAOC,MAAP,MAAmB,kBAAnB;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,QAA/B,QAA+C,WAA/C;AAEA,SAASC,kBAAT,QAAmC,UAAnC;;AAKA,MAAMC,SAAiC,GAAG,YAAyB;EAC/D,MAAMC,KAAK,GAAGH,QAAQ,EAAtB;EAEA,OAAO;IACHI,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,IAAI,EAAE,CAFJ;MAGFC,cAAc,EAAE,QAHd;MAIFC,iBAAiB,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IAJjB,CADH;IAOHC,GAAG,EAAE;MACDC,SAAS,EAAE;IADV;EAPF,CAAP;AAWH,CAdD;;AAgBA,eAAe,SAASC,KAAT,CAAeC,KAAf,EAAkC;EAC7C,MAAM;IACFC,WADE;IAEFC,WAFE;IAGFC,aAAa,EAAEC,iBAHb;IAIFC,aAJE;IAKFC,KAAK,EAAEC,SALL;IAMFC,KANE;IAOF,GAAGC;EAPD,IAQFT,KARJ;EAUA,MAAMU,MAAM,GAAGrB,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAGH,QAAQ,EAAtB;EAEA,MAAMwB,SAAS,GAAGzB,GAAG,CAAC,CAClBwB,MAAM,CAACnB,IADW,EAElBgB,SAFkB,CAAD,CAArB;EAKA,MAAMJ,aAAa,GAAGf,kBAAkB,CAACgB,iBAAD,CAAxC;EAEA,MAAMQ,cAAc,GAAG3B,eAAe,CAACK,KAAD,EAAQ;IAC1CuB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAE3B,KAAK,CAAC4B,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAR,CAAtC;EAKA,MAAMC,oBAAoB,GAAGpC,eAAe,CAACK,KAAD,EAAQ;IAChDuB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACQ,KAAX,CAAiBC,OADK;IAEhDN,KAAK,EAAE3B,KAAK,CAAC4B,OAAN,CAAcC,IAAd,CAAmBK;EAFsB,CAAR,CAA5C;EAKA,oBACI,oBAAC,MAAD;IACI,KAAK,EAAEb;EADX,GAEQF,UAFR,GAIKN,aAAa,gBACV,oBAAC,KAAD,CAAO,QAAP,QACKA,aADL,eAGI,oBAAC,MAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADU,GAMV,IAVR,eAYI,oBAAC,IAAD;IACI,QAAQ,EAAEK,KADd;IAEI,KAAK,EAAEI;EAFX,EAZJ,EAiBKV,WAAW,gBACR,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,MAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,oBAAC,IAAD;IACI,QAAQ,EAAEA,WADd;IAEI,KAAK,EAAEmB;EAFX,EAHJ,CADQ,GASR,IA1BR,EA4BKpB,WAAW,IAAII,aAAf,gBACG,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,MAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,oBAAC,MAAD;IACI,QAAQ,EAAEJ,WADd;IAEI,KAAK,EAAE,QAFX;IAGI,OAAO,EAAEI,aAHb;IAII,KAAK,EAAEK,MAAM,CAACb,GAJlB;IAKI,OAAO,EAAE;EALb,EAHJ,CADH,GAYG,IAxCR,CADJ;AA4CH"}
|
|
@@ -32,6 +32,7 @@ export default function createFlexbox(direction) {
|
|
|
32
32
|
flexGrow,
|
|
33
33
|
flexShrink,
|
|
34
34
|
flexWrap,
|
|
35
|
+
gap,
|
|
35
36
|
children,
|
|
36
37
|
insets,
|
|
37
38
|
justifyContent,
|
|
@@ -49,6 +50,7 @@ export default function createFlexbox(direction) {
|
|
|
49
50
|
flexGrow,
|
|
50
51
|
flexShrink,
|
|
51
52
|
flexWrap,
|
|
53
|
+
gap,
|
|
52
54
|
justifyContent,
|
|
53
55
|
overflow
|
|
54
56
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","View","css","StyleSheet","useTheme","styles","create","row","flexDirection","column","rowReverse","columnReverse","createFlexbox","direction","forwardDirection","reverseDirection","Flexbox","props","theme","spacing","alignContent","alignItems","alignSelf","flexBasis","flexGrow","flexShrink","flexWrap","children","insets","justifyContent","overflow","reversed","style","otherProps","propStyles","padding","undefined","paddingLeft","left","paddingTop","top","paddingRight","right","paddingBottom","bottom","displayName"],"sources":["Flexbox.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { css, StyleSheet, useTheme } from '../styles';\nimport type FlexboxProps from './FlexboxProps';\n\nconst styles = StyleSheet.create({\n row: { flexDirection: 'row' },\n column: { flexDirection: 'column' },\n rowReverse: { flexDirection: 'row-reverse' },\n columnReverse: { flexDirection: 'column-reverse' },\n});\n\nexport default function createFlexbox(direction: 'row' | 'column') {\n const forwardDirection = direction === 'row' ? styles.row : styles.column;\n const reverseDirection = direction === 'row' ? styles.rowReverse : styles.columnReverse;\n\n function Flexbox(props: FlexboxProps) {\n const theme = useTheme();\n\n const spacing = theme.spacing;\n\n const {\n alignContent,\n alignItems,\n alignSelf,\n flexBasis,\n flexGrow,\n flexShrink,\n flexWrap,\n children,\n insets,\n justifyContent,\n overflow,\n reversed,\n style,\n ...otherProps\n } = props;\n\n const direction = reversed ? reverseDirection : forwardDirection;\n\n const propStyles = {\n alignContent,\n alignItems,\n alignSelf,\n flexBasis,\n flexGrow,\n flexShrink,\n flexWrap,\n justifyContent,\n overflow,\n };\n\n const padding = insets !== undefined\n ? {\n paddingLeft: spacing(insets.left),\n paddingTop: spacing(insets.top),\n paddingRight: spacing(insets.right),\n paddingBottom: spacing(insets.bottom),\n }\n : undefined;\n\n return (\n <View\n children={children}\n style={css([\n direction,\n propStyles,\n padding,\n style,\n ])}\n {...otherProps}\n />\n );\n }\n\n Flexbox.displayName = direction === 'row' ? 'Row' : 'Column';\n\n return Flexbox;\n}\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AACA,SAASC,GAAT,EAAcC,UAAd,EAA0BC,QAA1B,QAA0C,WAA1C;AAGA,MAAMC,MAAM,GAAGF,UAAU,CAACG,MAAX,CAAkB;EAC7BC,GAAG,EAAE;IAAEC,aAAa,EAAE;EAAjB,CADwB;EAE7BC,MAAM,EAAE;IAAED,aAAa,EAAE;EAAjB,CAFqB;EAG7BE,UAAU,EAAE;IAAEF,aAAa,EAAE;EAAjB,CAHiB;EAI7BG,aAAa,EAAE;IAAEH,aAAa,EAAE;EAAjB;AAJc,CAAlB,CAAf;AAOA,eAAe,SAASI,aAAT,CAAuBC,SAAvB,EAAoD;EAC/D,MAAMC,gBAAgB,GAAGD,SAAS,KAAK,KAAd,GAAsBR,MAAM,CAACE,GAA7B,GAAmCF,MAAM,CAACI,MAAnE;EACA,MAAMM,gBAAgB,GAAGF,SAAS,KAAK,KAAd,GAAsBR,MAAM,CAACK,UAA7B,GAA0CL,MAAM,CAACM,aAA1E;;EAEA,SAASK,OAAT,CAAiBC,KAAjB,EAAsC;IAClC,MAAMC,KAAK,GAAGd,QAAQ,EAAtB;IAEA,MAAMe,OAAO,GAAGD,KAAK,CAACC,OAAtB;IAEA,MAAM;MACFC,YADE;MAEFC,UAFE;MAGFC,SAHE;MAIFC,SAJE;MAKFC,QALE;MAMFC,UANE;MAOFC,QAPE;MAQFC,
|
|
1
|
+
{"version":3,"names":["React","View","css","StyleSheet","useTheme","styles","create","row","flexDirection","column","rowReverse","columnReverse","createFlexbox","direction","forwardDirection","reverseDirection","Flexbox","props","theme","spacing","alignContent","alignItems","alignSelf","flexBasis","flexGrow","flexShrink","flexWrap","gap","children","insets","justifyContent","overflow","reversed","style","otherProps","propStyles","padding","undefined","paddingLeft","left","paddingTop","top","paddingRight","right","paddingBottom","bottom","displayName"],"sources":["Flexbox.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { css, StyleSheet, useTheme } from '../styles';\nimport type FlexboxProps from './FlexboxProps';\n\nconst styles = StyleSheet.create({\n row: { flexDirection: 'row' },\n column: { flexDirection: 'column' },\n rowReverse: { flexDirection: 'row-reverse' },\n columnReverse: { flexDirection: 'column-reverse' },\n});\n\nexport default function createFlexbox(direction: 'row' | 'column') {\n const forwardDirection = direction === 'row' ? styles.row : styles.column;\n const reverseDirection = direction === 'row' ? styles.rowReverse : styles.columnReverse;\n\n function Flexbox(props: FlexboxProps) {\n const theme = useTheme();\n\n const spacing = theme.spacing;\n\n const {\n alignContent,\n alignItems,\n alignSelf,\n flexBasis,\n flexGrow,\n flexShrink,\n flexWrap,\n gap,\n children,\n insets,\n justifyContent,\n overflow,\n reversed,\n style,\n ...otherProps\n } = props;\n\n const direction = reversed ? reverseDirection : forwardDirection;\n\n const propStyles = {\n alignContent,\n alignItems,\n alignSelf,\n flexBasis,\n flexGrow,\n flexShrink,\n flexWrap,\n gap,\n justifyContent,\n overflow,\n };\n\n const padding = insets !== undefined\n ? {\n paddingLeft: spacing(insets.left),\n paddingTop: spacing(insets.top),\n paddingRight: spacing(insets.right),\n paddingBottom: spacing(insets.bottom),\n }\n : undefined;\n\n return (\n <View\n children={children}\n style={css([\n direction,\n propStyles,\n padding,\n style,\n ])}\n {...otherProps}\n />\n );\n }\n\n Flexbox.displayName = direction === 'row' ? 'Row' : 'Column';\n\n return Flexbox;\n}\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AACA,SAASC,GAAT,EAAcC,UAAd,EAA0BC,QAA1B,QAA0C,WAA1C;AAGA,MAAMC,MAAM,GAAGF,UAAU,CAACG,MAAX,CAAkB;EAC7BC,GAAG,EAAE;IAAEC,aAAa,EAAE;EAAjB,CADwB;EAE7BC,MAAM,EAAE;IAAED,aAAa,EAAE;EAAjB,CAFqB;EAG7BE,UAAU,EAAE;IAAEF,aAAa,EAAE;EAAjB,CAHiB;EAI7BG,aAAa,EAAE;IAAEH,aAAa,EAAE;EAAjB;AAJc,CAAlB,CAAf;AAOA,eAAe,SAASI,aAAT,CAAuBC,SAAvB,EAAoD;EAC/D,MAAMC,gBAAgB,GAAGD,SAAS,KAAK,KAAd,GAAsBR,MAAM,CAACE,GAA7B,GAAmCF,MAAM,CAACI,MAAnE;EACA,MAAMM,gBAAgB,GAAGF,SAAS,KAAK,KAAd,GAAsBR,MAAM,CAACK,UAA7B,GAA0CL,MAAM,CAACM,aAA1E;;EAEA,SAASK,OAAT,CAAiBC,KAAjB,EAAsC;IAClC,MAAMC,KAAK,GAAGd,QAAQ,EAAtB;IAEA,MAAMe,OAAO,GAAGD,KAAK,CAACC,OAAtB;IAEA,MAAM;MACFC,YADE;MAEFC,UAFE;MAGFC,SAHE;MAIFC,SAJE;MAKFC,QALE;MAMFC,UANE;MAOFC,QAPE;MAQFC,GARE;MASFC,QATE;MAUFC,MAVE;MAWFC,cAXE;MAYFC,QAZE;MAaFC,QAbE;MAcFC,KAdE;MAeF,GAAGC;IAfD,IAgBFjB,KAhBJ;IAkBA,MAAMJ,SAAS,GAAGmB,QAAQ,GAAGjB,gBAAH,GAAsBD,gBAAhD;IAEA,MAAMqB,UAAU,GAAG;MACff,YADe;MAEfC,UAFe;MAGfC,SAHe;MAIfC,SAJe;MAKfC,QALe;MAMfC,UANe;MAOfC,QAPe;MAQfC,GARe;MASfG,cATe;MAUfC;IAVe,CAAnB;IAaA,MAAMK,OAAO,GAAGP,MAAM,KAAKQ,SAAX,GACV;MACEC,WAAW,EAAEnB,OAAO,CAACU,MAAM,CAACU,IAAR,CADtB;MAEEC,UAAU,EAAErB,OAAO,CAACU,MAAM,CAACY,GAAR,CAFrB;MAGEC,YAAY,EAAEvB,OAAO,CAACU,MAAM,CAACc,KAAR,CAHvB;MAIEC,aAAa,EAAEzB,OAAO,CAACU,MAAM,CAACgB,MAAR;IAJxB,CADU,GAOVR,SAPN;IASA,oBACI,oBAAC,IAAD;MACI,QAAQ,EAAET,QADd;MAEI,KAAK,EAAE1B,GAAG,CAAC,CACPW,SADO,EAEPsB,UAFO,EAGPC,OAHO,EAIPH,KAJO,CAAD;IAFd,GAQQC,UARR,EADJ;EAYH;;EAEDlB,OAAO,CAAC8B,WAAR,GAAsBjC,SAAS,KAAK,KAAd,GAAsB,KAAtB,GAA8B,QAApD;EAEA,OAAOG,OAAP;AACH"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["FlexboxProps.ts"],"sourcesContent":["import React from 'react';\nimport type { FlexStyle, ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\nimport type { EdgeInsetsType } from '../styles';\n\nexport default interface FlexboxProps extends OverridableComponentProps<ViewProps, {\n /**\n * Controls how rows align in the cross direction.\n * @default 'stretch'\n */\n alignContent?: FlexStyle['alignContent'];\n\n /**\n * Aligns children in the cross direction.\n * @default 'stretch'\n */\n alignItems?: FlexStyle['alignItems'];\n\n /**\n * Controls how a child aligns in the cross direction,\n * overriding the `alignItems` of the parent.\n * @default 'auto'\n */\n alignSelf?: FlexStyle['alignSelf'];\n\n /**\n * Providing the default size of an item along the main axis.\n */\n flexBasis?: FlexStyle['flexBasis'];\n\n /**\n * Describes how any space within a container should be distributed\n * among its children along the main axis.\n */\n flexGrow?: FlexStyle['flexGrow'];\n\n /**\n * Describes how to shrink children along the main axis in the case\n * in which the total size of the children overflows the size of the\n * container on the main axis.\n */\n flexShrink?: FlexStyle['flexShrink'];\n\n /**\n * Controls whether children can wrap around after they hit\n * the end of a flex container.\n * @default 'nowrap'\n */\n flexWrap?: FlexStyle['flexWrap'];\n\n /**\n * Content of this component.\n */\n children: React.ReactNode;\n\n /**\n * The amount of space by which to inset the child.\n */\n insets?: EdgeInsetsType;\n\n /**\n * Aligns children in the main direction.\n * @default 'flex-start'\n */\n justifyContent?: FlexStyle['justifyContent'];\n\n /**\n * Controls how children are measured and displayed.\n * @default 'visible'\n */\n overflow?: FlexStyle['overflow'];\n\n /**\n * Reverse flex direction.\n * @default false\n */\n reversed?: boolean;\n}> {}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"names":[],"sources":["FlexboxProps.ts"],"sourcesContent":["import React from 'react';\nimport type { FlexStyle, ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\nimport type { EdgeInsetsType } from '../styles';\n\nexport default interface FlexboxProps extends OverridableComponentProps<ViewProps, {\n /**\n * Controls how rows align in the cross direction.\n * @default 'stretch'\n */\n alignContent?: FlexStyle['alignContent'];\n\n /**\n * Aligns children in the cross direction.\n * @default 'stretch'\n */\n alignItems?: FlexStyle['alignItems'];\n\n /**\n * Controls how a child aligns in the cross direction,\n * overriding the `alignItems` of the parent.\n * @default 'auto'\n */\n alignSelf?: FlexStyle['alignSelf'];\n\n /**\n * Providing the default size of an item along the main axis.\n */\n flexBasis?: FlexStyle['flexBasis'];\n\n /**\n * Describes how any space within a container should be distributed\n * among its children along the main axis.\n */\n flexGrow?: FlexStyle['flexGrow'];\n\n /**\n * Describes how to shrink children along the main axis in the case\n * in which the total size of the children overflows the size of the\n * container on the main axis.\n */\n flexShrink?: FlexStyle['flexShrink'];\n\n /**\n * Controls whether children can wrap around after they hit\n * the end of a flex container.\n * @default 'nowrap'\n */\n flexWrap?: FlexStyle['flexWrap'];\n\n /**\n * Defines the spacing between items in a flex container.\n */\n gap?: number | undefined;\n\n /**\n * Content of this component.\n */\n children: React.ReactNode;\n\n /**\n * The amount of space by which to inset the child.\n */\n insets?: EdgeInsetsType;\n\n /**\n * Aligns children in the main direction.\n * @default 'flex-start'\n */\n justifyContent?: FlexStyle['justifyContent'];\n\n /**\n * Controls how children are measured and displayed.\n * @default 'visible'\n */\n overflow?: FlexStyle['overflow'];\n\n /**\n * Reverse flex direction.\n * @default false\n */\n reversed?: boolean;\n}> {}\n"],"mappings":""}
|
|
@@ -36,6 +36,9 @@ function selectIconColor(theme, color) {
|
|
|
36
36
|
case 'staticStrongInverse':
|
|
37
37
|
return commonColors.static.strongInverse;
|
|
38
38
|
|
|
39
|
+
case 'staticBaseOpacityInverse':
|
|
40
|
+
return commonColors.static.baseOpacityInverse;
|
|
41
|
+
|
|
39
42
|
case 'disabled':
|
|
40
43
|
return theme.palette.status.disabled;
|
|
41
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","StyleSheet","View","commonColors","ButtonBase","LoadingSpinner","css","useTheme","cloneElementSafely","styles","create","root","alignItems","height","justifyContent","width","loadingSpinner","position","loadingSpinnerSizeMap","small","medium","large","selectIconColor","theme","color","palette","icon","strong","base","static","strongInverse","status","disabled","IconButton","props","children","colorProp","onPress","iconSize","isLoading","style","otherProps","iconColor","enableV2","fill","size","rootStyle","contentStyle","opacity","loadingSpinnerStyle","handlePress"],"sources":["IconButton.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, View } from 'react-native';\nimport { commonColors, Theme } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { LoadingSpinner } from '../internal';\nimport { css, useTheme } from '../styles';\nimport type { SvgIconSize } from '../SvgIcon/SvgIconProps';\nimport { cloneElementSafely } from '../utils';\nimport type IconButtonProps from './IconButtonProps';\nimport type { IconButtonColor } from './IconButtonProps';\n\nconst styles = StyleSheet.create({\n root: {\n alignItems: 'center',\n height: 32,\n justifyContent: 'center',\n width: 32,\n },\n loadingSpinner: {\n position: 'absolute',\n },\n});\n\nconst loadingSpinnerSizeMap: Record<SvgIconSize, number> = {\n small: 14,\n medium: 16,\n large: 18,\n};\n\nfunction selectIconColor(theme: Theme, color: IconButtonColor) {\n switch (color) {\n default:\n case 'strong':\n return theme.palette.icon.strong;\n case 'base':\n return theme.palette.icon.base;\n case 'staticStrongInverse':\n return commonColors.static.strongInverse;\n case 'disabled':\n return theme.palette.status.disabled;\n }\n}\n\nexport default function IconButton(props: IconButtonProps) {\n const {\n children,\n color: colorProp = 'strong' as IconButtonColor,\n disabled = false,\n onPress,\n iconSize = 'medium' as SvgIconSize,\n isLoading = false,\n style,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const color: IconButtonColor = disabled ? 'disabled' : colorProp;\n const iconColor = selectIconColor(theme, color);\n\n const icon = cloneElementSafely(children, {\n enableV2: true,\n fill: iconColor,\n size: iconSize,\n });\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n const contentStyle = css({\n opacity: isLoading ? 0 : 1,\n });\n\n const loadingSpinnerStyle = css([\n styles.loadingSpinner,\n {\n height: loadingSpinnerSizeMap[iconSize],\n width: loadingSpinnerSizeMap[iconSize],\n },\n ]);\n\n const handlePress = () => {\n if (disabled) {\n return;\n }\n\n onPress?.();\n };\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n <View style={contentStyle}>\n {icon}\n </View>\n\n {isLoading ? (\n <LoadingSpinner style={loadingSpinnerStyle}/>\n ) : null}\n </ButtonBase>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,EAAqBC,IAArB,QAAiC,cAAjC;AACA,SAASC,YAAT,QAAoC,qBAApC;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,cAAT,QAA+B,aAA/B;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AAEA,SAASC,kBAAT,QAAmC,UAAnC;AAIA,MAAMC,MAAM,GAAGR,UAAU,CAACS,MAAX,CAAkB;EAC7BC,IAAI,EAAE;IACFC,UAAU,EAAE,QADV;IAEFC,MAAM,EAAE,EAFN;IAGFC,cAAc,EAAE,QAHd;IAIFC,KAAK,EAAE;EAJL,CADuB;EAO7BC,cAAc,EAAE;IACZC,QAAQ,EAAE;EADE;AAPa,CAAlB,CAAf;AAYA,MAAMC,qBAAkD,GAAG;EACvDC,KAAK,EAAE,EADgD;EAEvDC,MAAM,EAAE,EAF+C;EAGvDC,KAAK,EAAE;AAHgD,CAA3D;;AAMA,SAASC,eAAT,CAAyBC,KAAzB,EAAuCC,KAAvC,EAA+D;EAC3D,QAAQA,KAAR;IACI;IACA,KAAK,QAAL;MACI,OAAOD,KAAK,CAACE,OAAN,CAAcC,IAAd,CAAmBC,MAA1B;;IACJ,KAAK,MAAL;MACI,OAAOJ,KAAK,CAACE,OAAN,CAAcC,IAAd,CAAmBE,IAA1B;;IACJ,KAAK,qBAAL;MACI,OAAOzB,YAAY,CAAC0B,MAAb,CAAoBC,aAA3B;;IACJ,KAAK,UAAL;MACI,
|
|
1
|
+
{"version":3,"names":["React","StyleSheet","View","commonColors","ButtonBase","LoadingSpinner","css","useTheme","cloneElementSafely","styles","create","root","alignItems","height","justifyContent","width","loadingSpinner","position","loadingSpinnerSizeMap","small","medium","large","selectIconColor","theme","color","palette","icon","strong","base","static","strongInverse","baseOpacityInverse","status","disabled","IconButton","props","children","colorProp","onPress","iconSize","isLoading","style","otherProps","iconColor","enableV2","fill","size","rootStyle","contentStyle","opacity","loadingSpinnerStyle","handlePress"],"sources":["IconButton.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, View } from 'react-native';\nimport { commonColors, Theme } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { LoadingSpinner } from '../internal';\nimport { css, useTheme } from '../styles';\nimport type { SvgIconSize } from '../SvgIcon/SvgIconProps';\nimport { cloneElementSafely } from '../utils';\nimport type IconButtonProps from './IconButtonProps';\nimport type { IconButtonColor } from './IconButtonProps';\n\nconst styles = StyleSheet.create({\n root: {\n alignItems: 'center',\n height: 32,\n justifyContent: 'center',\n width: 32,\n },\n loadingSpinner: {\n position: 'absolute',\n },\n});\n\nconst loadingSpinnerSizeMap: Record<SvgIconSize, number> = {\n small: 14,\n medium: 16,\n large: 18,\n};\n\nfunction selectIconColor(theme: Theme, color: IconButtonColor) {\n switch (color) {\n default:\n case 'strong':\n return theme.palette.icon.strong;\n case 'base':\n return theme.palette.icon.base;\n case 'staticStrongInverse':\n return commonColors.static.strongInverse;\n case 'staticBaseOpacityInverse':\n return commonColors.static.baseOpacityInverse;\n case 'disabled':\n return theme.palette.status.disabled;\n }\n}\n\nexport default function IconButton(props: IconButtonProps) {\n const {\n children,\n color: colorProp = 'strong' as IconButtonColor,\n disabled = false,\n onPress,\n iconSize = 'medium' as SvgIconSize,\n isLoading = false,\n style,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const color: IconButtonColor = disabled ? 'disabled' : colorProp;\n const iconColor = selectIconColor(theme, color);\n\n const icon = cloneElementSafely(children, {\n enableV2: true,\n fill: iconColor,\n size: iconSize,\n });\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n const contentStyle = css({\n opacity: isLoading ? 0 : 1,\n });\n\n const loadingSpinnerStyle = css([\n styles.loadingSpinner,\n {\n height: loadingSpinnerSizeMap[iconSize],\n width: loadingSpinnerSizeMap[iconSize],\n },\n ]);\n\n const handlePress = () => {\n if (disabled) {\n return;\n }\n\n onPress?.();\n };\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n <View style={contentStyle}>\n {icon}\n </View>\n\n {isLoading ? (\n <LoadingSpinner style={loadingSpinnerStyle}/>\n ) : null}\n </ButtonBase>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export const iconButtonColors = ['strong', 'base', 'staticStrongInverse', 'disabled'];
|
|
1
|
+
export const iconButtonColors = ['strong', 'base', 'staticStrongInverse', 'staticBaseOpacityInverse', 'disabled'];
|
|
2
2
|
//# sourceMappingURL=IconButtonProps.js.map
|