@fountain-ui/core 2.0.0-beta.92 → 2.0.0-beta.94

package/build/commonjs/Chip/Chip.js

@@ -13,86 +13,48 @@ var _styles = require("../styles");
 
 var _utils = require("../utils");
 
-var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
+var _ButtonBase = _interopRequireDefault(require("../ButtonBase/ButtonBase"));
+
+var _useChipStyle = _interopRequireDefault(require("./useChipStyle"));
 
 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 ICON_SIZE = 20;
-
-const useStyles = function () {
-  const theme = (0, _styles.useTheme)();
-  return {
-    root: {
-      alignItems: 'center',
-      borderRadius: theme.shape.roundnessExtra,
-      flexDirection: 'row',
-      height: 32,
-      justifyContent: 'center',
-      paddingLeft: theme.spacing(3),
-      paddingRight: theme.spacing(3)
-    }
-  };
-};
-
 function Chip(props) {
   const {
     children,
-    endIcon: endIconProp,
+    endElement: endElementProp,
     numberOfLines,
     onPress,
-    startIcon: startIconProp,
+    size = 'small',
+    startElement: startElementProp,
+    startElementVariant = 'default',
     style: styleProp,
-    variant = 'outlined',
     ...otherProps
   } = props;
-  const theme = (0, _styles.useTheme)();
-  const styles = useStyles();
-  const fontColor = variant === 'outlined' ? theme.palette.tertiary.main : theme.palette.primary.main;
-  const variantStyleMap = {
-    outlined: {
-      backgroundColor: theme.palette.paper.default,
-      borderColor: theme.palette.border.default,
-      borderWidth: 1
-    },
-    filled: {
-      backgroundColor: theme.palette.paper.grey
-    },
-    bold: {
-      backgroundColor: theme.palette.paper.default,
-      borderColor: theme.palette.primary.main,
-      borderWidth: 1.5
-    }
-  };
-  const chipStyle = (0, _styles.css)([styles.root, variantStyleMap[variant], styleProp]);
-  const fontStyle = (0, _styles.createFontStyle)(theme, {
-    selector: typo => variant === 'bold' ? typo.subtitle2 : typo.body2,
-    color: fontColor
+  const {
+    container: containerStyle,
+    endElement: endElementStyle,
+    label: labelStyle,
+    startElement: startElementStyle
+  } = (0, _useChipStyle.default)(size, startElementVariant, !!endElementProp);
+  const chipStyle = (0, _styles.css)([containerStyle, styleProp]);
+  const startElement = startElementVariant === 'icon' ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: startElementStyle
+  }, (0, _utils.cloneElementSafely)(startElementProp)) : (0, _utils.cloneElementSafely)(startElementProp, {
+    style: startElementStyle
+  });
+  const endElement = (0, _utils.cloneElementSafely)(endElementProp, {
+    style: endElementStyle
   });
-  const textMarginSize = theme.spacing(1);
-  const textMarginStyle = startIconProp ? {
-    marginLeft: textMarginSize
-  } : endIconProp ? {
-    marginRight: textMarginSize
-  } : undefined;
-  const textStyle = (0, _styles.css)([fontStyle, textMarginStyle, {
-    textAlign: 'center'
-  }]);
-  const iconProps = {
-    width: ICON_SIZE,
-    height: ICON_SIZE,
-    fill: fontColor
-  };
-  const startIcon = (0, _utils.cloneElementSafely)(startIconProp, iconProps);
-  const endIcon = (0, _utils.cloneElementSafely)(endIconProp, iconProps);
   return /*#__PURE__*/_react.default.createElement(_ButtonBase.default, _extends({
     onPress: onPress,
     style: chipStyle
-  }, otherProps), startIcon, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+  }, otherProps), startElement, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
     children: children,
     numberOfLines: numberOfLines,
