@fountain-ui/core 2.0.0-beta.98 → 3.0.0-alpha.2

package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js

@@ -0,0 +1,73 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = BottomSheetTitle;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _Button = _interopRequireDefault(require("../Button/Button"));
+
+var _Row = _interopRequireDefault(require("../Row"));
+
+var _styles = require("../styles");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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 useStyles = function () {
+  const theme = (0, _styles.useTheme)();
+  return {
+    root: {
+      alignItems: 'center',
+      gap: theme.spacing(8),
+      justifyContent: 'space-between',
+      marginBottom: theme.spacing(4),
+      paddingHorizontal: theme.spacing(6)
+    },
+    title: {
+      paddingBottom: theme.spacing(1.25),
+      paddingTop: theme.spacing(1)
+    },
+    actionButton: {
+      paddingBottom: theme.spacing(1.75),
+      paddingHorizontal: 0,
+      paddingTop: theme.spacing(1.25)
+    }
+  };
+};
+
+function BottomSheetTitle(props) {
+  const {
+    actionButtonProps,
+    children,
+    style: styleProp,
+    ...otherProps
+  } = props;
+  const theme = (0, _styles.useTheme)();
+  const styles = useStyles();
+  const rootStyle = (0, _styles.css)([styles.root, styleProp]);
+  const titleFontStyle = (0, _styles.createFontStyle)(theme, {
+    selector: typography => typography.header3.semiBold,
+    color: theme.palette.text.strong
+  });
+  const titleStyle = (0, _styles.css)([styles.title, titleFontStyle]);
+  return /*#__PURE__*/_react.default.createElement(_Row.default, _extends({
+    style: rootStyle
+  }, otherProps), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    children: children,
+    style: titleStyle
+  }), actionButtonProps ? /*#__PURE__*/_react.default.createElement(_Button.default, {
+    children: actionButtonProps.title,
+    color: 'accent',
+    disableMinWidth: true,
+    onPress: actionButtonProps.onPress,
+    style: styles.actionButton,
+    variant: 'text'
+  }) : null);
+}
+//# sourceMappingURL=BottomSheetTitle.js.map

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

@@ -0,0 +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"}

package/build/commonjs/BottomSheetTitle/BottomSheetTitleProps.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=BottomSheetTitleProps.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["BottomSheetTitleProps.ts"],"sourcesContent":["import type { OverridableComponentProps } from '../types';\nimport type { RowProps } from '../Row';\n\ntype ActionButtonProps = {\n    title: string;\n    onPress: () => void;\n};\n\nexport default interface BottomSheetTitleProps extends OverridableComponentProps<RowProps, {\n    children: string;\n    actionButtonProps?: ActionButtonProps;\n}> {}\n"],"mappings":""}

package/build/commonjs/{CheckboxGroup → BottomSheetTitle}/index.js

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _CheckboxGroup.default;
+    return _BottomSheetTitle.default;
   }
 });
 
-var _CheckboxGroup = _interopRequireDefault(require("./CheckboxGroup"));
+var _BottomSheetTitle = _interopRequireDefault(require("./BottomSheetTitle"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './BottomSheetTitle';\nexport type { default as BottomSheetTitleProps } from './BottomSheetTitleProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}

package/build/commonjs/Button/Button.js

@@ -117,21 +117,20 @@ function Button(props) {
     labelColor
   } = (0, _useVariantStyleMap.default)(variant, color);
   const iconProps = {
-    fill: iconColor
+    fill: iconColor,
+    opacity: isLoading ? 0 : 1
   };
   const startIcon = (0, _utils.cloneElementSafely)(startIconProp, iconProps);
   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, styleProp]);
-  const contentStyle = (0, _styles2.css)({
-    opacity: isLoading ? 0 : 1
-  });
   const fontStyle = (0, _styles2.createFontStyle)(theme, {
     selector: _ => fontStyleMap[size],
     color: labelColor
   });
   const textStyle = (0, _styles2.css)([fontStyle, {
+    opacity: isLoading ? 0 : 1,
     textAlign: 'center'
   }]);
   const modifiedPressEffect = variant !== 'text' && !pressEffect ? 'scale' : pressEffect;
@@ -159,11 +158,9 @@ function Button(props) {
     onPress: handlePress,
     style: buttonBaseStyle,
     pressEffect: modifiedPressEffect
-  }, otherProps), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: contentStyle
-  }, startIcon, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+  }, otherProps), startIcon, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
     style: textStyle
