@fountain-ui/core 2.0.0-beta.93 → 2.0.0-beta.95

package/build/commonjs/SnackbarContent/SnackbarContent.js

@@ -11,94 +11,104 @@ var _reactNative = require("react-native");
 
 var _styles = require("@fountain-ui/styles");
 
-var _utils = require("@fountain-ui/utils");
-
 var _styles2 = require("../styles");
 
-var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
+var _ButtonBase = _interopRequireDefault(require("../ButtonBase/ButtonBase"));
 
 var _Column = _interopRequireDefault(require("../Column"));
 
-var _Paper = _interopRequireDefault(require("../Paper"));
-
 var _Spacer = _interopRequireDefault(require("../Spacer"));
 
 var _Typography = _interopRequireDefault(require("../Typography"));
 
+var _StatusIcon = _interopRequireDefault(require("./StatusIcon"));
+
 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, _styles2.useTheme)();
-  const backgroundColor = theme.palette.primary.main;
-
-  const [r, g, b] = _react.default.useMemo(() => (0, _utils.rgb)(backgroundColor), [backgroundColor]);
-
   return {
     root: {
       flexDirection: 'row',
       alignItems: 'center',
-      backgroundColor: `rgba(${r}, ${g}, ${b}, .9)`,
-      borderRadius: theme.shape.roundness,
+      backgroundColor: theme.palette.surface.accent,
+      borderRadius: 22,
+      paddingBottom: theme.spacing(2.25),
       paddingHorizontal: theme.spacing(4),
-      paddingVertical: theme.spacing(3)
-    },
-    action: {
-      paddingVertical: theme.spacing(2)
+      paddingTop: theme.spacing(2)
     }
   };
 };
 
 function SnackbarContent(props) {
   const {
-    actionLabel,
+    actionContent,
     message,
     title,
-    onActionPress,
-    style,
+    onPress,
+    style: styleProp,
+    status = 'info',
     startIcon,
     ...otherProps
   } = props;
   const styles = useStyles();
   const theme = (0, _styles2.useTheme)();
   const titleFontStyle = (0, _styles2.createFontStyle)(theme, {
-    selector: typo => typo.subtitle2,
-    color: theme.mode === 'light' ? _styles.lightTheme.palette.primary.contrastTextColor : _styles.lightTheme.palette.primary.main
+    selector: _ => (0, _styles.typographyOf)({
+      fontSize: 14,
+      lineHeight: 18.2,
+      fontFamily: 'Pretendard-SemiBold',
+      letterSpacing: 0
+    }),
+    color: theme.palette.text.strongInverse
   });
   const messageFontStyle = (0, _styles2.createFontStyle)(theme, {
-    selector: typo => typo.body2,
-    color: title ? theme.mode === 'light' ? _styles.darkTheme.palette.text.secondary : _styles.lightTheme.palette.text.secondary : theme.palette.primary.contrastTextColor
+    selector: _ => (0, _styles.typographyOf)({
+      fontSize: 13,
+      lineHeight: 16.9,
+      fontFamily: 'Pretendard-Regular',
+      letterSpacing: 0
+    }),
+    color: theme.palette.text.strongInverse
   });
   const labelFontStyle = (0, _styles2.createFontStyle)(theme, {
-    selector: typo => typo.button2,
-    color: theme.palette.primary.contrastTextColor
+    selector: _ => (0, _styles.typographyOf)({
+      fontSize: 13,
+      lineHeight: 16.25,
+      fontFamily: 'LexendDeca-SemiBold',
+      letterSpacing: -0.26
+    }),
+    color: theme.palette.text.accent
   });
-  const labelStyle = (0, _styles2.css)([labelFontStyle, {
-    padding: theme.spacing(2)
-  }]);
-  return /*#__PURE__*/_react.default.createElement(_Paper.default, _extends({
-    elevation: 0,
-    style: (0, _styles2.css)([styles.root, actionLabel ? styles.action : undefined, style])
+  const rootStyle = (0, _styles2.css)([styles.root, startIcon ? {
+    borderRadius: theme.shape.radius.xl
+  } : undefined, styleProp]);
+  return /*#__PURE__*/_react.default.createElement(_ButtonBase.default, _extends({
+    disabled: !onPress,
+    onPress: onPress,
+    style: rootStyle
   }, otherProps), startIcon ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, startIcon, /*#__PURE__*/_react.default.createElement(_Spacer.default, {
     size: 3
+  })) : status !== 'info' ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_StatusIcon.default, {
+    status: status
+  }), /*#__PURE__*/_react.default.createElement(_Spacer.default, {
+    size: 1.5
   })) : null, /*#__PURE__*/_react.default.createElement(_Column.default, null, title ? /*#__PURE__*/_react.default.createElement(_Typography.default, {
     children: title,
     style: (0, _styles2.css)([titleFontStyle])
   }) : null, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
     children: message,
     style: (0, _styles2.css)([messageFontStyle])
-  })), actionLabel ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Spacer.default, {
+  })), actionContent ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Spacer.default, {
     flex: 1
   }), /*#__PURE__*/_react.default.createElement(_Spacer.default, {
     size: 1
-  }), /*#__PURE__*/_react.default.createElement(_ButtonBase.default, {
-    onPress: onActionPress,
-    pressEffect: 'none'
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
-    children: actionLabel,
-    style: labelStyle
-  }))) : null);
+  }), typeof actionContent === 'string' ? /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    children: actionContent,
+    style: labelFontStyle
+  }) : actionContent) : null);
 }
 
 ;