-    style: textStyle
-  }), endIcon);
+    style: labelStyle
+  }), endElement);
 }
 //# sourceMappingURL=Chip.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["ICON_SIZE","useStyles","theme","useTheme","root","alignItems","borderRadius","shape","roundnessExtra","flexDirection","height","justifyContent","paddingLeft","spacing","paddingRight","Chip","props","children","endIcon","endIconProp","numberOfLines","onPress","startIcon","startIconProp","style","styleProp","variant","otherProps","styles","fontColor","palette","tertiary","main","primary","variantStyleMap","outlined","backgroundColor","paper","default","borderColor","border","borderWidth","filled","grey","bold","chipStyle","css","fontStyle","createFontStyle","selector","typo","subtitle2","body2","color","textMarginSize","textMarginStyle","marginLeft","marginRight","undefined","textStyle","textAlign","iconProps","width","fill","cloneElementSafely"],"sources":["Chip.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport ButtonBase from '../ButtonBase';\nimport type ChipProps from './ChipProps';\n\ntype ChipStyles = NamedStylesStringUnion<'root'>;\n\nconst ICON_SIZE = 20;\n\nconst useStyles: UseStyles<ChipStyles> = function (): ChipStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            borderRadius: theme.shape.roundnessExtra,\n            flexDirection: 'row',\n            height: 32,\n            justifyContent: 'center',\n            paddingLeft: theme.spacing(3),\n            paddingRight: theme.spacing(3),\n        },\n    };\n};\n\nexport default function Chip(props: ChipProps) {\n    const {\n        children,\n        endIcon: endIconProp,\n        numberOfLines,\n        onPress,\n        startIcon: startIconProp,\n        style: styleProp,\n        variant = 'outlined',\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n    const styles = useStyles();\n\n    const fontColor = variant === 'outlined'\n        ? theme.palette.tertiary.main\n        : theme.palette.primary.main;\n\n    const variantStyleMap = {\n        outlined: {\n            backgroundColor: theme.palette.paper.default,\n            borderColor: theme.palette.border.default,\n            borderWidth: 1,\n        },\n        filled: {\n            backgroundColor: theme.palette.paper.grey,\n        },\n        bold: {\n            backgroundColor: theme.palette.paper.default,\n            borderColor: theme.palette.primary.main,\n            borderWidth: 1.5,\n        },\n    };\n\n    const chipStyle = css([\n        styles.root,\n        variantStyleMap[variant],\n        styleProp,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => variant === 'bold'\n            ? typo.subtitle2\n            : typo.body2,\n        color: fontColor,\n    });\n\n    const textMarginSize = theme.spacing(1);\n    const textMarginStyle = startIconProp\n        ? { marginLeft: textMarginSize }\n        : endIconProp\n            ? { marginRight: textMarginSize }\n            : undefined;\n\n    const textStyle = css([\n        fontStyle,\n        textMarginStyle,\n        { textAlign: 'center' },\n    ]);\n\n    const iconProps = {\n        width: ICON_SIZE,\n        height: ICON_SIZE,\n        fill: fontColor,\n    };\n\n    const startIcon = cloneElementSafely(startIconProp, iconProps);\n    const endIcon = cloneElementSafely(endIconProp, iconProps);\n\n    return (\n        <ButtonBase\n            onPress={onPress}\n            style={chipStyle}\n            {...otherProps}\n        >\n            {startIcon}\n\n            <Text\n                children={children}\n                numberOfLines={numberOfLines}\n                style={textStyle}\n            />\n\n            {endIcon}\n        </ButtonBase>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"names":["Chip","props","children","endElement","endElementProp","numberOfLines","onPress","size","startElement","startElementProp","startElementVariant","style","styleProp","otherProps","container","containerStyle","endElementStyle","label","labelStyle","startElementStyle","useChipStyle","chipStyle","css","cloneElementSafely"],"sources":["Chip.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport { css } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport ButtonBase from '../ButtonBase/ButtonBase';\nimport type ChipProps from './ChipProps';\nimport type { ChipSize } from './ChipProps';\nimport useChipStyle from './useChipStyle';\n\nexport default function Chip(props: ChipProps) {\n    const {\n        children,\n        endElement: endElementProp,\n        numberOfLines,\n        onPress,\n        size = 'small' as ChipSize,\n        startElement: startElementProp,\n        startElementVariant = 'default',\n        style: styleProp,\n        ...otherProps\n    } = props;\n\n    const {\n        container: containerStyle,\n        endElement: endElementStyle,\n        label: labelStyle,\n        startElement: startElementStyle,\n    } = useChipStyle(size, startElementVariant, !!endElementProp);\n\n    const chipStyle = css([\n        containerStyle,\n        styleProp,\n    ]);\n\n    const startElement = startElementVariant === 'icon'\n        ? (\n            <View style={startElementStyle}>\n                {cloneElementSafely(startElementProp)}\n            </View>\n        ) : cloneElementSafely(startElementProp, { style: startElementStyle });\n    const endElement = cloneElementSafely(endElementProp, { style: endElementStyle });\n\n    return (\n        <ButtonBase\n            onPress={onPress}\n            style={chipStyle}\n            {...otherProps}\n        >\n            {startElement}\n\n            <Text\n                children={children}\n                numberOfLines={numberOfLines}\n                style={labelStyle}\n            />\n\n            {endElement}\n        </ButtonBase>\n    );\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAGA;;;;;;AAEe,SAASA,IAAT,CAAcC,KAAd,EAAgC;EAC3C,MAAM;IACFC,QADE;IAEFC,UAAU,EAAEC,cAFV;IAGFC,aAHE;IAIFC,OAJE;IAKFC,IAAI,GAAG,OALL;IAMFC,YAAY,EAAEC,gBANZ;IAOFC,mBAAmB,GAAG,SAPpB;IAQFC,KAAK,EAAEC,SARL;IASF,GAAGC;EATD,IAUFZ,KAVJ;EAYA,MAAM;IACFa,SAAS,EAAEC,cADT;IAEFZ,UAAU,EAAEa,eAFV;IAGFC,KAAK,EAAEC,UAHL;IAIFV,YAAY,EAAEW;EAJZ,IAKF,IAAAC,qBAAA,EAAab,IAAb,EAAmBG,mBAAnB,EAAwC,CAAC,CAACN,cAA1C,CALJ;EAOA,MAAMiB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBP,cADkB,EAElBH,SAFkB,CAAJ,CAAlB;EAKA,MAAMJ,YAAY,GAAGE,mBAAmB,KAAK,MAAxB,gBAEb,6BAAC,iBAAD;IAAM,KAAK,EAAES;EAAb,GACK,IAAAI,yBAAA,EAAmBd,gBAAnB,CADL,CAFa,GAKb,IAAAc,yBAAA,EAAmBd,gBAAnB,EAAqC;IAAEE,KAAK,EAAEQ;EAAT,CAArC,CALR;EAMA,MAAMhB,UAAU,GAAG,IAAAoB,yBAAA,EAAmBnB,cAAnB,EAAmC;IAAEO,KAAK,EAAEK;EAAT,CAAnC,CAAnB;EAEA,oBACI,6BAAC,mBAAD;IACI,OAAO,EAAEV,OADb;IAEI,KAAK,EAAEe;EAFX,GAGQR,UAHR,GAKKL,YALL,eAOI,6BAAC,iBAAD;IACI,QAAQ,EAAEN,QADd;IAEI,aAAa,EAAEG,aAFnB;IAGI,KAAK,EAAEa;EAHX,EAPJ,EAaKf,UAbL,CADJ;AAiBH"}

