@tecsinapse/react-core 1.17.4 → 1.20.0

package/esm/utils/lightenDarkenColor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lightenDarkenColor.js","names":["lightenDarkenColor","color","variation","usePound","slice","num","parseInt","r","b","g","toString"],"sources":["../../src/utils/lightenDarkenColor.ts"],"sourcesContent":["export const lightenDarkenColor = (color: string, variation: number) => {\n  let usePound = false;\n\n  if (color[0] == '#') {\n    color = color.slice(1);\n    usePound = true;\n  }\n\n  const num = parseInt(color, 16);\n\n  let r = (num >> 16) + variation;\n  if (r > 255) r = 255;\n  else if (r < 0) r = 0;\n\n  let b = ((num >> 8) & 0x00ff) + variation;\n  if (b > 255) b = 255;\n  else if (b < 0) b = 0;\n\n  let g = (num & 0x0000ff) + variation;\n  if (g > 255) g = 255;\n  else if (g < 0) g = 0;\n\n  return (usePound ? '#' : '') + (g | (b << 8) | (r << 16)).toString(16);\n};\n"],"mappings":"AAAA,OAAO,IAAMA,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD,EAAgBC,SAAhB,EAAsC;EACtE,IAAIC,QAAQ,GAAG,KAAf;;EAEA,IAAIF,KAAK,CAAC,CAAD,CAAL,IAAY,GAAhB,EAAqB;IACnBA,KAAK,GAAGA,KAAK,CAACG,KAAN,CAAY,CAAZ,CAAR;IACAD,QAAQ,GAAG,IAAX;EACD;;EAED,IAAME,GAAG,GAAGC,QAAQ,CAACL,KAAD,EAAQ,EAAR,CAApB;EAEA,IAAIM,CAAC,GAAG,CAACF,GAAG,IAAI,EAAR,IAAcH,SAAtB;EACA,IAAIK,CAAC,GAAG,GAAR,EAAaA,CAAC,GAAG,GAAJ,CAAb,KACK,IAAIA,CAAC,GAAG,CAAR,EAAWA,CAAC,GAAG,CAAJ;EAEhB,IAAIC,CAAC,GAAG,CAAEH,GAAG,IAAI,CAAR,GAAa,MAAd,IAAwBH,SAAhC;EACA,IAAIM,CAAC,GAAG,GAAR,EAAaA,CAAC,GAAG,GAAJ,CAAb,KACK,IAAIA,CAAC,GAAG,CAAR,EAAWA,CAAC,GAAG,CAAJ;EAEhB,IAAIC,CAAC,GAAG,CAACJ,GAAG,GAAG,QAAP,IAAmBH,SAA3B;EACA,IAAIO,CAAC,GAAG,GAAR,EAAaA,CAAC,GAAG,GAAJ,CAAb,KACK,IAAIA,CAAC,GAAG,CAAR,EAAWA,CAAC,GAAG,CAAJ;EAEhB,OAAO,CAACN,QAAQ,GAAG,GAAH,GAAS,EAAlB,IAAwB,CAACM,CAAC,GAAID,CAAC,IAAI,CAAV,GAAgBD,CAAC,IAAI,EAAtB,EAA2BG,QAA3B,CAAoC,EAApC,CAA/B;AACD,CAvBM"}

package/esm/utils/masks.d.ts

@@ -0,0 +1,11 @@
+export declare const Masks: {
+    CPF: string[];
+    CNPJ: string[];
+    DATE: string[];
+    MONTH_YEAR: string[];
+    CEP: string[];
+    PHONE: string[];
+    PHONE_EXTENDED: string[];
+    COMBINED_PHONE: (value: string) => string[];
+    COMBINED_CPF_CNPJ: (value: string) => string[];
+};

package/esm/utils/masks.js

