@tecsinapse/react-core 1.19.0 → 1.21.0-beta.13

package/dist/components/atoms/GroupButton/styled.js

@@ -1,140 +1,126 @@
-"use strict";
+'use strict';
 
-exports.__esModule = true;
-exports.getStyledGroupItemText = exports.StyledPressable = exports.StyledOption = exports.StyledGroupButton = exports.StyledDivider = void 0;
+Object.defineProperty(exports, '__esModule', { value: true });
 
-var _native = _interopRequireWildcard(require("@emotion/native"));
+var styled = require('@emotion/native');
+require('react');
+require('../Text/styled.js');
+require('../Input/styled.js');
+require('currency.js');
+require('../Input/InputElement/InputElement.js');
+require('../Input/InputMaskElement/InputMaskElement.js');
+require('../Input/PressableInputContainer/styled.js');
+require('react-native');
+var ResponsiveFontSize = require('../../../utils/ResponsiveFontSize.js');
+var PressableSurface = require('../PressableSurface/PressableSurface.js');
 
-var _utils = require("../../../utils");
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _PressableSurface = require("../PressableSurface");
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-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; }
-
-const StyledGroupButton = _native.default.View`
+const StyledGroupButton = styled__default["default"].View`
   flex-direction: row;
 `;
-exports.StyledGroupButton = StyledGroupButton;
-
 const disabledStyles = ({
   disabled,
   isActive
-}) => disabled && !isActive && (0, _native.css)`
+}) => disabled && !isActive && styled.css`
     background-color: #dcdcdc;
   `;
-
-const getStyledGroupItemText = component => {
-  return (0, _native.default)(component)`
-    color: ${({
-    active,
-    theme
-  }) => active ? theme.miscellaneous.surfaceColor : theme.color.secondary.medium};
+const getStyledGroupItemText = (component) => {
+  return styled__default["default"](component)`
+    color: ${({ active, theme }) => active ? theme.miscellaneous.surfaceColor : theme.color.secondary.medium};
   `;
 };
-
-exports.getStyledGroupItemText = getStyledGroupItemText;
-
 const activeStyles = ({
   theme,
   isActive,
-  activeBorderColor = 'secondary',
-  activeBorderColorTone = 'medium'
-}) => isActive && (0, _native.css)`
+  activeBorderColor = "secondary",
+  activeBorderColorTone = "medium"
+}) => isActive && styled.css`
     border-color: ${theme == null ? void 0 : theme.color[activeBorderColor][activeBorderColorTone]};
   `;
-
 const inactiveStyles = ({
   theme,
   isActive,
   inactiveBackgroundColor,
   inactiveBackgroundColorTone,
-  inactiveBorderColor = 'secondary',
-  inactiveBorderColorTone = 'light'
+  inactiveBorderColor = "secondary",
+  inactiveBorderColorTone = "light"
 }) => {
   if (!isActive && inactiveBackgroundColor && inactiveBackgroundColorTone) {
-    return (0, _native.css)`
+    return styled.css`
       border-color: ${theme == null ? void 0 : theme.color[inactiveBorderColor][inactiveBorderColorTone]};
     `;
   }
-
   if (!isActive) {
-    return (0, _native.css)`
+    return styled.css`
       border-color: ${theme == null ? void 0 : theme.color[inactiveBorderColor][inactiveBorderColorTone]};
     `;
   }
 };
-
 const leftStyles = ({
   theme,
   isFirstOption
-}) => isFirstOption && (0, _native.css)`
+}) => isFirstOption && styled.css`
     border-top-left-radius: ${theme == null ? void 0 : theme.borderRadius.mili};
     border-bottom-left-radius: ${theme == null ? void 0 : theme.borderRadius.mili};
     border-left-width: ${theme == null ? void 0 : theme.borderWidth.pico};
   `;
-
 const rightStyles = ({
   theme,
   isLastOption
-}) => isLastOption && (0, _native.css)`
+}) => isLastOption && styled.css`
     border-top-right-radius: ${theme == null ? void 0 : theme.borderRadius.mili};
     border-bottom-right-radius: ${theme == null ? void 0 : theme.borderRadius.mili};
     border-right-width: ${theme == null ? void 0 : theme.borderWidth.pico};
   `;
-
 const sizeStyles = ({
   theme,
-  buttonSize = 'small'
+  buttonSize = "small"
 }) => {
   switch (buttonSize) {
-    case 'small':
-      return (0, _native.css)`
+    case "small":
+      return styled.css`
         padding: ${theme == null ? void 0 : theme.spacing.mili} ${theme == null ? void 0 : theme.spacing.deca};
-        min-height: ${(0, _utils.RFValueStr)('34px')};
+        min-height: ${ResponsiveFontSize.RFValueStr("34px")};
       `;
-
     default:
-      return (0, _native.css)`
+      return styled.css`
         padding: ${theme == null ? void 0 : theme.spacing.mili} ${theme == null ? void 0 : theme.spacing.kilo};
-        min-height: ${(0, _utils.RFValueStr)('44px')};
+        min-height: ${ResponsiveFontSize.RFValueStr("44px")};
       `;
   }
 };