package/build/commonjs/Chip/ChipProps.js

@@ -1,2 +1,11 @@
 "use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.chipStartElementVariants = exports.chipSizes = void 0;
+const chipSizes = ['large', 'small'];
+exports.chipSizes = chipSizes;
+const chipStartElementVariants = ['default', 'avatar', 'image', 'icon'];
+exports.chipStartElementVariants = chipStartElementVariants;
 //# sourceMappingURL=ChipProps.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["ChipProps.ts"],"sourcesContent":["import React from 'react';\nimport { OverridableComponentProps } from '../types';\nimport type { ButtonBaseProps } from '../ButtonBase';\n\nexport type ChipVariant = 'outlined' | 'filled' | 'bold';\n\nexport default interface ChipProps extends OverridableComponentProps<ButtonBaseProps, {\n    /**\n     * Element placed after the children.\n     */\n    endIcon?: React.ReactElement;\n\n    /**\n     * The content of the component.\n     */\n    children: string;\n\n    /**\n     * Number of lines of children.\n     */\n    numberOfLines?: number;\n\n    /**\n     * Element placed before the children.\n     */\n    startIcon?: React.ReactElement;\n\n    /**\n     * The variant to use.\n     * @default 'outlined'\n     */\n    variant?: ChipVariant;\n}> {}"],"mappings":""}
