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

package/build/commonjs/BottomSheetContent/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _BottomSheetContent.default;
+  }
+});
+
+var _BottomSheetContent = _interopRequireDefault(require("./BottomSheetContent"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+//# sourceMappingURL=index.js.map

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

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

package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js

@@ -0,0 +1,74 @@
+"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,
+    size: 'large',
+    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                    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/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/BottomSheetTitle/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _BottomSheetTitle.default;
+  }
+});
+
+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

@@ -32,7 +32,8 @@ const useStyles = function () {
       alignItems: 'center',
       borderRadius: theme.shape.radius.sm,
       flexDirection: 'row',
-      justifyContent: 'center'
+      justifyContent: 'center',
+      minHeight: 32
     },
     fullWidth: {
       width: '100%'
@@ -56,6 +57,9 @@ const useStyles = function () {
     },
     loadingSpinner: {
       position: 'absolute'
+    },
+    iconContainer: {
+      paddingTop: 1
     }
   };
 };
@@ -95,6 +99,7 @@ function Button(props) {
     color: colorProp = 'primary',
     disabled: disabledProp = false,
     disableMinWidth = false,
+    disablePadding = false,
     endIcon: endIconProp,
     fullWidth = false,
     href,
@@ -117,21 +122,27 @@ 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 startIcon = startIconProp ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.iconContainer
+  }, (0, _utils.cloneElementSafely)(startIconProp, iconProps)) : null;
+  const endIcon = endIconProp ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.iconContainer
+  }, (0, _utils.cloneElementSafely)(endIconProp, iconProps)) : null;
   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 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 +170,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":";;;;;;;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;EADQ,CAAlB;EAIA,MAAMR,SAAS,GAAG,IAAAa,yBAAA,EAAmBZ,aAAnB,EAAkCU,SAAlC,CAAlB;EACA,MAAMlB,OAAO,GAAG,IAAAoB,yBAAA,EAAmBnB,WAAnB,EAAgCiB,SAAhC,CAAhB;EAEA,MAAMG,eAAe,GAAG,IAAAC,YAAA,EAAI,CACxBV,MAAM,CAAChD,IADiB,EAExBkD,cAFwB,EAGxBF,MAAM,CAACN,IAAD,CAHkB,EAIxBlC,SAAS,GAAGwC,MAAM,CAACxC,SAAV,GAAsBmD,SAJP,EAKxBxB,eAAe,GAAG;IAAEtB,QAAQ,EAAE;EAAZ,CAAH,GAAqB8C,SALZ,EAMxBb,SANwB,CAAJ,CAAxB;EASA,MAAMc,YAAY,GAAG,IAAAF,YAAA,EAAI;IACrBG,OAAO,EAAEtB,SAAS,GAAG,CAAH,GAAO;EADJ,CAAJ,CAArB;EAIA,MAAMuB,SAAS,GAAG,IAAAC,wBAAA,EAAgBjE,KAAhB,EAAuB;IACrCkE,QAAQ,EAAGC,CAAD,IAAO7C,YAAY,CAACsB,IAAD,CADQ;IAErCd,KAAK,EAAEwB;EAF8B,CAAvB,CAAlB;EAKA,MAAMc,SAAS,GAAG,IAAAR,YAAA,EAAI,CAClBI,SADkB,EAElB;IAAEK,SAAS,EAAE;EAAb,CAFkB,CAAJ,CAAlB;EAKA,MAAMC,mBAAmB,GAAGzC,OAAO,KAAK,MAAZ,IAAsB,CAACc,WAAvB,GACtB,OADsB,GAEtBA,WAFN;;EAIA,MAAM4B,WAAW,GAAG,YAAY;IAC5B,IAAIpC,QAAJ,EAAc;MACV;IACH;;IACD,IAAIO,OAAJ,EAAa;MACTA,OAAO;MACP;IACH;;IACD,IAAIF,IAAJ,EAAU;MACN,IAAI,MAAMgC,oBAAA,CAAQC,UAAR,CAAmBjC,IAAnB,CAAV,EAAoC;QAChC,MAAMgC,oBAAA,CAAQE,OAAR,CAAgBlC,IAAhB,CAAN;MACH;IACJ;EACJ,CAbD;;EAeA,MAAMmC,mBAAmB,GAAG/C,sBAAsB,CAACC,OAAD,EAAUC,KAAV,CAAlD;EAEA,oBACI,6BAAC,mBAAD;IACI,QAAQ,EAAEK,QADd;IAEI,OAAO,EAAEoC,WAFb;IAGI,KAAK,EAAEZ,eAHX;IAII,WAAW,EAAEW;EAJjB,GAKQrB,UALR,gBAOI,6BAAC,iBAAD;IAAM,KAAK,EAAEa;EAAb,GACKjB,SADL,eAGI,6BAAC,iBAAD;IAAM,KAAK,EAAEuB;EAAb,GACKnC,QADL,CAHJ,EAOKK,OAPL,CAPJ,EAiBKG,SAAS,gBACN,6BAAC,qBAAD;IACI,KAAK,EAAEkC,mBADX;IAEI,IAAI,EAAE/B,IAFV;IAGI,KAAK,EAAEM,MAAM,CAAC9B;EAHlB,EADM,GAMN,IAvBR,CADJ;AA2BH;;AAAA"}
+{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","borderRadius","shape","radius","sm","flexDirection","justifyContent","minHeight","fullWidth","width","large","gap","spacing","minWidth","paddingHorizontal","paddingVertical","medium","small","loadingSpinner","position","iconContainer","paddingTop","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, 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' | 'iconContainer'>;\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            minHeight: 32,\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        iconContainer: {\n            paddingTop: 1,\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 = startIconProp ? (\n        <View style={styles.iconContainer}>\n            {cloneElementSafely(startIconProp, iconProps)}\n        </View>\n    ) : null;\n\n    const endIcon = endIconProp ? (\n        <View style={styles.iconContainer}>\n            {cloneElementSafely(endIconProp, iconProps)}\n        </View>\n    ) : null;\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

@@ -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     * 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/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

@@ -14,6 +14,8 @@ var _styles2 = require("../styles");
 function useVariantStyleMap(variant, color) {
   const theme = (0, _styles2.useTheme)();
   return (0, _react.useMemo)(() => {
+    var _variantStyleMap$vari;
+
     const {
       palette
     } = theme;
@@ -91,6 +93,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
@@ -160,7 +166,7 @@ function useVariantStyleMap(variant, color) {
       }
     };
 
-    if (variantStyleMap[variant][color]) {
+    if ((_variantStyleMap$vari = variantStyleMap[variant]) !== null && _variantStyleMap$vari !== void 0 && _variantStyleMap$vari[color]) {
       return variantStyleMap[variant][color];
     }
 

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

@@ -35,13 +35,14 @@ function Checkbox(props) {
   } = props;
   const theme = (0, _styles.useTheme)();
   const {
+    checkboxContainerStyle,
     checkboxStyle,
     containerStyle,
     iconColor
   } = (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
   });
 
@@ -56,13 +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,
-    enableV2: true,
     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","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","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/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

@@ -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
       };
@@ -57,8 +61,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","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/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