@tecsinapse/react-core 1.5.0 → 1.6.3

package/dist/types/defaults.js

@@ -1,2 +1,6 @@
 "use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 //# sourceMappingURL=defaults.js.map

package/dist/utils/extractNumbersFromString.d.ts

@@ -0,0 +1 @@
+export declare const extractNumbersFromString: (value: string) => number;

package/dist/utils/extractNumbersFromString.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.extractNumbersFromString = void 0;
+
+const extractNumbersFromString = value => Number(value.replace(/[^0-9]/g, ''));
+
+exports.extractNumbersFromString = extractNumbersFromString;
+//# sourceMappingURL=extractNumbersFromString.js.map

package/dist/utils/extractNumbersFromString.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/extractNumbersFromString.ts"],"names":["extractNumbersFromString","value","Number","replace"],"mappings":";;;;;;;AAAO,MAAMA,wBAAwB,GAAIC,KAAD,IACtCC,MAAM,CAACD,KAAK,CAACE,OAAN,CAAc,SAAd,EAAyB,EAAzB,CAAD,CADD","sourcesContent":["export const extractNumbersFromString = (value: string): number =>\n  Number(value.replace(/[^0-9]/g, ''));\n"],"file":"extractNumbersFromString.js"}

package/dist/utils/index.d.ts

@@ -1 +1,2 @@
 export { lightenDarkenColor } from './lightenDarkenColor';
+export { extractNumbersFromString } from './extractNumbersFromString';

package/dist/utils/index.js

@@ -9,6 +9,14 @@ Object.defineProperty(exports, "lightenDarkenColor", {
     return _lightenDarkenColor.lightenDarkenColor;
   }
 });
+Object.defineProperty(exports, "extractNumbersFromString", {
+  enumerable: true,
+  get: function () {
+    return _extractNumbersFromString.extractNumbersFromString;
+  }
+});
 
 var _lightenDarkenColor = require("./lightenDarkenColor");
+
+var _extractNumbersFromString = require("./extractNumbersFromString");
 //# sourceMappingURL=index.js.map

package/dist/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA","sourcesContent":["export { lightenDarkenColor } from './lightenDarkenColor';\n"],"file":"index.js"}
+{"version":3,"sources":["../../src/utils/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;AACA","sourcesContent":["export { lightenDarkenColor } from './lightenDarkenColor';\nexport { extractNumbersFromString } from './extractNumbersFromString';\n"],"file":"index.js"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tecsinapse/react-core",
   "description": "TecSinapse hybrid React components",
-  "version": "1.5.0",
+  "version": "1.6.3",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -12,7 +12,7 @@
   },
   "dependencies": {
     "@emotion/native": "^11.0.0",
-    "@emotion/react": "^11.4.0",
+    "@emotion/react": "^11.4.1",
     "currency.js": "^2.0.4",
     "date-fns": "^2.22.1"
   },
@@ -31,5 +31,5 @@
     "react-native": ">=0.64.0",
     "react-native-vector-icons": ">=8.1.0"
   },
-  "gitHead": "aa821cfe5b5e9f375f41091dc6f35a2d5f2247e0"
+  "gitHead": "f7d8b7fc64df772a40219b18d79c3ea5e719baf4"
 }

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

@@ -13,6 +13,7 @@ export const ContainerButtonAvatar = styled(PressableSurface)<
     theme.iconSize[size]};
   height: ${({ theme, size = 'mega' }: StyleProps & Partial<AvatarProps>) =>
     theme.iconSize[size]};
+  cursor: ${({ onPress }) => (onPress ? 'pointer' : 'default')};
 `;
 
 export const StyledAvatar = styled(Image)<Partial<StyleProps>>`

package/src/components/atoms/Input/hooks/useCurrencyMask.ts

@@ -2,6 +2,7 @@ import currency from 'currency.js';
 import { useCallback, useState } from 'react';
 import { Mask } from '..';
 import { MaskValue } from './useMask';
+import { extractNumbersFromString } from '@tecsinapse/react-core';
 
 type CurrencyOptions = currency.Options;
 