+{"version":3,"names":["chipSizes","chipStartElementVariants"],"sources":["ChipProps.ts"],"sourcesContent":["import React from 'react';\nimport { OverridableComponentProps } from '../types';\nimport type { ButtonBaseProps } from '../ButtonBase';\n\nexport const chipSizes = ['large', 'small'] as const;\nexport type ChipSize = typeof chipSizes[number];\n\nexport const chipStartElementVariants = ['default', 'avatar', 'image', 'icon'] as const;\nexport type ChipStartElementVariant = typeof chipStartElementVariants[number];\n\nexport default interface ChipProps extends OverridableComponentProps<ButtonBaseProps, {\n    /**\n     * Element placed after the children.\n     */\n    endElement?: React.ReactElement;\n\n    /**\n     * The content of the component.\n     */\n    children: string;\n\n    /**\n     * Number of lines of children.\n     */\n    numberOfLines?: number;\n\n    /**\n     * Determines size of component.\n     * @default 'small'\n     */\n    size?: ChipSize;\n\n    /**\n     * Element placed before the children.\n     */\n    startElement?: React.ReactElement;\n\n    /**\n     * Determines the style of the start element.\n     */\n    startElementVariant?: ChipStartElementVariant;\n}> {}\n"],"mappings":";;;;;;AAIO,MAAMA,SAAS,GAAG,CAAC,OAAD,EAAU,OAAV,CAAlB;;AAGA,MAAMC,wBAAwB,GAAG,CAAC,SAAD,EAAY,QAAZ,EAAsB,OAAtB,EAA+B,MAA/B,CAAjC"}

package/build/commonjs/Chip/LegacyChip.js