package/build/commonjs/SnackbarContent/SnackbarContent.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","backgroundColor","palette","primary","main","r","g","b","React","useMemo","rgb","root","flexDirection","alignItems","borderRadius","shape","roundness","paddingHorizontal","spacing","paddingVertical","action","SnackbarContent","props","actionLabel","message","title","onActionPress","style","startIcon","otherProps","styles","titleFontStyle","createFontStyle","selector","typo","subtitle2","color","mode","lightTheme","contrastTextColor","messageFontStyle","body2","darkTheme","text","secondary","labelFontStyle","button2","labelStyle","css","padding","undefined"],"sources":["SnackbarContent.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { lightTheme, darkTheme } from '@fountain-ui/styles';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { rgb } from '@fountain-ui/utils';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase';\nimport Column from '../Column';\nimport Paper from '../Paper';\nimport Spacer from '../Spacer';\nimport Typography from '../Typography';\nimport type SnackbarContentProps from './SnackbarContentProps';\n\ntype SnackBarContentStyles = NamedStylesStringUnion<'root' | 'action'>;\n\nconst useStyles: UseStyles<SnackBarContentStyles> = function (): SnackBarContentStyles {\n    const theme = useTheme();\n\n    const backgroundColor = theme.palette.primary.main;\n    const [r, g, b] = React.useMemo(() => rgb(backgroundColor), [backgroundColor]);\n\n    return {\n        root: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            backgroundColor: `rgba(${r}, ${g}, ${b}, .9)`,\n            borderRadius: theme.shape.roundness,\n            paddingHorizontal: theme.spacing(4),\n            paddingVertical: theme.spacing(3),\n        },\n        action: {\n            paddingVertical: theme.spacing(2),\n        },\n    };\n};\n\nexport default function SnackbarContent(props: SnackbarContentProps) {\n    const {\n        actionLabel,\n        message,\n        title,\n        onActionPress,\n        style,\n        startIcon,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const theme = useTheme();\n\n    const titleFontStyle = createFontStyle(theme, {\n        selector: (typo) => typo.subtitle2,\n        color: theme.mode === 'light'\n            ? lightTheme.palette.primary.contrastTextColor\n            : lightTheme.palette.primary.main,\n    });\n\n    const messageFontStyle = createFontStyle(theme, {\n        selector: (typo) => typo.body2,\n        color: title\n            ? theme.mode === 'light'\n                ? darkTheme.palette.text.secondary\n                : lightTheme.palette.text.secondary\n            : theme.palette.primary.contrastTextColor,\n    });\n\n    const labelFontStyle = createFontStyle(theme, {\n        selector: (typo) => typo.button2,\n        color: theme.palette.primary.contrastTextColor,\n    });\n\n    const labelStyle = css([\n        labelFontStyle,\n        { padding: theme.spacing(2) },\n    ]);\n\n    return (\n        <Paper\n            elevation={0}\n            style={css([\n                styles.root,\n                actionLabel ? styles.action : undefined,\n                style,\n            ])}\n            {...otherProps}\n        >\n            {startIcon ? (\n                <React.Fragment>\n                    {startIcon}\n\n                    <Spacer size={3}/>\n                </React.Fragment>\n            ) : null}\n\n            <Column>\n                {title ? (\n                    <Typography\n                        children={title}\n                        style={css([titleFontStyle])}\n                    />\n                ) : null}\n\n                <Text\n                    children={message}\n                    style={css([messageFontStyle])}\n                />\n            </Column>\n\n            {actionLabel ? (\n                <React.Fragment>\n                    <Spacer flex={1}/>\n\n                    <Spacer size={1}/>\n\n                    <ButtonBase\n                        onPress={onActionPress}\n                        pressEffect={'none'}\n                    >\n                        <Text\n                            children={actionLabel}\n                            style={labelStyle}\n                        />\n                    </ButtonBase>\n                </React.Fragment>\n            ) : null}\n        </Paper>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["useStyles","theme","useTheme","root","flexDirection","alignItems","backgroundColor","palette","surface","accent","borderRadius","paddingBottom","spacing","paddingHorizontal","paddingTop","SnackbarContent","props","actionContent","message","title","onPress","style","styleProp","status","startIcon","otherProps","styles","titleFontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","text","strongInverse","messageFontStyle","labelFontStyle","rootStyle","css","shape","radius","xl","undefined"],"sources":["SnackbarContent.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { typographyOf } from '@fountain-ui/styles';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase/ButtonBase';\nimport Column from '../Column';\nimport Spacer from '../Spacer';\nimport Typography from '../Typography';\nimport type SnackbarContentProps from './SnackbarContentProps';\nimport StatusIcon from './StatusIcon';\n\ntype SnackBarContentStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<SnackBarContentStyles> = function (): SnackBarContentStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            backgroundColor: theme.palette.surface.accent,\n            borderRadius: 22,\n            paddingBottom: theme.spacing(2.25),\n            paddingHorizontal: theme.spacing(4),\n            paddingTop: theme.spacing(2),\n        },\n    };\n};\n\nexport default function SnackbarContent(props: SnackbarContentProps) {\n    const {\n        actionContent,\n        message,\n        title,\n        onPress,\n        style: styleProp,\n        status = 'info',\n        startIcon,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const theme = useTheme();\n\n    const titleFontStyle = createFontStyle(theme, {\n        selector: (_) => typographyOf({\n            fontSize: 14,\n            lineHeight: 18.2,\n            fontFamily: 'Pretendard-SemiBold',\n            letterSpacing: 0,\n        }),\n        color: theme.palette.text.strongInverse,\n    });\n\n    const messageFontStyle = createFontStyle(theme, {\n        selector: (_) => typographyOf({\n            fontSize: 13,\n            lineHeight: 16.9,\n            fontFamily: 'Pretendard-Regular',\n            letterSpacing: 0,\n        }),\n        color: theme.palette.text.strongInverse,\n    });\n\n    const labelFontStyle = createFontStyle(theme, {\n        selector: (_) => typographyOf({\n            fontSize: 13,\n            lineHeight: 16.25,\n            fontFamily: 'LexendDeca-SemiBold',\n            letterSpacing: -0.26,\n        }),\n        color: theme.palette.text.accent,\n    });\n\n    const rootStyle = css([\n        styles.root,\n        startIcon ? { borderRadius: theme.shape.radius.xl } : undefined,\n        styleProp,\n    ]);\n\n    return (\n        <ButtonBase\n            disabled={!onPress}\n            onPress={onPress}\n            style={rootStyle}\n            {...otherProps}\n        >\n            {startIcon ? (\n                <React.Fragment>\n                    {startIcon}\n\n                    <Spacer size={3}/>\n                </React.Fragment>\n            ) : status !== 'info' ? (\n                <React.Fragment>\n                    <StatusIcon status={status}/>\n\n                    <Spacer size={1.5}/>\n                </React.Fragment>\n            ) : null}\n\n            <Column>\n                {title ? (\n                    <Typography\n                        children={title}\n                        style={css([titleFontStyle])}\n                    />\n                ) : null}\n\n                <Text\n                    children={message}\n                    style={css([messageFontStyle])}\n                />\n            </Column>\n\n            {actionContent ? (\n                <React.Fragment>\n                    <Spacer flex={1}/>\n\n                    <Spacer size={1}/>\n\n                    {typeof actionContent === 'string' ? (\n                        <Text\n                            children={actionContent}\n                            style={labelFontStyle}\n                        />\n                    ) : (actionContent)}\n                </React.Fragment>\n            ) : null}\n        </ButtonBase>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAIA,MAAMA,SAA2C,GAAG,YAAmC;EACnF,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,aAAa,EAAE,KADb;MAEFC,UAAU,EAAE,QAFV;MAGFC,eAAe,EAAEL,KAAK,CAACM,OAAN,CAAcC,OAAd,CAAsBC,MAHrC;MAIFC,YAAY,EAAE,EAJZ;MAKFC,aAAa,EAAEV,KAAK,CAACW,OAAN,CAAc,IAAd,CALb;MAMFC,iBAAiB,EAAEZ,KAAK,CAACW,OAAN,CAAc,CAAd,CANjB;MAOFE,UAAU,EAAEb,KAAK,CAACW,OAAN,CAAc,CAAd;IAPV;EADH,CAAP;AAWH,CAdD;;AAgBe,SAASG,eAAT,CAAyBC,KAAzB,EAAsD;EACjE,MAAM;IACFC,aADE;IAEFC,OAFE;IAGFC,KAHE;IAIFC,OAJE;IAKFC,KAAK,EAAEC,SALL;IAMFC,MAAM,GAAG,MANP;IAOFC,SAPE;IAQF,GAAGC;EARD,IASFT,KATJ;EAWA,MAAMU,MAAM,GAAG1B,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMyB,cAAc,GAAG,IAAAC,wBAAA,EAAgB3B,KAAhB,EAAuB;IAC1C4B,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,qBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CADyB;IAO1CC,KAAK,EAAEnC,KAAK,CAACM,OAAN,CAAc8B,IAAd,CAAmBC;EAPgB,CAAvB,CAAvB;EAUA,MAAMC,gBAAgB,GAAG,IAAAX,wBAAA,EAAgB3B,KAAhB,EAAuB;IAC5C4B,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,oBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CAD2B;IAO5CC,KAAK,EAAEnC,KAAK,CAACM,OAAN,CAAc8B,IAAd,CAAmBC;EAPkB,CAAvB,CAAzB;EAUA,MAAME,cAAc,GAAG,IAAAZ,wBAAA,EAAgB3B,KAAhB,EAAuB;IAC1C4B,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,KAFc;MAG1BC,UAAU,EAAE,qBAHc;MAI1BC,aAAa,EAAE,CAAC;IAJU,CAAb,CADyB;IAO1CC,KAAK,EAAEnC,KAAK,CAACM,OAAN,CAAc8B,IAAd,CAAmB5B;EAPgB,CAAvB,CAAvB;EAUA,MAAMgC,SAAS,GAAG,IAAAC,YAAA,EAAI,CAClBhB,MAAM,CAACvB,IADW,EAElBqB,SAAS,GAAG;IAAEd,YAAY,EAAET,KAAK,CAAC0C,KAAN,CAAYC,MAAZ,CAAmBC;EAAnC,CAAH,GAA6CC,SAFpC,EAGlBxB,SAHkB,CAAJ,CAAlB;EAMA,oBACI,6BAAC,mBAAD;IACI,QAAQ,EAAE,CAACF,OADf;IAEI,OAAO,EAAEA,OAFb;IAGI,KAAK,EAAEqB;EAHX,GAIQhB,UAJR,GAMKD,SAAS,gBACN,6BAAC,cAAD,CAAO,QAAP,QACKA,SADL,eAGI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADM,GAMND,MAAM,KAAK,MAAX,gBACA,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,mBAAD;IAAY,MAAM,EAAEA;EAApB,EADJ,eAGI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADA,GAMA,IAlBR,eAoBI,6BAAC,eAAD,QACKJ,KAAK,gBACF,6BAAC,mBAAD;IACI,QAAQ,EAAEA,KADd;IAEI,KAAK,EAAE,IAAAuB,YAAA,EAAI,CAACf,cAAD,CAAJ;EAFX,EADE,GAKF,IANR,eAQI,6BAAC,iBAAD;IACI,QAAQ,EAAET,OADd;IAEI,KAAK,EAAE,IAAAwB,YAAA,EAAI,CAACH,gBAAD,CAAJ;EAFX,EARJ,CApBJ,EAkCKtB,aAAa,gBACV,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,EAKK,OAAOA,aAAP,KAAyB,QAAzB,gBACG,6BAAC,iBAAD;IACI,QAAQ,EAAEA,aADd;IAEI,KAAK,EAAEuB;EAFX,EADH,GAKIvB,aAVT,CADU,GAaV,IA/CR,CADJ;AAmDH;;AAAA"}

package/build/commonjs/SnackbarContent/SnackbarContentProps.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["SnackbarContentProps.ts"],"sourcesContent":["import React from 'react';\nimport type { OverridableComponentProps } from '../types';\nimport type { PaperProps } from '../Paper';\n\nexport default interface SnackbarContentProps extends OverridableComponentProps<PaperProps, {\n    /**\n     * The text to use for the action component.\n     */\n    actionLabel?: string;\n\n    /**\n     * The message to display.\n     */\n    message?: string;\n\n    /**\n     * Callback fired when the action component pressed.\n     */\n    onActionPress?: () => void;\n\n    /**\n     * Element placed before the title and message.\n     */\n    startIcon?: React.ReactElement;\n\n    /**\n     * The title to display.\n     */\n    title?: string;\n}> {}\n"],"mappings":""}
+{"version":3,"names":[],"sources":["SnackbarContentProps.ts"],"sourcesContent":["import type { ButtonBaseProps } from '../ButtonBase';\nimport type SnackbarProps from '../Snackbar/SnackbarProps';\nimport type { OverridableComponentProps } from '../types';\n\ntype SnackbarContentBaseProps = Pick<SnackbarProps,\n    | 'actionContent'\n    | 'message'\n    | 'onPress'\n    | 'startIcon'\n    | 'status'\n    | 'title'>\n\nexport default interface SnackbarContentProps extends OverridableComponentProps<Omit<ButtonBaseProps, 'children'>, SnackbarContentBaseProps> {}\n"],"mappings":""}

package/build/commonjs/SnackbarContent/StatusIcon.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = StatusIcon;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _icons = require("../internal/icons");
+
+var _styles = require("../styles");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function StatusIcon(props) {
+  const {
+    status
+  } = props;
+  const theme = (0, _styles.useTheme)();
+
+  switch (status) {
+    case 'success':
+      return /*#__PURE__*/_react.default.createElement(_icons.CheckCircle, {
+        color: 'accent',
+        enableV2: true,
+        height: 17,
+        width: 14
+      });
+
+    case 'fail':
+      return /*#__PURE__*/_react.default.createElement(_icons.InfoCircle, {
+        enableV2: true,
+        fill: theme.palette.status.danger,
+        height: 17,
+        width: 14
+      });
+
+    default:
+      return null;
+  }
+}
+//# sourceMappingURL=StatusIcon.js.map

package/build/commonjs/SnackbarContent/StatusIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StatusIcon","props","status","theme","useTheme","palette","danger"],"sources":["StatusIcon.tsx"],"sourcesContent":["import React from 'react';\nimport { CheckCircle, InfoCircle } from '../internal/icons';\nimport { useTheme } from '../styles';\nimport type SnackbarContentProps from './SnackbarContentProps';\n\ninterface StatusIconProps {\n    status: SnackbarContentProps['status'];\n}\n\nexport default function StatusIcon(props: StatusIconProps) {\n    const { status } = props;\n\n    const theme = useTheme();\n\n    switch (status) {\n        case 'success':\n            return (\n                <CheckCircle\n                    color={'accent'}\n                    enableV2={true}\n                    height={17}\n                    width={14}\n                />\n            );\n        case 'fail':\n            return (\n                <InfoCircle\n                    enableV2={true}\n                    fill={theme.palette.status.danger}\n                    height={17}\n                    width={14}\n                />\n            );\n        default:\n            return null;\n    }\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAOe,SAASA,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IAAEC;EAAF,IAAaD,KAAnB;EAEA,MAAME,KAAK,GAAG,IAAAC,gBAAA,GAAd;;EAEA,QAAQF,MAAR;IACI,KAAK,SAAL;MACI,oBACI,6BAAC,kBAAD;QACI,KAAK,EAAE,QADX;QAEI,QAAQ,EAAE,IAFd;QAGI,MAAM,EAAE,EAHZ;QAII,KAAK,EAAE;MAJX,EADJ;;IAQJ,KAAK,MAAL;MACI,oBACI,6BAAC,iBAAD;QACI,QAAQ,EAAE,IADd;QAEI,IAAI,EAAEC,KAAK,CAACE,OAAN,CAAcH,MAAd,CAAqBI,MAF/B;QAGI,MAAM,EAAE,EAHZ;QAII,KAAK,EAAE;MAJX,EADJ;;IAQJ;MACI,OAAO,IAAP;EApBR;AAsBH"}

package/build/commonjs/SnackbarContent/index.js

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

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

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

package/build/commonjs/Tab/LegacyTab.js

@@ -0,0 +1,126 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Tab;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactNative = require("react-native");
+
+var _Badge = _interopRequireDefault(require("../Badge"));
+
+var _TabBase = _interopRequireDefault(require("../TabBase"));
+
+var _styles = require("../styles");
+
+var _TabIndicator = _interopRequireDefault(require("./TabIndicator"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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 styles = _styles.StyleSheet.create({
+  root: { // TODO: Remove redundant platform checking
+    ...(_reactNative.Platform.OS === 'web' ? {
+      minWidth: 'auto'
+    } : {}),
+    minHeight: 40
+  },
+  bottomNavigation: {
+    minHeight: 56
+  },
+  filledInner: {
+    justifyContent: 'center'
+  },
+  tertiary: {
+    minHeight: 44
+  }
+});
+
+function Tab(props) {
+  const {
+    badgeVisible = false,
+    children,
+    enableIndicator = false,
+    icon: defaultIcon,
+    indicatorColor = 'primary',
+    indicatorSize = 'full',
+    selected = false,
+    selectedIcon,
+    variant = 'primary',
+    style,
+    onTabInnerLayout,
+    ...otherProps
+  } = props;
+  const theme = (0, _styles.useTheme)();
+  const vertical = variant === 'bottom-navigation';
+  const color = selected ? theme.palette.text.primary : variant === 'contained' ? theme.palette.text.secondary : theme.palette.text.hint;
+  const containedStyle = {
+    borderColor: selected ? theme.palette.primary.main : theme.palette.border.default,
+    borderRadius: theme.shape.roundnessExtra,
+    borderWidth: selected ? 1.5 : 1,
+    minHeight: 'auto',
+    paddingHorizontal: theme.spacing(3),
+    paddingVertical: theme.spacing(1.5)
+  };
+  const tabBaseStyle = (0, _styles.css)([styles.root, variant === 'bottom-navigation' && styles.bottomNavigation, variant === 'contained' && containedStyle, variant === 'tertiary' && styles.tertiary, style]);
+  const tabInnerStyle = (0, _styles.css)([styles.root, styles.filledInner]);
+  const fontStyle = (0, _styles.createFontStyle)(theme, {
+    selector: typo => {
+      switch (variant) {
+        case 'primary':
+          return typo.h2;
+
+        case 'secondary':
+          return typo.button2;
+
+        case 'tertiary':
+          return typo.h3;
+
+        case 'contained':
+          return selected ? { ...typo.subtitle2,
+            fontWeight: typo.fontWeight.medium
+          } : typo.body2;
+
+        default:
+          return typo.flag;
+      }
+    },
+    color
+  });
+  const pressEffect = selected ? 'none' : 'opacity';
+  const icon = selected ? selectedIcon || defaultIcon : defaultIcon;
+  const iconElement = icon ? /*#__PURE__*/(0, _react.cloneElement)(icon, {
+    fill: color
+  }) : null;
+  const tabElement = typeof children !== 'string' ? /*#__PURE__*/_react.default.cloneElement(children, {
+    selected
+  }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Badge.default, {
+    children: iconElement,
+    invisible: !badgeVisible
+  }), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    children: children,
+    style: (0, _styles.css)(fontStyle)
+  }));
+  const tabIndicator = enableIndicator && selected ? /*#__PURE__*/_react.default.createElement(_TabIndicator.default, {
+    indicatorSize: indicatorSize,
+    color: indicatorColor
+  }) : null;
+  return /*#__PURE__*/_react.default.createElement(_TabBase.default, _extends({
+    pressEffect: pressEffect,
+    style: tabBaseStyle,
+    vertical: vertical
+  }, otherProps), indicatorSize === 'fit-content' ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    onLayout: onTabInnerLayout,
+    style: tabInnerStyle
+  }, tabElement, tabIndicator) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, tabElement, tabIndicator));
+}
+
+;
+//# sourceMappingURL=LegacyTab.js.map