-  }, children), endIcon), isLoading ? /*#__PURE__*/_react.default.createElement(_icons.LoadingSpinner, {
+  }, children), endIcon, isLoading ? /*#__PURE__*/_react.default.createElement(_icons.LoadingSpinner, {
     color: loadingSpinnerColor,
     size: size,
     style: styles.loadingSpinner

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","cloneElementSafely","buttonBaseStyle","css","undefined","contentStyle","opacity","fontStyle","createFontStyle","selector","_","textStyle","textAlign","modifiedPressEffect","handlePress","Linking","canOpenURL","openURL","loadingSpinnerColor"],"sources":["Button.tsx"],"sourcesContent":["import React from 'react';\nimport { Linking, Text, View } 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    };\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 contentStyle = css({\n        opacity: isLoading ? 0 : 1,\n    });\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (_) => fontStyleMap[size],\n        color: labelColor,\n    });\n\n    const textStyle = css([\n        fontStyle,\n        { textAlign: 'center' },\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            <View style={contentStyle}>\n                {startIcon}\n\n                <Text style={textStyle}>\n                    {children}\n                </Text>\n\n                {endIcon}\n            </View>\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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"}
+{"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":"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"}

package/build/commonjs/Button/ButtonProps.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ButtonVariants = exports.ButtonSizes = exports.ButtonColors = void 0;
-const ButtonColors = ['accent', 'primary', 'danger', 'disabled', 'secondary', 'accentAlt'];
-exports.ButtonColors = ButtonColors;
-const ButtonSizes = ['small', 'medium', 'large'];
-exports.ButtonSizes = ButtonSizes;
-const ButtonVariants = ['solid', 'outlined', 'text', 'capsuleSolid', 'capsuleOutlined'];
-exports.ButtonVariants = ButtonVariants;
+exports.buttonVariants = exports.buttonSizes = exports.buttonColors = void 0;
+const buttonColors = ['accent', 'primary', 'danger', 'disabled', 'secondary', 'accentAlt'];
+exports.buttonColors = buttonColors;
+const buttonSizes = ['small', 'medium', 'large'];
+exports.buttonSizes = buttonSizes;
+const buttonVariants = ['solid', 'outlined', 'text', 'capsuleSolid', 'capsuleOutlined'];
+exports.buttonVariants = buttonVariants;
 //# sourceMappingURL=ButtonProps.js.map

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     * 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/Button/index.js

@@ -3,14 +3,34 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "buttonColors", {
+  enumerable: true,
+  get: function () {
+    return _ButtonProps.buttonColors;
+  }
+});
+Object.defineProperty(exports, "buttonSizes", {
+  enumerable: true,
+  get: function () {
+    return _ButtonProps.buttonSizes;
+  }
+});
+Object.defineProperty(exports, "buttonVariants", {
+  enumerable: true,
+  get: function () {
+    return _ButtonProps.buttonVariants;
+  }
+});
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _LegacyButton.default;
+    return _Button.default;
   }
 });
 
-var _LegacyButton = _interopRequireDefault(require("./LegacyButton"));
+var _Button = _interopRequireDefault(require("./Button"));
+
+var _ButtonProps = require("./ButtonProps");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyButton';\nexport type { default as ButtonProps } from './LegacyButtonProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './Button';\nexport type { default as ButtonProps } from './ButtonProps';\nexport { buttonColors, buttonSizes, buttonVariants } from './ButtonProps';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA"}

package/build/commonjs/Button/useVariantStyleMap.js

@@ -91,6 +91,10 @@ function useVariantStyleMap(variant, color) {
           labelColor: palette.text.accentAlt,
           iconColor: palette.icon.accentAlt
         },