@@ -0,0 +1,19 @@
+import { extractDigitsFromString } from './extractNumbersFromString';
+export var Masks = {
+  CPF: ['999.999.999-99'],
+  CNPJ: ['99.999.999/9999-99'],
+  DATE: ['99/99/9999'],
+  MONTH_YEAR: ['99/9999'],
+  CEP: ['99999-999'],
+  PHONE: ['(99) 9999-9999'],
+  PHONE_EXTENDED: ['(99) 99999-9999'],
+  COMBINED_PHONE: function COMBINED_PHONE(value) {
+    var onlyNumbers = extractDigitsFromString(value);
+    var isCellPhoneExtended = onlyNumbers.length === 11;
+    return (value === null || value === void 0 ? void 0 : value.length) <= 14 && !isCellPhoneExtended ? Masks.PHONE : Masks.PHONE_EXTENDED;
+  },
+  COMBINED_CPF_CNPJ: function COMBINED_CPF_CNPJ(value) {
+    return (value === null || value === void 0 ? void 0 : value.length) <= 14 ? Masks.CPF : Masks.CNPJ;
+  }
+};
+//# sourceMappingURL=masks.js.map

package/esm/utils/masks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"masks.js","names":["extractDigitsFromString","Masks","CPF","CNPJ","DATE","MONTH_YEAR","CEP","PHONE","PHONE_EXTENDED","COMBINED_PHONE","value","onlyNumbers","isCellPhoneExtended","length","COMBINED_CPF_CNPJ"],"sources":["../../src/utils/masks.ts"],"sourcesContent":["// NOTE: Add here all individually utils, then you can use it on input components everywhere.\nimport { extractDigitsFromString } from './extractNumbersFromString';\n\nexport const Masks = {\n  CPF: ['999.999.999-99'],\n  CNPJ: ['99.999.999/9999-99'],\n  DATE: ['99/99/9999'],\n  MONTH_YEAR: ['99/9999'],\n  CEP: ['99999-999'],\n  PHONE: ['(99) 9999-9999'],\n  PHONE_EXTENDED: ['(99) 99999-9999'],\n  COMBINED_PHONE: (value: string) => {\n    const onlyNumbers = extractDigitsFromString(value);\n    // Value is number extended, but without mask.\n    const isCellPhoneExtended = onlyNumbers.length === 11;\n\n    // Value in formatted mode\n    return value?.length <= 14 && !isCellPhoneExtended\n      ? Masks.PHONE\n      : Masks.PHONE_EXTENDED;\n  },\n  COMBINED_CPF_CNPJ: (value: string) =>\n    value?.length <= 14 ? Masks.CPF : Masks.CNPJ,\n};\n"],"mappings":"AACA,SAASA,uBAAT,QAAwC,4BAAxC;AAEA,OAAO,IAAMC,KAAK,GAAG;EACnBC,GAAG,EAAE,CAAC,gBAAD,CADc;EAEnBC,IAAI,EAAE,CAAC,oBAAD,CAFa;EAGnBC,IAAI,EAAE,CAAC,YAAD,CAHa;EAInBC,UAAU,EAAE,CAAC,SAAD,CAJO;EAKnBC,GAAG,EAAE,CAAC,WAAD,CALc;EAMnBC,KAAK,EAAE,CAAC,gBAAD,CANY;EAOnBC,cAAc,EAAE,CAAC,iBAAD,CAPG;EAQnBC,cAAc,EAAE,wBAACC,KAAD,EAAmB;IACjC,IAAMC,WAAW,GAAGX,uBAAuB,CAACU,KAAD,CAA3C;IAEA,IAAME,mBAAmB,GAAGD,WAAW,CAACE,MAAZ,KAAuB,EAAnD;IAGA,OAAO,CAAAH,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEG,MAAP,KAAiB,EAAjB,IAAuB,CAACD,mBAAxB,GACHX,KAAK,CAACM,KADH,GAEHN,KAAK,CAACO,cAFV;EAGD,CAjBkB;EAkBnBM,iBAAiB,EAAE,2BAACJ,KAAD;IAAA,OACjB,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEG,MAAP,KAAiB,EAAjB,GAAsBZ,KAAK,CAACC,GAA5B,GAAkCD,KAAK,CAACE,IADvB;EAAA;AAlBA,CAAd"}

package/esm/utils/variantComplement.d.ts