package/build/commonjs/Tab/LegacyTab.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["styles","StyleSheet","create","root","Platform","OS","minWidth","minHeight","bottomNavigation","filledInner","justifyContent","tertiary","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","indicatorColor","indicatorSize","selected","selectedIcon","variant","style","onTabInnerLayout","otherProps","theme","useTheme","vertical","color","palette","text","primary","secondary","hint","containedStyle","borderColor","main","border","default","borderRadius","shape","roundnessExtra","borderWidth","paddingHorizontal","spacing","paddingVertical","tabBaseStyle","css","tabInnerStyle","fontStyle","createFontStyle","selector","typo","h2","button2","h3","subtitle2","fontWeight","medium","body2","flag","pressEffect","iconElement","cloneElement","fill","tabElement","React","tabIndicator"],"sources":["LegacyTab.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\nimport { Platform, Text, View } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport type TabProps from './LegacyTabProps';\nimport TabIndicator from './TabIndicator';\n\nconst styles = StyleSheet.create({\n    root: {\n        // TODO: Remove redundant platform checking\n        ...(Platform.OS === 'web' ? { minWidth: 'auto' } : {}),\n        minHeight: 40,\n    },\n    bottomNavigation: {\n        minHeight: 56,\n    },\n    filledInner: {\n        justifyContent: 'center',\n    },\n    tertiary: {\n        minHeight: 44,\n    },\n});\n\nexport default function Tab(props: TabProps) {\n    const {\n        badgeVisible = false,\n        children,\n        enableIndicator = false,\n        icon: defaultIcon,\n        indicatorColor = 'primary',\n        indicatorSize = 'full',\n        selected = false,\n        selectedIcon,\n        variant = 'primary',\n        style,\n        onTabInnerLayout,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const vertical = variant === 'bottom-navigation';\n\n    const color = selected\n        ? theme.palette.text.primary\n        : variant === 'contained'\n            ? theme.palette.text.secondary\n            : theme.palette.text.hint;\n\n    const containedStyle = {\n        borderColor: selected ? theme.palette.primary.main : theme.palette.border.default,\n        borderRadius: theme.shape.roundnessExtra,\n        borderWidth: selected ? 1.5 : 1,\n        minHeight: 'auto',\n        paddingHorizontal: theme.spacing(3),\n        paddingVertical: theme.spacing(1.5),\n    };\n\n    const tabBaseStyle = css([\n        styles.root,\n        variant === 'bottom-navigation' && styles.bottomNavigation,\n        variant === 'contained' && containedStyle,\n        variant === 'tertiary' && styles.tertiary,\n        style,\n    ]);\n\n    const tabInnerStyle = css([\n        styles.root,\n        styles.filledInner,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => {\n            switch (variant) {\n                case 'primary':\n                    return typo.h2;\n                case 'secondary':\n                    return typo.button2;\n                case 'tertiary':\n                    return typo.h3;\n                case 'contained':\n                    return selected\n                        ? { ...typo.subtitle2, fontWeight: typo.fontWeight.medium }\n                        : typo.body2;\n                default:\n                    return typo.flag;\n            }\n        },\n        color,\n    });\n    const pressEffect = selected ? 'none' : 'opacity';\n\n    const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n    const iconElement = icon ? cloneElement(icon, { fill: color }) : null;\n\n    const tabElement = typeof children !== 'string' ? (\n        React.cloneElement(children, {\n            selected,\n        })\n    ) : (\n        <React.Fragment>\n            <Badge\n                children={iconElement}\n                invisible={!badgeVisible}\n            />\n\n            <Text\n                children={children}\n                style={css(fontStyle)}\n            />\n        </React.Fragment>\n    );\n    const tabIndicator = (enableIndicator && selected)\n        ? <TabIndicator indicatorSize={indicatorSize} color={indicatorColor}/>\n        : null;\n\n    return (\n        <TabBase\n            pressEffect={pressEffect}\n            style={tabBaseStyle}\n            vertical={vertical}\n            {...otherProps}\n        >\n            {indicatorSize === 'fit-content' ? (\n                <View onLayout={onTabInnerLayout} style={tabInnerStyle}>\n                    {tabElement}\n\n                    {tabIndicator}\n                </View>\n            ) : (\n                <React.Fragment>\n                    {tabElement}\n\n                    {tabIndicator}\n                </React.Fragment>\n            )}\n        </TabBase>\n    );\n};\n"],"mappings":"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"}