-
-const StyledPressableBase = (0, _native.default)(_PressableSurface.PressableSurface)`
-  border-top-width: ${({
-  theme
-}) => theme.borderWidth.pico};
-  border-bottom-width: ${({
-  theme
-}) => theme.borderWidth.pico};
+const StyledPressableBase = styled__default["default"](PressableSurface)`
+  border-top-width: ${({ theme }) => theme.borderWidth.pico};
+  border-bottom-width: ${({ theme }) => theme.borderWidth.pico};
   justify-content: center;
   align-items: center;
   flex: 1;
 `;
-const StyledOption = _native.default.View`
+const StyledOption = styled__default["default"].View`
   flex-direction: row;
   flex: 1;
 `;
-exports.StyledOption = StyledOption;
-const StyledDivider = _native.default.View`
-  width: ${({
-  theme
-}) => theme.borderWidth.pico};
-  background-color: ${({
-  theme
-}) => theme.color.secondary.light}; ;
+const StyledDivider = styled__default["default"].View`
+  width: ${({ theme }) => theme.borderWidth.pico};
+  background-color: ${({ theme }) => theme.color.secondary.light}; ;
 `;
-exports.StyledDivider = StyledDivider;
-const StyledPressable = (0, _native.default)(StyledPressableBase)(props => (0, _native.css)`
+const StyledPressable = styled__default["default"](StyledPressableBase)(
+  (props) => styled.css`
     ${activeStyles(props)}
     ${inactiveStyles(props)}
     ${leftStyles(props)}
     ${rightStyles(props)}
     ${sizeStyles(props)}
     ${disabledStyles(props)}
-  `);
+  `
+);
+
+exports.StyledDivider = StyledDivider;
+exports.StyledGroupButton = StyledGroupButton;
+exports.StyledOption = StyledOption;
 exports.StyledPressable = StyledPressable;
-//# sourceMappingURL=styled.js.map
+exports.getStyledGroupItemText = getStyledGroupItemText;
+//# sourceMappingURL=styled.js.map

package/dist/components/atoms/GroupButton/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","names":["StyledGroupButton","styled","View","disabledStyles","disabled","isActive","css","getStyledGroupItemText","component","active","theme","miscellaneous","surfaceColor","color","secondary","medium","activeStyles","activeBorderColor","activeBorderColorTone","inactiveStyles","inactiveBackgroundColor","inactiveBackgroundColorTone","inactiveBorderColor","inactiveBorderColorTone","leftStyles","isFirstOption","borderRadius","mili","borderWidth","pico","rightStyles","isLastOption","sizeStyles","buttonSize","spacing","deca","RFValueStr","kilo","StyledPressableBase","PressableSurface","StyledOption","StyledDivider","light","StyledPressable","props"],"sources":["../../../../src/components/atoms/GroupButton/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { RFValueStr } from '../../../utils';\nimport { ButtonSizeType } from '../Button';\nimport { PressableSurface } from '../PressableSurface';\nimport { TextProps } from '../Text';\nimport { GroupButtonOptions } from './GroupButton';\nimport { GroupButtonOptionProps } from './GroupButtonOption';\n\ninterface PressableOptions extends GroupButtonOptions {\n  isActive: boolean;\n  isFirstOption: boolean;\n  isLastOption: boolean;\n  buttonSize?: ButtonSizeType;\n}\n\nexport const StyledGroupButton = styled.View<Partial<StyleProps>>`\n  flex-direction: row;\n`;\n\n// TO FIXED: hexa color to theme definitions\nconst disabledStyles = ({\n  disabled,\n  isActive,\n}: PressableOptions & Partial<StyleProps>) =>\n  disabled &&\n  !isActive &&\n  css`\n    background-color: #dcdcdc;\n  `;\n\nexport const getStyledGroupItemText = (component: FC<TextProps>) => {\n  return styled(component)<\n    Partial<GroupButtonOptionProps> & Partial<StyleProps>\n  >`\n    color: ${({ active, theme }) =>\n      active ? theme.miscellaneous.surfaceColor : theme.color.secondary.medium};\n  `;\n};\n\nconst activeStyles = ({\n  theme,\n  isActive,\n  activeBorderColor = 'secondary',\n  activeBorderColorTone = 'medium',\n}: PressableOptions & Partial<StyleProps>) =>\n  isActive &&\n  css`\n    border-color: ${theme?.color[activeBorderColor][activeBorderColorTone]};\n  `;\n\nconst inactiveStyles = ({\n  theme,\n  isActive,\n  inactiveBackgroundColor,\n  inactiveBackgroundColorTone,\n  inactiveBorderColor = 'secondary',\n  inactiveBorderColorTone = 'light',\n}: PressableOptions & Partial<StyleProps>) => {\n  if (!isActive && inactiveBackgroundColor && inactiveBackgroundColorTone) {\n    return css`\n      border-color: ${theme?.color[inactiveBorderColor][\n        inactiveBorderColorTone\n      ]};\n    `;\n  }\n\n  if (!isActive) {\n    return css`\n      border-color: ${theme?.color[inactiveBorderColor][\n        inactiveBorderColorTone\n      ]};\n    `;\n  }\n};\n\nconst leftStyles = ({\n  theme,\n  isFirstOption,\n}: PressableOptions & Partial<StyleProps>) =>\n  isFirstOption &&\n  css`\n    border-top-left-radius: ${theme?.borderRadius.mili};\n    border-bottom-left-radius: ${theme?.borderRadius.mili};\n    border-left-width: ${theme?.borderWidth.pico};\n  `;\n\nconst rightStyles = ({\n  theme,\n  isLastOption,\n}: PressableOptions & Partial<StyleProps>) =>\n  isLastOption &&\n  css`\n    border-top-right-radius: ${theme?.borderRadius.mili};\n    border-bottom-right-radius: ${theme?.borderRadius.mili};\n    border-right-width: ${theme?.borderWidth.pico};\n  `;\n\nconst sizeStyles = ({\n  theme,\n  buttonSize = 'small',\n}: PressableOptions & Partial<StyleProps>) => {\n  switch (buttonSize) {\n    case 'small':\n      return css`\n        padding: ${theme?.spacing.mili} ${theme?.spacing.deca};\n        min-height: ${RFValueStr('34px')};\n      `;\n    default:\n      return css`\n        padding: ${theme?.spacing.mili} ${theme?.spacing.kilo};\n        min-height: ${RFValueStr('44px')};\n      `;\n  }\n};\n\nconst StyledPressableBase = styled(PressableSurface)<\n  PressableOptions & Partial<StyleProps>\n>`\n  border-top-width: ${({ theme }) => theme.borderWidth.pico};\n  border-bottom-width: ${({ theme }) => theme.borderWidth.pico};\n  justify-content: center;\n  align-items: center;\n  flex: 1;\n`;\n\nexport const StyledOption = styled.View`\n  flex-direction: row;\n  flex: 1;\n`;\n\nexport const StyledDivider = styled.View<Partial<StyleProps>>`\n  width: ${({ theme }) => theme.borderWidth.pico};\n  background-color: ${({ theme }) => theme.color.secondary.light}; ;\n`;\n\nexport const StyledPressable = styled(StyledPressableBase)(\n  (props: PressableOptions & Partial<StyleProps>) => css`\n    ${activeStyles(props)}\n    ${inactiveStyles(props)}\n    ${leftStyles(props)}\n    ${rightStyles(props)}\n    ${sizeStyles(props)}\n    ${disabledStyles(props)}\n  `\n);\n"],"mappings":"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"}
+{"version":3,"file":"styled.js","sources":["../../../../src/components/atoms/GroupButton/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { RFValueStr } from '../../../utils';\nimport { ButtonSizeType } from '../Button';\nimport { PressableSurface } from '../PressableSurface';\nimport { TextProps } from '../Text';\nimport { GroupButtonOptions } from './GroupButton';\nimport { GroupButtonOptionProps } from './GroupButtonOption';\n\ninterface PressableOptions extends GroupButtonOptions {\n  isActive: boolean;\n  isFirstOption: boolean;\n  isLastOption: boolean;\n  buttonSize?: ButtonSizeType;\n}\n\nexport const StyledGroupButton = styled.View<Partial<StyleProps>>`\n  flex-direction: row;\n`;\n\n// TO FIXED: hexa color to theme definitions\nconst disabledStyles = ({\n  disabled,\n  isActive,\n}: PressableOptions & Partial<StyleProps>) =>\n  disabled &&\n  !isActive &&\n  css`\n    background-color: #dcdcdc;\n  `;\n\nexport const getStyledGroupItemText = (component: FC<TextProps>) => {\n  return styled(component)<\n    Partial<GroupButtonOptionProps> & Partial<StyleProps>\n  >`\n    color: ${({ active, theme }) =>\n      active ? theme.miscellaneous.surfaceColor : theme.color.secondary.medium};\n  `;\n};\n\nconst activeStyles = ({\n  theme,\n  isActive,\n  activeBorderColor = 'secondary',\n  activeBorderColorTone = 'medium',\n}: PressableOptions & Partial<StyleProps>) =>\n  isActive &&\n  css`\n    border-color: ${theme?.color[activeBorderColor][activeBorderColorTone]};\n  `;\n\nconst inactiveStyles = ({\n  theme,\n  isActive,\n  inactiveBackgroundColor,\n  inactiveBackgroundColorTone,\n  inactiveBorderColor = 'secondary',\n  inactiveBorderColorTone = 'light',\n}: PressableOptions & Partial<StyleProps>) => {\n  if (!isActive && inactiveBackgroundColor && inactiveBackgroundColorTone) {\n    return css`\n      border-color: ${theme?.color[inactiveBorderColor][\n        inactiveBorderColorTone\n      ]};\n    `;\n  }\n\n  if (!isActive) {\n    return css`\n      border-color: ${theme?.color[inactiveBorderColor][\n        inactiveBorderColorTone\n      ]};\n    `;\n  }\n};\n\nconst leftStyles = ({\n  theme,\n  isFirstOption,\n}: PressableOptions & Partial<StyleProps>) =>\n  isFirstOption &&\n  css`\n    border-top-left-radius: ${theme?.borderRadius.mili};\n    border-bottom-left-radius: ${theme?.borderRadius.mili};\n    border-left-width: ${theme?.borderWidth.pico};\n  `;\n\nconst rightStyles = ({\n  theme,\n  isLastOption,\n}: PressableOptions & Partial<StyleProps>) =>\n  isLastOption &&\n  css`\n    border-top-right-radius: ${theme?.borderRadius.mili};\n    border-bottom-right-radius: ${theme?.borderRadius.mili};\n    border-right-width: ${theme?.borderWidth.pico};\n  `;\n\nconst sizeStyles = ({\n  theme,\n  buttonSize = 'small',\n}: PressableOptions & Partial<StyleProps>) => {\n  switch (buttonSize) {\n    case 'small':\n      return css`\n        padding: ${theme?.spacing.mili} ${theme?.spacing.deca};\n        min-height: ${RFValueStr('34px')};\n      `;\n    default:\n      return css`\n        padding: ${theme?.spacing.mili} ${theme?.spacing.kilo};\n        min-height: ${RFValueStr('44px')};\n      `;\n  }\n};\n\nconst StyledPressableBase = styled(PressableSurface)<\n  PressableOptions & Partial<StyleProps>\n>`\n  border-top-width: ${({ theme }) => theme.borderWidth.pico};\n  border-bottom-width: ${({ theme }) => theme.borderWidth.pico};\n  justify-content: center;\n  align-items: center;\n  flex: 1;\n`;\n\nexport const StyledOption = styled.View`\n  flex-direction: row;\n  flex: 1;\n`;\n\nexport const StyledDivider = styled.View<Partial<StyleProps>>`\n  width: ${({ theme }) => theme.borderWidth.pico};\n  background-color: ${({ theme }) => theme.color.secondary.light}; ;\n`;\n\nexport const StyledPressable = styled(StyledPressableBase)(\n  (props: PressableOptions & Partial<StyleProps>) => css`\n    ${activeStyles(props)}\n    ${inactiveStyles(props)}\n    ${leftStyles(props)}\n    ${rightStyles(props)}\n    ${sizeStyles(props)}\n    ${disabledStyles(props)}\n  `\n);\n"],"names":["styled","css","RFValueStr"],"mappings":";;;;;;;;;;;;;;;;;;;;AAiBO,MAAM,oBAAoBA,0BAAO,CAAA,IAAA,CAAA;AAAA;AAAA,EAAA;AAKxC,MAAM,iBAAiB,CAAC;AAAA,EACtB,QAAA;AAAA,EACA,QAAA;AACF,CACE,KAAA,QAAA,IACA,CAAC,QACD,IAAAC,UAAA,CAAA;AAAA;AAAA,EAAA,CAAA,CAAA;AAIW,MAAA,sBAAA,GAAyB,CAAC,SAA6B,KAAA;AAClE,EAAA,OAAOD,2BAAO,SAAS,CAAA,CAAA;AAAA,WAGZ,EAAA,CAAC,EAAE,MAAA,EAAQ,KAAM,EAAA,KACxB,MAAS,GAAA,KAAA,CAAM,aAAc,CAAA,YAAA,GAAe,KAAM,CAAA,KAAA,CAAM,SAAU,CAAA,MAAA,CAAA;AAAA,EAAA,CAAA,CAAA;AAExE,EAAA;AAEA,MAAM,eAAe,CAAC;AAAA,EACpB,KAAA;AAAA,EACA,QAAA;AAAA,EACA,iBAAoB,GAAA,WAAA;AAAA,EACpB,qBAAwB,GAAA,QAAA;AAC1B,CAAA,KACE,QACA,IAAAC,UAAA,CAAA;AAAA,kBACkB,EAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAO,MAAM,iBAAmB,CAAA,CAAA,qBAAA,CAAA,CAAA;AAAA,EAAA,CAAA,CAAA;AAGpD,MAAM,iBAAiB,CAAC;AAAA,EACtB,KAAA;AAAA,EACA,QAAA;AAAA,EACA,uBAAA;AAAA,EACA,2BAAA;AAAA,EACA,mBAAsB,GAAA,WAAA;AAAA,EACtB,uBAA0B,GAAA,OAAA;AAC5B,CAA8C,KAAA;AAC5C,EAAI,IAAA,CAAC,QAAY,IAAA,uBAAA,IAA2B,2BAA6B,EAAA;AACvE,IAAO,OAAAA,UAAA,CAAA;AAAA,oBACW,EAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAO,MAAM,mBAC3B,CAAA,CAAA,uBAAA,CAAA,CAAA;AAAA,IAAA,CAAA,CAAA;AAAA,GAGN;AAEA,EAAA,IAAI,CAAC,QAAU,EAAA;AACb,IAAO,OAAAA,UAAA,CAAA;AAAA,oBACW,EAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAO,MAAM,mBAC3B,CAAA,CAAA,uBAAA,CAAA,CAAA;AAAA,IAAA,CAAA,CAAA;AAAA,GAGN;AACF,CAAA,CAAA;AAEA,MAAM,aAAa,CAAC;AAAA,EAClB,KAAA;AAAA,EACA,aAAA;AACF,CAAA,KACE,aACA,IAAAA,UAAA,CAAA;AAAA,4BAAA,EAC4B,+BAAO,YAAa,CAAA,IAAA,CAAA;AAAA,+BAAA,EACjB,+BAAO,YAAa,CAAA,IAAA,CAAA;AAAA,uBAAA,EAC5B,+BAAO,WAAY,CAAA,IAAA,CAAA;AAAA,EAAA,CAAA,CAAA;AAG5C,MAAM,cAAc,CAAC;AAAA,EACnB,KAAA;AAAA,EACA,YAAA;AACF,CAAA,KACE,YACA,IAAAA,UAAA,CAAA;AAAA,6BAAA,EAC6B,+BAAO,YAAa,CAAA,IAAA,CAAA;AAAA,gCAAA,EACjB,+BAAO,YAAa,CAAA,IAAA,CAAA;AAAA,wBAAA,EAC5B,+BAAO,WAAY,CAAA,IAAA,CAAA;AAAA,EAAA,CAAA,CAAA;AAG7C,MAAM,aAAa,CAAC;AAAA,EAClB,KAAA;AAAA,EACA,UAAa,GAAA,OAAA;AACf,CAA8C,KAAA;AAC5C,EAAA,QAAQ,UAAY;AAAA,IAClB,KAAK,OAAA;AACH,MAAO,OAAAA,UAAA,CAAA;AAAA,iBAAA,EACM,KAAO,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAA,OAAA,CAAQ,IAAQ,CAAA,CAAA,EAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAO,OAAQ,CAAA,IAAA,CAAA;AAAA,oBAAA,EACnCC,8BAAW,MAAM,CAAA,CAAA;AAAA,MAAA,CAAA,CAAA;AAAA,IAEnC;AACE,MAAO,OAAAD,UAAA,CAAA;AAAA,iBAAA,EACM,KAAO,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAA,OAAA,CAAQ,IAAQ,CAAA,CAAA,EAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAO,OAAQ,CAAA,IAAA,CAAA;AAAA,oBAAA,EACnCC,8BAAW,MAAM,CAAA,CAAA;AAAA,MAAA,CAAA,CAAA;AAAA,GAErC;AACF,CAAA,CAAA;AAEA,MAAM,mBAAA,GAAsBF,2BAAO,gBAAgB,CAAA,CAAA;AAAA,oBAAA,EAG7B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,WAAY,CAAA,IAAA,CAAA;AAAA,uBAAA,EAC9B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,WAAY,CAAA,IAAA,CAAA;AAAA;AAAA;AAAA;AAAA,CAAA,CAAA;AAMnD,MAAM,eAAeA,0BAAO,CAAA,IAAA,CAAA;AAAA;AAAA;AAAA,EAAA;AAK5B,MAAM,gBAAgBA,0BAAO,CAAA,IAAA,CAAA;AAAA,SAAA,EACzB,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,WAAY,CAAA,IAAA,CAAA;AAAA,oBAAA,EACtB,CAAC,EAAE,KAAA,EAAY,KAAA,KAAA,CAAM,MAAM,SAAU,CAAA,KAAA,CAAA;AAAA,EAAA;AAG9C,MAAA,eAAA,GAAkBA,2BAAO,mBAAmB,CAAA;AAAA,EACvD,CAAC,KAAkD,KAAAC,UAAA,CAAA;AAAA,IAAA,EAC/C,aAAa,KAAK,CAAA,CAAA;AAAA,IAAA,EAClB,eAAe,KAAK,CAAA,CAAA;AAAA,IAAA,EACpB,WAAW,KAAK,CAAA,CAAA;AAAA,IAAA,EAChB,YAAY,KAAK,CAAA,CAAA;AAAA,IAAA,EACjB,WAAW,KAAK,CAAA,CAAA;AAAA,IAAA,EAChB,eAAe,KAAK,CAAA,CAAA;AAAA,EAAA,CAAA;AAE1B;;;;;;;;"}