@@ -0,0 +1,6 @@
+import { ColorGradationType, ColorType, FontColorType, VariantType } from '../types/defaults';
+export declare const fontColorVC: Record<VariantType, FontColorType>;
+export declare const colorVC: Record<VariantType, ColorType>;
+export declare const colorGradationVC: Record<VariantType, ColorGradationType>;
+export declare const borderColorVC: Record<VariantType, ColorType>;
+export declare const borderColorGradationVC: Record<VariantType, ColorGradationType>;

package/esm/utils/variantComplement.js

@@ -0,0 +1,26 @@
+export var fontColorVC = {
+  filled: 'light',
+  outlined: 'orange',
+  text: 'orange'
+};
+export var colorVC = {
+  filled: 'primary',
+  outlined: 'primary',
+  text: 'primary'
+};
+export var colorGradationVC = {
+  filled: 'dark',
+  outlined: 'dark',
+  text: 'dark'
+};
+export var borderColorVC = {
+  filled: 'primary',
+  outlined: 'primary',
+  text: 'primary'
+};
+export var borderColorGradationVC = {
+  filled: 'dark',
+  outlined: 'dark',
+  text: 'dark'
+};
+//# sourceMappingURL=variantComplement.js.map

package/esm/utils/variantComplement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"variantComplement.js","names":["fontColorVC","filled","outlined","text","colorVC","colorGradationVC","borderColorVC","borderColorGradationVC"],"sources":["../../src/utils/variantComplement.ts"],"sourcesContent":["import {\n  ColorGradationType,\n  ColorType,\n  FontColorType,\n  VariantType,\n} from '../types/defaults';\n\nexport const fontColorVC: Record<VariantType, FontColorType> = {\n  filled: 'light',\n  outlined: 'orange',\n  text: 'orange',\n};\n\nexport const colorVC: Record<VariantType, ColorType> = {\n  filled: 'primary',\n  outlined: 'primary',\n  text: 'primary',\n};\n\nexport const colorGradationVC: Record<VariantType, ColorGradationType> = {\n  filled: 'dark',\n  outlined: 'dark',\n  text: 'dark',\n};\n\nexport const borderColorVC: Record<VariantType, ColorType> = {\n  filled: 'primary',\n  outlined: 'primary',\n  text: 'primary',\n};\n\nexport const borderColorGradationVC: Record<VariantType, ColorGradationType> = {\n  filled: 'dark',\n  outlined: 'dark',\n  text: 'dark',\n};\n"],"mappings":"AAOA,OAAO,IAAMA,WAA+C,GAAG;EAC7DC,MAAM,EAAE,OADqD;EAE7DC,QAAQ,EAAE,QAFmD;EAG7DC,IAAI,EAAE;AAHuD,CAAxD;AAMP,OAAO,IAAMC,OAAuC,GAAG;EACrDH,MAAM,EAAE,SAD6C;EAErDC,QAAQ,EAAE,SAF2C;EAGrDC,IAAI,EAAE;AAH+C,CAAhD;AAMP,OAAO,IAAME,gBAAyD,GAAG;EACvEJ,MAAM,EAAE,MAD+D;EAEvEC,QAAQ,EAAE,MAF6D;EAGvEC,IAAI,EAAE;AAHiE,CAAlE;AAMP,OAAO,IAAMG,aAA6C,GAAG;EAC3DL,MAAM,EAAE,SADmD;EAE3DC,QAAQ,EAAE,SAFiD;EAG3DC,IAAI,EAAE;AAHqD,CAAtD;AAMP,OAAO,IAAMI,sBAA+D,GAAG;EAC7EN,MAAM,EAAE,MADqE;EAE7EC,QAAQ,EAAE,MAFmE;EAG7EC,IAAI,EAAE;AAHuE,CAAxE"}

package/package.json