package/build/commonjs/Tab/LegacyTabProps.js

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

package/build/commonjs/Tab/LegacyTabProps.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["LegacyTabProps.ts"],"sourcesContent":["import React from 'react';\nimport type { LayoutChangeEvent } from 'react-native';\nimport type { TabBaseProps } from '../TabBase';\nimport type { OverridableComponentProps } from '../types';\n\nexport type TabVariant = 'primary' | 'secondary' | 'tertiary' | 'bottom-navigation' | 'contained';\nexport type TabIndicatorColor = 'primary' | 'secondary';\nexport type TabIndicatorSize = 'full' | 'fit-content';\n\nexport default interface TabProps extends OverridableComponentProps<TabBaseProps, {\n    /**\n     * If `true`, the badge is visible.\n     * @default false\n     */\n    badgeVisible?: boolean;\n\n    /**\n     * The label of the Tab.\n     */\n    children: string | React.ReactElement;\n\n    /**\n     * If `true`, the indicator is enabled.\n     * @default false\n     */\n    enableIndicator?: boolean;\n\n    /**\n     * If `true`, the component is selected.\n     * @default false\n     */\n    selected?: boolean;\n\n    /**\n     * Element placed before the children.\n     */\n    icon?: React.ReactElement;\n\n    /**\n     * Tab indicator color\n     * @default 'primary'\n     */\n    indicatorColor?: TabIndicatorColor;\n\n    /**\n     * The size of tab indicator.\n     * 'full' adjusts the indicator to the size of the Tab,\n     * while 'fit-content' adjusts the indicator to the size of the content inside the Tab.\n     * @default 'full'\n     */\n    indicatorSize?: TabIndicatorSize;\n\n    /**\n     * If supplied, use this icon on selected state.\n     */\n    selectedIcon?: React.ReactElement;\n\n    /**\n     * The variant to use.\n     * @default 'primary'\n     */\n    variant?: TabVariant;\n\n    /**\n     * Function to be passed to the child component's onLayout prop.\n     */\n    onTabInnerLayout?: (event: LayoutChangeEvent) => void;\n}> {}\n"],"mappings":""}