@@ -0,0 +1,98 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Chip;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _styles = require("../styles");
+
+var _utils = require("../utils");
+
+var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
+
+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 ICON_SIZE = 20;
+
+const useStyles = function () {
+  const theme = (0, _styles.useTheme)();
+  return {
+    root: {
+      alignItems: 'center',
+      borderRadius: theme.shape.roundnessExtra,
+      flexDirection: 'row',
+      height: 32,
+      justifyContent: 'center',
+      paddingLeft: theme.spacing(3),
+      paddingRight: theme.spacing(3)
+    }
+  };
+};
+
+function Chip(props) {
+  const {
+    children,
+    endIcon: endIconProp,
+    numberOfLines,
+    onPress,
+    startIcon: startIconProp,
+    style: styleProp,
+    variant = 'outlined',
+    ...otherProps
+  } = props;
+  const theme = (0, _styles.useTheme)();
+  const styles = useStyles();
+  const fontColor = variant === 'outlined' ? theme.palette.tertiary.main : theme.palette.primary.main;
+  const variantStyleMap = {
+    outlined: {
+      backgroundColor: theme.palette.paper.default,
+      borderColor: theme.palette.border.default,
+      borderWidth: 1
+    },
+    filled: {
+      backgroundColor: theme.palette.paper.grey
+    },
+    bold: {
+      backgroundColor: theme.palette.paper.default,
+      borderColor: theme.palette.primary.main,
+      borderWidth: 1.5
+    }
+  };
+  const chipStyle = (0, _styles.css)([styles.root, variantStyleMap[variant], styleProp]);
+  const fontStyle = (0, _styles.createFontStyle)(theme, {
+    selector: typo => variant === 'bold' ? typo.subtitle2 : typo.body2,
+    color: fontColor
+  });
+  const textMarginSize = theme.spacing(1);
+  const textMarginStyle = startIconProp ? {
+    marginLeft: textMarginSize
+  } : endIconProp ? {
+    marginRight: textMarginSize
+  } : undefined;
+  const textStyle = (0, _styles.css)([fontStyle, textMarginStyle, {
+    textAlign: 'center'
+  }]);
+  const iconProps = {
+    width: ICON_SIZE,
+    height: ICON_SIZE,
+    fill: fontColor
+  };
+  const startIcon = (0, _utils.cloneElementSafely)(startIconProp, iconProps);
+  const endIcon = (0, _utils.cloneElementSafely)(endIconProp, iconProps);
+  return /*#__PURE__*/_react.default.createElement(_ButtonBase.default, _extends({
+    onPress: onPress,
+    style: chipStyle
+  }, otherProps), startIcon, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    children: children,
+    numberOfLines: numberOfLines,
+    style: textStyle
+  }), endIcon);
+}
+//# sourceMappingURL=LegacyChip.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["ICON_SIZE","useStyles","theme","useTheme","root","alignItems","borderRadius","shape","roundnessExtra","flexDirection","height","justifyContent","paddingLeft","spacing","paddingRight","Chip","props","children","endIcon","endIconProp","numberOfLines","onPress","startIcon","startIconProp","style","styleProp","variant","otherProps","styles","fontColor","palette","tertiary","main","primary","variantStyleMap","outlined","backgroundColor","paper","default","borderColor","border","borderWidth","filled","grey","bold","chipStyle","css","fontStyle","createFontStyle","selector","typo","subtitle2","body2","color","textMarginSize","textMarginStyle","marginLeft","marginRight","undefined","textStyle","textAlign","iconProps","width","fill","cloneElementSafely"],"sources":["LegacyChip.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport ButtonBase from '../ButtonBase';\nimport type ChipProps from './LegacyChipProps';\n\ntype ChipStyles = NamedStylesStringUnion<'root'>;\n\nconst ICON_SIZE = 20;\n\nconst useStyles: UseStyles<ChipStyles> = function (): ChipStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            borderRadius: theme.shape.roundnessExtra,\n            flexDirection: 'row',\n            height: 32,\n            justifyContent: 'center',\n            paddingLeft: theme.spacing(3),\n            paddingRight: theme.spacing(3),\n        },\n    };\n};\n\nexport default function Chip(props: ChipProps) {\n    const {\n        children,\n        endIcon: endIconProp,\n        numberOfLines,\n        onPress,\n        startIcon: startIconProp,\n        style: styleProp,\n        variant = 'outlined',\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n    const styles = useStyles();\n\n    const fontColor = variant === 'outlined'\n        ? theme.palette.tertiary.main\n        : theme.palette.primary.main;\n\n    const variantStyleMap = {\n        outlined: {\n            backgroundColor: theme.palette.paper.default,\n            borderColor: theme.palette.border.default,\n            borderWidth: 1,\n        },\n        filled: {\n            backgroundColor: theme.palette.paper.grey,\n        },\n        bold: {\n            backgroundColor: theme.palette.paper.default,\n            borderColor: theme.palette.primary.main,\n            borderWidth: 1.5,\n        },\n    };\n\n    const chipStyle = css([\n        styles.root,\n        variantStyleMap[variant],\n        styleProp,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => variant === 'bold'\n            ? typo.subtitle2\n            : typo.body2,\n        color: fontColor,\n    });\n\n    const textMarginSize = theme.spacing(1);\n    const textMarginStyle = startIconProp\n        ? { marginLeft: textMarginSize }\n        : endIconProp\n            ? { marginRight: textMarginSize }\n            : undefined;\n\n    const textStyle = css([\n        fontStyle,\n        textMarginStyle,\n        { textAlign: 'center' },\n    ]);\n\n    const iconProps = {\n        width: ICON_SIZE,\n        height: ICON_SIZE,\n        fill: fontColor,\n    };\n\n    const startIcon = cloneElementSafely(startIconProp, iconProps);\n    const endIcon = cloneElementSafely(endIconProp, iconProps);\n\n    return (\n        <ButtonBase\n            onPress={onPress}\n            style={chipStyle}\n            {...otherProps}\n        >\n            {startIcon}\n\n            <Text\n                children={children}\n                numberOfLines={numberOfLines}\n                style={textStyle}\n            />\n\n            {endIcon}\n        </ButtonBase>\n    );\n}\n"],"mappings":"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"}

package/build/commonjs/Chip/LegacyChipProps.js

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

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["LegacyChipProps.ts"],"sourcesContent":["import React from 'react';\nimport { OverridableComponentProps } from '../types';\nimport type { ButtonBaseProps } from '../ButtonBase';\n\nexport type ChipVariant = 'outlined' | 'filled' | 'bold';\n\nexport default interface ChipProps extends OverridableComponentProps<ButtonBaseProps, {\n    /**\n     * Element placed after the children.\n     */\n    endIcon?: React.ReactElement;\n\n    /**\n     * The content of the component.\n     */\n    children: string;\n\n    /**\n     * Number of lines of children.\n     */\n    numberOfLines?: number;\n\n    /**\n     * Element placed before the children.\n     */\n    startIcon?: React.ReactElement;\n\n    /**\n     * The variant to use.\n     * @default 'outlined'\n     */\n    variant?: ChipVariant;\n}> {}\n"],"mappings":""}

package/build/commonjs/Chip/index.js

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _Chip.default;
+    return _LegacyChip.default;
   }
 });
 