@@ -1,23 +1,28 @@
 {
   "name": "@tecsinapse/react-core",
   "description": "TecSinapse hybrid React components",
-  "version": "1.17.4",
+  "version": "1.20.0",
   "license": "MIT",
   "main": "dist/index.js",
+  "module": "esm/index.js",
   "types": "dist/index.d.ts",
   "scripts": {
     "start": "yarn build:es --watch",
-    "build:es": "cross-env BABEL_ENV=build babel src --root-mode upward --out-dir dist --source-maps --extensions .ts,.tsx --delete-dir-on-start --no-comments",
-    "build:declaration": "tsc --project tsconfig.build.json",
+    "build:es": "yarn build:cjs && yarn build:esm",
+    "build:cjs": "cross-env BABEL_ENV=build babel src --root-mode upward --out-dir dist --source-maps --extensions .ts,.tsx --delete-dir-on-start --no-comments",
+    "build:esm": "cross-env BABEL_ENV=build babel src --root-mode upward --out-dir esm --source-maps --extensions .ts,.tsx --delete-dir-on-start --no-comments --config-file ./babel.config.esm.js",
+    "build:declaration": "yarn build:declaration:cjs && yarn build:declaration:esm",
+    "build:declaration:cjs": "tsc --project tsconfig.build.json",
+    "build:declaration:esm": "tsc --project tsconfig.build.esm.json",
     "build:declaration:watch": "tsc --project tsconfig.build.json --watch",
     "yalc:push": "yalc push --changed",
     "yalc:show": "yalc installations show $npm_package_name"
   },
   "dependencies": {
-    "@emotion/native": "^11.0.0",
-    "@emotion/react": "^11.4.1",
+    "@emotion/native": "^11.10.0",
+    "@emotion/react": "^11.10.0",
     "currency.js": "^2.0.4",
-    "date-fns": "^2.22.1"
+    "date-fns": "^2.29.1"
   },
   "repository": {
     "type": "git",
@@ -34,5 +39,5 @@
     "react-native": "^0.64.0",
     "react-native-vector-icons": "^8.1.0 || ^9.0.0"
   },
-  "gitHead": "03c2dd15a8e489f803bcb0aab01ec83a3cd7f277"
+  "gitHead": "46fe5778b52031a04bcb217c86cf363d6ae45b54"
 }

package/src/components/atoms/Avatar/index.ts

@@ -1 +1,2 @@
-export { default as Avatar, AvatarProps } from './Avatar';
+export { default as Avatar } from './Avatar';
+export type { AvatarProps } from './Avatar';

package/src/components/atoms/Badge/index.ts

@@ -1 +1,2 @@
-export { default as Badge, BadgeProps } from './Badge';
+export { default as Badge } from './Badge';
+export type { BadgeProps } from './Badge';

package/src/components/atoms/Badge/styled.ts