package/build/commonjs/Tab/Tab.js

@@ -5,23 +5,23 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = Tab;
 
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 
 var _reactNative = require("react-native");
 
 var _Badge = _interopRequireDefault(require("../Badge"));
 
-var _TabBase = _interopRequireDefault(require("../TabBase"));
+var _Spacer = _interopRequireDefault(require("../Spacer"));
 
-var _styles = require("../styles");
+var _TabBase = _interopRequireDefault(require("../TabBase/TabBase"));
 
-var _TabIndicator = _interopRequireDefault(require("./TabIndicator"));
+var _styles = require("../styles");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _utils = require("../utils");
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+var _useVariantStyleMap = _interopRequireDefault(require("./useVariantStyleMap"));
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+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); }
 
@@ -29,17 +29,11 @@ const styles = _styles.StyleSheet.create({
   root: { // TODO: Remove redundant platform checking
     ...(_reactNative.Platform.OS === 'web' ? {
       minWidth: 'auto'
-    } : {}),
-    minHeight: 40
-  },
-  bottomNavigation: {
-    minHeight: 56
+    } : {})
   },
   filledInner: {
+    alignItems: 'center',
     justifyContent: 'center'
-  },
-  tertiary: {
-    minHeight: 44
   }
 });
 
@@ -49,77 +43,45 @@ function Tab(props) {
     children,
     enableIndicator = false,
     icon: defaultIcon,
-    indicatorColor = 'primary',
-    indicatorSize = 'full',
     selected = false,
     selectedIcon,
-    variant = 'primary',
-    style,
+    variant = 'default',
+    style: styleProp,
     onTabInnerLayout,
     ...otherProps
   } = props;
   const theme = (0, _styles.useTheme)();
   const vertical = variant === 'bottom-navigation';