@@ -31,7 +32,7 @@ export const useCurrencyMask = (
     (value = ''): MaskValue => {
       const mergedOptions = { ...DEFAULT_OPTIONS, ...options };
       const { precision = -1 } = mergedOptions;
-      const onlyNumbers = String(value).replace(/\D/g, '');
+      const onlyNumbers = String(extractNumbersFromString(value));
       const padZeros = String(onlyNumbers).padStart(precision + 1, '0');
       let internalNumber = Number(padZeros.replace(getRegex(precision), '.'));
 

package/src/components/atoms/Input/hooks/useMask.ts

@@ -1,4 +1,5 @@
 import { useCallback, useState } from 'react';
+import { extractNumbersFromString } from '@tecsinapse/react-core';
 
 export interface MaskValue {
   formatted?: string;
@@ -55,7 +56,7 @@ export const useMask = (
 ): [Mask, (text: string) => void] => {
   const applyMask = useCallback(
     (value = ''): MaskValue => {
-      const onlyNumbers = String(value).replace(/\D/g, '');
+      const onlyNumbers = String(extractNumbersFromString(value));
       const selectedMask = getMask(onlyNumbers, mask);
       const formattedValue = mergeMask(onlyNumbers, selectedMask);
 

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

@@ -5,6 +5,7 @@ import { useTheme } from '@emotion/react';
 import {
   ColorGradationType,
   ColorType,
+  extractNumbersFromString,
   ThemeProp,
 } from '@tecsinapse/react-core';
 
@@ -42,7 +43,7 @@ const ProgressBar: React.FC<ProgressBarProps> = ({
 
   const valueNow =
     typeof _valueNow === 'string'
-      ? parseInt(_valueNow.replace(/\D/g, ''))
+      ? extractNumbersFromString(_valueNow)
       : _valueNow;
 
   const totalProgress = ((valueNow - valueMin) / (valueMax - valueMin)) * 100;

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

@@ -8,7 +8,8 @@ import {
 } from '../../../types/defaults';
 import { PressableSurface } from '../PressableSurface';
 import { StyledSwitch } from './styled';
-import { transtionSwitch } from './animation';
+import { transitionSwitch } from './animation';
+import { extractNumbersFromString } from '../../../utils';
 
 export interface SwitchProps {
   onChange: (active: boolean) => void;
@@ -21,9 +22,6 @@ export interface SwitchProps {
   dotStyle?: StyleProp<ViewStyle>;
 }
 
-const extractNumbers = (value: string): number =>
-  Number(value.replace(/[^0-9]/g, ''));
-
 const Switch: FC<SwitchProps> = ({
   onChange,
   activeColor = 'primary',
@@ -56,12 +54,12 @@ const Switch: FC<SwitchProps> = ({
 
   const handleChange = useCallback(() => {
     onChange(!active);
-    transtionSwitch(active, transitionValue, animatedColor);
+    transitionSwitch(active, transitionValue, animatedColor);
   }, [active]);
 
   const stylesDefaut: ViewStyle = {
-    borderRadius: extractNumbers(theme.borderRadius.pill),
-    paddingHorizontal: extractNumbers(theme.borderRadius.micro),
+    borderRadius: extractNumbersFromString(theme.borderRadius.pill),
+    paddingHorizontal: extractNumbersFromString(theme.spacing.micro),
     paddingVertical: 0,
     justifyContent: 'center',
     width: 40,

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

@@ -1,6 +1,6 @@
 import { Animated } from 'react-native';
 
-export const transtionSwitch = (active, transitionValue, animatedColor) => {
+export const transitionSwitch = (active, transitionValue, animatedColor) => {
   if (active) {
     Animated.timing(transitionValue, {
       toValue: 0,

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

@@ -6,6 +6,7 @@ export const baseStyles = ({ theme }: StyleProps): any => css`
   padding: ${theme.spacing.deca};
   border-radius: ${theme.borderRadius.mili};
   background-color: ${theme.miscellaneous.surfaceColor};
+  overflow: hidden;
 `;
 
 /* eslint-disable @typescript-eslint/no-explicit-any */

package/src/hooks/index.ts

@@ -1 +1,2 @@
 export { useDebouncedState } from './useDebouncedState';
+export { useTheme } from './useTheme';

package/src/hooks/useTheme.ts

@@ -0,0 +1,4 @@
+import { useTheme as useEmotionTheme } from '@emotion/react';
+import { ThemeProp } from '../types/defaults';
+
+export const useTheme = () => useEmotionTheme() as ThemeProp;

package/src/styles/definitions.ts

@@ -92,13 +92,6 @@ export const borderWidth: BorderWidth = {
 };
 
 export const typography: TypographyVariation = {
-  // TODO: H6 wasn't defined! It's the same of H5
-  // h6: {
-  //   // fontSize: '1rem', // 16px
-  //   // lineHeight: '1.5rem', // 24px
-  //   fontSize: '16px',
-  //   lineHeight: '24px',
-  // },
   h5: {
     fontSize: '16px', // '1rem'
     lineHeight: '24px', // '1.5rem'
@@ -160,13 +153,13 @@ export const fontColor: FontColor = {
 export const zIndex: ZIndex = {
   default: 0,
   absolute: 1,
-  drawer: 10,
   select: 20,
   input: 20,
   popover: 30,
   tooltip: 40,
   header: 600,
   backdrop: 700,
+  drawer: 700,
   sidebar: 800,
   modal: 1000,
 };

package/src/utils/extractNumbersFromString.ts

@@ -0,0 +1,2 @@
+export const extractNumbersFromString = (value: string): number =>
+  Number(value.replace(/[^0-9]/g, ''));

package/src/utils/index.ts

@@ -1 +1,2 @@
 export { lightenDarkenColor } from './lightenDarkenColor';
+export { extractNumbersFromString } from './extractNumbersFromString';