-var _Chip = _interopRequireDefault(require("./Chip"));
+var _LegacyChip = _interopRequireDefault(require("./LegacyChip"));
 
 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 './Chip';\nexport type { default as ChipProps } from './ChipProps';"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyChip';\nexport type { default as ChipProps } from './LegacyChipProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}

package/build/commonjs/Chip/useChipStyle.js

@@ -0,0 +1,113 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useChipStyle;
+
+var _react = require("react");
+
+var _styles = require("../styles");
+
+// TODO: need to refactoring...
+function useChipStyle(size, startElementVariant, isEndElement) {
+  const theme = (0, _styles.useTheme)();
+  return (0, _react.useMemo)(() => {
+    var _variantStyleMap$star, _variantStyleMap$star2;
+
+    const fontStyleMap = {
+      small: (0, _styles.createFontStyle)(theme, {
+        // TODO: select typography.
+        // selector: (typography) => typography.caption1.medium,
+        color: theme.palette.text.strong
+      }),
+      large: (0, _styles.createFontStyle)(theme, {
+        // TODO: select typography.
+        // selector: (typography) => typography.body2.medium,
+        color: theme.palette.text.strong
+      })
+    };
+    const endElementStyleMap = {
+      small: {
+        height: 14,
+        marginLeft: theme.spacing(2),
+        width: 8.17
+      },
+      large: {
+        height: 16,
+        marginLeft: theme.spacing(2.5),
+        width: 9
+      }
+    };
+    const baseContainerStyle = {
+      alignItems: 'center',
+      backgroundColor: theme.palette.fill.weaker,
+      borderRadius: theme.shape.radius.full,
+      flexDirection: 'row',
+      height: 'fit-content',
+      overflow: 'hidden',
+      width: 'fit-content'
+    };
+    const isLarge = size === 'large';
+    const variantStyleMap = {
+      avatar: {
+        container: {
+          paddingLeft: theme.spacing(isLarge ? 1.5 : 1.25),
+          paddingRight: theme.spacing(isLarge ? 3.5 : 3),
+          paddingVertical: theme.spacing(isLarge ? 1.25 : 1)
+        },
+        startElement: {
+          borderRadius: theme.shape.radius.full,
+          height: isLarge ? 24 : 22,
+          marginRight: theme.spacing(isLarge ? 1.5 : 1.25),
+          width: isLarge ? 24 : 22
+        }
+      },
+      icon: {
+        container: {
+          paddingLeft: theme.spacing(1.5),
+          paddingRight: theme.spacing(isLarge ? 3.5 : 3),
+          paddingVertical: theme.spacing(isLarge ? 1.5 : 1.25)
+        },
+        startElement: {
+          alignItems: 'center',
+          height: isLarge ? 22 : 20,
+          justifyContent: 'center',
+          marginRight: theme.spacing(isLarge ? 1 : 0.75),
+          width: isLarge ? 22 : 20
+        }
+      },
+      image: {
+        container: {
+          alignItems: 'center',
+          paddingRight: theme.spacing(isLarge ? 3.5 : 3)
+        },
+        startElement: {
+          borderRadius: theme.shape.radius.full,
+          height: isLarge ? 34 : 30,
+          marginRight: theme.spacing(1.5),
+          width: isLarge ? 45 : 40
+        }
+      },
+      default: {
+        container: {
+          paddingBottom: theme.spacing(1.75),
+          paddingHorizontal: theme.spacing(isLarge ? 3.5 : 3),
+          paddingTop: theme.spacing(1.5)
+        }
+      }
+    };
+    return {
+      container: { ...baseContainerStyle,
+        ...((_variantStyleMap$star = variantStyleMap[startElementVariant]) === null || _variantStyleMap$star === void 0 ? void 0 : _variantStyleMap$star.container),
+        ...(isEndElement ? {
+          paddingRight: theme.spacing(isLarge ? 2.5 : 2.25)
+        } : {})
+      },
+      endElement: endElementStyleMap[size],
+      label: fontStyleMap[size],
+      startElement: (_variantStyleMap$star2 = variantStyleMap[startElementVariant]) === null || _variantStyleMap$star2 === void 0 ? void 0 : _variantStyleMap$star2.startElement
+    };
+  }, [theme, size, startElementVariant]);
+}
+//# sourceMappingURL=useChipStyle.js.map

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

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