-  const color = selected ? theme.palette.text.primary : variant === 'contained' ? theme.palette.text.secondary : theme.palette.text.hint;
-  const containedStyle = {
-    borderColor: selected ? theme.palette.primary.main : theme.palette.border.default,
-    borderRadius: theme.shape.roundnessExtra,
-    borderWidth: selected ? 1.5 : 1,
-    minHeight: 'auto',
-    paddingHorizontal: theme.spacing(3),
-    paddingVertical: theme.spacing(1.5)
-  };
-  const tabBaseStyle = (0, _styles.css)([styles.root, variant === 'bottom-navigation' && styles.bottomNavigation, variant === 'contained' && containedStyle, variant === 'tertiary' && styles.tertiary, style]);
-  const tabInnerStyle = (0, _styles.css)([styles.root, styles.filledInner]);
-  const fontStyle = (0, _styles.createFontStyle)(theme, {
-    selector: typo => {
-      switch (variant) {
-        case 'primary':
-          return typo.h2;
-
-        case 'secondary':
-          return typo.button2;
-
-        case 'tertiary':
-          return typo.h3;
-
-        case 'contained':
-          return selected ? { ...typo.subtitle2,
-            fontWeight: typo.fontWeight.medium
-          } : typo.body2;
-
-        default:
-          return typo.flag;
-      }
-    },
-    color
-  });
+  const {
+    container: containerStyle,
+    inner: innerStyle,
+    label: labelStyle
+  } = (0, _useVariantStyleMap.default)(variant, selected);
+  const tabBaseStyle = (0, _styles.css)([styles.root, containerStyle, styleProp]);
+  const tabInnerStyle = (0, _styles.css)([styles.filledInner, innerStyle]);
   const pressEffect = selected ? 'none' : 'opacity';
   const icon = selected ? selectedIcon || defaultIcon : defaultIcon;