package/dist/components/atoms/Icon/Icon.js

@@ -1,38 +1,74 @@
-"use strict";
+'use strict';
 
-exports.__esModule = true;
-exports.default = void 0;
+var React = require('react');
+var reactNative = require('react-native');
+var react = require('@emotion/react');
+var helpers = require('./helpers.js');
 
-var _react = _interopRequireDefault(require("react"));
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _react2 = require("@emotion/react");
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _helpers = require("./helpers");
-
-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 = ({
-  name,
-  size = 'centi',
-  type,
-  style,
-  fontColor = 'dark',
-  colorVariant,
-  colorTone = 'medium',
-  ...rest
-}) => {
-  const theme = (0, _react2.useTheme)();
-  const color = (0, _helpers.getIconColor)(colorVariant, colorTone, fontColor, theme);
-  const RNVIcon = (0, _helpers.getIconComponent)(type, size);
-  return _react.default.createElement(RNVIcon, _extends({}, rest, {
-    style: style,
-    name: name,
-    color: color
-  }));
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const Icon = (_a) => {
+  var _b = _a, {
+    name,
+    size = "centi",
+    type,
+    style,
+    fontColor = "dark",
+    colorVariant,
+    colorTone = "medium"
+  } = _b, rest = __objRest(_b, [
+    "name",
+    "size",
+    "type",
+    "style",
+    "fontColor",
+    "colorVariant",
+    "colorTone"
+  ]);
+  const theme = react.useTheme();
+  const color = helpers.getIconColor(colorVariant, colorTone, fontColor, theme);
+  const RNVIcon = helpers.getIconComponent(type, size);
+  return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Suspense, {
+    fallback: /* @__PURE__ */ React__default["default"].createElement(reactNative.Text, null, " ")
+  }, /* @__PURE__ */ React__default["default"].createElement(RNVIcon, __spreadProps(__spreadValues({}, rest), {
+    style,
+    name,
+    color
+  })));
 };
 