+        danger: {
+          labelColor: palette.status.danger,
+          iconColor: palette.status.danger
+        },
         disabled: {
           labelColor: palette.status.disabledLabel,
           iconColor: palette.status.disabledLabel

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

@@ -1 +1 @@
-{"version":3,"names":["useVariantStyleMap","variant","color","theme","useTheme","useMemo","palette","variantStyleMap","solid","accent","container","backgroundColor","fill","labelColor","commonColors","static","strongInverse","iconColor","primary","base","text","icon","danger","status","disabled","onDisabled","outlined","borderColor","border","borderWidth","disabledLabel","strong","secondary","accentAlt","capsuleSolid","borderRadius","shape","radius","full","capsuleOutlined","process","env","NODE_ENV","console","warn"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { commonColors } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport { ButtonColor, ButtonVariant } from './ButtonProps';\n\ntype UseVariantStyleMapReturns = {\n    container?: FountainUiStyle;\n    iconColor?: string;\n    labelColor?: string;\n}\n\ntype VariantStyleMap = {\n    [variant in ButtonVariant]: {\n        [color in ButtonColor]?: UseVariantStyleMapReturns;\n    }\n};\n\nexport default function useVariantStyleMap(variant: ButtonVariant, color: ButtonColor): UseVariantStyleMapReturns {\n    const theme = useTheme();\n\n    return useMemo(() => {\n        const { palette } = theme;\n\n        const variantStyleMap: VariantStyleMap = {\n            solid: {\n                accent: {\n                    container: {\n                        backgroundColor: palette.fill.accent,\n                    },\n                    labelColor: commonColors.static.strongInverse,\n                    iconColor: commonColors.static.strongInverse,\n                },\n                primary: {\n                    container: {\n                        backgroundColor: palette.fill.base,\n                    },\n                    labelColor: palette.text.strongInverse,\n                    iconColor: palette.icon.strongInverse,\n                },\n                danger: {\n                    container: {\n                        backgroundColor: palette.status.danger,\n                    },\n                    labelColor: commonColors.static.strongInverse,\n                    iconColor: commonColors.static.strongInverse,\n                },\n                disabled: {\n                    container: {\n                        backgroundColor: palette.status.disabled,\n                    },\n                    labelColor: palette.status.onDisabled,\n                    iconColor: palette.status.onDisabled,\n                },\n            },\n            outlined: {\n                accent: {\n                    container: {\n                        borderColor: palette.border.accent,\n                        borderWidth: 1,\n                    },\n                    labelColor: palette.text.accent,\n                    iconColor: palette.icon.accent,\n                },\n                primary: {\n                    container: {\n                        borderColor: palette.border.base,\n                        borderWidth: 1,\n                    },\n                    labelColor: palette.text.base,\n                    iconColor: palette.icon.base,\n                },\n                disabled: {\n                    container: {\n                        borderColor: palette.status.disabled,\n                        borderWidth: 1,\n                    },\n                    labelColor: palette.status.disabledLabel,\n                    iconColor: palette.status.disabledLabel,\n                },\n            },\n            text: {\n                primary: {\n                    labelColor: palette.text.strong,\n                    iconColor: palette.icon.strong,\n                },\n                secondary: {\n                    labelColor: palette.text.base,\n                    iconColor: palette.icon.base,\n                },\n                accent: {\n                    labelColor: palette.text.accent,\n                    iconColor: palette.icon.accent,\n                },\n                accentAlt: {\n                    labelColor: palette.text.accentAlt,\n                    iconColor: palette.icon.accentAlt,\n                },\n                disabled: {\n                    labelColor: palette.status.disabledLabel,\n                    iconColor: palette.status.disabledLabel,\n                },\n            },\n            capsuleSolid: {\n                accent: {\n                    container: {\n                        backgroundColor: theme.palette.fill.accent,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: commonColors.static.strongInverse,\n                    iconColor: commonColors.static.strongInverse,\n                },\n                primary: {\n                    container: {\n                        backgroundColor: theme.palette.fill.base,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: palette.text.strongInverse,\n                    iconColor: palette.icon.strongInverse,\n                },\n                danger: {\n                    container: {\n                        backgroundColor: theme.palette.status.danger,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: commonColors.static.strongInverse,\n                    iconColor: commonColors.static.strongInverse,\n                },\n                secondary: {\n                    container: {\n                        backgroundColor: commonColors.static.strongInverse,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: theme.palette.text.strong,\n                    iconColor: theme.palette.icon.strong,\n                },\n                disabled: {\n                    container: {\n                        backgroundColor: theme.palette.status.disabled,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: theme.palette.status.onDisabled,\n                    iconColor: theme.palette.status.onDisabled,\n                },\n            },\n            capsuleOutlined: {\n                primary: {\n                    container: {\n                        borderColor: theme.palette.border.base,\n                        borderRadius: theme.shape.radius.full,\n                        borderWidth: 1,\n                    },\n                    labelColor: theme.palette.text.strong,\n                    iconColor: theme.palette.icon.strong,\n                },\n                disabled: {\n                    container: {\n                        borderColor: theme.palette.status.disabled,\n                        borderRadius: theme.shape.radius.full,\n                        borderWidth: 1,\n                    },\n                    labelColor: theme.palette.status.disabledLabel,\n                    iconColor: theme.palette.status.disabledLabel,\n                },\n            },\n        };\n\n        if (variantStyleMap[variant][color]) {\n            return variantStyleMap[variant][color] as UseVariantStyleMapReturns;\n        }\n\n        if (process.env.NODE_ENV !== 'production') {\n            console.warn('The selected color is not supported for the chosen variant.');\n        }\n\n        return {};\n    }, [theme, variant, color]);\n}\n"],"mappings":"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"}
+{"version":3,"names":["useVariantStyleMap","variant","color","theme","useTheme","useMemo","palette","variantStyleMap","solid","accent","container","backgroundColor","fill","labelColor","commonColors","static","strongInverse","iconColor","primary","base","text","icon","danger","status","disabled","onDisabled","outlined","borderColor","border","borderWidth","disabledLabel","strong","secondary","accentAlt","capsuleSolid","borderRadius","shape","radius","full","capsuleOutlined","process","env","NODE_ENV","console","warn"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { commonColors } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport { ButtonColor, ButtonVariant } from './ButtonProps';\n\ntype UseVariantStyleMapReturns = {\n    container?: FountainUiStyle;\n    iconColor?: string;\n    labelColor?: string;\n}\n\ntype VariantStyleMap = {\n    [variant in ButtonVariant]: {\n        [color in ButtonColor]?: UseVariantStyleMapReturns;\n    }\n};\n\nexport default function useVariantStyleMap(variant: ButtonVariant, color: ButtonColor): UseVariantStyleMapReturns {\n    const theme = useTheme();\n\n    return useMemo(() => {\n        const { palette } = theme;\n\n        const variantStyleMap: VariantStyleMap = {\n            solid: {\n                accent: {\n                    container: {\n                        backgroundColor: palette.fill.accent,\n                    },\n                    labelColor: commonColors.static.strongInverse,\n                    iconColor: commonColors.static.strongInverse,\n                },\n                primary: {\n                    container: {\n                        backgroundColor: palette.fill.base,\n                    },\n                    labelColor: palette.text.strongInverse,\n                    iconColor: palette.icon.strongInverse,\n                },\n                danger: {\n                    container: {\n                        backgroundColor: palette.status.danger,\n                    },\n                    labelColor: commonColors.static.strongInverse,\n                    iconColor: commonColors.static.strongInverse,\n                },\n                disabled: {\n                    container: {\n                        backgroundColor: palette.status.disabled,\n                    },\n                    labelColor: palette.status.onDisabled,\n                    iconColor: palette.status.onDisabled,\n                },\n            },\n            outlined: {\n                accent: {\n                    container: {\n                        borderColor: palette.border.accent,\n                        borderWidth: 1,\n                    },\n                    labelColor: palette.text.accent,\n                    iconColor: palette.icon.accent,\n                },\n                primary: {\n                    container: {\n                        borderColor: palette.border.base,\n                        borderWidth: 1,\n                    },\n                    labelColor: palette.text.base,\n                    iconColor: palette.icon.base,\n                },\n                disabled: {\n                    container: {\n                        borderColor: palette.status.disabled,\n                        borderWidth: 1,\n                    },\n                    labelColor: palette.status.disabledLabel,\n                    iconColor: palette.status.disabledLabel,\n                },\n            },\n            text: {\n                primary: {\n                    labelColor: palette.text.strong,\n                    iconColor: palette.icon.strong,\n                },\n                secondary: {\n                    labelColor: palette.text.base,\n                    iconColor: palette.icon.base,\n                },\n                accent: {\n                    labelColor: palette.text.accent,\n                    iconColor: palette.icon.accent,\n                },\n                accentAlt: {\n                    labelColor: palette.text.accentAlt,\n                    iconColor: palette.icon.accentAlt,\n                },\n                danger: {\n                    labelColor: palette.status.danger,\n                    iconColor: palette.status.danger,\n                },\n                disabled: {\n                    labelColor: palette.status.disabledLabel,\n                    iconColor: palette.status.disabledLabel,\n                },\n            },\n            capsuleSolid: {\n                accent: {\n                    container: {\n                        backgroundColor: theme.palette.fill.accent,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: commonColors.static.strongInverse,\n                    iconColor: commonColors.static.strongInverse,\n                },\n                primary: {\n                    container: {\n                        backgroundColor: theme.palette.fill.base,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: palette.text.strongInverse,\n                    iconColor: palette.icon.strongInverse,\n                },\n                danger: {\n                    container: {\n                        backgroundColor: theme.palette.status.danger,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: commonColors.static.strongInverse,\n                    iconColor: commonColors.static.strongInverse,\n                },\n                secondary: {\n                    container: {\n                        backgroundColor: commonColors.static.strongInverse,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: theme.palette.text.strong,\n                    iconColor: theme.palette.icon.strong,\n                },\n                disabled: {\n                    container: {\n                        backgroundColor: theme.palette.status.disabled,\n                        borderRadius: theme.shape.radius.full,\n                    },\n                    labelColor: theme.palette.status.onDisabled,\n                    iconColor: theme.palette.status.onDisabled,\n                },\n            },\n            capsuleOutlined: {\n                primary: {\n                    container: {\n                        borderColor: theme.palette.border.base,\n                        borderRadius: theme.shape.radius.full,\n                        borderWidth: 1,\n                    },\n                    labelColor: theme.palette.text.strong,\n                    iconColor: theme.palette.icon.strong,\n                },\n                disabled: {\n                    container: {\n                        borderColor: theme.palette.status.disabled,\n                        borderRadius: theme.shape.radius.full,\n                        borderWidth: 1,\n                    },\n                    labelColor: theme.palette.status.disabledLabel,\n                    iconColor: theme.palette.status.disabledLabel,\n                },\n            },\n        };\n\n        if (variantStyleMap[variant][color]) {\n            return variantStyleMap[variant][color] as UseVariantStyleMapReturns;\n        }\n\n        if (process.env.NODE_ENV !== 'production') {\n            console.warn('The selected color is not supported for the chosen variant.');\n        }\n\n        return {};\n    }, [theme, variant, color]);\n}\n"],"mappings":"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"}

package/build/commonjs/Checkbox/Checkbox.js

@@ -41,7 +41,7 @@ function Checkbox(props) {
   } = (0, _useVariantStyleMap.default)(variant, checked);
   const rootStyle = (0, _styles.css)([children ? containerStyle : undefined, styleProp]);
   const fontStyle = (0, _styles.createFontStyle)(theme, {
-    // TODO: apply typo select.
+    selector: typography => typography.body2.regular,
     color: theme.palette.text.strong
   });
 
@@ -59,7 +59,6 @@ function Checkbox(props) {
     style: checkboxStyle
   }, checked ? /*#__PURE__*/_react.default.createElement(_icons.CheckboxOn, {
     fill: iconColor,
-    enableV2: true,
     height: 7.5,
     width: 11
   }) : null), children ? /*#__PURE__*/_react.default.createElement(_Row.default, {

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","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        // TODO: apply typo select.\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                        enableV2={true}\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;IACrC;IACAW,KAAK,EAAEX,KAAK,CAACY,OAAN,CAAcC,IAAd,CAAmBC;EAFW,CAAvB,CAAlB;;EAKA,MAAMC,WAAW,GAAG,MAAM;IACtB,IAAIpB,QAAJ,EAAc;MACVA,QAAQ,CAAC,CAACH,OAAF,CAAR;IACH;EACJ,CAJD;;EAMA,oBACI,6BAAC,mBAAD;IACI,QAAQ,EAAEE,QADd;IAEI,OAAO,EAAEqB,WAFb;IAGI,KAAK,EAAET;EAHX,GAIQP,UAJR,gBAMI,6BAAC,iBAAD;IAAM,KAAK,EAAEG;EAAb,GACKV,OAAO,gBACJ,6BAAC,iBAAD;IACI,IAAI,EAAEY,SADV;IAEI,QAAQ,EAAE,IAFd;IAGI,MAAM,EAAE,GAHZ;IAII,KAAK,EAAE;EAJX,EADI,GAOJ,IARR,CANJ,EAiBKX,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,IA3BR,CADJ;AA+BH;;AAAA"}
+{"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"}

package/build/commonjs/Checkbox/index.js

@@ -3,14 +3,22 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "checkboxVariants", {
+  enumerable: true,
+  get: function () {
+    return _CheckboxProps.checkboxVariants;
+  }
+});
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _LegacyCheckbox.default;
+    return _Checkbox.default;
   }
 });
 
-var _LegacyCheckbox = _interopRequireDefault(require("./LegacyCheckbox"));
+var _Checkbox = _interopRequireDefault(require("./Checkbox"));
+
+var _CheckboxProps = require("./CheckboxProps");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyCheckbox';\nexport type { default as CheckboxProps } from './LegacyCheckboxProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './Checkbox';\nexport type { default as CheckboxProps } from './CheckboxProps';\nexport { checkboxVariants } from './CheckboxProps';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;AAEA"}

package/build/commonjs/Checkbox/useVariantStyleMap.js

@@ -57,8 +57,11 @@ function useVariantStyleMap(variant, checked) {
         }]),
         containerStyle: {
           alignItems: 'center',
+          borderBottomColor: theme.palette.border.weak,
+          borderBottomWidth: 0.5,
           flexDirection: 'row-reverse',
-          gap: theme.spacing(8)
+          gap: theme.spacing(8),
+          paddingVertical: theme.spacing(3.5)
         },
         iconColor: _styles.commonColors.static.strongInverse
       };

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","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                    flexDirection: 'row-reverse',\n                    gap: theme.spacing(8),\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;UAEZuB,aAAa,EAAE,aAFH;UAGZC,GAAG,EAAElB,KAAK,CAACmB,OAAN,CAAc,CAAd;QAHO,CAdb;QAmBHC,SAAS,EAAEI,oBAAA,CAAaC,MAAb,CAAoBC;MAnB5B,CAAP;;IAqBJ;MACI,OAAO,EAAP;EA9CR;AAgDH"}
+{"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"}

package/build/commonjs/Chip/index.js

@@ -3,14 +3,28 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "chipSizes", {
+  enumerable: true,
+  get: function () {
+    return _ChipProps.chipSizes;
+  }
+});
+Object.defineProperty(exports, "chipStartElementVariants", {
+  enumerable: true,
+  get: function () {
+    return _ChipProps.chipStartElementVariants;
+  }
+});
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _LegacyChip.default;
+    return _Chip.default;
   }
 });
 
-var _LegacyChip = _interopRequireDefault(require("./LegacyChip"));
+var _Chip = _interopRequireDefault(require("./Chip"));
+
+var _ChipProps = require("./ChipProps");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

package/build/commonjs/Chip/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyChip';\nexport type { default as ChipProps } from './LegacyChipProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './Chip';\nexport type { default as ChipProps } from './ChipProps';\nexport { chipSizes, chipStartElementVariants } from './ChipProps';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA"}

package/build/commonjs/Chip/useChipStyle.js

@@ -17,13 +17,11 @@ function useChipStyle(size, startElementVariant, isEndElement) {
 
     const fontStyleMap = {
       small: (0, _styles.createFontStyle)(theme, {
-        // TODO: select typography.
-        // selector: (typography) => typography.caption1.medium,
+        selector: typography => typography.caption1.medium,
         color: theme.palette.text.strong
       }),
       large: (0, _styles.createFontStyle)(theme, {
-        // TODO: select typography.
-        // selector: (typography) => typography.body2.medium,
+        selector: typography => typography.body2.medium,
         color: theme.palette.text.strong
       })
     };
@@ -44,9 +42,7 @@ function useChipStyle(size, startElementVariant, isEndElement) {
       backgroundColor: theme.palette.fill.weaker,
       borderRadius: theme.shape.radius.full,
       flexDirection: 'row',
-      height: 'fit-content',
-      overflow: 'hidden',
-      width: 'fit-content'
+      overflow: 'hidden'
     };
     const isLarge = size === 'large';
     const variantStyleMap = {

package/build/commonjs/Chip/useChipStyle.js.map

@@ -1 +1 @@
-{"version":3,"names":["useChipStyle","size","startElementVariant","isEndElement","theme","useTheme","useMemo","fontStyleMap","small","createFontStyle","color","palette","text","strong","large","endElementStyleMap","height","marginLeft","spacing","width","baseContainerStyle","alignItems","backgroundColor","fill","weaker","borderRadius","shape","radius","full","flexDirection","overflow","isLarge","variantStyleMap","avatar","container","paddingLeft","paddingRight","paddingVertical","startElement","marginRight","icon","justifyContent","image","default","paddingBottom","paddingHorizontal","paddingTop","endElement","label"],"sources":["useChipStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { ChipSize, ChipStartElementVariant } from './ChipProps';\n\ninterface ChipStyle {\n    container: FountainUiStyle;\n    endElement?: FountainUiStyle;\n    label: TextStyle;\n    startElement?: FountainUiStyle;\n}\n\ntype VariantStyleMap = Record<ChipStartElementVariant, Partial<ChipStyle>>;\n\n// TODO: need to refactoring...\nexport default function useChipStyle(\n    size: ChipSize,\n    startElementVariant: ChipStartElementVariant,\n    isEndElement: boolean,\n): ChipStyle {\n    const theme = useTheme();\n\n    return useMemo<ChipStyle>(() => {\n        const fontStyleMap: Record<ChipSize, TextStyle> = {\n            small: createFontStyle(theme, {\n                // TODO: select typography.\n                // selector: (typography) => typography.caption1.medium,\n                color: theme.palette.text.strong,\n            }),\n            large: createFontStyle(theme, {\n                // TODO: select typography.\n                // selector: (typography) => typography.body2.medium,\n                color: theme.palette.text.strong,\n            }),\n        };\n\n        const endElementStyleMap: Record<ChipSize, FountainUiStyle> = {\n            small: {\n                height: 14,\n                marginLeft: theme.spacing(2),\n                width: 8.17,\n            },\n            large: {\n                height: 16,\n                marginLeft: theme.spacing(2.5),\n                width: 9,\n            },\n        };\n\n        const baseContainerStyle: FountainUiStyle = {\n            alignItems: 'center',\n            backgroundColor: theme.palette.fill.weaker,\n            borderRadius: theme.shape.radius.full,\n            flexDirection: 'row',\n            height: 'fit-content',\n            overflow: 'hidden',\n            width: 'fit-content',\n        };\n\n        const isLarge = size === 'large';\n\n        const variantStyleMap: VariantStyleMap = {\n            avatar: {\n                container: {\n                    paddingLeft: theme.spacing(isLarge ? 1.5 : 1.25),\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingVertical: theme.spacing(isLarge ? 1.25 : 1),\n                },\n                startElement: {\n                    borderRadius: theme.shape.radius.full,\n                    height: isLarge ? 24 : 22,\n                    marginRight: theme.spacing(isLarge ? 1.5 : 1.25),\n                    width: isLarge ? 24 : 22,\n                },\n            },\n            icon: {\n                container: {\n                    paddingLeft: theme.spacing(1.5),\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingVertical: theme.spacing(isLarge ? 1.5 : 1.25),\n                },\n                startElement: {\n                    alignItems: 'center',\n                    height: isLarge ? 22 : 20,\n                    justifyContent: 'center',\n                    marginRight: theme.spacing(isLarge ? 1 : 0.75),\n                    width: isLarge ? 22 : 20,\n                },\n            },\n            image: {\n                container: {\n                    alignItems: 'center',\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                },\n                startElement: {\n                    borderRadius: theme.shape.radius.full,\n                    height: isLarge ? 34 : 30,\n                    marginRight: theme.spacing(1.5),\n                    width: isLarge ? 45 : 40,\n                },\n            },\n            default: {\n                container: {\n                    paddingBottom: theme.spacing(1.75),\n                    paddingHorizontal: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingTop: theme.spacing(1.5),\n                },\n            },\n        };\n\n        return {\n            container: {\n                ...baseContainerStyle,\n                ...variantStyleMap[startElementVariant]?.container,\n                ...(isEndElement ? { paddingRight: theme.spacing(isLarge ? 2.5 : 2.25) } : {}),\n            },\n            endElement: endElementStyleMap[size],\n            label: fontStyleMap[size],\n            startElement: variantStyleMap[startElementVariant]?.startElement,\n        };\n    }, [theme, size, startElementVariant]);\n}\n"],"mappings":"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"}
+{"version":3,"names":["useChipStyle","size","startElementVariant","isEndElement","theme","useTheme","useMemo","fontStyleMap","small","createFontStyle","selector","typography","caption1","medium","color","palette","text","strong","large","body2","endElementStyleMap","height","marginLeft","spacing","width","baseContainerStyle","alignItems","backgroundColor","fill","weaker","borderRadius","shape","radius","full","flexDirection","overflow","isLarge","variantStyleMap","avatar","container","paddingLeft","paddingRight","paddingVertical","startElement","marginRight","icon","justifyContent","image","default","paddingBottom","paddingHorizontal","paddingTop","endElement","label"],"sources":["useChipStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { ChipSize, ChipStartElementVariant } from './ChipProps';\n\ninterface ChipStyle {\n    container: FountainUiStyle;\n    endElement?: FountainUiStyle;\n    label: TextStyle;\n    startElement?: FountainUiStyle;\n}\n\ntype VariantStyleMap = Record<ChipStartElementVariant, Partial<ChipStyle>>;\n\n// TODO: need to refactoring...\nexport default function useChipStyle(\n    size: ChipSize,\n    startElementVariant: ChipStartElementVariant,\n    isEndElement: boolean,\n): ChipStyle {\n    const theme = useTheme();\n\n    return useMemo<ChipStyle>(() => {\n        const fontStyleMap: Record<ChipSize, TextStyle> = {\n            small: createFontStyle(theme, {\n                selector: (typography) => typography.caption1.medium,\n                color: theme.palette.text.strong,\n            }),\n            large: createFontStyle(theme, {\n                selector: (typography) => typography.body2.medium,\n                color: theme.palette.text.strong,\n            }),\n        };\n\n        const endElementStyleMap: Record<ChipSize, FountainUiStyle> = {\n            small: {\n                height: 14,\n                marginLeft: theme.spacing(2),\n                width: 8.17,\n            },\n            large: {\n                height: 16,\n                marginLeft: theme.spacing(2.5),\n                width: 9,\n            },\n        };\n\n        const baseContainerStyle: FountainUiStyle = {\n            alignItems: 'center',\n            backgroundColor: theme.palette.fill.weaker,\n            borderRadius: theme.shape.radius.full,\n            flexDirection: 'row',\n            overflow: 'hidden',\n        };\n\n        const isLarge = size === 'large';\n\n        const variantStyleMap: VariantStyleMap = {\n            avatar: {\n                container: {\n                    paddingLeft: theme.spacing(isLarge ? 1.5 : 1.25),\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingVertical: theme.spacing(isLarge ? 1.25 : 1),\n                },\n                startElement: {\n                    borderRadius: theme.shape.radius.full,\n                    height: isLarge ? 24 : 22,\n                    marginRight: theme.spacing(isLarge ? 1.5 : 1.25),\n                    width: isLarge ? 24 : 22,\n                },\n            },\n            icon: {\n                container: {\n                    paddingLeft: theme.spacing(1.5),\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingVertical: theme.spacing(isLarge ? 1.5 : 1.25),\n                },\n                startElement: {\n                    alignItems: 'center',\n                    height: isLarge ? 22 : 20,\n                    justifyContent: 'center',\n                    marginRight: theme.spacing(isLarge ? 1 : 0.75),\n                    width: isLarge ? 22 : 20,\n                },\n            },\n            image: {\n                container: {\n                    alignItems: 'center',\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                },\n                startElement: {\n                    borderRadius: theme.shape.radius.full,\n                    height: isLarge ? 34 : 30,\n                    marginRight: theme.spacing(1.5),\n                    width: isLarge ? 45 : 40,\n                },\n            },\n            default: {\n                container: {\n                    paddingBottom: theme.spacing(1.75),\n                    paddingHorizontal: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingTop: theme.spacing(1.5),\n                },\n            },\n        };\n\n        return {\n            container: {\n                ...baseContainerStyle,\n                ...variantStyleMap[startElementVariant]?.container,\n                ...(isEndElement ? { paddingRight: theme.spacing(isLarge ? 2.5 : 2.25) } : {}),\n            },\n            endElement: endElementStyleMap[size],\n            label: fontStyleMap[size],\n            startElement: variantStyleMap[startElementVariant]?.startElement,\n        };\n    }, [theme, size, startElementVariant]);\n}\n"],"mappings":"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"}