@@ -23,9 +23,8 @@ const baseStyle = ({
   `;
 };
 
-export const BadgeStyle = styled(View)<Partial<StyleProps & BadgeProps>>(
-  baseStyle
-);
+export const BadgeStyle =
+  styled(View)<Partial<StyleProps & BadgeProps>>(baseStyle);
 
 export const ViewStyled = styled(View)<Partial<StyleProps & BadgeProps>>`
   align-items: center;

package/src/components/atoms/BoxContent/index.ts

@@ -1 +1,2 @@
-export { default as BoxContent, BoxContentProps } from './BoxContent';
+export { default as BoxContent } from './BoxContent';
+export type { BoxContentProps } from './BoxContent';

package/src/components/atoms/Button/index.ts

@@ -1,8 +1,8 @@
-export {
-  default as Button,
+export { default as Button } from './Button';
+export { Error, Success, Loading } from './States';
+export type {
   ButtonProps,
   ButtonSizeType,
   ButtonStateType,
   ButtonStateProps,
 } from './Button';
-export { Error, Success, Loading } from './States';

package/src/components/atoms/Card/Footer/index.ts

@@ -1 +1,2 @@
-export { default as Footer, FooterProps } from './Footer';
+export { default as Footer } from './Footer';
+export type { FooterProps } from './Footer';

package/src/components/atoms/Card/Header/index.ts

@@ -1 +1,2 @@
-export { default as Header, HeaderProps } from './Header';
+export { default as Header } from './Header';
+export type { HeaderProps } from './Header';

package/src/components/atoms/Card/index.ts

@@ -1 +1,2 @@
-export { default as Card, CardProps } from './Card';
+export { default as Card } from './Card';
+export type { CardProps } from './Card';

package/src/components/atoms/Checkbox/index.ts

@@ -1 +1,2 @@
-export { default as Checkbox, CheckboxProps } from './Checkbox';
+export { default as Checkbox } from './Checkbox';
+export type { CheckboxProps } from './Checkbox';

package/src/components/atoms/Divider/index.ts

@@ -1 +1,2 @@
-export { default as Divider, DividerProps } from './Divider';
+export { default as Divider } from './Divider';
+export type { DividerProps } from './Divider';

package/src/components/atoms/GroupButton/GroupButton.tsx

@@ -44,16 +44,13 @@ export interface GroupButtonProps<T> {
   disableAllOptions?: boolean;
 }
 
-const GroupButton = <T extends unknown>({
-  style,
-  ...rest
-}: GroupButtonProps<T>) => {
+const GroupButton = <T,>({ style, ...rest }: GroupButtonProps<T>) => {
   return (
     <StyledGroupButton style={style}>{groupOptions(rest)}</StyledGroupButton>
   );
 };
 
-const groupOptions = <T extends unknown>({
+const groupOptions = <T,>({
   options,
   renderOption,
   renderKey,

package/src/components/atoms/GroupButton/index.ts

@@ -1,9 +1,4 @@
-export {
-  default as GroupButton,
-  GroupButtonProps,
-  GroupButtonValue,
-} from './GroupButton';
-export {
-  default as GroupButtonOption,
-  GroupButtonOptionProps,
-} from './GroupButtonOption';
+export { default as GroupButton } from './GroupButton';
+export type { GroupButtonProps, GroupButtonValue } from './GroupButton';
+export { default as GroupButtonOption } from './GroupButtonOption';
+export type { GroupButtonOptionProps } from './GroupButtonOption';

package/src/components/atoms/Icon/index.ts

@@ -1 +1,2 @@
-export { default as Icon, IconProps } from './Icon';
+export { default as Icon } from './Icon';
+export type { IconProps } from './Icon';

package/src/components/atoms/Input/InputContainer/InputContainer.tsx

@@ -7,14 +7,14 @@ import {
   FontColorType,
   FontStackType,
   FontWeightType,
-  TypographyVariationType
-} from '../../../../types/defaults';
+  TypographyVariationType,
+} from '@tecsinapse/react-core';
 import { Text, TextProps } from '../../Text';
 import {
   StyledBorderKeeper,
   StyledIconContent,
   StyledInputContainer,
-  StyledLabelContainer
+  StyledLabelContainer,
 } from '../styled';
 
 export type InputVariantType = 'default' | 'error' | 'success';

package/src/components/atoms/Input/InputElement/InputElement.tsx

@@ -1,7 +1,7 @@
 import { useTheme } from '@emotion/react';
 import { ThemeProp } from '@tecsinapse/react-core';
-import React, { FC } from 'react';
-import { StyleProp, TextInputProps, TextStyle } from 'react-native';
+import React from 'react';
+import { StyleProp, TextInput, TextInputProps, TextStyle } from 'react-native';
 import { StyledInputElement } from '../styled';
 
 export interface InputElementProps
@@ -13,10 +13,9 @@ export interface InputElementProps
   onChange?: (value: string) => void;
   onFocus?: () => void;
   onBlur?: () => void;
-  ref?: React.Ref<any>;
 }
 
-const InputElement: FC<InputElementProps> = React.forwardRef(
+const InputElement = React.forwardRef<TextInput, InputElementProps>(
   (
     {
       onChange,
@@ -26,7 +25,7 @@ const InputElement: FC<InputElementProps> = React.forwardRef(
       placeholderTextColor,
       ...rest
     },
-    ref: React.Ref<any>
+    ref
   ): JSX.Element => {
     const theme = useTheme() as ThemeProp;
     const _placeholderColor = placeholderTextColor || theme.font.color.dark;

package/src/components/atoms/Input/InputMaskElement/InputMaskElement.tsx

@@ -1,7 +1,7 @@
 import { useTheme } from '@emotion/react';
 import { ThemeProp } from '@tecsinapse/react-core';
-import React, { FC, useCallback, useEffect } from 'react';
-import { StyleProp, TextInputProps, TextStyle } from 'react-native';
+import React, { useCallback, useEffect } from 'react';
+import { StyleProp, TextInput, TextInputProps, TextStyle } from 'react-native';
 import { StyledInputElement } from '../styled';
 import { MaskType, useStringMask } from '../hooks/useStringMask';
 import { CurrencyOptions, useNumberMask } from '../hooks/useNumberMask';
@@ -24,10 +24,9 @@ export interface InputMaskElementProps
   mask?: (MaskType[] | ((value: string) => MaskType[])) | CurrencyOptions;
   onFocus?: () => void;
   onBlur?: () => void;
-  ref?: React.Ref<any>;
 }
 
-const InputMaskElement: FC<InputMaskElementProps> = React.forwardRef(
+const InputMaskElement = React.forwardRef<TextInput, InputMaskElementProps>(
   (
     {
       onChange,
@@ -38,7 +37,7 @@ const InputMaskElement: FC<InputMaskElementProps> = React.forwardRef(
       mask,
       ...rest
     },
-    ref: React.Ref<any>
+    ref
   ): JSX.Element => {
     const theme = useTheme() as ThemeProp;
 

package/src/components/atoms/Input/PressableInputContainer/index.ts

@@ -1,4 +1,2 @@
-export {
-  default as PressableInputContainer,
-  PressableInputContainerProps,
-} from './PressableInputContainer';
+export { default as PressableInputContainer } from './PressableInputContainer';
+export type { PressableInputContainerProps } from './PressableInputContainer';

package/src/components/atoms/Input/index.ts

@@ -2,21 +2,15 @@ export { default as Hint } from './Hint';
 export * from './hooks/useInputFocus';
 export * from './hooks/useNumberMask';
 export * from './hooks/useStringMask';
-export {
-  default as InputContainer,
+export { default as InputContainer } from './InputContainer/InputContainer';
+export type {
   InputContainerProps,
   InputVariantType,
 } from './InputContainer/InputContainer';
-export {
-  default as InputElement,
-  InputElementProps,
-} from './InputElement/InputElement';
-export {
-  default as InputMaskElement,
-  InputMaskElementProps,
-} from './InputMaskElement/InputMaskElement';
-export {
-  PressableInputContainer,
-  PressableInputContainerProps,
-} from './PressableInputContainer';
+export { default as InputElement } from './InputElement/InputElement';
+export type { InputElementProps } from './InputElement/InputElement';
+export { default as InputMaskElement } from './InputMaskElement/InputMaskElement';
+export type { InputMaskElementProps } from './InputMaskElement/InputMaskElement';
+export { PressableInputContainer } from './PressableInputContainer';
+export type { PressableInputContainerProps } from './PressableInputContainer';
 export { StyledBorderKeeper, disabledInputStyles } from './styled';

package/src/components/atoms/Paper/index.ts

@@ -1 +1,2 @@
-export { default as Paper, PaperProps } from './Paper';
+export { default as Paper } from './Paper';
+export type { PaperProps } from './Paper';

package/src/components/atoms/PressableSurface/index.ts

@@ -1,4 +1,2 @@
-export {
-  default as PressableSurface,
-  PressableSurfaceProps,
-} from './PressableSurface';
+export { default as PressableSurface } from './PressableSurface';
+export type { PressableSurfaceProps } from './PressableSurface';

package/src/components/atoms/ProgressBar/ProgressBar.tsx

@@ -4,8 +4,8 @@ import { Animated, ViewProps } from 'react-native';
 import {
   ColorGradationType,
   ColorType,
-  ThemeProp
-} from '../../../types/defaults';
+  ThemeProp,
+} from '@tecsinapse/react-core';
 import { extractNumbersFromString } from '../../../utils';
 import { Container, Progress, Segment } from './styled';
 
@@ -54,8 +54,6 @@ const ProgressBar: React.FC<ProgressBarProps> = ({
   const items = [...Array(segments).keys()];
 
   const segmentsRender = items.map(index => {
-    
-
     const max = segmentWidth * (index + 1);
     const min = segmentWidth * index;
     const minmax = (totalProgress - min) / (max - min);

package/src/components/atoms/ProgressBar/index.ts

@@ -1 +1,2 @@
-export { default as ProgressBar, ProgressBarProps } from './ProgressBar';
+export { default as ProgressBar } from './ProgressBar';
+export type { ProgressBarProps } from './ProgressBar';

package/src/components/atoms/RadioButton/index.ts

@@ -1 +1,2 @@
-export { default as RadioButton, RadioButtonProps } from './RadioButton';
+export { default as RadioButton } from './RadioButton';
+export type { RadioButtonProps } from './RadioButton';

package/src/components/atoms/Switch/Switch.tsx

@@ -1,12 +1,21 @@
 import { useTheme } from '@emotion/react';
 import React, { FC, useCallback, useEffect } from 'react';
-import { Animated, LayoutChangeEvent, StyleProp, ViewStyle } from 'react-native';
+import {
+  Animated,
+  LayoutChangeEvent,
+  StyleProp,
+  ViewStyle,
+} from 'react-native';
 import {
   ColorGradationType,
   ColorType,
-  ThemeProp
-} from '../../../types/defaults';
-import { extractNumbersFromString, lightenDarkenColor, RFValueStr } from '../../../utils';
+  ThemeProp,
+} from '@tecsinapse/react-core';
+import {
+  extractNumbersFromString,
+  lightenDarkenColor,
+  RFValueStr,
+} from '../../../utils';
 import { PressableSurface } from '../PressableSurface';
 import { transitionSwitch } from './animation';
 import { StyledSwitch, StyledSwitchContent, SWITCH_PIN_WIDTH } from './styled';
@@ -36,19 +45,25 @@ const Switch: FC<SwitchProps> = ({
 }): JSX.Element => {
   const theme = useTheme() as ThemeProp;
 
-  const width = React.useRef(0)
-  const transitionValue = React.useRef(new Animated.Value(0)).current
-  const animatedColor = React.useRef(new Animated.Value(0)).current
-  
+  const width = React.useRef(0);
+  const transitionValue = React.useRef(new Animated.Value(0)).current;
+  const animatedColor = React.useRef(new Animated.Value(0)).current;
+
   const calculateTranslate = () => {
     if (width.current > 0) {
-      return width.current - (extractNumbersFromString(theme.spacing.micro) * 2) - (extractNumbersFromString(RFValueStr(SWITCH_PIN_WIDTH)))
+      return (
+        width.current -
+        extractNumbersFromString(theme.spacing.micro) * 2 -
+        extractNumbersFromString(RFValueStr(SWITCH_PIN_WIDTH))
+      );
     }
-    return 0
-  }
+    return 0;
+  };
 
   const getBackgroundColor = (color: string) => {
-    return disabled ? lightenDarkenColor(theme.color[inactiveColor][inactiveColorTone], 20) : color;
+    return disabled
+      ? lightenDarkenColor(theme.color[inactiveColor][inactiveColorTone], 20)
+      : color;
   };
 
   const interpolateColor = animatedColor.interpolate({
@@ -56,11 +71,11 @@ const Switch: FC<SwitchProps> = ({
     outputRange: [
       getBackgroundColor(theme.color[inactiveColor][inactiveColorTone]),
       getBackgroundColor(theme.color[activeColor][activeColorTone]),
-    ]
+    ],
   });
 
   useEffect(() => {
-    const translate = calculateTranslate()
+    const translate = calculateTranslate();
     transitionSwitch(active, translate, transitionValue, animatedColor);
   }, [active]);
 
@@ -69,10 +84,10 @@ const Switch: FC<SwitchProps> = ({
   }, [active, onChange]);
 
   const handleSwitchLayout = (lce: LayoutChangeEvent) => {
-    width.current = lce.nativeEvent.layout.width
-    const translate = calculateTranslate()
+    width.current = lce.nativeEvent.layout.width;
+    const translate = calculateTranslate();
     transitionSwitch(active, translate, transitionValue, animatedColor);
-  }
+  };
 
   return (
     <PressableSurface
@@ -81,8 +96,13 @@ const Switch: FC<SwitchProps> = ({
       effect="none"
       disabled={disabled}
     >
-      <StyledSwitchContent onLayout={handleSwitchLayout} style={{ backgroundColor: interpolateColor }}>
-        <StyledSwitch style={[dotStyle, { transform: [{ translateX: transitionValue }] }]}/>
+      <StyledSwitchContent
+        onLayout={handleSwitchLayout}
+        style={{ backgroundColor: interpolateColor }}
+      >
+        <StyledSwitch
+          style={[dotStyle, { transform: [{ translateX: transitionValue }] }]}
+        />
       </StyledSwitchContent>
     </PressableSurface>
   );

package/src/components/atoms/Switch/animation.ts

@@ -1,6 +1,6 @@
 import { Animated, Easing } from 'react-native';
 
-const ANIMATION_SPEED = 140
+const ANIMATION_SPEED = 140;
 
 export const transitionSwitch = (
   active: boolean,
@@ -8,9 +8,8 @@ export const transitionSwitch = (
   transitionValue: Animated.Value,
   animatedColor: Animated.Value
 ): void => {
+  if (translate <= 0) return;
 
-  if (translate <= 0) return
-  
   if (active) {
     Animated.timing(transitionValue, {
       toValue: translate,
@@ -23,8 +22,8 @@ export const transitionSwitch = (
       duration: ANIMATION_SPEED,
       useNativeDriver: false,
     }).start();
-    return
-  } 
+    return;
+  }
 
   Animated.timing(transitionValue, {
     toValue: 0,
@@ -37,5 +36,4 @@ export const transitionSwitch = (
     duration: ANIMATION_SPEED,
     useNativeDriver: false,
   }).start();
-
 };

package/src/components/atoms/Switch/index.ts

@@ -1 +1,2 @@
-export { default as Switch, SwitchProps } from './Switch';
+export { default as Switch } from './Switch';
+export type { SwitchProps } from './Switch';

package/src/components/atoms/Switch/styled.ts

@@ -1,14 +1,12 @@
 import styled from '@emotion/native';
 import { Animated } from 'react-native';
-import { StyleProps } from '../../../types/defaults';
+import { StyleProps } from '@tecsinapse/react-core';
 import { RFValueStr } from '../../../utils';
 
-export const SWITCH_BODY_WIDTH = '40px'
-export const SWITCH_PIN_WIDTH = '16px'
+export const SWITCH_BODY_WIDTH = '40px';
+export const SWITCH_PIN_WIDTH = '16px';
 
-export const StyledSwitchContent = styled(Animated.View)<
-  Partial<StyleProps>
->`
+export const StyledSwitchContent = styled(Animated.View)<Partial<StyleProps>>`
   border-radius: ${({ theme }) => theme.borderRadius.pill};
   padding: 0 ${({ theme }) => theme.spacing.micro};
   justify-content: center;

package/src/components/atoms/Tag/Tag.tsx

@@ -43,7 +43,7 @@ const Tag: React.FC<TagProps> = ({
     <StyledTagContainer
       {...rest}
       variant={variant}
-      style={[{ opacity: (fadeAnim as unknown) as number }, style]}
+      style={[{ opacity: fadeAnim as unknown as number }, style]}
       visible={!dismiss}
     >
       {icon && (

package/src/components/atoms/Tag/index.ts

@@ -1 +1,2 @@
-export { default as Tag, TagProps } from './Tag';
+export { default as Tag } from './Tag';
+export type { TagProps } from './Tag';

package/src/components/atoms/Text/index.ts

@@ -1 +1,2 @@
-export { default as Text, TextProps } from './Text';
+export { default as Text } from './Text';
+export type { TextProps } from './Text';

package/src/components/atoms/shared/PaperAndCard.ts

@@ -18,7 +18,7 @@ export const elevatedStyles = ({
       shadowOffset: { width: 0, height: 2 },
       shadowOpacity: 0.05,
       shadowRadius: 5,
-      elevation: 2
+      elevation: 2,
     }),
   ];
 /* eslint-enable @typescript-eslint/no-explicit-any */

package/src/components/molecules/Calendar/index.ts

@@ -1,7 +1,7 @@
-export {
-  default as Calendar,
+export { default as Calendar } from './Calendar';
+export type {
   CalendarProps,
   SelectionType,
   DateRange,
-  Value
+  Value,
 } from './Calendar';