-  const iconElement = icon ? /*#__PURE__*/(0, _react.cloneElement)(icon, {
-    fill: color
-  }) : null;
-  const tabElement = typeof children !== 'string' ? /*#__PURE__*/_react.default.cloneElement(children, {
+  const iconColor = selected ? theme.palette.icon.strong : theme.palette.icon.base;
+  const iconElement = (0, _utils.cloneElementSafely)(icon, {
+    fill: iconColor
+  });
+  const tabElement = typeof children !== 'string' ? (0, _utils.cloneElementSafely)(children, {
     selected
-  }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Badge.default, {
-    children: iconElement,
+  }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, iconElement ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Badge.default, {
     invisible: !badgeVisible
-  }), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
-    children: children,
-    style: (0, _styles.css)(fontStyle)
-  }));
-  const tabIndicator = enableIndicator && selected ? /*#__PURE__*/_react.default.createElement(_TabIndicator.default, {
-    indicatorSize: indicatorSize,
-    color: indicatorColor
-  }) : null;
+  }, iconElement), /*#__PURE__*/_react.default.createElement(_Spacer.default, {
+    size: 1.25
+  })) : null, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: (0, _styles.css)(labelStyle)
+  }, children));
   return /*#__PURE__*/_react.default.createElement(_TabBase.default, _extends({
     pressEffect: pressEffect,
     style: tabBaseStyle,
     vertical: vertical
-  }, otherProps), indicatorSize === 'fit-content' ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, otherProps), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     onLayout: onTabInnerLayout,
     style: tabInnerStyle
-  }, tabElement, tabIndicator) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, tabElement, tabIndicator));
+  }, tabElement));
 }
 
 ;

