@fountain-ui/core 3.0.0-alpha.5 → 3.0.0-alpha.7

package/build/commonjs/Accordion/Accordion.js

@@ -75,6 +75,7 @@ function Accordion(props) {
     container: containerStyle,
     content: contentStyle,
     contentFont: contentFontStyle,
+    iconContainer: iconContainerStyle,
     subTitleFont: subTitleFontStyle,
     title: titleStyle,
     titleFont: titleFontStyle
@@ -126,7 +127,9 @@ function Accordion(props) {
     flexShrink: 1
   }, /*#__PURE__*/_react.default.createElement(_Row.default, {
     alignItems: 'center'
-  }, LeftComponent ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, LeftComponent, /*#__PURE__*/_react.default.createElement(_Spacer.default, {
+  }, LeftComponent ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: iconContainerStyle
+  }, LeftComponent), /*#__PURE__*/_react.default.createElement(_Spacer.default, {
     size: 1.5
   })) : null, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
     allowFontScaling: false,

package/build/commonjs/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"names":["ROTATE_HIDE_DEGREE","ROTATE_SHOW_DEGREE","ANIMATION_CONFIG","duration","INITIAL_EXPANDED_DELAY_MILLIS","CONTENT_OPACITY_DELAY_MILLIS","useStyles","theme","useTheme","root","marginBottom","spacing","rightIcon","alignItems","height","justifyContent","width","Accordion","props","title","subTitle","content","RightIcon","LeftComponent","isInitialExpanded","variant","styles","CONTENT_MARGIN_HEIGHT","isExpanded","setIsExpanded","useState","shouldInitialExpandedRef","useRef","container","containerStyle","contentStyle","contentFont","contentFontStyle","subTitleFont","subTitleFontStyle","titleStyle","titleFont","titleFontStyle","useVariantStyleMap","rotate","useSharedValue","animatedOpacity","animatedHeight","contentHeight","setContentHeight","animatedChevronDownStyles","useAnimatedStyle","transform","value","animatedContentBackgroundStyles","overflow","animatedContentStyle","opacity","onPress","prev","onLayout","event","nativeEvent","layout","current","setTimeout","useEffect","withTiming","withDelay","rootStyle","css"],"sources":["Accordion.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { LayoutChangeEvent, Text, View, ViewStyle } from 'react-native';\nimport Animated, {\n    useAnimatedStyle,\n    useSharedValue,\n    withDelay,\n    withTiming,\n    WithTimingConfig,\n} from 'react-native-reanimated';\nimport { css, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport { ChevronDown } from '../internal/icons';\nimport ButtonBase from '../ButtonBase';\nimport Column from '../Column';\nimport Row from '../Row';\nimport Spacer from '../Spacer';\nimport type AccordionProps from './AccordionProps';\nimport type { AccordionVariant } from './AccordionProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\ntype AccordionStyles = NamedStylesStringUnion<'root' | 'rightIcon'>;\n\nconst ROTATE_HIDE_DEGREE = 0;\nconst ROTATE_SHOW_DEGREE = 180;\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 200 };\nconst INITIAL_EXPANDED_DELAY_MILLIS = 100;\nconst CONTENT_OPACITY_DELAY_MILLIS = 200;\n\nconst useStyles: UseStyles<AccordionStyles> = function (): AccordionStyles {\n    const theme = useTheme();\n\n    return {\n        root: { marginBottom: theme.spacing(3) },\n        rightIcon: {\n            alignItems: 'center',\n            height: 32,\n            justifyContent: 'center',\n            width: 32,\n        },\n    };\n};\n\nexport default function Accordion(props: AccordionProps) {\n    const {\n        title,\n        subTitle,\n        content,\n        RightIcon,\n        LeftComponent,\n        isInitialExpanded = false,\n        variant = 'solid' as AccordionVariant,\n    } = props;\n\n    const styles = useStyles();\n    const theme = useTheme();\n    const CONTENT_MARGIN_HEIGHT = theme.spacing(2);\n\n    const [isExpanded, setIsExpanded] = useState<boolean>(false);\n    const shouldInitialExpandedRef = useRef<boolean>(isInitialExpanded);\n\n    const {\n        container: containerStyle,\n        content: contentStyle,\n        contentFont: contentFontStyle,\n        subTitleFont: subTitleFontStyle,\n        title: titleStyle,\n        titleFont: titleFontStyle,\n    } = useVariantStyleMap(variant);\n\n    const rotate = useSharedValue(ROTATE_HIDE_DEGREE);\n    const animatedOpacity = useSharedValue(0);\n\n    const animatedHeight = useSharedValue(0);\n    const [contentHeight, setContentHeight] = useState(0);\n\n    const animatedChevronDownStyles = useAnimatedStyle(() => ({\n        transform: [{ rotate: `${rotate.value}deg` }],\n    }), []);\n\n    const animatedContentBackgroundStyles = useAnimatedStyle(() => ({\n        height: animatedHeight.value,\n        overflow: 'hidden',\n    } as ViewStyle), []);\n\n    const animatedContentStyle = useAnimatedStyle(() => ({\n        opacity: animatedOpacity.value,\n    }), []);\n\n    const onPress = () => {\n        setIsExpanded(prev => !prev);\n    };\n\n    const onLayout = (event: LayoutChangeEvent) => {\n        const height = event.nativeEvent.layout.height + CONTENT_MARGIN_HEIGHT;\n        setContentHeight(height);\n\n        if (shouldInitialExpandedRef.current) {\n            shouldInitialExpandedRef.current = false;\n            setTimeout(() => setIsExpanded(true), INITIAL_EXPANDED_DELAY_MILLIS);\n        }\n    };\n\n    useEffect(() => {\n        rotate.value = withTiming(isExpanded ? ROTATE_SHOW_DEGREE : ROTATE_HIDE_DEGREE, ANIMATION_CONFIG);\n\n        animatedHeight.value = withTiming(isExpanded ? contentHeight : 0, ANIMATION_CONFIG);\n\n        animatedOpacity.value = isExpanded\n            ? withDelay(CONTENT_OPACITY_DELAY_MILLIS, withTiming(1, ANIMATION_CONFIG))\n            : withTiming(0, ANIMATION_CONFIG);\n    }, [isExpanded, contentHeight]);\n\n    const rootStyle = css([\n        styles.root,\n        containerStyle,\n    ]);\n\n    return (\n        <Column style={rootStyle}>\n            <ButtonBase onPress={onPress}>\n                <Row style={titleStyle}>\n                    <Column flexShrink={1}>\n                        <Row alignItems={'center'}>\n                            {LeftComponent ? (\n                                <React.Fragment>\n                                    {LeftComponent}\n\n                                    <Spacer size={1.5}/>\n                                </React.Fragment>\n                            ) : null}\n\n                            <Text\n                                allowFontScaling={false}\n                                children={title}\n                                numberOfLines={1}\n                                style={titleFontStyle}\n                            />\n                        </Row>\n\n                        {subTitle && variant === 'solid' ?\n                            typeof subTitle === 'string' ? (\n                                <React.Fragment>\n                                    <Spacer size={1.5}/>\n\n                                    <Text\n                                        allowFontScaling={false}\n                                        children={subTitle}\n                                        numberOfLines={1}\n                                        style={subTitleFontStyle}\n                                    />\n                                </React.Fragment>\n                            ) : (subTitle)\n                            : null}\n                    </Column>\n\n                    <Spacer flex={1}/>\n\n                    <Spacer size={3}/>\n\n                    <Animated.View style={animatedChevronDownStyles}>\n                        <View style={styles.rightIcon}>\n                            {RightIcon ? RightIcon : (\n                                <ChevronDown\n                                    width={16}\n                                    height={16}\n                                    color={'base'}\n                                />\n                            )}\n                        </View>\n                    </Animated.View>\n                </Row>\n            </ButtonBase>\n\n            <Animated.View style={animatedContentBackgroundStyles}>\n                <View\n                    onLayout={onLayout}\n                    style={contentStyle}\n                >\n                    <Animated.View style={animatedContentStyle}>\n                        {typeof content === 'string' ? (\n                            <Text\n                                allowFontScaling={false}\n                                children={content}\n                                style={contentFontStyle}\n                            />\n                        ) : (content)}\n                    </Animated.View>\n                </View>\n            </Animated.View>\n        </Column>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"names":["ROTATE_HIDE_DEGREE","ROTATE_SHOW_DEGREE","ANIMATION_CONFIG","duration","INITIAL_EXPANDED_DELAY_MILLIS","CONTENT_OPACITY_DELAY_MILLIS","useStyles","theme","useTheme","root","marginBottom","spacing","rightIcon","alignItems","height","justifyContent","width","Accordion","props","title","subTitle","content","RightIcon","LeftComponent","isInitialExpanded","variant","styles","CONTENT_MARGIN_HEIGHT","isExpanded","setIsExpanded","useState","shouldInitialExpandedRef","useRef","container","containerStyle","contentStyle","contentFont","contentFontStyle","iconContainer","iconContainerStyle","subTitleFont","subTitleFontStyle","titleStyle","titleFont","titleFontStyle","useVariantStyleMap","rotate","useSharedValue","animatedOpacity","animatedHeight","contentHeight","setContentHeight","animatedChevronDownStyles","useAnimatedStyle","transform","value","animatedContentBackgroundStyles","overflow","animatedContentStyle","opacity","onPress","prev","onLayout","event","nativeEvent","layout","current","setTimeout","useEffect","withTiming","withDelay","rootStyle","css"],"sources":["Accordion.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { LayoutChangeEvent, Text, View, ViewStyle } from 'react-native';\nimport Animated, {\n    useAnimatedStyle,\n    useSharedValue,\n    withDelay,\n    withTiming,\n    WithTimingConfig,\n} from 'react-native-reanimated';\nimport { css, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport { ChevronDown } from '../internal/icons';\nimport ButtonBase from '../ButtonBase';\nimport Column from '../Column';\nimport Row from '../Row';\nimport Spacer from '../Spacer';\nimport type AccordionProps from './AccordionProps';\nimport type { AccordionVariant } from './AccordionProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\ntype AccordionStyles = NamedStylesStringUnion<'root' | 'rightIcon'>;\n\nconst ROTATE_HIDE_DEGREE = 0;\nconst ROTATE_SHOW_DEGREE = 180;\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 200 };\nconst INITIAL_EXPANDED_DELAY_MILLIS = 100;\nconst CONTENT_OPACITY_DELAY_MILLIS = 200;\n\nconst useStyles: UseStyles<AccordionStyles> = function (): AccordionStyles {\n    const theme = useTheme();\n\n    return {\n        root: { marginBottom: theme.spacing(3) },\n        rightIcon: {\n            alignItems: 'center',\n            height: 32,\n            justifyContent: 'center',\n            width: 32,\n        },\n    };\n};\n\nexport default function Accordion(props: AccordionProps) {\n    const {\n        title,\n        subTitle,\n        content,\n        RightIcon,\n        LeftComponent,\n        isInitialExpanded = false,\n        variant = 'solid' as AccordionVariant,\n    } = props;\n\n    const styles = useStyles();\n    const theme = useTheme();\n    const CONTENT_MARGIN_HEIGHT = theme.spacing(2);\n\n    const [isExpanded, setIsExpanded] = useState<boolean>(false);\n    const shouldInitialExpandedRef = useRef<boolean>(isInitialExpanded);\n\n    const {\n        container: containerStyle,\n        content: contentStyle,\n        contentFont: contentFontStyle,\n        iconContainer: iconContainerStyle,\n        subTitleFont: subTitleFontStyle,\n        title: titleStyle,\n        titleFont: titleFontStyle,\n    } = useVariantStyleMap(variant);\n\n    const rotate = useSharedValue(ROTATE_HIDE_DEGREE);\n    const animatedOpacity = useSharedValue(0);\n\n    const animatedHeight = useSharedValue(0);\n    const [contentHeight, setContentHeight] = useState(0);\n\n    const animatedChevronDownStyles = useAnimatedStyle(() => ({\n        transform: [{ rotate: `${rotate.value}deg` }],\n    }), []);\n\n    const animatedContentBackgroundStyles = useAnimatedStyle(() => ({\n        height: animatedHeight.value,\n        overflow: 'hidden',\n    } as ViewStyle), []);\n\n    const animatedContentStyle = useAnimatedStyle(() => ({\n        opacity: animatedOpacity.value,\n    }), []);\n\n    const onPress = () => {\n        setIsExpanded(prev => !prev);\n    };\n\n    const onLayout = (event: LayoutChangeEvent) => {\n        const height = event.nativeEvent.layout.height + CONTENT_MARGIN_HEIGHT;\n        setContentHeight(height);\n\n        if (shouldInitialExpandedRef.current) {\n            shouldInitialExpandedRef.current = false;\n            setTimeout(() => setIsExpanded(true), INITIAL_EXPANDED_DELAY_MILLIS);\n        }\n    };\n\n    useEffect(() => {\n        rotate.value = withTiming(isExpanded ? ROTATE_SHOW_DEGREE : ROTATE_HIDE_DEGREE, ANIMATION_CONFIG);\n\n        animatedHeight.value = withTiming(isExpanded ? contentHeight : 0, ANIMATION_CONFIG);\n\n        animatedOpacity.value = isExpanded\n            ? withDelay(CONTENT_OPACITY_DELAY_MILLIS, withTiming(1, ANIMATION_CONFIG))\n            : withTiming(0, ANIMATION_CONFIG);\n    }, [isExpanded, contentHeight]);\n\n    const rootStyle = css([\n        styles.root,\n        containerStyle,\n    ]);\n\n    return (\n        <Column style={rootStyle}>\n            <ButtonBase onPress={onPress}>\n                <Row style={titleStyle}>\n                    <Column flexShrink={1}>\n                        <Row alignItems={'center'}>\n                            {LeftComponent ? (\n                                <React.Fragment>\n                                    <View style={iconContainerStyle}>\n                                        {LeftComponent}\n                                    </View>\n\n                                    <Spacer size={1.5}/>\n                                </React.Fragment>\n                            ) : null}\n\n                            <Text\n                                allowFontScaling={false}\n                                children={title}\n                                numberOfLines={1}\n                                style={titleFontStyle}\n                            />\n                        </Row>\n\n                        {subTitle && variant === 'solid' ?\n                            typeof subTitle === 'string' ? (\n                                <React.Fragment>\n                                    <Spacer size={1.5}/>\n\n                                    <Text\n                                        allowFontScaling={false}\n                                        children={subTitle}\n                                        numberOfLines={1}\n                                        style={subTitleFontStyle}\n                                    />\n                                </React.Fragment>\n                            ) : (subTitle)\n                            : null}\n                    </Column>\n\n                    <Spacer flex={1}/>\n\n                    <Spacer size={3}/>\n\n                    <Animated.View style={animatedChevronDownStyles}>\n                        <View style={styles.rightIcon}>\n                            {RightIcon ? RightIcon : (\n                                <ChevronDown\n                                    width={16}\n                                    height={16}\n                                    color={'base'}\n                                />\n                            )}\n                        </View>\n                    </Animated.View>\n                </Row>\n            </ButtonBase>\n\n            <Animated.View style={animatedContentBackgroundStyles}>\n                <View\n                    onLayout={onLayout}\n                    style={contentStyle}\n                >\n                    <Animated.View style={animatedContentStyle}>\n                        {typeof content === 'string' ? (\n                            <Text\n                                allowFontScaling={false}\n                                children={content}\n                                style={contentFontStyle}\n                            />\n                        ) : (content)}\n                    </Animated.View>\n                </View>\n            </Animated.View>\n        </Column>\n    );\n}\n"],"mappings":"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"}

package/build/commonjs/Accordion/useVariantStyleMap.js

@@ -46,8 +46,8 @@ function useVariantStyleMap(variant) {
           },
           titleFont: (0, _styles2.createFontStyle)(theme, {
             selector: _ => (0, _styles.typographyOf)({
-              fontSize: 15,
-              lineHeight: 19.5,
+              fontSize: 16,
+              lineHeight: 20.8,
               fontFamily: 'PretendardStd-SemiBold',
               letterSpacing: 0
             }),
@@ -74,6 +74,9 @@ function useVariantStyleMap(variant) {
             selector: typography => typography.caption2.regular,
             color: theme.palette.text.base
           }),
+          iconContainer: {
+            paddingTop: 1
+          },
           title: {
             alignItems: 'center',
             paddingBottom: theme.spacing(1),
@@ -112,8 +115,8 @@ function useVariantStyleMap(variant) {
           },
           titleFont: (0, _styles2.createFontStyle)(theme, {
             selector: _ => (0, _styles.typographyOf)({
-              fontSize: 15,
-              lineHeight: 19.5,
+              fontSize: 16,
+              lineHeight: 20.8,
               fontFamily: 'PretendardStd-SemiBold',
               letterSpacing: 0
             }),

package/build/commonjs/Accordion/useVariantStyleMap.js.map

@@ -1 +1 @@
-{"version":3,"names":["useVariantStyleMap","variant","theme","useTheme","useMemo","container","backgroundColor","palette","surface","supportive","borderRadius","shape","radius","md","content","borderTopColor","border","weak","borderTopWidth","marginHorizontal","spacing","paddingBottom","paddingTop","position","contentFont","createFontStyle","selector","typography","body3","regular","color","text","base","subTitleFont","caption1","title","alignItems","paddingLeft","paddingRight","paddingVertical","titleFont","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","strong","borderColor","borderWidth","caption2","caption1short","semiBold","borderBottomColor","borderBottomWidth"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { AccordionVariant } from './AccordionProps';\n\ninterface VariantStyle {\n    container: FountainUiStyle;\n    content: FountainUiStyle;\n    contentFont: TextStyle;\n    subTitleFont?: TextStyle;\n    title: FountainUiStyle;\n    titleFont: TextStyle;\n}\n\nexport default function useVariantStyleMap(variant: AccordionVariant): VariantStyle {\n    const theme = useTheme();\n\n    return useMemo(() => {\n        switch (variant) {\n            default:\n            case 'solid':\n                return {\n                    container: {\n                        backgroundColor: theme.palette.surface.supportive,\n                        borderRadius: theme.shape.radius.md,\n                    },\n                    content: {\n                        borderTopColor: theme.palette.border.weak,\n                        borderTopWidth: 0.5,\n                        marginHorizontal: theme.spacing(4),\n                        paddingBottom: theme.spacing(5),\n                        paddingTop: theme.spacing(4),\n                        position: 'absolute',\n                    },\n                    contentFont: createFontStyle(theme, {\n                        selector: (typography) => typography.body3.regular,\n                        color: theme.palette.text.base,\n                    }),\n                    subTitleFont: createFontStyle(theme, {\n                        selector: (typography) => typography.caption1.regular,\n                        color: theme.palette.text.base,\n                    }),\n                    title: {\n                        alignItems: 'center',\n                        paddingLeft: theme.spacing(4),\n                        paddingRight: theme.spacing(2),\n                        paddingVertical: theme.spacing(4),\n                    },\n                    titleFont: createFontStyle(theme, {\n                        selector: (_) => typographyOf({\n                            fontSize: 15,\n                            lineHeight: 19.5,\n                            fontFamily: 'PretendardStd-SemiBold',\n                            letterSpacing: 0,\n                        }),\n                        color: theme.palette.text.strong,\n                    }),\n                };\n            case 'line':\n                return {\n                    container: {\n                        borderColor: theme.palette.border.weak,\n                        borderRadius: theme.shape.radius.md,\n                        borderWidth: 1,\n                    },\n                    content: {\n                        borderTopColor: theme.palette.border.weak,\n                        borderTopWidth: 0.5,\n                        marginHorizontal: theme.spacing(4),\n                        paddingBottom: theme.spacing(4),\n                        paddingTop: theme.spacing(3),\n                        position: 'absolute',\n                    },\n                    contentFont: createFontStyle(theme, {\n                        selector: (typography) => typography.caption2.regular,\n                        color: theme.palette.text.base,\n                    }),\n                    title: {\n                        alignItems: 'center',\n                        paddingBottom: theme.spacing(1),\n                        paddingLeft: theme.spacing(4),\n                        paddingRight: theme.spacing(2),\n                        paddingTop: theme.spacing(0.75),\n                    },\n                    titleFont: createFontStyle(theme, {\n                        selector: (typography) => typography.caption1short.semiBold,\n                        color: theme.palette.text.base,\n                    }),\n                };\n            case 'underline':\n                return {\n                    container: {\n                        borderBottomColor: theme.palette.border.weak,\n                        borderBottomWidth: 1,\n                    },\n                    content: {\n                        borderTopColor: theme.palette.border.weak,\n                        borderTopWidth: 0.5,\n                        paddingBottom: theme.spacing(5),\n                        paddingLeft: theme.spacing(0.5),\n                        paddingRight: theme.spacing(2),\n                        paddingTop: theme.spacing(4),\n                    },\n                    contentFont: createFontStyle(theme, {\n                        selector: (typography) => typography.body3.regular,\n                        color: theme.palette.text.base,\n                    }),\n                    title: {\n                        alignItems: 'center',\n                        paddingLeft: theme.spacing(0.5),\n                        paddingVertical: theme.spacing(2),\n                    },\n                    titleFont: createFontStyle(theme, {\n                        selector: (_) => typographyOf({\n                            fontSize: 15,\n                            lineHeight: 19.5,\n                            fontFamily: 'PretendardStd-SemiBold',\n                            letterSpacing: 0,\n                        }),\n                        color: theme.palette.text.strong,\n                    }),\n                };\n        }\n    }, [theme, variant]);\n}\n"],"mappings":"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"}
+{"version":3,"names":["useVariantStyleMap","variant","theme","useTheme","useMemo","container","backgroundColor","palette","surface","supportive","borderRadius","shape","radius","md","content","borderTopColor","border","weak","borderTopWidth","marginHorizontal","spacing","paddingBottom","paddingTop","position","contentFont","createFontStyle","selector","typography","body3","regular","color","text","base","subTitleFont","caption1","title","alignItems","paddingLeft","paddingRight","paddingVertical","titleFont","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","strong","borderColor","borderWidth","caption2","iconContainer","caption1short","semiBold","borderBottomColor","borderBottomWidth"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { AccordionVariant } from './AccordionProps';\n\ninterface VariantStyle {\n    container: FountainUiStyle;\n    content: FountainUiStyle;\n    contentFont: TextStyle;\n    iconContainer?: FountainUiStyle;\n    subTitleFont?: TextStyle;\n    title: FountainUiStyle;\n    titleFont: TextStyle;\n}\n\nexport default function useVariantStyleMap(variant: AccordionVariant): VariantStyle {\n    const theme = useTheme();\n\n    return useMemo(() => {\n        switch (variant) {\n            default:\n            case 'solid':\n                return {\n                    container: {\n                        backgroundColor: theme.palette.surface.supportive,\n                        borderRadius: theme.shape.radius.md,\n                    },\n                    content: {\n                        borderTopColor: theme.palette.border.weak,\n                        borderTopWidth: 0.5,\n                        marginHorizontal: theme.spacing(4),\n                        paddingBottom: theme.spacing(5),\n                        paddingTop: theme.spacing(4),\n                        position: 'absolute',\n                    },\n                    contentFont: createFontStyle(theme, {\n                        selector: (typography) => typography.body3.regular,\n                        color: theme.palette.text.base,\n                    }),\n                    subTitleFont: createFontStyle(theme, {\n                        selector: (typography) => typography.caption1.regular,\n                        color: theme.palette.text.base,\n                    }),\n                    title: {\n                        alignItems: 'center',\n                        paddingLeft: theme.spacing(4),\n                        paddingRight: theme.spacing(2),\n                        paddingVertical: theme.spacing(4),\n                    },\n                    titleFont: createFontStyle(theme, {\n                        selector: (_) => typographyOf({\n                            fontSize: 16,\n                            lineHeight: 20.8,\n                            fontFamily: 'PretendardStd-SemiBold',\n                            letterSpacing: 0,\n                        }),\n                        color: theme.palette.text.strong,\n                    }),\n                };\n            case 'line':\n                return {\n                    container: {\n                        borderColor: theme.palette.border.weak,\n                        borderRadius: theme.shape.radius.md,\n                        borderWidth: 1,\n                    },\n                    content: {\n                        borderTopColor: theme.palette.border.weak,\n                        borderTopWidth: 0.5,\n                        marginHorizontal: theme.spacing(4),\n                        paddingBottom: theme.spacing(4),\n                        paddingTop: theme.spacing(3),\n                        position: 'absolute',\n                    },\n                    contentFont: createFontStyle(theme, {\n                        selector: (typography) => typography.caption2.regular,\n                        color: theme.palette.text.base,\n                    }),\n                    iconContainer: {\n                        paddingTop: 1,\n                    },\n                    title: {\n                        alignItems: 'center',\n                        paddingBottom: theme.spacing(1),\n                        paddingLeft: theme.spacing(4),\n                        paddingRight: theme.spacing(2),\n                        paddingTop: theme.spacing(0.75),\n                    },\n                    titleFont: createFontStyle(theme, {\n                        selector: (typography) => typography.caption1short.semiBold,\n                        color: theme.palette.text.base,\n                    }),\n                };\n            case 'underline':\n                return {\n                    container: {\n                        borderBottomColor: theme.palette.border.weak,\n                        borderBottomWidth: 1,\n                    },\n                    content: {\n                        borderTopColor: theme.palette.border.weak,\n                        borderTopWidth: 0.5,\n                        paddingBottom: theme.spacing(5),\n                        paddingLeft: theme.spacing(0.5),\n                        paddingRight: theme.spacing(2),\n                        paddingTop: theme.spacing(4),\n                    },\n                    contentFont: createFontStyle(theme, {\n                        selector: (typography) => typography.body3.regular,\n                        color: theme.palette.text.base,\n                    }),\n                    title: {\n                        alignItems: 'center',\n                        paddingLeft: theme.spacing(0.5),\n                        paddingVertical: theme.spacing(2),\n                    },\n                    titleFont: createFontStyle(theme, {\n                        selector: (_) => typographyOf({\n                            fontSize: 16,\n                            lineHeight: 20.8,\n                            fontFamily: 'PretendardStd-SemiBold',\n                            letterSpacing: 0,\n                        }),\n                        color: theme.palette.text.strong,\n                    }),\n                };\n        }\n    }, [theme, variant]);\n}\n"],"mappings":"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"}

package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js

@@ -66,6 +66,7 @@ function BottomSheetTitle(props) {
     color: 'accent',
     disableMinWidth: true,
     onPress: actionButtonProps.onPress,
+    size: 'large',
     style: styles.actionButton,
     variant: 'text'
   }) : null);

package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","gap","spacing","justifyContent","marginBottom","paddingHorizontal","title","paddingBottom","paddingTop","actionButton","BottomSheetTitle","props","actionButtonProps","children","style","styleProp","otherProps","styles","rootStyle","css","titleFontStyle","createFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle","onPress"],"sources":["BottomSheetTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Button from '../Button/Button';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type BottomSheetTitleProps from './BottomSheetTitleProps';\n\ntype BottomSheetTitleStyles = NamedStylesStringUnion<'root' | 'title' | 'actionButton'>;\n\nconst useStyles: UseStyles<BottomSheetTitleStyles> = function (): BottomSheetTitleStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            gap: theme.spacing(8),\n            justifyContent: 'space-between',\n            marginBottom: theme.spacing(4),\n            paddingHorizontal: theme.spacing(6),\n        },\n        title: {\n            paddingBottom: theme.spacing(1.25),\n            paddingTop: theme.spacing(1),\n        },\n        actionButton: {\n            paddingBottom: theme.spacing(1.75),\n            paddingHorizontal: 0,\n            paddingTop: theme.spacing(1.25),\n        },\n    };\n};\n\nexport default function BottomSheetTitle(props: BottomSheetTitleProps) {\n    const {\n        actionButtonProps,\n        children,\n        style: styleProp,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const rootStyle = css([\n        styles.root,\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        <Row\n            style={rootStyle}\n            {...otherProps}\n        >\n            <Text\n                children={children}\n                style={titleStyle}\n            />\n\n            {actionButtonProps ? (\n                <Button\n                    children={actionButtonProps.title}\n                    color={'accent'}\n                    disableMinWidth={true}\n                    onPress={actionButtonProps.onPress}\n                    style={styles.actionButton}\n                    variant={'text'}\n                />\n            ) : null}\n        </Row>\n    );\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAA4C,GAAG,YAAoC;EACrF,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,GAAG,EAAEJ,KAAK,CAACK,OAAN,CAAc,CAAd,CAFH;MAGFC,cAAc,EAAE,eAHd;MAIFC,YAAY,EAAEP,KAAK,CAACK,OAAN,CAAc,CAAd,CAJZ;MAKFG,iBAAiB,EAAER,KAAK,CAACK,OAAN,CAAc,CAAd;IALjB,CADH;IAQHI,KAAK,EAAE;MACHC,aAAa,EAAEV,KAAK,CAACK,OAAN,CAAc,IAAd,CADZ;MAEHM,UAAU,EAAEX,KAAK,CAACK,OAAN,CAAc,CAAd;IAFT,CARJ;IAYHO,YAAY,EAAE;MACVF,aAAa,EAAEV,KAAK,CAACK,OAAN,CAAc,IAAd,CADL;MAEVG,iBAAiB,EAAE,CAFT;MAGVG,UAAU,EAAEX,KAAK,CAACK,OAAN,CAAc,IAAd;IAHF;EAZX,CAAP;AAkBH,CArBD;;AAuBe,SAASQ,gBAAT,CAA0BC,KAA1B,EAAwD;EACnE,MAAM;IACFC,iBADE;IAEFC,QAFE;IAGFC,KAAK,EAAEC,SAHL;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMd,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMmB,MAAM,GAAGrB,SAAS,EAAxB;EAEA,MAAMsB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAAClB,IADW,EAElBgB,SAFkB,CAAJ,CAAlB;EAKA,MAAMK,cAAc,GAAG,IAAAC,uBAAA,EAAgBxB,KAAhB,EAAuB;IAC1CyB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAE7B,KAAK,CAAC8B,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAvB,CAAvB;EAKA,MAAMC,UAAU,GAAG,IAAAX,WAAA,EAAI,CACnBF,MAAM,CAACX,KADY,EAEnBc,cAFmB,CAAJ,CAAnB;EAKA,oBACI,6BAAC,YAAD;IACI,KAAK,EAAEF;EADX,GAEQF,UAFR,gBAII,6BAAC,iBAAD;IACI,QAAQ,EAAEH,QADd;IAEI,KAAK,EAAEiB;EAFX,EAJJ,EASKlB,iBAAiB,gBACd,6BAAC,eAAD;IACI,QAAQ,EAAEA,iBAAiB,CAACN,KADhC;IAEI,KAAK,EAAE,QAFX;IAGI,eAAe,EAAE,IAHrB;IAII,OAAO,EAAEM,iBAAiB,CAACmB,OAJ/B;IAKI,KAAK,EAAEd,MAAM,CAACR,YALlB;IAMI,OAAO,EAAE;EANb,EADc,GASd,IAlBR,CADJ;AAsBH"}
+{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","gap","spacing","justifyContent","marginBottom","paddingHorizontal","title","paddingBottom","paddingTop","actionButton","BottomSheetTitle","props","actionButtonProps","children","style","styleProp","otherProps","styles","rootStyle","css","titleFontStyle","createFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle","onPress"],"sources":["BottomSheetTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Button from '../Button/Button';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type BottomSheetTitleProps from './BottomSheetTitleProps';\n\ntype BottomSheetTitleStyles = NamedStylesStringUnion<'root' | 'title' | 'actionButton'>;\n\nconst useStyles: UseStyles<BottomSheetTitleStyles> = function (): BottomSheetTitleStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            gap: theme.spacing(8),\n            justifyContent: 'space-between',\n            marginBottom: theme.spacing(4),\n            paddingHorizontal: theme.spacing(6),\n        },\n        title: {\n            paddingBottom: theme.spacing(1.25),\n            paddingTop: theme.spacing(1),\n        },\n        actionButton: {\n            paddingBottom: theme.spacing(1.75),\n            paddingHorizontal: 0,\n            paddingTop: theme.spacing(1.25),\n        },\n    };\n};\n\nexport default function BottomSheetTitle(props: BottomSheetTitleProps) {\n    const {\n        actionButtonProps,\n        children,\n        style: styleProp,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const rootStyle = css([\n        styles.root,\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        <Row\n            style={rootStyle}\n            {...otherProps}\n        >\n            <Text\n                children={children}\n                style={titleStyle}\n            />\n\n            {actionButtonProps ? (\n                <Button\n                    children={actionButtonProps.title}\n                    color={'accent'}\n                    disableMinWidth={true}\n                    onPress={actionButtonProps.onPress}\n                    size={'large'}\n                    style={styles.actionButton}\n                    variant={'text'}\n                />\n            ) : null}\n        </Row>\n    );\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAA4C,GAAG,YAAoC;EACrF,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,GAAG,EAAEJ,KAAK,CAACK,OAAN,CAAc,CAAd,CAFH;MAGFC,cAAc,EAAE,eAHd;MAIFC,YAAY,EAAEP,KAAK,CAACK,OAAN,CAAc,CAAd,CAJZ;MAKFG,iBAAiB,EAAER,KAAK,CAACK,OAAN,CAAc,CAAd;IALjB,CADH;IAQHI,KAAK,EAAE;MACHC,aAAa,EAAEV,KAAK,CAACK,OAAN,CAAc,IAAd,CADZ;MAEHM,UAAU,EAAEX,KAAK,CAACK,OAAN,CAAc,CAAd;IAFT,CARJ;IAYHO,YAAY,EAAE;MACVF,aAAa,EAAEV,KAAK,CAACK,OAAN,CAAc,IAAd,CADL;MAEVG,iBAAiB,EAAE,CAFT;MAGVG,UAAU,EAAEX,KAAK,CAACK,OAAN,CAAc,IAAd;IAHF;EAZX,CAAP;AAkBH,CArBD;;AAuBe,SAASQ,gBAAT,CAA0BC,KAA1B,EAAwD;EACnE,MAAM;IACFC,iBADE;IAEFC,QAFE;IAGFC,KAAK,EAAEC,SAHL;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMd,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMmB,MAAM,GAAGrB,SAAS,EAAxB;EAEA,MAAMsB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAAClB,IADW,EAElBgB,SAFkB,CAAJ,CAAlB;EAKA,MAAMK,cAAc,GAAG,IAAAC,uBAAA,EAAgBxB,KAAhB,EAAuB;IAC1CyB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAE7B,KAAK,CAAC8B,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAvB,CAAvB;EAKA,MAAMC,UAAU,GAAG,IAAAX,WAAA,EAAI,CACnBF,MAAM,CAACX,KADY,EAEnBc,cAFmB,CAAJ,CAAnB;EAKA,oBACI,6BAAC,YAAD;IACI,KAAK,EAAEF;EADX,GAEQF,UAFR,gBAII,6BAAC,iBAAD;IACI,QAAQ,EAAEH,QADd;IAEI,KAAK,EAAEiB;EAFX,EAJJ,EASKlB,iBAAiB,gBACd,6BAAC,eAAD;IACI,QAAQ,EAAEA,iBAAiB,CAACN,KADhC;IAEI,KAAK,EAAE,QAFX;IAGI,eAAe,EAAE,IAHrB;IAII,OAAO,EAAEM,iBAAiB,CAACmB,OAJ/B;IAKI,IAAI,EAAE,OALV;IAMI,KAAK,EAAEd,MAAM,CAACR,YANlB;IAOI,OAAO,EAAE;EAPb,EADc,GAUd,IAnBR,CADJ;AAuBH"}

package/build/commonjs/Button/Button.js

@@ -95,6 +95,7 @@ function Button(props) {
     color: colorProp = 'primary',
     disabled: disabledProp = false,
     disableMinWidth = false,
+    disablePadding = false,
     endIcon: endIconProp,
     fullWidth = false,
     href,
@@ -124,6 +125,9 @@ function Button(props) {
   const endIcon = (0, _utils.cloneElementSafely)(endIconProp, iconProps);
   const buttonBaseStyle = (0, _styles2.css)([styles.root, containerStyle, styles[size], fullWidth ? styles.fullWidth : undefined, disableMinWidth ? {
     minWidth: 0
+  } : undefined, disablePadding ? {
+    paddingHorizontal: 0,
+    paddingVertical: 0
   } : undefined, styleProp]);
   const fontStyle = (0, _styles2.createFontStyle)(theme, {
     selector: _ => fontStyleMap[size],

package/build/commonjs/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","borderRadius","shape","radius","sm","flexDirection","justifyContent","fullWidth","width","large","gap","spacing","minWidth","paddingHorizontal","paddingVertical","medium","small","loadingSpinner","position","fontStyleMap","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","getLoadingSpinnerColor","variant","color","Button","props","children","colorProp","disabled","disabledProp","disableMinWidth","endIcon","endIconProp","href","isLoading","onPress","pressEffect","size","startIcon","startIconProp","style","styleProp","otherProps","styles","container","containerStyle","iconColor","labelColor","useVariantStyleMap","iconProps","fill","opacity","cloneElementSafely","buttonBaseStyle","css","undefined","fontStyle","createFontStyle","selector","_","textStyle","textAlign","modifiedPressEffect","handlePress","Linking","canOpenURL","openURL","loadingSpinnerColor"],"sources":["Button.tsx"],"sourcesContent":["import React from 'react';\nimport { Linking, Text } from 'react-native';\nimport type { FontStyle, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase/ButtonBase';\nimport { LoadingSpinner } from '../internal/icons';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport type ButtonProps from './ButtonProps';\nimport type { ButtonColor, ButtonSize, ButtonVariant } from './ButtonProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\ntype ButtonStyles = NamedStylesStringUnion<'root' | 'fullWidth' | 'large' | 'medium' | 'small' | 'loadingSpinner'>;\n\nconst useStyles: UseStyles<ButtonStyles> = function (): ButtonStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            borderRadius: theme.shape.radius.sm,\n            flexDirection: 'row',\n            justifyContent: 'center',\n        },\n        fullWidth: {\n            width: '100%',\n        },\n        large: {\n            gap: theme.spacing(2),\n            minWidth: 104,\n            paddingHorizontal: theme.spacing(6),\n            paddingVertical: theme.spacing(3.5),\n        },\n        medium: {\n            gap: theme.spacing(1.5),\n            minWidth: 88,\n            paddingHorizontal: theme.spacing(6),\n            paddingVertical: theme.spacing(2.75),\n        },\n        small: {\n            minWidth: 64,\n            paddingHorizontal: theme.spacing(6),\n            paddingVertical: theme.spacing(2),\n        },\n        loadingSpinner: {\n            position: 'absolute',\n        },\n    };\n};\n\nconst fontStyleMap: Record<ButtonSize, FontStyle> = {\n    large: typographyOf({\n        fontSize: 16,\n        lineHeight: 20,\n        fontFamily: 'LexendDeca-SemiBold',\n        letterSpacing: -0.32,\n    }),\n    medium: typographyOf({\n        fontSize: 15,\n        lineHeight: 19.5,\n        fontFamily: 'LexendDeca-SemiBold',\n        letterSpacing: -0.3,\n    }),\n    small: typographyOf({\n        fontSize: 13,\n        lineHeight: 16.9,\n        fontFamily: 'LexendDeca-SemiBold',\n        letterSpacing: -0.26,\n    }),\n};\n\nfunction getLoadingSpinnerColor(variant: ButtonVariant, color: ButtonColor) {\n    if (variant === 'solid' || (variant === 'capsuleSolid' && color !== 'secondary')) {\n        return 'white';\n    }\n    return 'gray';\n}\n\nexport default function Button(props: ButtonProps) {\n    const {\n        children,\n        color: colorProp = 'primary' as ButtonColor,\n        disabled: disabledProp = false,\n        disableMinWidth = false,\n        endIcon: endIconProp,\n        fullWidth = false,\n        href,\n        isLoading = false,\n        onPress,\n        pressEffect,\n        size = 'medium' as ButtonSize,\n        startIcon: startIconProp,\n        style: styleProp,\n        variant = 'solid' as ButtonVariant,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const disabled = disabledProp || isLoading;\n\n    const color = disabledProp ? 'disabled' : colorProp;\n    const {\n        container: containerStyle,\n        iconColor,\n        labelColor,\n    } = useVariantStyleMap(variant, color);\n\n    const iconProps = {\n        fill: iconColor,\n        opacity: isLoading ? 0 : 1,\n    };\n\n    const startIcon = cloneElementSafely(startIconProp, iconProps);\n    const endIcon = cloneElementSafely(endIconProp, iconProps);\n\n    const buttonBaseStyle = css([\n        styles.root,\n        containerStyle,\n        styles[size],\n        fullWidth ? styles.fullWidth : undefined,\n        disableMinWidth ? { minWidth: 0 } : undefined,\n        styleProp,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (_) => fontStyleMap[size],\n        color: labelColor,\n    });\n\n    const textStyle = css([\n        fontStyle,\n        {\n            opacity: isLoading ? 0 : 1,\n            textAlign: 'center',\n        },\n    ]);\n\n    const modifiedPressEffect = variant !== 'text' && !pressEffect\n        ? 'scale'\n        : pressEffect;\n\n    const handlePress = async () => {\n        if (disabled) {\n            return;\n        }\n        if (onPress) {\n            onPress();\n            return;\n        }\n        if (href) {\n            if (await Linking.canOpenURL(href)) {\n                await Linking.openURL(href);\n            }\n        }\n    };\n\n    const loadingSpinnerColor = getLoadingSpinnerColor(variant, color);\n\n    return (\n        <ButtonBase\n            disabled={disabled}\n            onPress={handlePress}\n            style={buttonBaseStyle}\n            pressEffect={modifiedPressEffect}\n            {...otherProps}\n        >\n            {startIcon}\n\n            <Text style={textStyle}>\n                {children}\n            </Text>\n\n            {endIcon}\n\n            {isLoading ? (\n                <LoadingSpinner\n                    color={loadingSpinnerColor}\n                    size={size}\n                    style={styles.loadingSpinner}\n                />\n            ) : null}\n        </ButtonBase>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAGA;;;;;;AAIA,MAAMA,SAAkC,GAAG,YAA0B;EACjE,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,YAAY,EAAEJ,KAAK,CAACK,KAAN,CAAYC,MAAZ,CAAmBC,EAF/B;MAGFC,aAAa,EAAE,KAHb;MAIFC,cAAc,EAAE;IAJd,CADH;IAOHC,SAAS,EAAE;MACPC,KAAK,EAAE;IADA,CAPR;IAUHC,KAAK,EAAE;MACHC,GAAG,EAAEb,KAAK,CAACc,OAAN,CAAc,CAAd,CADF;MAEHC,QAAQ,EAAE,GAFP;MAGHC,iBAAiB,EAAEhB,KAAK,CAACc,OAAN,CAAc,CAAd,CAHhB;MAIHG,eAAe,EAAEjB,KAAK,CAACc,OAAN,CAAc,GAAd;IAJd,CAVJ;IAgBHI,MAAM,EAAE;MACJL,GAAG,EAAEb,KAAK,CAACc,OAAN,CAAc,GAAd,CADD;MAEJC,QAAQ,EAAE,EAFN;MAGJC,iBAAiB,EAAEhB,KAAK,CAACc,OAAN,CAAc,CAAd,CAHf;MAIJG,eAAe,EAAEjB,KAAK,CAACc,OAAN,CAAc,IAAd;IAJb,CAhBL;IAsBHK,KAAK,EAAE;MACHJ,QAAQ,EAAE,EADP;MAEHC,iBAAiB,EAAEhB,KAAK,CAACc,OAAN,CAAc,CAAd,CAFhB;MAGHG,eAAe,EAAEjB,KAAK,CAACc,OAAN,CAAc,CAAd;IAHd,CAtBJ;IA2BHM,cAAc,EAAE;MACZC,QAAQ,EAAE;IADE;EA3Bb,CAAP;AA+BH,CAlCD;;AAoCA,MAAMC,YAA2C,GAAG;EAChDV,KAAK,EAAE,IAAAW,oBAAA,EAAa;IAChBC,QAAQ,EAAE,EADM;IAEhBC,UAAU,EAAE,EAFI;IAGhBC,UAAU,EAAE,qBAHI;IAIhBC,aAAa,EAAE,CAAC;EAJA,CAAb,CADyC;EAOhDT,MAAM,EAAE,IAAAK,oBAAA,EAAa;IACjBC,QAAQ,EAAE,EADO;IAEjBC,UAAU,EAAE,IAFK;IAGjBC,UAAU,EAAE,qBAHK;IAIjBC,aAAa,EAAE,CAAC;EAJC,CAAb,CAPwC;EAahDR,KAAK,EAAE,IAAAI,oBAAA,EAAa;IAChBC,QAAQ,EAAE,EADM;IAEhBC,UAAU,EAAE,IAFI;IAGhBC,UAAU,EAAE,qBAHI;IAIhBC,aAAa,EAAE,CAAC;EAJA,CAAb;AAbyC,CAApD;;AAqBA,SAASC,sBAAT,CAAgCC,OAAhC,EAAwDC,KAAxD,EAA4E;EACxE,IAAID,OAAO,KAAK,OAAZ,IAAwBA,OAAO,KAAK,cAAZ,IAA8BC,KAAK,KAAK,WAApE,EAAkF;IAC9E,OAAO,OAAP;EACH;;EACD,OAAO,MAAP;AACH;;AAEc,SAASC,MAAT,CAAgBC,KAAhB,EAAoC;EAC/C,MAAM;IACFC,QADE;IAEFH,KAAK,EAAEI,SAAS,GAAG,SAFjB;IAGFC,QAAQ,EAAEC,YAAY,GAAG,KAHvB;IAIFC,eAAe,GAAG,KAJhB;IAKFC,OAAO,EAAEC,WALP;IAMF7B,SAAS,GAAG,KANV;IAOF8B,IAPE;IAQFC,SAAS,GAAG,KARV;IASFC,OATE;IAUFC,WAVE;IAWFC,IAAI,GAAG,QAXL;IAYFC,SAAS,EAAEC,aAZT;IAaFC,KAAK,EAAEC,SAbL;IAcFnB,OAAO,GAAG,OAdR;IAeF,GAAGoB;EAfD,IAgBFjB,KAhBJ;EAkBA,MAAMhC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMiD,MAAM,GAAGnD,SAAS,EAAxB;EAEA,MAAMoC,QAAQ,GAAGC,YAAY,IAAIK,SAAjC;EAEA,MAAMX,KAAK,GAAGM,YAAY,GAAG,UAAH,GAAgBF,SAA1C;EACA,MAAM;IACFiB,SAAS,EAAEC,cADT;IAEFC,SAFE;IAGFC;EAHE,IAIF,IAAAC,2BAAA,EAAmB1B,OAAnB,EAA4BC,KAA5B,CAJJ;EAMA,MAAM0B,SAAS,GAAG;IACdC,IAAI,EAAEJ,SADQ;IAEdK,OAAO,EAAEjB,SAAS,GAAG,CAAH,GAAO;EAFX,CAAlB;EAKA,MAAMI,SAAS,GAAG,IAAAc,yBAAA,EAAmBb,aAAnB,EAAkCU,SAAlC,CAAlB;EACA,MAAMlB,OAAO,GAAG,IAAAqB,yBAAA,EAAmBpB,WAAnB,EAAgCiB,SAAhC,CAAhB;EAEA,MAAMI,eAAe,GAAG,IAAAC,YAAA,EAAI,CACxBX,MAAM,CAAChD,IADiB,EAExBkD,cAFwB,EAGxBF,MAAM,CAACN,IAAD,CAHkB,EAIxBlC,SAAS,GAAGwC,MAAM,CAACxC,SAAV,GAAsBoD,SAJP,EAKxBzB,eAAe,GAAG;IAAEtB,QAAQ,EAAE;EAAZ,CAAH,GAAqB+C,SALZ,EAMxBd,SANwB,CAAJ,CAAxB;EASA,MAAMe,SAAS,GAAG,IAAAC,wBAAA,EAAgBhE,KAAhB,EAAuB;IACrCiE,QAAQ,EAAGC,CAAD,IAAO5C,YAAY,CAACsB,IAAD,CADQ;IAErCd,KAAK,EAAEwB;EAF8B,CAAvB,CAAlB;EAKA,MAAMa,SAAS,GAAG,IAAAN,YAAA,EAAI,CAClBE,SADkB,EAElB;IACIL,OAAO,EAAEjB,SAAS,GAAG,CAAH,GAAO,CAD7B;IAEI2B,SAAS,EAAE;EAFf,CAFkB,CAAJ,CAAlB;EAQA,MAAMC,mBAAmB,GAAGxC,OAAO,KAAK,MAAZ,IAAsB,CAACc,WAAvB,GACtB,OADsB,GAEtBA,WAFN;;EAIA,MAAM2B,WAAW,GAAG,YAAY;IAC5B,IAAInC,QAAJ,EAAc;MACV;IACH;;IACD,IAAIO,OAAJ,EAAa;MACTA,OAAO;MACP;IACH;;IACD,IAAIF,IAAJ,EAAU;MACN,IAAI,MAAM+B,oBAAA,CAAQC,UAAR,CAAmBhC,IAAnB,CAAV,EAAoC;QAChC,MAAM+B,oBAAA,CAAQE,OAAR,CAAgBjC,IAAhB,CAAN;MACH;IACJ;EACJ,CAbD;;EAeA,MAAMkC,mBAAmB,GAAG9C,sBAAsB,CAACC,OAAD,EAAUC,KAAV,CAAlD;EAEA,oBACI,6BAAC,mBAAD;IACI,QAAQ,EAAEK,QADd;IAEI,OAAO,EAAEmC,WAFb;IAGI,KAAK,EAAEV,eAHX;IAII,WAAW,EAAES;EAJjB,GAKQpB,UALR,GAOKJ,SAPL,eASI,6BAAC,iBAAD;IAAM,KAAK,EAAEsB;EAAb,GACKlC,QADL,CATJ,EAaKK,OAbL,EAeKG,SAAS,gBACN,6BAAC,qBAAD;IACI,KAAK,EAAEiC,mBADX;IAEI,IAAI,EAAE9B,IAFV;IAGI,KAAK,EAAEM,MAAM,CAAC9B;EAHlB,EADM,GAMN,IArBR,CADJ;AAyBH;;AAAA"}
+{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","borderRadius","shape","radius","sm","flexDirection","justifyContent","fullWidth","width","large","gap","spacing","minWidth","paddingHorizontal","paddingVertical","medium","small","loadingSpinner","position","fontStyleMap","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","getLoadingSpinnerColor","variant","color","Button","props","children","colorProp","disabled","disabledProp","disableMinWidth","disablePadding","endIcon","endIconProp","href","isLoading","onPress","pressEffect","size","startIcon","startIconProp","style","styleProp","otherProps","styles","container","containerStyle","iconColor","labelColor","useVariantStyleMap","iconProps","fill","opacity","cloneElementSafely","buttonBaseStyle","css","undefined","fontStyle","createFontStyle","selector","_","textStyle","textAlign","modifiedPressEffect","handlePress","Linking","canOpenURL","openURL","loadingSpinnerColor"],"sources":["Button.tsx"],"sourcesContent":["import React from 'react';\nimport { Linking, Text } from 'react-native';\nimport type { FontStyle, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase/ButtonBase';\nimport { LoadingSpinner } from '../internal/icons';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport type ButtonProps from './ButtonProps';\nimport type { ButtonColor, ButtonSize, ButtonVariant } from './ButtonProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\ntype ButtonStyles = NamedStylesStringUnion<'root' | 'fullWidth' | 'large' | 'medium' | 'small' | 'loadingSpinner'>;\n\nconst useStyles: UseStyles<ButtonStyles> = function (): ButtonStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            borderRadius: theme.shape.radius.sm,\n            flexDirection: 'row',\n            justifyContent: 'center',\n        },\n        fullWidth: {\n            width: '100%',\n        },\n        large: {\n            gap: theme.spacing(2),\n            minWidth: 104,\n            paddingHorizontal: theme.spacing(6),\n            paddingVertical: theme.spacing(3.5),\n        },\n        medium: {\n            gap: theme.spacing(1.5),\n            minWidth: 88,\n            paddingHorizontal: theme.spacing(6),\n            paddingVertical: theme.spacing(2.75),\n        },\n        small: {\n            minWidth: 64,\n            paddingHorizontal: theme.spacing(6),\n            paddingVertical: theme.spacing(2),\n        },\n        loadingSpinner: {\n            position: 'absolute',\n        },\n    };\n};\n\nconst fontStyleMap: Record<ButtonSize, FontStyle> = {\n    large: typographyOf({\n        fontSize: 16,\n        lineHeight: 20,\n        fontFamily: 'LexendDeca-SemiBold',\n        letterSpacing: -0.32,\n    }),\n    medium: typographyOf({\n        fontSize: 15,\n        lineHeight: 19.5,\n        fontFamily: 'LexendDeca-SemiBold',\n        letterSpacing: -0.3,\n    }),\n    small: typographyOf({\n        fontSize: 13,\n        lineHeight: 16.9,\n        fontFamily: 'LexendDeca-SemiBold',\n        letterSpacing: -0.26,\n    }),\n};\n\nfunction getLoadingSpinnerColor(variant: ButtonVariant, color: ButtonColor) {\n    if (variant === 'solid' || (variant === 'capsuleSolid' && color !== 'secondary')) {\n        return 'white';\n    }\n    return 'gray';\n}\n\nexport default function Button(props: ButtonProps) {\n    const {\n        children,\n        color: colorProp = 'primary' as ButtonColor,\n        disabled: disabledProp = false,\n        disableMinWidth = false,\n        disablePadding = false,\n        endIcon: endIconProp,\n        fullWidth = false,\n        href,\n        isLoading = false,\n        onPress,\n        pressEffect,\n        size = 'medium' as ButtonSize,\n        startIcon: startIconProp,\n        style: styleProp,\n        variant = 'solid' as ButtonVariant,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const disabled = disabledProp || isLoading;\n\n    const color = disabledProp ? 'disabled' : colorProp;\n    const {\n        container: containerStyle,\n        iconColor,\n        labelColor,\n    } = useVariantStyleMap(variant, color);\n\n    const iconProps = {\n        fill: iconColor,\n        opacity: isLoading ? 0 : 1,\n    };\n\n    const startIcon = cloneElementSafely(startIconProp, iconProps);\n    const endIcon = cloneElementSafely(endIconProp, iconProps);\n\n    const buttonBaseStyle = css([\n        styles.root,\n        containerStyle,\n        styles[size],\n        fullWidth ? styles.fullWidth : undefined,\n        disableMinWidth ? { minWidth: 0 } : undefined,\n        disablePadding ? { paddingHorizontal: 0, paddingVertical: 0 } : undefined,\n        styleProp,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (_) => fontStyleMap[size],\n        color: labelColor,\n    });\n\n    const textStyle = css([\n        fontStyle,\n        {\n            opacity: isLoading ? 0 : 1,\n            textAlign: 'center',\n        },\n    ]);\n\n    const modifiedPressEffect = variant !== 'text' && !pressEffect\n        ? 'scale'\n        : pressEffect;\n\n    const handlePress = async () => {\n        if (disabled) {\n            return;\n        }\n        if (onPress) {\n            onPress();\n            return;\n        }\n        if (href) {\n            if (await Linking.canOpenURL(href)) {\n                await Linking.openURL(href);\n            }\n        }\n    };\n\n    const loadingSpinnerColor = getLoadingSpinnerColor(variant, color);\n\n    return (\n        <ButtonBase\n            disabled={disabled}\n            onPress={handlePress}\n            style={buttonBaseStyle}\n            pressEffect={modifiedPressEffect}\n            {...otherProps}\n        >\n            {startIcon}\n\n            <Text style={textStyle}>\n                {children}\n            </Text>\n\n            {endIcon}\n\n            {isLoading ? (\n                <LoadingSpinner\n                    color={loadingSpinnerColor}\n                    size={size}\n                    style={styles.loadingSpinner}\n                />\n            ) : null}\n        </ButtonBase>\n    );\n};\n"],"mappings":"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"}

package/build/commonjs/Button/ButtonProps.js.map

@@ -1 +1 @@
-{"version":3,"names":["buttonColors","buttonSizes","buttonVariants"],"sources":["ButtonProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ButtonBaseProps } from '../ButtonBase';\nimport type { OverridableComponentProps } from '../types';\n\nexport const buttonColors = [\n    'accent',\n    'primary',\n    'danger',\n    'disabled',\n    'secondary',\n    'accentAlt',\n] as const;\nexport type ButtonColor = typeof buttonColors[number];\n\nexport const buttonSizes = [\n    'small',\n    'medium',\n    'large',\n] as const;\nexport type ButtonSize = typeof buttonSizes[number];\n\nexport const buttonVariants = [\n    'solid',\n    'outlined',\n    'text',\n    'capsuleSolid',\n    'capsuleOutlined',\n] as const;\nexport type ButtonVariant = typeof buttonVariants[number];\n\nexport default interface ButtonProps extends OverridableComponentProps<ButtonBaseProps, {\n    /**\n     * The content of the button.\n     */\n    children: string;\n\n    /**\n     * The color of the component. It supports those theme colors that make sense for this component.\n     * @default 'primary'\n     */\n    color?: ButtonColor;\n\n    /**\n     * Determines whether minWidth should be applied.\n     * @default false\n     */\n    disableMinWidth?: boolean;\n\n    /**\n     * Element placed after the children.\n     */\n    endIcon?: React.ReactElement;\n\n    /**\n     * If `true`, the button will take up the full width of its container.\n     * @default false\n     */\n    fullWidth?: boolean;\n\n    /**\n     * The URL to link to when the button is clicked.\n     */\n    href?: string;\n\n    /**\n     * Determines whether to show the loading status or not.\n     * @default false\n     */\n    isLoading?: boolean;\n\n    /**\n     * The size of the button.\n     * @default 'medium'\n     */\n    size?: ButtonSize;\n\n    /**\n     * Element placed before the children.\n     */\n    startIcon?: React.ReactElement;\n\n    /**\n     * The variant to use.\n     * @default 'solid'\n     */\n    variant?: ButtonVariant;\n}> {}\n"],"mappings":";;;;;;AAIO,MAAMA,YAAY,GAAG,CACxB,QADwB,EAExB,SAFwB,EAGxB,QAHwB,EAIxB,UAJwB,EAKxB,WALwB,EAMxB,WANwB,CAArB;;AAUA,MAAMC,WAAW,GAAG,CACvB,OADuB,EAEvB,QAFuB,EAGvB,OAHuB,CAApB;;AAOA,MAAMC,cAAc,GAAG,CAC1B,OAD0B,EAE1B,UAF0B,EAG1B,MAH0B,EAI1B,cAJ0B,EAK1B,iBAL0B,CAAvB"}
+{"version":3,"names":["buttonColors","buttonSizes","buttonVariants"],"sources":["ButtonProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ButtonBaseProps } from '../ButtonBase';\nimport type { OverridableComponentProps } from '../types';\n\nexport const buttonColors = [\n    'accent',\n    'primary',\n    'danger',\n    'disabled',\n    'secondary',\n    'accentAlt',\n] as const;\nexport type ButtonColor = typeof buttonColors[number];\n\nexport const buttonSizes = [\n    'small',\n    'medium',\n    'large',\n] as const;\nexport type ButtonSize = typeof buttonSizes[number];\n\nexport const buttonVariants = [\n    'solid',\n    'outlined',\n    'text',\n    'capsuleSolid',\n    'capsuleOutlined',\n] as const;\nexport type ButtonVariant = typeof buttonVariants[number];\n\nexport default interface ButtonProps extends OverridableComponentProps<ButtonBaseProps, {\n    /**\n     * The content of the button.\n     */\n    children: string;\n\n    /**\n     * The color of the component. It supports those theme colors that make sense for this component.\n     * @default 'primary'\n     */\n    color?: ButtonColor;\n\n    /**\n     * Determines whether minWidth should be applied.\n     * @default false\n     */\n    disableMinWidth?: boolean;\n\n    /**\n     * Determines whether padding should be applied.\n     * @default false\n     */\n    disablePadding?: boolean;\n\n    /**\n     * Element placed after the children.\n     */\n    endIcon?: React.ReactElement;\n\n    /**\n     * If `true`, the button will take up the full width of its container.\n     * @default false\n     */\n    fullWidth?: boolean;\n\n    /**\n     * The URL to link to when the button is clicked.\n     */\n    href?: string;\n\n    /**\n     * Determines whether to show the loading status or not.\n     * @default false\n     */\n    isLoading?: boolean;\n\n    /**\n     * The size of the button.\n     * @default 'medium'\n     */\n    size?: ButtonSize;\n\n    /**\n     * Element placed before the children.\n     */\n    startIcon?: React.ReactElement;\n\n    /**\n     * The variant to use.\n     * @default 'solid'\n     */\n    variant?: ButtonVariant;\n}> {}\n"],"mappings":";;;;;;AAIO,MAAMA,YAAY,GAAG,CACxB,QADwB,EAExB,SAFwB,EAGxB,QAHwB,EAIxB,UAJwB,EAKxB,WALwB,EAMxB,WANwB,CAArB;;AAUA,MAAMC,WAAW,GAAG,CACvB,OADuB,EAEvB,QAFuB,EAGvB,OAHuB,CAApB;;AAOA,MAAMC,cAAc,GAAG,CAC1B,OAD0B,EAE1B,UAF0B,EAG1B,MAH0B,EAI1B,cAJ0B,EAK1B,iBAL0B,CAAvB"}

package/build/commonjs/Checkbox/Checkbox.js

@@ -35,6 +35,7 @@ function Checkbox(props) {
   } = props;
   const theme = (0, _styles.useTheme)();
   const {
+    checkboxContainerStyle,
     checkboxStyle,
     containerStyle,
     iconColor
@@ -56,12 +57,14 @@ function Checkbox(props) {
     onPress: handlePress,
     style: rootStyle
   }, otherProps), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: checkboxContainerStyle
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: checkboxStyle
   }, checked ? /*#__PURE__*/_react.default.createElement(_icons.CheckboxOn, {
     fill: iconColor,
     height: 7.5,
     width: 11
-  }) : null), children ? /*#__PURE__*/_react.default.createElement(_Row.default, {
+  }) : null)), children ? /*#__PURE__*/_react.default.createElement(_Row.default, {
     flexGrow: 1,
     flexShrink: 1
   }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {

package/build/commonjs/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"names":["Checkbox","props","checked","children","disabled","onChange","style","styleProp","variant","otherProps","theme","useTheme","checkboxStyle","containerStyle","iconColor","useVariantStyleMap","rootStyle","css","undefined","fontStyle","createFontStyle","selector","typography","body2","regular","color","palette","text","strong","handlePress"],"sources":["Checkbox.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport ButtonBase from '../ButtonBase';\nimport { CheckboxOn as CheckboxOnIcon } from '../internal/icons';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type CheckboxProps from './CheckboxProps';\nimport type { CheckboxVariant } from './CheckboxProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nexport default function Checkbox(props: CheckboxProps) {\n    const {\n        checked = false,\n        children,\n        disabled = false,\n        onChange,\n        style: styleProp,\n        variant = 'square' as CheckboxVariant,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const {\n        checkboxStyle,\n        containerStyle,\n        iconColor,\n    } = useVariantStyleMap(variant, checked);\n\n    const rootStyle = css([\n        children ? containerStyle : undefined,\n        styleProp,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typography) => typography.body2.regular,\n        color: theme.palette.text.strong,\n    });\n\n    const handlePress = () => {\n        if (onChange) {\n            onChange(!checked);\n        }\n    };\n\n    return (\n        <ButtonBase\n            disabled={disabled}\n            onPress={handlePress}\n            style={rootStyle}\n            {...otherProps}\n        >\n            <View style={checkboxStyle}>\n                {checked ? (\n                    <CheckboxOnIcon\n                        fill={iconColor}\n                        height={7.5}\n                        width={11}\n                    />\n                ) : null}\n            </View>\n\n            {children ? (\n                <Row\n                    flexGrow={1}\n                    flexShrink={1}\n                >\n                    <Text\n                        children={children}\n                        style={fontStyle}\n                    />\n                </Row>\n            ) : null}\n        </ButtonBase>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;;;;;AAEe,SAASA,QAAT,CAAkBC,KAAlB,EAAwC;EACnD,MAAM;IACFC,OAAO,GAAG,KADR;IAEFC,QAFE;IAGFC,QAAQ,GAAG,KAHT;IAIFC,QAJE;IAKFC,KAAK,EAAEC,SALL;IAMFC,OAAO,GAAG,QANR;IAOF,GAAGC;EAPD,IAQFR,KARJ;EAUA,MAAMS,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAM;IACFC,aADE;IAEFC,cAFE;IAGFC;EAHE,IAIF,IAAAC,2BAAA,EAAmBP,OAAnB,EAA4BN,OAA5B,CAJJ;EAMA,MAAMc,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBd,QAAQ,GAAGU,cAAH,GAAoBK,SADV,EAElBX,SAFkB,CAAJ,CAAlB;EAKA,MAAMY,SAAS,GAAG,IAAAC,uBAAA,EAAgBV,KAAhB,EAAuB;IACrCW,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,KAAX,CAAiBC,OADN;IAErCC,KAAK,EAAEf,KAAK,CAACgB,OAAN,CAAcC,IAAd,CAAmBC;EAFW,CAAvB,CAAlB;;EAKA,MAAMC,WAAW,GAAG,MAAM;IACtB,IAAIxB,QAAJ,EAAc;MACVA,QAAQ,CAAC,CAACH,OAAF,CAAR;IACH;EACJ,CAJD;;EAMA,oBACI,6BAAC,mBAAD;IACI,QAAQ,EAAEE,QADd;IAEI,OAAO,EAAEyB,WAFb;IAGI,KAAK,EAAEb;EAHX,GAIQP,UAJR,gBAMI,6BAAC,iBAAD;IAAM,KAAK,EAAEG;EAAb,GACKV,OAAO,gBACJ,6BAAC,iBAAD;IACI,IAAI,EAAEY,SADV;IAEI,MAAM,EAAE,GAFZ;IAGI,KAAK,EAAE;EAHX,EADI,GAMJ,IAPR,CANJ,EAgBKX,QAAQ,gBACL,6BAAC,YAAD;IACI,QAAQ,EAAE,CADd;IAEI,UAAU,EAAE;EAFhB,gBAII,6BAAC,iBAAD;IACI,QAAQ,EAAEA,QADd;IAEI,KAAK,EAAEgB;EAFX,EAJJ,CADK,GAUL,IA1BR,CADJ;AA8BH;;AAAA"}
+{"version":3,"names":["Checkbox","props","checked","children","disabled","onChange","style","styleProp","variant","otherProps","theme","useTheme","checkboxContainerStyle","checkboxStyle","containerStyle","iconColor","useVariantStyleMap","rootStyle","css","undefined","fontStyle","createFontStyle","selector","typography","body2","regular","color","palette","text","strong","handlePress"],"sources":["Checkbox.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport ButtonBase from '../ButtonBase';\nimport { CheckboxOn as CheckboxOnIcon } from '../internal/icons';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type CheckboxProps from './CheckboxProps';\nimport type { CheckboxVariant } from './CheckboxProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nexport default function Checkbox(props: CheckboxProps) {\n    const {\n        checked = false,\n        children,\n        disabled = false,\n        onChange,\n        style: styleProp,\n        variant = 'square' as CheckboxVariant,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const {\n        checkboxContainerStyle,\n        checkboxStyle,\n        containerStyle,\n        iconColor,\n    } = useVariantStyleMap(variant, checked);\n\n    const rootStyle = css([\n        children ? containerStyle : undefined,\n        styleProp,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typography) => typography.body2.regular,\n        color: theme.palette.text.strong,\n    });\n\n    const handlePress = () => {\n        if (onChange) {\n            onChange(!checked);\n        }\n    };\n\n    return (\n        <ButtonBase\n            disabled={disabled}\n            onPress={handlePress}\n            style={rootStyle}\n            {...otherProps}\n        >\n            <View style={checkboxContainerStyle}>\n                <View style={checkboxStyle}>\n                    {checked ? (\n                        <CheckboxOnIcon\n                            fill={iconColor}\n                            height={7.5}\n                            width={11}\n                        />\n                    ) : null}\n                </View>\n            </View>\n\n            {children ? (\n                <Row\n                    flexGrow={1}\n                    flexShrink={1}\n                >\n                    <Text\n                        children={children}\n                        style={fontStyle}\n                    />\n                </Row>\n            ) : null}\n        </ButtonBase>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;;;;;AAEe,SAASA,QAAT,CAAkBC,KAAlB,EAAwC;EACnD,MAAM;IACFC,OAAO,GAAG,KADR;IAEFC,QAFE;IAGFC,QAAQ,GAAG,KAHT;IAIFC,QAJE;IAKFC,KAAK,EAAEC,SALL;IAMFC,OAAO,GAAG,QANR;IAOF,GAAGC;EAPD,IAQFR,KARJ;EAUA,MAAMS,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAM;IACFC,sBADE;IAEFC,aAFE;IAGFC,cAHE;IAIFC;EAJE,IAKF,IAAAC,2BAAA,EAAmBR,OAAnB,EAA4BN,OAA5B,CALJ;EAOA,MAAMe,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBf,QAAQ,GAAGW,cAAH,GAAoBK,SADV,EAElBZ,SAFkB,CAAJ,CAAlB;EAKA,MAAMa,SAAS,GAAG,IAAAC,uBAAA,EAAgBX,KAAhB,EAAuB;IACrCY,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,KAAX,CAAiBC,OADN;IAErCC,KAAK,EAAEhB,KAAK,CAACiB,OAAN,CAAcC,IAAd,CAAmBC;EAFW,CAAvB,CAAlB;;EAKA,MAAMC,WAAW,GAAG,MAAM;IACtB,IAAIzB,QAAJ,EAAc;MACVA,QAAQ,CAAC,CAACH,OAAF,CAAR;IACH;EACJ,CAJD;;EAMA,oBACI,6BAAC,mBAAD;IACI,QAAQ,EAAEE,QADd;IAEI,OAAO,EAAE0B,WAFb;IAGI,KAAK,EAAEb;EAHX,GAIQR,UAJR,gBAMI,6BAAC,iBAAD;IAAM,KAAK,EAAEG;EAAb,gBACI,6BAAC,iBAAD;IAAM,KAAK,EAAEC;EAAb,GACKX,OAAO,gBACJ,6BAAC,iBAAD;IACI,IAAI,EAAEa,SADV;IAEI,MAAM,EAAE,GAFZ;IAGI,KAAK,EAAE;EAHX,EADI,GAMJ,IAPR,CADJ,CANJ,EAkBKZ,QAAQ,gBACL,6BAAC,YAAD;IACI,QAAQ,EAAE,CADd;IAEI,UAAU,EAAE;EAFhB,gBAII,6BAAC,iBAAD;IACI,QAAQ,EAAEA,QADd;IAEI,KAAK,EAAEiB;EAFX,EAJJ,CADK,GAUL,IA5BR,CADJ;AAgCH;;AAAA"}

package/build/commonjs/Checkbox/useVariantStyleMap.js

@@ -25,6 +25,10 @@ function useVariantStyleMap(variant, checked) {
   switch (variant) {
     case 'square':
       return {
+        checkboxContainerStyle: {
+          alignSelf: 'flex-start',
+          paddingTop: 3
+        },
         checkboxStyle: (0, _styles2.css)([styles.checkbox, {
           borderColor: theme.palette.border.base,
           borderRadius: theme.shape.radius.xs,
@@ -36,9 +40,9 @@ function useVariantStyleMap(variant, checked) {
           } : {})
         }]),
         containerStyle: {
-          alignItems: 'center',
           flexDirection: 'row',
-          gap: theme.spacing(3)
+          gap: theme.spacing(3),
+          paddingVertical: theme.spacing(2)
         },
         iconColor: theme.palette.fill.baseAlt
       };

package/build/commonjs/Checkbox/useVariantStyleMap.js.map

@@ -1 +1 @@
-{"version":3,"names":["styles","StyleSheet","create","checkbox","alignItems","borderWidth","justifyContent","useVariantStyleMap","variant","checked","theme","useTheme","checkboxStyle","css","borderColor","palette","border","base","borderRadius","shape","radius","xs","height","width","backgroundColor","fill","containerStyle","flexDirection","gap","spacing","iconColor","baseAlt","full","accent","borderBottomColor","weak","borderBottomWidth","paddingVertical","commonColors","static","strongInverse"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { StyleSheet } from 'react-native';\nimport { commonColors, FountainUiStyle } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type { CheckboxVariant } from './CheckboxProps';\n\nconst styles = StyleSheet.create({\n    checkbox: {\n        alignItems: 'center',\n        borderWidth: 1,\n        justifyContent: 'center',\n    },\n});\n\ntype useVariantStyleMapReturns = {\n    checkboxStyle?: FountainUiStyle;\n    containerStyle?: FountainUiStyle;\n    iconColor?: string;\n};\n\nexport default function useVariantStyleMap(variant: CheckboxVariant, checked: boolean): useVariantStyleMapReturns {\n    const theme = useTheme();\n\n    switch (variant) {\n        case 'square':\n            return {\n                checkboxStyle: css([\n                    styles.checkbox,\n                    {\n                        borderColor: theme.palette.border.base,\n                        borderRadius: theme.shape.radius.xs,\n                        height: 18,\n                        width: 18,\n                        ...(checked ? {\n                            backgroundColor: theme.palette.fill.base,\n                            borderColor: theme.palette.fill.base,\n                        } : {}),\n                    },\n                ]),\n                containerStyle: {\n                    alignItems: 'center',\n                    flexDirection: 'row',\n                    gap: theme.spacing(3),\n                },\n                iconColor: theme.palette.fill.baseAlt,\n            };\n        case 'round':\n            return {\n                checkboxStyle: css([\n                    styles.checkbox,\n                    {\n                        borderColor: theme.palette.border.base,\n                        borderRadius: theme.shape.radius.full,\n                        height: 20,\n                        width: 20,\n                        ...(checked ? {\n                            backgroundColor: theme.palette.fill.accent,\n                            borderColor: theme.palette.fill.accent,\n                        } : {}),\n                    },\n                ]),\n                containerStyle: {\n                    alignItems: 'center',\n                    borderBottomColor: theme.palette.border.weak,\n                    borderBottomWidth: 0.5,\n                    flexDirection: 'row-reverse',\n                    gap: theme.spacing(8),\n                    paddingVertical: theme.spacing(3.5),\n                },\n                iconColor: commonColors.static.strongInverse,\n            };\n        default:\n            return {};\n    }\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAGA,MAAMA,MAAM,GAAGC,uBAAA,CAAWC,MAAX,CAAkB;EAC7BC,QAAQ,EAAE;IACNC,UAAU,EAAE,QADN;IAENC,WAAW,EAAE,CAFP;IAGNC,cAAc,EAAE;EAHV;AADmB,CAAlB,CAAf;;AAce,SAASC,kBAAT,CAA4BC,OAA5B,EAAsDC,OAAtD,EAAmG;EAC9G,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;;EAEA,QAAQH,OAAR;IACI,KAAK,QAAL;MACI,OAAO;QACHI,aAAa,EAAE,IAAAC,YAAA,EAAI,CACfb,MAAM,CAACG,QADQ,EAEf;UACIW,WAAW,EAAEJ,KAAK,CAACK,OAAN,CAAcC,MAAd,CAAqBC,IADtC;UAEIC,YAAY,EAAER,KAAK,CAACS,KAAN,CAAYC,MAAZ,CAAmBC,EAFrC;UAGIC,MAAM,EAAE,EAHZ;UAIIC,KAAK,EAAE,EAJX;UAKI,IAAId,OAAO,GAAG;YACVe,eAAe,EAAEd,KAAK,CAACK,OAAN,CAAcU,IAAd,CAAmBR,IAD1B;YAEVH,WAAW,EAAEJ,KAAK,CAACK,OAAN,CAAcU,IAAd,CAAmBR;UAFtB,CAAH,GAGP,EAHJ;QALJ,CAFe,CAAJ,CADZ;QAcHS,cAAc,EAAE;UACZtB,UAAU,EAAE,QADA;UAEZuB,aAAa,EAAE,KAFH;UAGZC,GAAG,EAAElB,KAAK,CAACmB,OAAN,CAAc,CAAd;QAHO,CAdb;QAmBHC,SAAS,EAAEpB,KAAK,CAACK,OAAN,CAAcU,IAAd,CAAmBM;MAnB3B,CAAP;;IAqBJ,KAAK,OAAL;MACI,OAAO;QACHnB,aAAa,EAAE,IAAAC,YAAA,EAAI,CACfb,MAAM,CAACG,QADQ,EAEf;UACIW,WAAW,EAAEJ,KAAK,CAACK,OAAN,CAAcC,MAAd,CAAqBC,IADtC;UAEIC,YAAY,EAAER,KAAK,CAACS,KAAN,CAAYC,MAAZ,CAAmBY,IAFrC;UAGIV,MAAM,EAAE,EAHZ;UAIIC,KAAK,EAAE,EAJX;UAKI,IAAId,OAAO,GAAG;YACVe,eAAe,EAAEd,KAAK,CAACK,OAAN,CAAcU,IAAd,CAAmBQ,MAD1B;YAEVnB,WAAW,EAAEJ,KAAK,CAACK,OAAN,CAAcU,IAAd,CAAmBQ;UAFtB,CAAH,GAGP,EAHJ;QALJ,CAFe,CAAJ,CADZ;QAcHP,cAAc,EAAE;UACZtB,UAAU,EAAE,QADA;UAEZ8B,iBAAiB,EAAExB,KAAK,CAACK,OAAN,CAAcC,MAAd,CAAqBmB,IAF5B;UAGZC,iBAAiB,EAAE,GAHP;UAIZT,aAAa,EAAE,aAJH;UAKZC,GAAG,EAAElB,KAAK,CAACmB,OAAN,CAAc,CAAd,CALO;UAMZQ,eAAe,EAAE3B,KAAK,CAACmB,OAAN,CAAc,GAAd;QANL,CAdb;QAsBHC,SAAS,EAAEQ,oBAAA,CAAaC,MAAb,CAAoBC;MAtB5B,CAAP;;IAwBJ;MACI,OAAO,EAAP;EAjDR;AAmDH"}
+{"version":3,"names":["styles","StyleSheet","create","checkbox","alignItems","borderWidth","justifyContent","useVariantStyleMap","variant","checked","theme","useTheme","checkboxContainerStyle","alignSelf","paddingTop","checkboxStyle","css","borderColor","palette","border","base","borderRadius","shape","radius","xs","height","width","backgroundColor","fill","containerStyle","flexDirection","gap","spacing","paddingVertical","iconColor","baseAlt","full","accent","borderBottomColor","weak","borderBottomWidth","commonColors","static","strongInverse"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { StyleSheet } from 'react-native';\nimport { commonColors, FountainUiStyle } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type { CheckboxVariant } from './CheckboxProps';\n\nconst styles = StyleSheet.create({\n    checkbox: {\n        alignItems: 'center',\n        borderWidth: 1,\n        justifyContent: 'center',\n    },\n});\n\ntype useVariantStyleMapReturns = {\n    checkboxContainerStyle?: FountainUiStyle;\n    checkboxStyle?: FountainUiStyle;\n    containerStyle?: FountainUiStyle;\n    iconColor?: string;\n};\n\nexport default function useVariantStyleMap(variant: CheckboxVariant, checked: boolean): useVariantStyleMapReturns {\n    const theme = useTheme();\n\n    switch (variant) {\n        case 'square':\n            return {\n                checkboxContainerStyle: {\n                    alignSelf: 'flex-start',\n                    paddingTop: 3,\n                },\n                checkboxStyle: css([\n                    styles.checkbox,\n                    {\n                        borderColor: theme.palette.border.base,\n                        borderRadius: theme.shape.radius.xs,\n                        height: 18,\n                        width: 18,\n                        ...(checked ? {\n                            backgroundColor: theme.palette.fill.base,\n                            borderColor: theme.palette.fill.base,\n                        } : {}),\n                    },\n                ]),\n                containerStyle: {\n                    flexDirection: 'row',\n                    gap: theme.spacing(3),\n                    paddingVertical: theme.spacing(2),\n                },\n                iconColor: theme.palette.fill.baseAlt,\n            };\n        case 'round':\n            return {\n                checkboxStyle: css([\n                    styles.checkbox,\n                    {\n                        borderColor: theme.palette.border.base,\n                        borderRadius: theme.shape.radius.full,\n                        height: 20,\n                        width: 20,\n                        ...(checked ? {\n                            backgroundColor: theme.palette.fill.accent,\n                            borderColor: theme.palette.fill.accent,\n                        } : {}),\n                    },\n                ]),\n                containerStyle: {\n                    alignItems: 'center',\n                    borderBottomColor: theme.palette.border.weak,\n                    borderBottomWidth: 0.5,\n                    flexDirection: 'row-reverse',\n                    gap: theme.spacing(8),\n                    paddingVertical: theme.spacing(3.5),\n                },\n                iconColor: commonColors.static.strongInverse,\n            };\n        default:\n            return {};\n    }\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAGA,MAAMA,MAAM,GAAGC,uBAAA,CAAWC,MAAX,CAAkB;EAC7BC,QAAQ,EAAE;IACNC,UAAU,EAAE,QADN;IAENC,WAAW,EAAE,CAFP;IAGNC,cAAc,EAAE;EAHV;AADmB,CAAlB,CAAf;;AAee,SAASC,kBAAT,CAA4BC,OAA5B,EAAsDC,OAAtD,EAAmG;EAC9G,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;;EAEA,QAAQH,OAAR;IACI,KAAK,QAAL;MACI,OAAO;QACHI,sBAAsB,EAAE;UACpBC,SAAS,EAAE,YADS;UAEpBC,UAAU,EAAE;QAFQ,CADrB;QAKHC,aAAa,EAAE,IAAAC,YAAA,EAAI,CACfhB,MAAM,CAACG,QADQ,EAEf;UACIc,WAAW,EAAEP,KAAK,CAACQ,OAAN,CAAcC,MAAd,CAAqBC,IADtC;UAEIC,YAAY,EAAEX,KAAK,CAACY,KAAN,CAAYC,MAAZ,CAAmBC,EAFrC;UAGIC,MAAM,EAAE,EAHZ;UAIIC,KAAK,EAAE,EAJX;UAKI,IAAIjB,OAAO,GAAG;YACVkB,eAAe,EAAEjB,KAAK,CAACQ,OAAN,CAAcU,IAAd,CAAmBR,IAD1B;YAEVH,WAAW,EAAEP,KAAK,CAACQ,OAAN,CAAcU,IAAd,CAAmBR;UAFtB,CAAH,GAGP,EAHJ;QALJ,CAFe,CAAJ,CALZ;QAkBHS,cAAc,EAAE;UACZC,aAAa,EAAE,KADH;UAEZC,GAAG,EAAErB,KAAK,CAACsB,OAAN,CAAc,CAAd,CAFO;UAGZC,eAAe,EAAEvB,KAAK,CAACsB,OAAN,CAAc,CAAd;QAHL,CAlBb;QAuBHE,SAAS,EAAExB,KAAK,CAACQ,OAAN,CAAcU,IAAd,CAAmBO;MAvB3B,CAAP;;IAyBJ,KAAK,OAAL;MACI,OAAO;QACHpB,aAAa,EAAE,IAAAC,YAAA,EAAI,CACfhB,MAAM,CAACG,QADQ,EAEf;UACIc,WAAW,EAAEP,KAAK,CAACQ,OAAN,CAAcC,MAAd,CAAqBC,IADtC;UAEIC,YAAY,EAAEX,KAAK,CAACY,KAAN,CAAYC,MAAZ,CAAmBa,IAFrC;UAGIX,MAAM,EAAE,EAHZ;UAIIC,KAAK,EAAE,EAJX;UAKI,IAAIjB,OAAO,GAAG;YACVkB,eAAe,EAAEjB,KAAK,CAACQ,OAAN,CAAcU,IAAd,CAAmBS,MAD1B;YAEVpB,WAAW,EAAEP,KAAK,CAACQ,OAAN,CAAcU,IAAd,CAAmBS;UAFtB,CAAH,GAGP,EAHJ;QALJ,CAFe,CAAJ,CADZ;QAcHR,cAAc,EAAE;UACZzB,UAAU,EAAE,QADA;UAEZkC,iBAAiB,EAAE5B,KAAK,CAACQ,OAAN,CAAcC,MAAd,CAAqBoB,IAF5B;UAGZC,iBAAiB,EAAE,GAHP;UAIZV,aAAa,EAAE,aAJH;UAKZC,GAAG,EAAErB,KAAK,CAACsB,OAAN,CAAc,CAAd,CALO;UAMZC,eAAe,EAAEvB,KAAK,CAACsB,OAAN,CAAc,GAAd;QANL,CAdb;QAsBHE,SAAS,EAAEO,oBAAA,CAAaC,MAAb,CAAoBC;MAtB5B,CAAP;;IAwBJ;MACI,OAAO,EAAP;EArDR;AAuDH"}

package/build/commonjs/Empty/Empty.js

@@ -57,7 +57,7 @@ function Empty(props) {
     color: theme.palette.text.strong
   });
   const descriptionFontStyle = (0, _styles.createFontStyle)(theme, {
-    selector: typography => typography.body2.regular,
+    selector: typography => typography.body3.regular,
     color: theme.palette.text.base
   });
   return /*#__PURE__*/_react.default.createElement(_Column.default, _extends({

package/build/commonjs/Empty/Empty.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","flex","justifyContent","paddingHorizontal","spacing","cta","alignSelf","Empty","props","buttonTitle","description","headerContent","headerContentProp","onButtonPress","style","styleProp","title","otherProps","styles","rootStyle","css","cloneElementSafely","titleFontStyle","createFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","descriptionFontStyle","body2","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.body2.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;;AACA;;AAEA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAKA,MAAMA,SAAiC,GAAG,YAAyB;EAC/D,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,IAAI,EAAE,CAFJ;MAGFC,cAAc,EAAE,QAHd;MAIFC,iBAAiB,EAAEN,KAAK,CAACO,OAAN,CAAc,CAAd;IAJjB,CADH;IAOHC,GAAG,EAAE;MACDC,SAAS,EAAE;IADV;EAPF,CAAP;AAWH,CAdD;;AAgBe,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,GAAGtB,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMqB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACnB,IADW,EAElBgB,SAFkB,CAAJ,CAAlB;EAKA,MAAMJ,aAAa,GAAG,IAAAU,yBAAA,EAAmBT,iBAAnB,CAAtB;EAEA,MAAMU,cAAc,GAAG,IAAAC,uBAAA,EAAgB1B,KAAhB,EAAuB;IAC1C2B,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAE/B,KAAK,CAACgC,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAvB,CAAvB;EAKA,MAAMC,oBAAoB,GAAG,IAAAT,uBAAA,EAAgB1B,KAAhB,EAAuB;IAChD2B,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACQ,KAAX,CAAiBC,OADK;IAEhDN,KAAK,EAAE/B,KAAK,CAACgC,OAAN,CAAcC,IAAd,CAAmBK;EAFsB,CAAvB,CAA7B;EAKA,oBACI,6BAAC,eAAD;IACI,KAAK,EAAEhB;EADX,GAEQF,UAFR,GAIKN,aAAa,gBACV,6BAAC,cAAD,CAAO,QAAP,QACKA,aADL,eAGI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADU,GAMV,IAVR,eAYI,6BAAC,iBAAD;IACI,QAAQ,EAAEK,KADd;IAEI,KAAK,EAAEM;EAFX,EAZJ,EAiBKZ,WAAW,gBACR,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,6BAAC,iBAAD;IACI,QAAQ,EAAEA,WADd;IAEI,KAAK,EAAEsB;EAFX,EAHJ,CADQ,GASR,IA1BR,EA4BKvB,WAAW,IAAII,aAAf,gBACG,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,6BAAC,eAAD;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"}
+{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","flex","justifyContent","paddingHorizontal","spacing","cta","alignSelf","Empty","props","buttonTitle","description","headerContent","headerContentProp","onButtonPress","style","styleProp","title","otherProps","styles","rootStyle","css","cloneElementSafely","titleFontStyle","createFontStyle","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;;AACA;;AAEA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAKA,MAAMA,SAAiC,GAAG,YAAyB;EAC/D,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,IAAI,EAAE,CAFJ;MAGFC,cAAc,EAAE,QAHd;MAIFC,iBAAiB,EAAEN,KAAK,CAACO,OAAN,CAAc,CAAd;IAJjB,CADH;IAOHC,GAAG,EAAE;MACDC,SAAS,EAAE;IADV;EAPF,CAAP;AAWH,CAdD;;AAgBe,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,GAAGtB,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMqB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACnB,IADW,EAElBgB,SAFkB,CAAJ,CAAlB;EAKA,MAAMJ,aAAa,GAAG,IAAAU,yBAAA,EAAmBT,iBAAnB,CAAtB;EAEA,MAAMU,cAAc,GAAG,IAAAC,uBAAA,EAAgB1B,KAAhB,EAAuB;IAC1C2B,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAE/B,KAAK,CAACgC,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAvB,CAAvB;EAKA,MAAMC,oBAAoB,GAAG,IAAAT,uBAAA,EAAgB1B,KAAhB,EAAuB;IAChD2B,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACQ,KAAX,CAAiBC,OADK;IAEhDN,KAAK,EAAE/B,KAAK,CAACgC,OAAN,CAAcC,IAAd,CAAmBK;EAFsB,CAAvB,CAA7B;EAKA,oBACI,6BAAC,eAAD;IACI,KAAK,EAAEhB;EADX,GAEQF,UAFR,GAIKN,aAAa,gBACV,6BAAC,cAAD,CAAO,QAAP,QACKA,aADL,eAGI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADU,GAMV,IAVR,eAYI,6BAAC,iBAAD;IACI,QAAQ,EAAEK,KADd;IAEI,KAAK,EAAEM;EAFX,EAZJ,EAiBKZ,WAAW,gBACR,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,6BAAC,iBAAD;IACI,QAAQ,EAAEA,WADd;IAEI,KAAK,EAAEsB;EAFX,EAHJ,CADQ,GASR,IA1BR,EA4BKvB,WAAW,IAAII,aAAf,gBACG,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,6BAAC,eAAD;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"}

package/build/commonjs/ListItem/ListItem.js

@@ -61,8 +61,8 @@ function ListItem(props) {
   const contentWrapperStyle = (0, _styles2.css)([styles.content, style]);
   const descriptionFontStyle = (0, _styles2.createFontStyle)(theme, {
     selector: _ => (0, _styles.typographyOf)({
-      fontSize: 13,
-      lineHeight: 18.2,
+      fontSize: 14,
+      lineHeight: 19.6,
       fontFamily: 'PretendardStd-Regular',
       letterSpacing: 0
     }),

package/build/commonjs/ListItem/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","content","gap","spacing","paddingVertical","paddingHorizontal","width","description","paddingRight","divider","borderBottomColor","palette","border","weak","borderBottomWidth","dividerWrapper","ListItem","props","alignItems","button","children","disabled","onPress","style","otherProps","styles","rootComponentProps","accessibilityRole","Platform","OS","undefined","contentWrapperStyle","css","descriptionFontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","text","base"],"sources":["ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport type { FlexStyle } from 'react-native';\nimport { Platform, Text, View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type ListItemProps from './ListItemProps';\n\ntype ListItemStyles = NamedStylesStringUnion<'content' | 'description' | 'divider' | 'dividerWrapper'>;\n\nconst useStyles: UseStyles<ListItemStyles> = function (): ListItemStyles {\n    const theme = useTheme();\n\n    return {\n        content: {\n            gap: theme.spacing(2),\n            paddingVertical: theme.spacing(3.75),\n            paddingHorizontal: theme.spacing(4),\n            width: '100%',\n        },\n        description: {\n            paddingRight: theme.spacing(20),\n        },\n        divider: {\n            borderBottomColor: theme.palette.border.weak,\n            borderBottomWidth: 0.5,\n        },\n        dividerWrapper: {\n            paddingHorizontal: theme.spacing(4),\n        },\n    };\n};\n\nexport default function ListItem(props: ListItemProps) {\n    const {\n        alignItems = 'center' as FlexStyle['alignItems'],\n        button = false,\n        children,\n        description,\n        disabled = false,\n        onPress,\n        style,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const rootComponentProps = {\n        accessibilityRole: Platform.OS === 'web' ? 'listitem' : undefined,\n        ...otherProps,\n    };\n\n    const contentWrapperStyle = css([\n        styles.content,\n        style,\n    ]);\n\n    const descriptionFontStyle = createFontStyle(theme, {\n        selector: (_) => typographyOf({\n            fontSize: 13,\n            lineHeight: 18.2,\n            fontFamily: 'PretendardStd-Regular',\n            letterSpacing: 0,\n        }),\n        color: theme.palette.text.base,\n    });\n\n    const content = (\n        <React.Fragment>\n            <Row alignItems={alignItems}>\n                {children}\n            </Row>\n\n            {description ? (\n                <Text style={css([\n                    styles.description,\n                    descriptionFontStyle,\n                ])}>\n                    {description}\n                </Text>\n            ) : null}\n        </React.Fragment>\n    );\n\n    return (\n        // @ts-ignore\n        <View {...rootComponentProps}>\n            {button ? (\n                <ButtonBase\n                    disabled={disabled}\n                    onPress={onPress}\n                    style={contentWrapperStyle}\n                >\n                    {content}\n                </ButtonBase>\n            ) : (\n                <View style={contentWrapperStyle}>\n                    {content}\n                </View>\n            )}\n\n            <View style={styles.dividerWrapper}>\n                <View style={styles.divider}/>\n            </View>\n        </View>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;;;AAKA,MAAMA,SAAoC,GAAG,YAA4B;EACrE,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO;IACHC,OAAO,EAAE;MACLC,GAAG,EAAEH,KAAK,CAACI,OAAN,CAAc,CAAd,CADA;MAELC,eAAe,EAAEL,KAAK,CAACI,OAAN,CAAc,IAAd,CAFZ;MAGLE,iBAAiB,EAAEN,KAAK,CAACI,OAAN,CAAc,CAAd,CAHd;MAILG,KAAK,EAAE;IAJF,CADN;IAOHC,WAAW,EAAE;MACTC,YAAY,EAAET,KAAK,CAACI,OAAN,CAAc,EAAd;IADL,CAPV;IAUHM,OAAO,EAAE;MACLC,iBAAiB,EAAEX,KAAK,CAACY,OAAN,CAAcC,MAAd,CAAqBC,IADnC;MAELC,iBAAiB,EAAE;IAFd,CAVN;IAcHC,cAAc,EAAE;MACZV,iBAAiB,EAAEN,KAAK,CAACI,OAAN,CAAc,CAAd;IADP;EAdb,CAAP;AAkBH,CArBD;;AAuBe,SAASa,QAAT,CAAkBC,KAAlB,EAAwC;EACnD,MAAM;IACFC,UAAU,GAAG,QADX;IAEFC,MAAM,GAAG,KAFP;IAGFC,QAHE;IAIFb,WAJE;IAKFc,QAAQ,GAAG,KALT;IAMFC,OANE;IAOFC,KAPE;IAQF,GAAGC;EARD,IASFP,KATJ;EAWA,MAAMlB,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMyB,MAAM,GAAG3B,SAAS,EAAxB;EAEA,MAAM4B,kBAAkB,GAAG;IACvBC,iBAAiB,EAAEC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GAAwB,UAAxB,GAAqCC,SADjC;IAEvB,GAAGN;EAFoB,CAA3B;EAKA,MAAMO,mBAAmB,GAAG,IAAAC,YAAA,EAAI,CAC5BP,MAAM,CAACxB,OADqB,EAE5BsB,KAF4B,CAAJ,CAA5B;EAKA,MAAMU,oBAAoB,GAAG,IAAAC,wBAAA,EAAgBnC,KAAhB,EAAuB;IAChDoC,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,uBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CAD+B;IAOhDC,KAAK,EAAE3C,KAAK,CAACY,OAAN,CAAcgC,IAAd,CAAmBC;EAPsB,CAAvB,CAA7B;;EAUA,MAAM3C,OAAO,gBACT,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,YAAD;IAAK,UAAU,EAAEiB;EAAjB,GACKE,QADL,CADJ,EAKKb,WAAW,gBACR,6BAAC,iBAAD;IAAM,KAAK,EAAE,IAAAyB,YAAA,EAAI,CACbP,MAAM,CAAClB,WADM,EAEb0B,oBAFa,CAAJ;EAAb,GAIK1B,WAJL,CADQ,GAOR,IAZR,CADJ;;EAiBA;IAAA;IACI;IACA,6BAAC,iBAAD,EAAUmB,kBAAV,EACKP,MAAM,gBACH,6BAAC,mBAAD;MACI,QAAQ,EAAEE,QADd;MAEI,OAAO,EAAEC,OAFb;MAGI,KAAK,EAAES;IAHX,GAKK9B,OALL,CADG,gBASH,6BAAC,iBAAD;MAAM,KAAK,EAAE8B;IAAb,GACK9B,OADL,CAVR,eAeI,6BAAC,iBAAD;MAAM,KAAK,EAAEwB,MAAM,CAACV;IAApB,gBACI,6BAAC,iBAAD;MAAM,KAAK,EAAEU,MAAM,CAAChB;IAApB,EADJ,CAfJ;EAFJ;AAsBH;;AAAA"}
+{"version":3,"names":["useStyles","theme","useTheme","content","gap","spacing","paddingVertical","paddingHorizontal","width","description","paddingRight","divider","borderBottomColor","palette","border","weak","borderBottomWidth","dividerWrapper","ListItem","props","alignItems","button","children","disabled","onPress","style","otherProps","styles","rootComponentProps","accessibilityRole","Platform","OS","undefined","contentWrapperStyle","css","descriptionFontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","text","base"],"sources":["ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport type { FlexStyle } from 'react-native';\nimport { Platform, Text, View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type ListItemProps from './ListItemProps';\n\ntype ListItemStyles = NamedStylesStringUnion<'content' | 'description' | 'divider' | 'dividerWrapper'>;\n\nconst useStyles: UseStyles<ListItemStyles> = function (): ListItemStyles {\n    const theme = useTheme();\n\n    return {\n        content: {\n            gap: theme.spacing(2),\n            paddingVertical: theme.spacing(3.75),\n            paddingHorizontal: theme.spacing(4),\n            width: '100%',\n        },\n        description: {\n            paddingRight: theme.spacing(20),\n        },\n        divider: {\n            borderBottomColor: theme.palette.border.weak,\n            borderBottomWidth: 0.5,\n        },\n        dividerWrapper: {\n            paddingHorizontal: theme.spacing(4),\n        },\n    };\n};\n\nexport default function ListItem(props: ListItemProps) {\n    const {\n        alignItems = 'center' as FlexStyle['alignItems'],\n        button = false,\n        children,\n        description,\n        disabled = false,\n        onPress,\n        style,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const rootComponentProps = {\n        accessibilityRole: Platform.OS === 'web' ? 'listitem' : undefined,\n        ...otherProps,\n    };\n\n    const contentWrapperStyle = css([\n        styles.content,\n        style,\n    ]);\n\n    const descriptionFontStyle = createFontStyle(theme, {\n        selector: (_) => typographyOf({\n            fontSize: 14,\n            lineHeight: 19.6,\n            fontFamily: 'PretendardStd-Regular',\n            letterSpacing: 0,\n        }),\n        color: theme.palette.text.base,\n    });\n\n    const content = (\n        <React.Fragment>\n            <Row alignItems={alignItems}>\n                {children}\n            </Row>\n\n            {description ? (\n                <Text style={css([\n                    styles.description,\n                    descriptionFontStyle,\n                ])}>\n                    {description}\n                </Text>\n            ) : null}\n        </React.Fragment>\n    );\n\n    return (\n        // @ts-ignore\n        <View {...rootComponentProps}>\n            {button ? (\n                <ButtonBase\n                    disabled={disabled}\n                    onPress={onPress}\n                    style={contentWrapperStyle}\n                >\n                    {content}\n                </ButtonBase>\n            ) : (\n                <View style={contentWrapperStyle}>\n                    {content}\n                </View>\n            )}\n\n            <View style={styles.dividerWrapper}>\n                <View style={styles.divider}/>\n            </View>\n        </View>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;;;AAKA,MAAMA,SAAoC,GAAG,YAA4B;EACrE,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO;IACHC,OAAO,EAAE;MACLC,GAAG,EAAEH,KAAK,CAACI,OAAN,CAAc,CAAd,CADA;MAELC,eAAe,EAAEL,KAAK,CAACI,OAAN,CAAc,IAAd,CAFZ;MAGLE,iBAAiB,EAAEN,KAAK,CAACI,OAAN,CAAc,CAAd,CAHd;MAILG,KAAK,EAAE;IAJF,CADN;IAOHC,WAAW,EAAE;MACTC,YAAY,EAAET,KAAK,CAACI,OAAN,CAAc,EAAd;IADL,CAPV;IAUHM,OAAO,EAAE;MACLC,iBAAiB,EAAEX,KAAK,CAACY,OAAN,CAAcC,MAAd,CAAqBC,IADnC;MAELC,iBAAiB,EAAE;IAFd,CAVN;IAcHC,cAAc,EAAE;MACZV,iBAAiB,EAAEN,KAAK,CAACI,OAAN,CAAc,CAAd;IADP;EAdb,CAAP;AAkBH,CArBD;;AAuBe,SAASa,QAAT,CAAkBC,KAAlB,EAAwC;EACnD,MAAM;IACFC,UAAU,GAAG,QADX;IAEFC,MAAM,GAAG,KAFP;IAGFC,QAHE;IAIFb,WAJE;IAKFc,QAAQ,GAAG,KALT;IAMFC,OANE;IAOFC,KAPE;IAQF,GAAGC;EARD,IASFP,KATJ;EAWA,MAAMlB,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMyB,MAAM,GAAG3B,SAAS,EAAxB;EAEA,MAAM4B,kBAAkB,GAAG;IACvBC,iBAAiB,EAAEC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GAAwB,UAAxB,GAAqCC,SADjC;IAEvB,GAAGN;EAFoB,CAA3B;EAKA,MAAMO,mBAAmB,GAAG,IAAAC,YAAA,EAAI,CAC5BP,MAAM,CAACxB,OADqB,EAE5BsB,KAF4B,CAAJ,CAA5B;EAKA,MAAMU,oBAAoB,GAAG,IAAAC,wBAAA,EAAgBnC,KAAhB,EAAuB;IAChDoC,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,uBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CAD+B;IAOhDC,KAAK,EAAE3C,KAAK,CAACY,OAAN,CAAcgC,IAAd,CAAmBC;EAPsB,CAAvB,CAA7B;;EAUA,MAAM3C,OAAO,gBACT,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,YAAD;IAAK,UAAU,EAAEiB;EAAjB,GACKE,QADL,CADJ,EAKKb,WAAW,gBACR,6BAAC,iBAAD;IAAM,KAAK,EAAE,IAAAyB,YAAA,EAAI,CACbP,MAAM,CAAClB,WADM,EAEb0B,oBAFa,CAAJ;EAAb,GAIK1B,WAJL,CADQ,GAOR,IAZR,CADJ;;EAiBA;IAAA;IACI;IACA,6BAAC,iBAAD,EAAUmB,kBAAV,EACKP,MAAM,gBACH,6BAAC,mBAAD;MACI,QAAQ,EAAEE,QADd;MAEI,OAAO,EAAEC,OAFb;MAGI,KAAK,EAAES;IAHX,GAKK9B,OALL,CADG,gBASH,6BAAC,iBAAD;MAAM,KAAK,EAAE8B;IAAb,GACK9B,OADL,CAVR,eAeI,6BAAC,iBAAD;MAAM,KAAK,EAAEwB,MAAM,CAACV;IAApB,gBACI,6BAAC,iBAAD;MAAM,KAAK,EAAEU,MAAM,CAAChB;IAApB,EADJ,CAfJ;EAFJ;AAsBH;;AAAA"}

package/build/commonjs/ListItemText/ListItemText.js

@@ -38,8 +38,8 @@ function ListItemText(props) {
   const styles = useStyles();
   const fontStyle = (0, _styles2.createFontStyle)(theme, {
     selector: _ => (0, _styles.typographyOf)({
-      fontSize: 15,
-      lineHeight: 18,
+      fontSize: 16,
+      lineHeight: 19.2,
       fontFamily: 'PretendardStd-Medium',
       letterSpacing: 0
     }),

package/build/commonjs/ListItemText/ListItemText.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","root","flexGrow","flexShrink","ListItemText","props","children","style","otherProps","theme","useTheme","styles","fontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","palette","text","strong","css"],"sources":["ListItemText.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type ListItemTextProps from './ListItemTextProps';\n\ntype ListItemTextStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<ListItemTextStyles> = function (): ListItemTextStyles {\n    return {\n        root: {\n            flexGrow: 1,\n            flexShrink: 1,\n        },\n    };\n};\n\nexport default function ListItemText(props: ListItemTextProps) {\n    const {\n        children,\n        style,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (_) => typographyOf({\n            fontSize: 15,\n            lineHeight: 18,\n            fontFamily: 'PretendardStd-Medium',\n            letterSpacing: 0,\n        }),\n        color: theme.palette.text.strong,\n    });\n\n    return (\n        <Column\n            style={css([\n                styles.root,\n                style,\n            ])}\n            {...otherProps}\n        >\n            <Text style={fontStyle}>\n                {children}\n            </Text>\n        </Column>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAAwC,GAAG,YAAgC;EAC7E,OAAO;IACHC,IAAI,EAAE;MACFC,QAAQ,EAAE,CADR;MAEFC,UAAU,EAAE;IAFV;EADH,CAAP;AAMH,CAPD;;AASe,SAASC,YAAT,CAAsBC,KAAtB,EAAgD;EAC3D,MAAM;IACFC,QADE;IAEFC,KAFE;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAMI,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMC,MAAM,GAAGX,SAAS,EAAxB;EAEA,MAAMY,SAAS,GAAG,IAAAC,wBAAA,EAAgBJ,KAAhB,EAAuB;IACrCK,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,EAFc;MAG1BC,UAAU,EAAE,sBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CADoB;IAOrCC,KAAK,EAAEZ,KAAK,CAACa,OAAN,CAAcC,IAAd,CAAmBC;EAPW,CAAvB,CAAlB;EAUA,oBACI,6BAAC,eAAD;IACI,KAAK,EAAE,IAAAC,YAAA,EAAI,CACPd,MAAM,CAACV,IADA,EAEPM,KAFO,CAAJ;EADX,GAKQC,UALR,gBAOI,6BAAC,iBAAD;IAAM,KAAK,EAAEI;EAAb,GACKN,QADL,CAPJ,CADJ;AAaH;;AAAA"}
+{"version":3,"names":["useStyles","root","flexGrow","flexShrink","ListItemText","props","children","style","otherProps","theme","useTheme","styles","fontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","palette","text","strong","css"],"sources":["ListItemText.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type ListItemTextProps from './ListItemTextProps';\n\ntype ListItemTextStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<ListItemTextStyles> = function (): ListItemTextStyles {\n    return {\n        root: {\n            flexGrow: 1,\n            flexShrink: 1,\n        },\n    };\n};\n\nexport default function ListItemText(props: ListItemTextProps) {\n    const {\n        children,\n        style,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (_) => typographyOf({\n            fontSize: 16,\n            lineHeight: 19.2,\n            fontFamily: 'PretendardStd-Medium',\n            letterSpacing: 0,\n        }),\n        color: theme.palette.text.strong,\n    });\n\n    return (\n        <Column\n            style={css([\n                styles.root,\n                style,\n            ])}\n            {...otherProps}\n        >\n            <Text style={fontStyle}>\n                {children}\n            </Text>\n        </Column>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAAwC,GAAG,YAAgC;EAC7E,OAAO;IACHC,IAAI,EAAE;MACFC,QAAQ,EAAE,CADR;MAEFC,UAAU,EAAE;IAFV;EADH,CAAP;AAMH,CAPD;;AASe,SAASC,YAAT,CAAsBC,KAAtB,EAAgD;EAC3D,MAAM;IACFC,QADE;IAEFC,KAFE;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAMI,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMC,MAAM,GAAGX,SAAS,EAAxB;EAEA,MAAMY,SAAS,GAAG,IAAAC,wBAAA,EAAgBJ,KAAhB,EAAuB;IACrCK,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,sBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CADoB;IAOrCC,KAAK,EAAEZ,KAAK,CAACa,OAAN,CAAcC,IAAd,CAAmBC;EAPW,CAAvB,CAAlB;EAUA,oBACI,6BAAC,eAAD;IACI,KAAK,EAAE,IAAAC,YAAA,EAAI,CACPd,MAAM,CAACV,IADA,EAEPM,KAFO,CAAJ;EADX,GAKQC,UALR,gBAOI,6BAAC,iBAAD;IAAM,KAAK,EAAEI;EAAb,GACKN,QADL,CAPJ,CADJ;AAaH;;AAAA"}

package/build/commonjs/ListSubheader/ListSubheader.js

@@ -33,7 +33,7 @@ function ListSubheader(props) {
   }, otherProps), disableTypography ? children : /*#__PURE__*/_react.default.createElement(_Typography.default, {
     children: children,
     color: 'strong',
-    variant: 'caption3'
+    variant: 'caption2'
   }));
 }
 

package/build/commonjs/ListSubheader/ListSubheader.js.map

@@ -1 +1 @@
-{"version":3,"names":["ListSubheader","props","children","disableTypography","otherProps","accessibilityRole","Platform","OS","undefined","EdgeInsets","horizontal"],"sources":["ListSubheader.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform } from 'react-native';\nimport Row from '../Row';\nimport Typography from '../Typography';\nimport { EdgeInsets } from '../styles';\nimport type ListSubheaderProps from './ListSubheaderProps';\n\nexport default function ListSubheader(props: ListSubheaderProps) {\n    const {\n        children,\n        disableTypography = false,\n        ...otherProps\n    } = props;\n\n    const accessibilityRole = Platform.OS === 'web' ? 'listitem' : undefined;\n\n    return (\n        <Row\n            // @ts-ignore\n            accessibilityRole={accessibilityRole}\n            insets={EdgeInsets.horizontal(4)}\n            {...otherProps}\n        >\n            {disableTypography ? (\n                children\n            ) : (\n                <Typography\n                    children={children}\n                    color={'strong'}\n                    variant={'caption3'}\n                />\n            )}\n        </Row>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAGe,SAASA,aAAT,CAAuBC,KAAvB,EAAkD;EAC7D,MAAM;IACFC,QADE;IAEFC,iBAAiB,GAAG,KAFlB;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAMI,iBAAiB,GAAGC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GAAwB,UAAxB,GAAqCC,SAA/D;EAEA,oBACI,6BAAC,YAAD,CACI;EADJ;IAEI,iBAAiB,EAAEH,iBAFvB;IAGI,MAAM,EAAEI,kBAAA,CAAWC,UAAX,CAAsB,CAAtB;EAHZ,GAIQN,UAJR,GAMKD,iBAAiB,GACdD,QADc,gBAGd,6BAAC,mBAAD;IACI,QAAQ,EAAEA,QADd;IAEI,KAAK,EAAE,QAFX;IAGI,OAAO,EAAE;EAHb,EATR,CADJ;AAkBH;;AAAA"}
+{"version":3,"names":["ListSubheader","props","children","disableTypography","otherProps","accessibilityRole","Platform","OS","undefined","EdgeInsets","horizontal"],"sources":["ListSubheader.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform } from 'react-native';\nimport Row from '../Row';\nimport Typography from '../Typography';\nimport { EdgeInsets } from '../styles';\nimport type ListSubheaderProps from './ListSubheaderProps';\n\nexport default function ListSubheader(props: ListSubheaderProps) {\n    const {\n        children,\n        disableTypography = false,\n        ...otherProps\n    } = props;\n\n    const accessibilityRole = Platform.OS === 'web' ? 'listitem' : undefined;\n\n    return (\n        <Row\n            // @ts-ignore\n            accessibilityRole={accessibilityRole}\n            insets={EdgeInsets.horizontal(4)}\n            {...otherProps}\n        >\n            {disableTypography ? (\n                children\n            ) : (\n                <Typography\n                    children={children}\n                    color={'strong'}\n                    variant={'caption2'}\n                />\n            )}\n        </Row>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAGe,SAASA,aAAT,CAAuBC,KAAvB,EAAkD;EAC7D,MAAM;IACFC,QADE;IAEFC,iBAAiB,GAAG,KAFlB;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAMI,iBAAiB,GAAGC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GAAwB,UAAxB,GAAqCC,SAA/D;EAEA,oBACI,6BAAC,YAAD,CACI;EADJ;IAEI,iBAAiB,EAAEH,iBAFvB;IAGI,MAAM,EAAEI,kBAAA,CAAWC,UAAX,CAAsB,CAAtB;EAHZ,GAIQN,UAJR,GAMKD,iBAAiB,GACdD,QADc,gBAGd,6BAAC,mBAAD;IACI,QAAQ,EAAEA,QADd;IAEI,KAAK,EAAE,QAFX;IAGI,OAAO,EAAE;EAHb,EATR,CADJ;AAkBH;;AAAA"}

package/build/commonjs/Pagination/NumberPagination.js

@@ -46,7 +46,7 @@ function NumberPagination(props) {
   const typography = (0, _styles.typographyOf)({
     fontSize: 9.5,
     lineHeight: 11.4,
-    fontFamily: 'Pretendard-SemiBold',
+    fontFamily: 'PretendardStd-SemiBold',
     letterSpacing: -0.19
   });
   const currentFontStyle = (0, _styles2.createFontStyle)(theme, {

package/build/commonjs/Pagination/NumberPagination.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","root","backgroundColor","commonColors","static","weakOpacity","borderRadius","shape","radius","full","paddingHorizontal","spacing","paddingVertical","divider","alignSelf","borderColor","weakOpacityInverse","height","NumberPagination","props","currentPage","maxPage","styles","typography","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","currentFontStyle","createFontStyle","selector","_","color","strongInverse","countFontStyle","baseOpacityInverse"],"sources":["NumberPagination.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { commonColors, typographyOf } from '@fountain-ui/styles';\nimport Divider from '../Divider';\nimport Row from '../Row';\nimport { createFontStyle, useTheme } from '../styles';\nimport type PaginationProps from './PaginationProps';\n\ntype NumberPaginationStyles = NamedStylesStringUnion<'root' | 'divider'>;\n\nconst useStyles: UseStyles<NumberPaginationStyles> = function (): NumberPaginationStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            backgroundColor: commonColors.static.weakOpacity,\n            borderRadius: theme.shape.radius.full,\n            paddingHorizontal: theme.spacing(1.25),\n            paddingVertical: theme.spacing(0.5),\n        },\n        divider: {\n            alignSelf: 'center',\n            borderColor: commonColors.static.weakOpacityInverse,\n            height: 6,\n        },\n    };\n};\n\ninterface NumberPaginationProps {\n    currentPage: PaginationProps['page'];\n    maxPage: PaginationProps['count'];\n}\n\nexport default function NumberPagination(props: NumberPaginationProps) {\n    const {\n        currentPage,\n        maxPage,\n    } = props;\n\n    const styles = useStyles();\n\n    const theme = useTheme();\n\n    const typography = typographyOf({\n        fontSize: 9.5,\n        lineHeight: 11.4,\n        fontFamily: 'Pretendard-SemiBold',\n        letterSpacing: -0.19,\n    });\n\n    const currentFontStyle = createFontStyle(theme, {\n        selector: (_) => typography,\n        color: commonColors.static.strongInverse,\n    });\n\n    const countFontStyle = createFontStyle(theme, {\n        selector: (_) => typography,\n        color: commonColors.static.baseOpacityInverse,\n    });\n\n    return (\n        <Row style={styles.root}>\n            <Text style={currentFontStyle}>\n                {currentPage + 1}\n            </Text>\n\n            <Divider\n                style={styles.divider}\n                vertical={true}\n            />\n\n            <Text style={countFontStyle}>\n                {maxPage}\n            </Text>\n        </Row>\n    );\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;AAKA,MAAMA,SAA4C,GAAG,YAAoC;EACrF,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,eAAe,EAAEC,oBAAA,CAAaC,MAAb,CAAoBC,WADnC;MAEFC,YAAY,EAAEP,KAAK,CAACQ,KAAN,CAAYC,MAAZ,CAAmBC,IAF/B;MAGFC,iBAAiB,EAAEX,KAAK,CAACY,OAAN,CAAc,IAAd,CAHjB;MAIFC,eAAe,EAAEb,KAAK,CAACY,OAAN,CAAc,GAAd;IAJf,CADH;IAOHE,OAAO,EAAE;MACLC,SAAS,EAAE,QADN;MAELC,WAAW,EAAEZ,oBAAA,CAAaC,MAAb,CAAoBY,kBAF5B;MAGLC,MAAM,EAAE;IAHH;EAPN,CAAP;AAaH,CAhBD;;AAuBe,SAASC,gBAAT,CAA0BC,KAA1B,EAAwD;EACnE,MAAM;IACFC,WADE;IAEFC;EAFE,IAGFF,KAHJ;EAKA,MAAMG,MAAM,GAAGxB,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMuB,UAAU,GAAG,IAAAC,oBAAA,EAAa;IAC5BC,QAAQ,EAAE,GADkB;IAE5BC,UAAU,EAAE,IAFgB;IAG5BC,UAAU,EAAE,qBAHgB;IAI5BC,aAAa,EAAE,CAAC;EAJY,CAAb,CAAnB;EAOA,MAAMC,gBAAgB,GAAG,IAAAC,wBAAA,EAAgB/B,KAAhB,EAAuB;IAC5CgC,QAAQ,EAAGC,CAAD,IAAOT,UAD2B;IAE5CU,KAAK,EAAE9B,oBAAA,CAAaC,MAAb,CAAoB8B;EAFiB,CAAvB,CAAzB;EAKA,MAAMC,cAAc,GAAG,IAAAL,wBAAA,EAAgB/B,KAAhB,EAAuB;IAC1CgC,QAAQ,EAAGC,CAAD,IAAOT,UADyB;IAE1CU,KAAK,EAAE9B,oBAAA,CAAaC,MAAb,CAAoBgC;EAFe,CAAvB,CAAvB;EAKA,oBACI,6BAAC,YAAD;IAAK,KAAK,EAAEd,MAAM,CAACrB;EAAnB,gBACI,6BAAC,iBAAD;IAAM,KAAK,EAAE4B;EAAb,GACKT,WAAW,GAAG,CADnB,CADJ,eAKI,6BAAC,gBAAD;IACI,KAAK,EAAEE,MAAM,CAACT,OADlB;IAEI,QAAQ,EAAE;EAFd,EALJ,eAUI,6BAAC,iBAAD;IAAM,KAAK,EAAEsB;EAAb,GACKd,OADL,CAVJ,CADJ;AAgBH"}
+{"version":3,"names":["useStyles","theme","useTheme","root","backgroundColor","commonColors","static","weakOpacity","borderRadius","shape","radius","full","paddingHorizontal","spacing","paddingVertical","divider","alignSelf","borderColor","weakOpacityInverse","height","NumberPagination","props","currentPage","maxPage","styles","typography","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","currentFontStyle","createFontStyle","selector","_","color","strongInverse","countFontStyle","baseOpacityInverse"],"sources":["NumberPagination.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { commonColors, typographyOf } from '@fountain-ui/styles';\nimport Divider from '../Divider';\nimport Row from '../Row';\nimport { createFontStyle, useTheme } from '../styles';\nimport type PaginationProps from './PaginationProps';\n\ntype NumberPaginationStyles = NamedStylesStringUnion<'root' | 'divider'>;\n\nconst useStyles: UseStyles<NumberPaginationStyles> = function (): NumberPaginationStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            backgroundColor: commonColors.static.weakOpacity,\n            borderRadius: theme.shape.radius.full,\n            paddingHorizontal: theme.spacing(1.25),\n            paddingVertical: theme.spacing(0.5),\n        },\n        divider: {\n            alignSelf: 'center',\n            borderColor: commonColors.static.weakOpacityInverse,\n            height: 6,\n        },\n    };\n};\n\ninterface NumberPaginationProps {\n    currentPage: PaginationProps['page'];\n    maxPage: PaginationProps['count'];\n}\n\nexport default function NumberPagination(props: NumberPaginationProps) {\n    const {\n        currentPage,\n        maxPage,\n    } = props;\n\n    const styles = useStyles();\n\n    const theme = useTheme();\n\n    const typography = typographyOf({\n        fontSize: 9.5,\n        lineHeight: 11.4,\n        fontFamily: 'PretendardStd-SemiBold',\n        letterSpacing: -0.19,\n    });\n\n    const currentFontStyle = createFontStyle(theme, {\n        selector: (_) => typography,\n        color: commonColors.static.strongInverse,\n    });\n\n    const countFontStyle = createFontStyle(theme, {\n        selector: (_) => typography,\n        color: commonColors.static.baseOpacityInverse,\n    });\n\n    return (\n        <Row style={styles.root}>\n            <Text style={currentFontStyle}>\n                {currentPage + 1}\n            </Text>\n\n            <Divider\n                style={styles.divider}\n                vertical={true}\n            />\n\n            <Text style={countFontStyle}>\n                {maxPage}\n            </Text>\n        </Row>\n    );\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;AAKA,MAAMA,SAA4C,GAAG,YAAoC;EACrF,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,eAAe,EAAEC,oBAAA,CAAaC,MAAb,CAAoBC,WADnC;MAEFC,YAAY,EAAEP,KAAK,CAACQ,KAAN,CAAYC,MAAZ,CAAmBC,IAF/B;MAGFC,iBAAiB,EAAEX,KAAK,CAACY,OAAN,CAAc,IAAd,CAHjB;MAIFC,eAAe,EAAEb,KAAK,CAACY,OAAN,CAAc,GAAd;IAJf,CADH;IAOHE,OAAO,EAAE;MACLC,SAAS,EAAE,QADN;MAELC,WAAW,EAAEZ,oBAAA,CAAaC,MAAb,CAAoBY,kBAF5B;MAGLC,MAAM,EAAE;IAHH;EAPN,CAAP;AAaH,CAhBD;;AAuBe,SAASC,gBAAT,CAA0BC,KAA1B,EAAwD;EACnE,MAAM;IACFC,WADE;IAEFC;EAFE,IAGFF,KAHJ;EAKA,MAAMG,MAAM,GAAGxB,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMuB,UAAU,GAAG,IAAAC,oBAAA,EAAa;IAC5BC,QAAQ,EAAE,GADkB;IAE5BC,UAAU,EAAE,IAFgB;IAG5BC,UAAU,EAAE,wBAHgB;IAI5BC,aAAa,EAAE,CAAC;EAJY,CAAb,CAAnB;EAOA,MAAMC,gBAAgB,GAAG,IAAAC,wBAAA,EAAgB/B,KAAhB,EAAuB;IAC5CgC,QAAQ,EAAGC,CAAD,IAAOT,UAD2B;IAE5CU,KAAK,EAAE9B,oBAAA,CAAaC,MAAb,CAAoB8B;EAFiB,CAAvB,CAAzB;EAKA,MAAMC,cAAc,GAAG,IAAAL,wBAAA,EAAgB/B,KAAhB,EAAuB;IAC1CgC,QAAQ,EAAGC,CAAD,IAAOT,UADyB;IAE1CU,KAAK,EAAE9B,oBAAA,CAAaC,MAAb,CAAoBgC;EAFe,CAAvB,CAAvB;EAKA,oBACI,6BAAC,YAAD;IAAK,KAAK,EAAEd,MAAM,CAACrB;EAAnB,gBACI,6BAAC,iBAAD;IAAM,KAAK,EAAE4B;EAAb,GACKT,WAAW,GAAG,CADnB,CADJ,eAKI,6BAAC,gBAAD;IACI,KAAK,EAAEE,MAAM,CAACT,OADlB;IAEI,QAAQ,EAAE;EAFd,EALJ,eAUI,6BAAC,iBAAD;IAAM,KAAK,EAAEsB;EAAb,GACKd,OADL,CAVJ,CADJ;AAgBH"}

package/build/commonjs/Radio/Radio.js

@@ -29,6 +29,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 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); }
 
+const DEFAULT_START_ICON_SIZE = 21;
+
 const useStyles = function () {
   const theme = (0, _styles.useTheme)();
   return {
@@ -78,7 +80,9 @@ function Radio(props) {
   const checkedIcon = checkIconProp ?? defaultCheckedIcon;
   const icon = isChecked ? checkedIcon : null;
   const startIcon = (0, _utils.cloneElementSafely)(startIconProp, {
-    color: 'strong'
+    color: 'strong',
+    height: DEFAULT_START_ICON_SIZE,
+    width: DEFAULT_START_ICON_SIZE
   });
   const rootStyle = (0, _styles.css)([styles.root, style]);
   const fontStyle = (0, _styles.createFontStyle)(theme, {