package/build/commonjs/Empty/Empty.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Empty;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _Button = _interopRequireDefault(require("../Button/Button"));
+
+var _Column = _interopRequireDefault(require("../Column"));
+
+var _Spacer = _interopRequireDefault(require("../Spacer"));
+
+var _styles = require("../styles");
+
+var _utils = require("../utils");
+
+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',
+      flex: 1,
+      justifyContent: 'center',
+      paddingHorizontal: theme.spacing(12)
+    },
+    cta: {
+      alignSelf: 'center'
+    }
+  };
+};
+
+function Empty(props) {
+  const {
+    buttonTitle,
+    description,
+    headerContent: headerContentProp,
+    onButtonPress,
+    style: styleProp,
+    title,
+    ...otherProps
+  } = props;
+  const styles = useStyles();
+  const theme = (0, _styles.useTheme)();
+  const rootStyle = (0, _styles.css)([styles.root, styleProp]);
+  const headerContent = (0, _utils.cloneElementSafely)(headerContentProp);
+  const titleFontStyle = (0, _styles.createFontStyle)(theme, {
+    selector: typography => typography.header3.semiBold,
+    color: theme.palette.text.strong
+  });
+  const descriptionFontStyle = (0, _styles.createFontStyle)(theme, {
+    // TODO: select typography.
+    // selector: (typography) =>  typography.body2.regular,
+    color: theme.palette.text.base
+  });
+  return /*#__PURE__*/_react.default.createElement(_Column.default, _extends({
+    style: rootStyle
+  }, otherProps), headerContent ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, headerContent, /*#__PURE__*/_react.default.createElement(_Spacer.default, {
+    size: 6
+  })) : null, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    children: title,
+    style: titleFontStyle
+  }), description ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Spacer.default, {
+    size: 2
+  }), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    children: description,
+    style: descriptionFontStyle
+  })) : null, buttonTitle && onButtonPress ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Spacer.default, {
+    size: 6
+  }), /*#__PURE__*/_react.default.createElement(_Button.default, {
+    children: buttonTitle,
+    color: 'accent',
+    onPress: onButtonPress,
+    style: styles.cta,
+    variant: 'solid'
+  })) : null);
+}
+//# sourceMappingURL=Empty.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","flex","justifyContent","paddingHorizontal","spacing","cta","alignSelf","Empty","props","buttonTitle","description","headerContent","headerContentProp","onButtonPress","style","styleProp","title","otherProps","styles","rootStyle","css","cloneElementSafely","titleFontStyle","createFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","descriptionFontStyle","base"],"sources":["Empty.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Button from '../Button/Button';\nimport Column from '../Column';\nimport Spacer from '../Spacer';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type { FalsyReactElement } from '../utils';\nimport { cloneElementSafely } from '../utils';\nimport type EmptyProps from './EmptyProps';\n\ntype EmptyStyles = NamedStylesStringUnion<'root' | 'cta'>;\n\nconst useStyles: UseStyles<EmptyStyles> = function (): EmptyStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            flex: 1,\n            justifyContent: 'center',\n            paddingHorizontal: theme.spacing(12),\n        },\n        cta: {\n            alignSelf: 'center',\n        },\n    };\n};\n\nexport default function Empty(props: EmptyProps) {\n    const {\n        buttonTitle,\n        description,\n        headerContent: headerContentProp,\n        onButtonPress,\n        style: styleProp,\n        title,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const theme = useTheme();\n\n    const rootStyle = css([\n        styles.root,\n        styleProp,\n    ]);\n\n    const headerContent = cloneElementSafely(headerContentProp as FalsyReactElement);\n\n    const titleFontStyle = createFontStyle(theme, {\n        selector: (typography) => typography.header3.semiBold,\n        color: theme.palette.text.strong,\n    });\n\n    const descriptionFontStyle = createFontStyle(theme, {\n        // TODO: select typography.\n        // selector: (typography) =>  typography.body2.regular,\n        color: theme.palette.text.base,\n    });\n\n    return (\n        <Column\n            style={rootStyle}\n            {...otherProps}\n        >\n            {headerContent ? (\n                <React.Fragment>\n                    {headerContent}\n\n                    <Spacer size={6}/>\n                </React.Fragment>\n            ) : null}\n\n            <Text\n                children={title}\n                style={titleFontStyle}\n            />\n\n            {description ? (\n                <React.Fragment>\n                    <Spacer size={2}/>\n\n                    <Text\n                        children={description}\n                        style={descriptionFontStyle}\n                    />\n                </React.Fragment>\n            ) : null}\n\n            {buttonTitle && onButtonPress ? (\n                <React.Fragment>\n                    <Spacer size={6}/>\n\n                    {/* TODO: change Capsule solid variant. */}\n                    <Button\n                        children={buttonTitle}\n                        color={'accent'}\n                        onPress={onButtonPress}\n                        style={styles.cta}\n                        variant={'solid'}\n                    />\n                </React.Fragment>\n            ) : null}\n        </Column>\n    );\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAKA,MAAMA,SAAiC,GAAG,YAAyB;EAC/D,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,IAAI,EAAE,CAFJ;MAGFC,cAAc,EAAE,QAHd;MAIFC,iBAAiB,EAAEN,KAAK,CAACO,OAAN,CAAc,EAAd;IAJjB,CADH;IAOHC,GAAG,EAAE;MACDC,SAAS,EAAE;IADV;EAPF,CAAP;AAWH,CAdD;;AAgBe,SAASC,KAAT,CAAeC,KAAf,EAAkC;EAC7C,MAAM;IACFC,WADE;IAEFC,WAFE;IAGFC,aAAa,EAAEC,iBAHb;IAIFC,aAJE;IAKFC,KAAK,EAAEC,SALL;IAMFC,KANE;IAOF,GAAGC;EAPD,IAQFT,KARJ;EAUA,MAAMU,MAAM,GAAGtB,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMqB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACnB,IADW,EAElBgB,SAFkB,CAAJ,CAAlB;EAKA,MAAMJ,aAAa,GAAG,IAAAU,yBAAA,EAAmBT,iBAAnB,CAAtB;EAEA,MAAMU,cAAc,GAAG,IAAAC,uBAAA,EAAgB1B,KAAhB,EAAuB;IAC1C2B,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAE/B,KAAK,CAACgC,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAvB,CAAvB;EAKA,MAAMC,oBAAoB,GAAG,IAAAT,uBAAA,EAAgB1B,KAAhB,EAAuB;IAChD;IACA;IACA+B,KAAK,EAAE/B,KAAK,CAACgC,OAAN,CAAcC,IAAd,CAAmBG;EAHsB,CAAvB,CAA7B;EAMA,oBACI,6BAAC,eAAD;IACI,KAAK,EAAEd;EADX,GAEQF,UAFR,GAIKN,aAAa,gBACV,6BAAC,cAAD,CAAO,QAAP,QACKA,aADL,eAGI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADU,GAMV,IAVR,eAYI,6BAAC,iBAAD;IACI,QAAQ,EAAEK,KADd;IAEI,KAAK,EAAEM;EAFX,EAZJ,EAiBKZ,WAAW,gBACR,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,6BAAC,iBAAD;IACI,QAAQ,EAAEA,WADd;IAEI,KAAK,EAAEsB;EAFX,EAHJ,CADQ,GASR,IA1BR,EA4BKvB,WAAW,IAAII,aAAf,gBACG,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAII,6BAAC,eAAD;IACI,QAAQ,EAAEJ,WADd;IAEI,KAAK,EAAE,QAFX;IAGI,OAAO,EAAEI,aAHb;IAII,KAAK,EAAEK,MAAM,CAACb,GAJlB;IAKI,OAAO,EAAE;EALb,EAJJ,CADH,GAaG,IAzCR,CADJ;AA6CH"}

package/build/commonjs/Empty/EmptyProps.js

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

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["EmptyProps.ts"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface EmptyProps extends OverridableComponentProps<Omit<ViewProps, 'children'>, {\n    /**\n     * Text displayed on the CTA button.\n     */\n    buttonTitle?: string;\n\n    /**\n     * Descriptive text shown below the title.\n     */\n    description?: string;\n\n    /**\n     * Content displayed at the top.\n     * Can be an icon, image, or any visual element.\n     */\n    headerContent?: React.ReactNode;\n\n    /**\n     * Function called when the CTA button is pressed.\n     */\n    onButtonPress?: () => void;\n\n    /**\n     * The main title text.\n     */\n    title: string;\n}> {}\n"],"mappings":""}

package/build/commonjs/Empty/index.js

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

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

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