package/build/commonjs/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"names":["styles","StyleSheet","create","root","Platform","OS","minWidth","minHeight","bottomNavigation","filledInner","justifyContent","tertiary","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","indicatorColor","indicatorSize","selected","selectedIcon","variant","style","onTabInnerLayout","otherProps","theme","useTheme","vertical","color","palette","text","primary","secondary","hint","containedStyle","borderColor","main","border","default","borderRadius","shape","roundnessExtra","borderWidth","paddingHorizontal","spacing","paddingVertical","tabBaseStyle","css","tabInnerStyle","fontStyle","createFontStyle","selector","typo","h2","button2","h3","subtitle2","fontWeight","medium","body2","flag","pressEffect","iconElement","cloneElement","fill","tabElement","React","tabIndicator"],"sources":["Tab.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\nimport { Platform, Text, View } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport type TabProps from './TabProps';\nimport TabIndicator from './TabIndicator';\n\nconst styles = StyleSheet.create({\n    root: {\n        // TODO: Remove redundant platform checking\n        ...(Platform.OS === 'web' ? { minWidth: 'auto' } : {}),\n        minHeight: 40,\n    },\n    bottomNavigation: {\n        minHeight: 56,\n    },\n    filledInner: {\n        justifyContent: 'center',\n    },\n    tertiary: {\n        minHeight: 44,\n    },\n});\n\nexport default function Tab(props: TabProps) {\n    const {\n        badgeVisible = false,\n        children,\n        enableIndicator = false,\n        icon: defaultIcon,\n        indicatorColor = 'primary',\n        indicatorSize = 'full',\n        selected = false,\n        selectedIcon,\n        variant = 'primary',\n        style,\n        onTabInnerLayout,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const vertical = variant === 'bottom-navigation';\n\n    const color = selected\n        ? theme.palette.text.primary\n        : variant === 'contained'\n            ? theme.palette.text.secondary\n            : theme.palette.text.hint;\n\n    const containedStyle = {\n        borderColor: selected ? theme.palette.primary.main : theme.palette.border.default,\n        borderRadius: theme.shape.roundnessExtra,\n        borderWidth: selected ? 1.5 : 1,\n        minHeight: 'auto',\n        paddingHorizontal: theme.spacing(3),\n        paddingVertical: theme.spacing(1.5),\n    };\n\n    const tabBaseStyle = css([\n        styles.root,\n        variant === 'bottom-navigation' && styles.bottomNavigation,\n        variant === 'contained' && containedStyle,\n        variant === 'tertiary' && styles.tertiary,\n        style,\n    ]);\n\n    const tabInnerStyle = css([\n        styles.root,\n        styles.filledInner,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => {\n            switch (variant) {\n                case 'primary':\n                    return typo.h2;\n                case 'secondary':\n                    return typo.button2;\n                case 'tertiary':\n                    return typo.h3;\n                case 'contained':\n                    return selected\n                        ? { ...typo.subtitle2, fontWeight: typo.fontWeight.medium }\n                        : typo.body2;\n                default:\n                    return typo.flag;\n            }\n        },\n        color,\n    });\n    const pressEffect = selected ? 'none' : 'opacity';\n\n    const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n    const iconElement = icon ? cloneElement(icon, { fill: color }) : null;\n\n    const tabElement = typeof children !== 'string' ? (\n        React.cloneElement(children, {\n            selected,\n        })\n    ) : (\n        <React.Fragment>\n            <Badge\n                children={iconElement}\n                invisible={!badgeVisible}\n            />\n\n            <Text\n                children={children}\n                style={css(fontStyle)}\n            />\n        </React.Fragment>\n    );\n    const tabIndicator = (enableIndicator && selected)\n        ? <TabIndicator indicatorSize={indicatorSize} color={indicatorColor}/>\n        : null;\n\n    return (\n        <TabBase\n            pressEffect={pressEffect}\n            style={tabBaseStyle}\n            vertical={vertical}\n            {...otherProps}\n        >\n            {indicatorSize === 'fit-content' ? (\n                <View onLayout={onTabInnerLayout} style={tabInnerStyle}>\n                    {tabElement}\n\n                    {tabIndicator}\n                </View>\n            ) : (\n                <React.Fragment>\n                    {tabElement}\n\n                    {tabIndicator}\n                </React.Fragment>\n            )}\n        </TabBase>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["styles","StyleSheet","create","root","Platform","OS","minWidth","filledInner","alignItems","justifyContent","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","selected","selectedIcon","variant","style","styleProp","onTabInnerLayout","otherProps","theme","useTheme","vertical","container","containerStyle","inner","innerStyle","label","labelStyle","useVariantStyleMap","tabBaseStyle","css","tabInnerStyle","pressEffect","iconColor","palette","strong","base","iconElement","cloneElementSafely","fill","tabElement"],"sources":["Tab.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform, Text, View } from 'react-native';\nimport Badge from '../Badge';\nimport Spacer from '../Spacer';\nimport TabBase from '../TabBase/TabBase';\nimport { css, StyleSheet, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport type TabProps from './TabProps';\nimport type { TabVariant } from './TabProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nconst styles = StyleSheet.create({\n    root: {\n        // TODO: Remove redundant platform checking\n        ...(Platform.OS === 'web' ? { minWidth: 'auto' } : {}),\n    },\n    filledInner: {\n        alignItems: 'center',\n        justifyContent: 'center',\n    },\n});\n\nexport default function Tab(props: TabProps) {\n    const {\n        badgeVisible = false,\n        children,\n        enableIndicator = false,\n        icon: defaultIcon,\n        selected = false,\n        selectedIcon,\n        variant = 'default' as TabVariant,\n        style: styleProp,\n        onTabInnerLayout,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const vertical = variant === 'bottom-navigation';\n\n    const {\n        container: containerStyle,\n        inner: innerStyle,\n        label: labelStyle,\n    } = useVariantStyleMap(variant, selected);\n\n    const tabBaseStyle = css([\n        styles.root,\n        containerStyle,\n        styleProp,\n    ]);\n\n    const tabInnerStyle = css([\n        styles.filledInner,\n        innerStyle,\n    ]);\n\n    const pressEffect = selected ? 'none' : 'opacity';\n\n    const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n    const iconColor = selected ? theme.palette.icon.strong : theme.palette.icon.base;\n    const iconElement = cloneElementSafely(icon, { fill: iconColor });\n\n    const tabElement = typeof children !== 'string' ? (\n        cloneElementSafely(children, {\n            selected,\n        })\n    ) : (\n        <React.Fragment>\n            {iconElement ? (\n                <React.Fragment>\n                    <Badge invisible={!badgeVisible}>\n                        {iconElement}\n                    </Badge>\n\n                    <Spacer size={1.25}/>\n                </React.Fragment>\n            ) : null}\n\n            <Text style={css(labelStyle)}>\n                {children}\n            </Text>\n        </React.Fragment>\n    );\n\n    return (\n        <TabBase\n            pressEffect={pressEffect}\n            style={tabBaseStyle}\n            vertical={vertical}\n            {...otherProps}\n        >\n            <View onLayout={onTabInnerLayout} style={tabInnerStyle}>\n                {tabElement}\n            </View>\n        </TabBase>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;;;;;AAEA,MAAMA,MAAM,GAAGC,kBAAA,CAAWC,MAAX,CAAkB;EAC7BC,IAAI,EAAE,EACF;IACA,IAAIC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GAAwB;MAAEC,QAAQ,EAAE;IAAZ,CAAxB,GAA+C,EAAnD;EAFE,CADuB;EAK7BC,WAAW,EAAE;IACTC,UAAU,EAAE,QADH;IAETC,cAAc,EAAE;EAFP;AALgB,CAAlB,CAAf;;AAWe,SAASC,GAAT,CAAaC,KAAb,EAA8B;EACzC,MAAM;IACFC,YAAY,GAAG,KADb;IAEFC,QAFE;IAGFC,eAAe,GAAG,KAHhB;IAIFC,IAAI,EAAEC,WAJJ;IAKFC,QAAQ,GAAG,KALT;IAMFC,YANE;IAOFC,OAAO,GAAG,SAPR;IAQFC,KAAK,EAAEC,SARL;IASFC,gBATE;IAUF,GAAGC;EAVD,IAWFZ,KAXJ;EAaA,MAAMa,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMC,QAAQ,GAAGP,OAAO,KAAK,mBAA7B;EAEA,MAAM;IACFQ,SAAS,EAAEC,cADT;IAEFC,KAAK,EAAEC,UAFL;IAGFC,KAAK,EAAEC;EAHL,IAIF,IAAAC,2BAAA,EAAmBd,OAAnB,EAA4BF,QAA5B,CAJJ;EAMA,MAAMiB,YAAY,GAAG,IAAAC,WAAA,EAAI,CACrBnC,MAAM,CAACG,IADc,EAErByB,cAFqB,EAGrBP,SAHqB,CAAJ,CAArB;EAMA,MAAMe,aAAa,GAAG,IAAAD,WAAA,EAAI,CACtBnC,MAAM,CAACO,WADe,EAEtBuB,UAFsB,CAAJ,CAAtB;EAKA,MAAMO,WAAW,GAAGpB,QAAQ,GAAG,MAAH,GAAY,SAAxC;EAEA,MAAMF,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;EACA,MAAMsB,SAAS,GAAGrB,QAAQ,GAAGO,KAAK,CAACe,OAAN,CAAcxB,IAAd,CAAmByB,MAAtB,GAA+BhB,KAAK,CAACe,OAAN,CAAcxB,IAAd,CAAmB0B,IAA5E;EACA,MAAMC,WAAW,GAAG,IAAAC,yBAAA,EAAmB5B,IAAnB,EAAyB;IAAE6B,IAAI,EAAEN;EAAR,CAAzB,CAApB;EAEA,MAAMO,UAAU,GAAG,OAAOhC,QAAP,KAAoB,QAApB,GACf,IAAA8B,yBAAA,EAAmB9B,QAAnB,EAA6B;IACzBI;EADyB,CAA7B,CADe,gBAKf,6BAAC,cAAD,CAAO,QAAP,QACKyB,WAAW,gBACR,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,cAAD;IAAO,SAAS,EAAE,CAAC9B;EAAnB,GACK8B,WADL,CADJ,eAKI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EALJ,CADQ,GAQR,IATR,eAWI,6BAAC,iBAAD;IAAM,KAAK,EAAE,IAAAP,WAAA,EAAIH,UAAJ;EAAb,GACKnB,QADL,CAXJ,CALJ;EAsBA,oBACI,6BAAC,gBAAD;IACI,WAAW,EAAEwB,WADjB;IAEI,KAAK,EAAEH,YAFX;IAGI,QAAQ,EAAER;EAHd,GAIQH,UAJR,gBAMI,6BAAC,iBAAD;IAAM,QAAQ,EAAED,gBAAhB;IAAkC,KAAK,EAAEc;EAAzC,GACKS,UADL,CANJ,CADJ;AAYH;;AAAA"}