-var _default = Icon;
-exports.default = _default;
-//# sourceMappingURL=Icon.js.map
+module.exports = Icon;
+//# sourceMappingURL=Icon.js.map

package/dist/components/atoms/Icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","names":["Icon","name","size","type","style","fontColor","colorVariant","colorTone","rest","theme","useTheme","color","getIconColor","RNVIcon","getIconComponent"],"sources":["../../../../src/components/atoms/Icon/Icon.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyleProp, TextStyle } from 'react-native';\nimport { useTheme } from '@emotion/react';\nimport {\n  ColorGradationType,\n  ColorType,\n  FontColorType,\n  IconSizeType,\n  IconType,\n  ThemeProp,\n} from '@tecsinapse/react-core';\nimport { getIconColor, getIconComponent } from './helpers';\n\nexport interface IconProps {\n  /**  Name of the icon. You must use the same icons from react-native-vector-icons */\n  name: string;\n  /**  Default icon sizes from theme */\n  size?: IconSizeType;\n  /**  Icon family. You must use the same icons from react-native-vector-icons */\n  type: IconType;\n  /** Font theme fill color */\n  fontColor?: FontColorType;\n  /** Palette theme fill color */\n  colorVariant?: ColorType;\n  /** Palette theme gradation fill color */\n  colorTone?: ColorGradationType;\n  style?: StyleProp<TextStyle>;\n}\n\n/** NOTE: When using colors, the order matters if you're trying to merge multiple types. */\nconst Icon: FC<IconProps> = ({\n  name,\n  size = 'centi',\n  type,\n  style,\n  fontColor = 'dark',\n  colorVariant,\n  colorTone = 'medium',\n  ...rest\n}) => {\n  const theme = useTheme() as ThemeProp;\n  const color = getIconColor(colorVariant, colorTone, fontColor, theme);\n  const RNVIcon = getIconComponent(type, size);\n\n  return <RNVIcon {...rest} style={style} name={name} color={color} />;\n};\n\nexport default Icon;\n"],"mappings":";;;;;AAAA;;AAEA;;AASA;;;;;;AAmBA,MAAMA,IAAmB,GAAG,CAAC;EAC3BC,IAD2B;EAE3BC,IAAI,GAAG,OAFoB;EAG3BC,IAH2B;EAI3BC,KAJ2B;EAK3BC,SAAS,GAAG,MALe;EAM3BC,YAN2B;EAO3BC,SAAS,GAAG,QAPe;EAQ3B,GAAGC;AARwB,CAAD,KAStB;EACJ,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EACA,MAAMC,KAAK,GAAG,IAAAC,qBAAA,EAAaN,YAAb,EAA2BC,SAA3B,EAAsCF,SAAtC,EAAiDI,KAAjD,CAAd;EACA,MAAMI,OAAO,GAAG,IAAAC,yBAAA,EAAiBX,IAAjB,EAAuBD,IAAvB,CAAhB;EAEA,OAAO,6BAAC,OAAD,eAAaM,IAAb;IAAmB,KAAK,EAAEJ,KAA1B;IAAiC,IAAI,EAAEH,IAAvC;IAA6C,KAAK,EAAEU;EAApD,GAAP;AACD,CAfD;;eAiBeX,I"}
+{"version":3,"file":"Icon.js","sources":["../../../../src/components/atoms/Icon/Icon.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyleProp, TextStyle, Text } from 'react-native';\nimport { useTheme } from '@emotion/react';\nimport {\n  ColorGradationType,\n  ColorType,\n  FontColorType,\n  IconSizeType,\n  IconType,\n  ThemeProp,\n} from '@tecsinapse/react-core';\nimport { getIconColor, getIconComponent } from './helpers';\n\nexport interface IconProps {\n  /**  Name of the icon. You must use the same icons from react-native-vector-icons */\n  name: string;\n  /**  Default icon sizes from theme */\n  size?: IconSizeType;\n  /**  Icon family. You must use the same icons from react-native-vector-icons */\n  type: IconType;\n  /** Font theme fill color */\n  fontColor?: FontColorType;\n  /** Palette theme fill color */\n  colorVariant?: ColorType;\n  /** Palette theme gradation fill color */\n  colorTone?: ColorGradationType;\n  style?: StyleProp<TextStyle>;\n}\n\n/** NOTE: When using colors, the order matters if you're trying to merge multiple types. */\nconst Icon: FC<IconProps> = ({\n  name,\n  size = 'centi',\n  type,\n  style,\n  fontColor = 'dark',\n  colorVariant,\n  colorTone = 'medium',\n  ...rest\n}) => {\n  const theme = useTheme() as ThemeProp;\n  const color = getIconColor(colorVariant, colorTone, fontColor, theme);\n  const RNVIcon = getIconComponent(type, size);\n\n  return (\n    <React.Suspense fallback={<Text> </Text>}>\n      <RNVIcon {...rest} style={style} name={name} color={color} />\n    </React.Suspense>\n  );\n};\n\nexport default Icon;\n"],"names":["useTheme","getIconColor","getIconComponent","React","Text"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BM,MAAA,IAAA,GAAsB,CAAC,EASvB,KAAA;AATuB,EAC3B,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,IAAA;AAAA,IACA,IAAO,GAAA,OAAA;AAAA,IACP,IAAA;AAAA,IACA,KAAA;AAAA,IACA,SAAY,GAAA,MAAA;AAAA,IACZ,YAAA;AAAA,IACA,SAAY,GAAA,QAAA;AAAA,GArCd,GA8B6B,EAQxB,EAAA,IAAA,GAAA,SAAA,CARwB,EAQxB,EAAA;AAAA,IAPH,MAAA;AAAA,IACA,MAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,WAAA;AAAA,IACA,cAAA;AAAA,IACA,WAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,MAAM,QAAQA,cAAS,EAAA,CAAA;AACvB,EAAA,MAAM,KAAQ,GAAAC,oBAAA,CAAa,YAAc,EAAA,SAAA,EAAW,WAAW,KAAK,CAAA,CAAA;AACpE,EAAM,MAAA,OAAA,GAAUC,wBAAiB,CAAA,IAAA,EAAM,IAAI,CAAA,CAAA;AAE3C,EACE,uBAAAC,yBAAA,CAAA,aAAA,CAACA,0BAAM,QAAN,EAAA;AAAA,IAAe,QAAA,kBAAWA,yBAAA,CAAA,aAAA,CAAAC,gBAAA,EAAA,IAAA,EAAK,GAAC,CAAA;AAAA,GAC/B,kBAAAD,yBAAA,CAAA,aAAA,CAAC,0CAAY,IAAZ,CAAA,EAAA;AAAA,IAAkB,KAAA;AAAA,IAAc,IAAA;AAAA,IAAY,KAAA;AAAA,GAAA,CAAc,CAC7D,CAAA,CAAA;AAEJ;;;;"}

package/dist/components/atoms/Icon/Icon.stories.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { Story } from '@storybook/react';
+import { IconProps } from './Icon';
+declare const _default: {
+    title: string;
+    component: React.FC<IconProps>;
+};
+export default _default;
+export declare const Base: Story<IconProps>;

package/dist/components/atoms/Icon/helpers.js

@@ -1,90 +1,129 @@
-"use strict";
-
-exports.__esModule = true;
-exports.registerCustomIconType = exports.getIconComponent = exports.getIconColor = void 0;
-
-var _native = _interopRequireDefault(require("@emotion/native"));
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var styled = require('@emotion/native');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
 const customIcons = {};
-
-const registerCustomIconType = (id, customIcon) => {
-  customIcons[id] = customIcon;
-};
-
-exports.registerCustomIconType = registerCustomIconType;
-
-const getStyledIcon = (Component, size) => (0, _native.default)(Component)`
-  font-size: ${({
-  theme
-}) => theme.iconSize[size]};
+const getStyledIcon = (Component, size) => styled__default["default"](Component)`
+  font-size: ${({ theme }) => theme.iconSize[size]};
   text-align: center;
 `;
-
 const getIconComponent = (type, size) => {
   switch (type) {
-    case 'zocial':
-      return getStyledIcon(require('react-native-vector-icons/dist/Zocial').default, size);
-
-    case 'octicon':
-      return getStyledIcon(require('react-native-vector-icons/dist/Octicons').default, size);
-
-    case 'material':
-      return getStyledIcon(require('react-native-vector-icons/dist/MaterialIcons').default, size);
-
-    case 'material-community':
-      return getStyledIcon(require('react-native-vector-icons/dist/MaterialCommunityIcons').default, size);
-
-    case 'ionicon':
-      return getStyledIcon(require('react-native-vector-icons/dist/Ionicons').default, size);
-
-    case 'foundation':
-      return getStyledIcon(require('react-native-vector-icons/dist/Foundation').default, size);
-
-    case 'evilicon':
-      return getStyledIcon(require('react-native-vector-icons/dist/EvilIcons').default, size);
-
-    case 'entypo':
-      return getStyledIcon(require('react-native-vector-icons/dist/Entypo').default, size);
-
-    case 'font-awesome':
-      return getStyledIcon(require('react-native-vector-icons/dist/FontAwesome').default, size);
-
-    case 'font-awesome-5':
-      return getStyledIcon(require('react-native-vector-icons/dist/FontAwesome5').default, size);
-
-    case 'simple-line-icon':
-      return getStyledIcon(require('react-native-vector-icons/dist/SimpleLineIcons').default, size);
-
-    case 'feather':
-      return getStyledIcon(require('react-native-vector-icons/dist/Feather').default, size);
-
-    case 'antdesign':
-    case 'ant-design':
-      return getStyledIcon(require('react-native-vector-icons/dist/AntDesign').default, size);
-
-    case 'fontisto':
-      return getStyledIcon(require('react-native-vector-icons/dist/Fontisto').default, size);
-
+    case "zocial":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/Zocial')); })),
+        size
+      );
+    case "octicon":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/Octicons')); })),
+        size
+      );
+    case "material":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/MaterialIcons')); })),
+        size
+      );
+    case "material-community":
+      return getStyledIcon(
+        React.lazy(
+          () => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/MaterialCommunityIcons')); })
+        ),
+        size
+      );
+    case "ionicon":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/Ionicons')); })),
+        size
+      );
+    case "foundation":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/Foundation')); })),
+        size
+      );
+    case "evilicon":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/EvilIcons')); })),
+        size
+      );
+    case "entypo":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/Entypo')); })),
+        size
+      );
+    case "font-awesome":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/FontAwesome')); })),
+        size
+      );
+    case "font-awesome-5":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/FontAwesome5')); })),
+        size
+      );
+    case "simple-line-icon":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/SimpleLineIcons')); })),
+        size
+      );
+    case "feather":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/Feather')); })),
+        size
+      );
+    case "antdesign":
+    case "ant-design":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/AntDesign')); })),
+        size
+      );
+    case "fontisto":
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/Fontisto')); })),
+        size
+      );
     default:
       if (Object.prototype.hasOwnProperty.call(customIcons, type)) {
         return getStyledIcon(customIcons[type], size);
       }
-
-      return getStyledIcon(require('react-native-vector-icons/dist/MaterialIcons').default, size);
+      return getStyledIcon(
+        React.lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-native-vector-icons/dist/MaterialIcons')); })),
+        size
+      );
   }
 };
-
-exports.getIconComponent = getIconComponent;
-
 const getIconColor = (colorVariant, colorGradation, fontColor, theme) => {
   if (colorVariant && colorGradation) {
     return theme.color[colorVariant][colorGradation];
   }
-
   return theme.font.color[fontColor];
 };
 
 exports.getIconColor = getIconColor;
-//# sourceMappingURL=helpers.js.map
+exports.getIconComponent = getIconComponent;
+//# sourceMappingURL=helpers.js.map