@tecsinapse/react-core 3.4.14 → 3.4.15-beta.1

package/dist/esm/components/atoms/Input/Hint.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import Text from '../Text/Text.js';
 import { StyledHintContainer, StyledHintIcon } from './styled.js';
 
@@ -18,15 +18,18 @@ const Hint = ({ variant, text, TextComponent = Text }) => {
       icon = "checkmark-circle-outline";
       break;
   }
-  return /* @__PURE__ */ React__default.createElement(StyledHintContainer, null, icon && /* @__PURE__ */ React__default.createElement(
-    StyledHintIcon,
-    {
-      name: icon,
-      type: "ionicon",
-      size: "centi",
-      colorVariant: color
-    }
-  ), /* @__PURE__ */ React__default.createElement(TextComponent, { typography: "label", colorVariant: color }, text));
+  return /* @__PURE__ */ jsxs(StyledHintContainer, { children: [
+    icon && /* @__PURE__ */ jsx(
+      StyledHintIcon,
+      {
+        name: icon,
+        type: "ionicon",
+        size: "centi",
+        colorVariant: color
+      }
+    ),
+    /* @__PURE__ */ jsx(TextComponent, { typography: "label", colorVariant: color, children: text })
+  ] });
 };
 
 export { Hint as default };

package/dist/esm/components/atoms/Input/InputContainer/InputContainer.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import Text from '../../Text/Text.js';
 import { StyledInputContainer, StyledBorderKeeper, StyledIconContent, StyledLabelContainer } from '../styled.js';
 
@@ -25,44 +25,48 @@ const InputContainer = ({
   if (variant === "success") _defaultLabelColor = "success";
   const _labelColorVariant = disabled ? "secondary" : _defaultLabelColor;
   const _labelColorTone = disabled ? "light" : labelColorTone;
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsxs(
     StyledInputContainer,
     {
       ...rest,
       style: inputContainerStyle,
       focused,
-      disabled
-    },
-    /* @__PURE__ */ React__default.createElement(
-      StyledBorderKeeper,
-      {
-        focused,
-        disabled,
-        borderColor: _defaultLabelColor
-      }
-    ),
-    leftComponent && /* @__PURE__ */ React__default.createElement(StyledIconContent, null, leftComponent),
-    /* @__PURE__ */ React__default.createElement(
-      StyledLabelContainer,
-      {
-        leftComponent,
-        rightComponent
-      },
-      label && /* @__PURE__ */ React__default.createElement(
-        LabelComponent,
-        {
-          fontColor: labelColor,
-          colorTone: _labelColorTone,
-          colorVariant: _labelColorVariant,
-          typography: labelTypography,
-          fontWeight: labelWeight,
-          fontStack: labelStack
-        },
-        label
-      ),
-      children
-    ),
-    rightComponent && /* @__PURE__ */ React__default.createElement(StyledIconContent, null, rightComponent)
+      disabled,
+      children: [
+        /* @__PURE__ */ jsx(
+          StyledBorderKeeper,
+          {
+            focused,
+            disabled,
+            borderColor: _defaultLabelColor
+          }
+        ),
+        leftComponent && /* @__PURE__ */ jsx(StyledIconContent, { children: leftComponent }),
+        /* @__PURE__ */ jsxs(
+          StyledLabelContainer,
+          {
+            leftComponent,
+            rightComponent,
+            children: [
+              label && /* @__PURE__ */ jsx(
+                LabelComponent,
+                {
+                  fontColor: labelColor,
+                  colorTone: _labelColorTone,
+                  colorVariant: _labelColorVariant,
+                  typography: labelTypography,
+                  fontWeight: labelWeight,
+                  fontStack: labelStack,
+                  children: label
+                }
+              ),
+              children
+            ]
+          }
+        ),
+        rightComponent && /* @__PURE__ */ jsx(StyledIconContent, { children: rightComponent })
+      ]
+    }
   );
 };
 

package/dist/esm/components/atoms/Input/InputElement/InputElement.js

@@ -1,3 +1,4 @@
+import { jsx } from 'react/jsx-runtime';
 import React__default from 'react';
 import { StyledInputElement } from '../styled.js';
 import { useTheme } from '../../../../hooks/useTheme.js';
@@ -13,7 +14,7 @@ const InputElement = React__default.forwardRef(
   }, ref) => {
     const theme = useTheme();
     const _placeholderColor = placeholderTextColor || theme.font?.color?.dark;
-    return /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ jsx(
       StyledInputElement,
       {
         ...rest,

package/dist/esm/components/atoms/Input/InputMaskElement/InputMaskElement.js

@@ -1,3 +1,4 @@
+import { jsx } from 'react/jsx-runtime';
 import { useTheme } from '@emotion/react';
 import React__default, { useEffect, useCallback } from 'react';
 import { StyledInputElement } from '../styled.js';
@@ -51,7 +52,7 @@ const InputMaskElement = React__default.forwardRef(
         onChangeValue(value);
       }
     }, [value]);
-    return /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ jsx(
       StyledInputElement,
       {
         ...rest,

package/dist/esm/components/atoms/Input/PressableInputContainer/PressableInputContainer.js

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import InputContainer from '../InputContainer/InputContainer.js';
 import { StyledPressableSurface } from './styled.js';
 
@@ -9,7 +9,7 @@ const PressableInputContainer = ({
   children,
   ...rest
 }) => {
-  return /* @__PURE__ */ React.createElement(StyledPressableSurface, { onPress, disabled, style }, /* @__PURE__ */ React.createElement(InputContainer, { disabled, ...rest }, children));
+  return /* @__PURE__ */ jsx(StyledPressableSurface, { onPress, disabled, style, children: /* @__PURE__ */ jsx(InputContainer, { disabled, ...rest, children }) });
 };
 
 export { PressableInputContainer as default };

package/dist/esm/components/atoms/Paper/Paper.js

@@ -1,10 +1,10 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { StyledPaper } from './styled.js';
 
 const Paper = ({
   children,
   elevated = false,
   ...rest
-}) => /* @__PURE__ */ React__default.createElement(StyledPaper, { ...rest, elevated }, children);
+}) => /* @__PURE__ */ jsx(StyledPaper, { ...rest, elevated, children });
 
 export { Paper as default };

package/dist/esm/components/atoms/PressableSurface/PressableSurface.js

@@ -1,8 +1,9 @@
+import { jsx } from 'react/jsx-runtime';
 import { useTheme } from '@emotion/react';
-import React__default from 'react';
 import { Pressable } from 'react-native';
 import '../Text/styled.js';
 import '../Input/styled.js';
+import 'react';
 import 'currency.js';
 import '../Input/InputElement/InputElement.js';
 import '../Input/InputMaskElement/InputMaskElement.js';
@@ -31,7 +32,7 @@ const PressableSurface = ({
     effectBaseColor,
     bgColor
   );
-  return /* @__PURE__ */ React__default.createElement(Pressable, { ...rest, style: readyStyle }, children);
+  return /* @__PURE__ */ jsx(Pressable, { ...rest, style: readyStyle, children });
 };
 const prepareStyle = (props, effectColor, bgColor) => {
   const {

package/dist/esm/components/atoms/ProgressBar/ProgressBar.js

@@ -1,8 +1,9 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { useTheme } from '@emotion/react';
 import { extractNumbersFromString } from '../../../utils/extractNumbersFromString.js';
 import '../Text/styled.js';
 import '../Input/styled.js';
+import 'react';
 import 'currency.js';
 import '../Input/InputElement/InputElement.js';
 import '../Input/InputMaskElement/InputMaskElement.js';
@@ -31,27 +32,27 @@ const ProgressBar = ({
     const minmax = (totalProgress - min) / (max - min);
     const width = (minmax > 1 ? 1 : minmax < 0 ? 0 : minmax) * 100;
     const progressPercent = `${width}%`;
-    return /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ jsx(
       Segment,
       {
-        key: index,
         style: {
           borderRightWidth: index == segments - 1 ? 0 : 2
-        }
-      },
-      /* @__PURE__ */ React__default.createElement(
-        Progress,
-        {
-          style: {
-            width: progressPercent,
-            backgroundColor: theme.color[color][colorTone],
-            borderRightWidth: width > 0 && width < 100 ? 2 : 0
+        },
+        children: /* @__PURE__ */ jsx(
+          Progress,
+          {
+            style: {
+              width: progressPercent,
+              backgroundColor: theme.color[color][colorTone],
+              borderRightWidth: width > 0 && width < 100 ? 2 : 0
+            }
           }
-        }
-      )
+        )
+      },
+      index
     );
   });
-  return /* @__PURE__ */ React__default.createElement(Container, { ...rest }, segmentsRender);
+  return /* @__PURE__ */ jsx(Container, { ...rest, children: segmentsRender });
 };
 
 export { ProgressBar as default };

package/dist/esm/components/atoms/ProgressBar/styled.js

@@ -1,7 +1,8 @@
 import styled from '@emotion/native';
-import 'react';
+import 'react/jsx-runtime';
 import '../Text/styled.js';
 import '../Input/styled.js';
+import 'react';
 import 'currency.js';
 import '../Input/InputElement/InputElement.js';
 import '../Input/InputMaskElement/InputMaskElement.js';

package/dist/esm/components/atoms/RadioButton/RadioButton.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { Pressable } from 'react-native';
 import Icon from '../Icon/Icon.js';
 import { ViewStyled, IconViewStyled, IconWrapper, ScaledView } from './styled.js';
@@ -16,32 +16,37 @@ const RadioButton = ({
   const handleChange = () => {
     onChange?.(!checked);
   };
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     Pressable,
     {
       ...rest,
       disabled,
       onPress: handleChange,
-      accessibilityRole: "radio"
-    },
-    /* @__PURE__ */ React__default.createElement(ViewStyled, null, labelPosition === "left" && children, checked && /* @__PURE__ */ React__default.createElement(IconViewStyled, null, /* @__PURE__ */ React__default.createElement(IconWrapper, null, /* @__PURE__ */ React__default.createElement(ScaledView, null, /* @__PURE__ */ React__default.createElement(
-      Icon,
-      {
-        name: "circle",
-        colorVariant: color,
-        colorTone,
-        type: "material-community",
-        size: "centi"
-      }
-    )))), !checked && /* @__PURE__ */ React__default.createElement(IconViewStyled, null, /* @__PURE__ */ React__default.createElement(IconWrapper, null, /* @__PURE__ */ React__default.createElement(ScaledView, null, /* @__PURE__ */ React__default.createElement(
-      Icon,
-      {
-        name: "circle",
-        fontColor: "light",
-        type: "material-community",
-        size: "centi"
-      }
-    )))), labelPosition === "right" && children)
+      accessibilityRole: "radio",
+      children: /* @__PURE__ */ jsxs(ViewStyled, { children: [
+        labelPosition === "left" && children,
+        checked && /* @__PURE__ */ jsx(IconViewStyled, { children: /* @__PURE__ */ jsx(IconWrapper, { children: /* @__PURE__ */ jsx(ScaledView, { children: /* @__PURE__ */ jsx(
+          Icon,
+          {
+            name: "circle",
+            colorVariant: color,
+            colorTone,
+            type: "material-community",
+            size: "centi"
+          }
+        ) }) }) }),
+        !checked && /* @__PURE__ */ jsx(IconViewStyled, { children: /* @__PURE__ */ jsx(IconWrapper, { children: /* @__PURE__ */ jsx(ScaledView, { children: /* @__PURE__ */ jsx(
+          Icon,
+          {
+            name: "circle",
+            fontColor: "light",
+            type: "material-community",
+            size: "centi"
+          }
+        ) }) }) }),
+        labelPosition === "right" && children
+      ] })
+    }
   );
 };
 

package/dist/esm/components/atoms/Switch/Switch.js

@@ -1,3 +1,4 @@
+import { jsx } from 'react/jsx-runtime';
 import { useTheme } from '@emotion/react';
 import React__default, { useEffect, useCallback } from 'react';
 import { Animated } from 'react-native';
@@ -57,27 +58,27 @@ const Switch = ({
     const translate = calculateTranslate();
     transitionSwitch(active, translate, transitionValue, animatedColor);
   };
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     PressableSurface,
     {
       ...rest,
       onPress: handleChange,
       effect: "none",
-      disabled
-    },
-    /* @__PURE__ */ React__default.createElement(
-      StyledSwitchContent,
-      {
-        onLayout: handleSwitchLayout,
-        style: { backgroundColor: interpolateColor }
-      },
-      /* @__PURE__ */ React__default.createElement(
-        StyledSwitch,
+      disabled,
+      children: /* @__PURE__ */ jsx(
+        StyledSwitchContent,
         {
-          style: [dotStyle, { transform: [{ translateX: transitionValue }] }]
+          onLayout: handleSwitchLayout,
+          style: { backgroundColor: interpolateColor },
+          children: /* @__PURE__ */ jsx(
+            StyledSwitch,
+            {
+              style: [dotStyle, { transform: [{ translateX: transitionValue }] }]
+            }
+          )
         }
       )
-    )
+    }
   );
 };
 

package/dist/esm/components/atoms/Switch/styled.js

@@ -1,8 +1,9 @@
 import styled from '@emotion/native';
 import { Animated } from 'react-native';
-import 'react';
+import 'react/jsx-runtime';
 import '../Text/styled.js';
 import '../Input/styled.js';
+import 'react';
 import 'currency.js';
 import '../Input/InputElement/InputElement.js';
 import '../Input/InputMaskElement/InputMaskElement.js';

package/dist/esm/components/atoms/Tag/Tag.js

@@ -1,3 +1,4 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
 import React__default, { useState, useCallback } from 'react';
 import { Animated } from 'react-native';
 import PressableSurface from '../PressableSurface/PressableSurface.js';
@@ -29,7 +30,7 @@ const Tag = ({
     fadeOut();
     setTimeout(() => setDismiss(true), duration);
   }, [onDismiss]);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsxs(
     StyledTagContainer,
     {
       backgroundColorTone,
@@ -37,26 +38,28 @@ const Tag = ({
       variant,
       style: [{ opacity: fadeAnim }, style],
       visible: !dismiss,
-      ...rest
-    },
-    icon && /* @__PURE__ */ React__default.createElement(
-      StyledLeftIcon,
-      {
-        size: icon.size || "micro",
-        colorVariant: icon.colorVariant || "primary",
-        ...icon
-      }
-    ),
-    value,
-    canDismiss && /* @__PURE__ */ React__default.createElement(PressableSurface, { onPress: handleDismiss }, /* @__PURE__ */ React__default.createElement(
-      StyledCloseIcon,
-      {
-        name: "close-outline",
-        type: "ionicon",
-        size: "centi",
-        fontColor: "medium"
-      }
-    ))
+      ...rest,
+      children: [
+        icon && /* @__PURE__ */ jsx(
+          StyledLeftIcon,
+          {
+            size: icon.size || "micro",
+            colorVariant: icon.colorVariant || "primary",
+            ...icon
+          }
+        ),
+        value,
+        canDismiss && /* @__PURE__ */ jsx(PressableSurface, { onPress: handleDismiss, children: /* @__PURE__ */ jsx(
+          StyledCloseIcon,
+          {
+            name: "close-outline",
+            type: "ionicon",
+            size: "centi",
+            fontColor: "medium"
+          }
+        ) })
+      ]
+    }
   );
 };
 

package/dist/esm/components/atoms/Text/Text.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { StyledColoredText } from './styled.js';
 import { getLabel } from './functions.js';
 
@@ -16,7 +16,7 @@ const Text = ({
   capitalFirst = false,
   ...rest
 }) => {
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     StyledColoredText,
     {
       ...rest,
@@ -28,9 +28,9 @@ const Text = ({
       typography,
       numberOfLines,
       ellipsizeMode,
-      textTransform
-    },
-    getLabel(children, capitalFirst)
+      textTransform,
+      children: getLabel(children, capitalFirst)
+    }
   );
 };
 

package/dist/esm/components/molecules/Calendar/Calendar.js

@@ -1,3 +1,4 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { set, getWeeksInMonth, add, format } from 'date-fns';
 import * as React from 'react';
 import { useRef } from 'react';
@@ -84,84 +85,93 @@ function Calendar({
     },
     [referenceDate]
   );
-  return /* @__PURE__ */ React.createElement(View, { ...rest }, /* @__PURE__ */ React.createElement(TitleContainer, null, /* @__PURE__ */ React.createElement(
-    Control,
-    {
-      onPress: handlePressPrev,
-      align: "start",
-      disabled: showSelectYear,
-      isLeft: true
-    },
-    /* @__PURE__ */ React.createElement(
-      Icon,
+  return /* @__PURE__ */ jsxs(View, { ...rest, children: [
+    /* @__PURE__ */ jsxs(TitleContainer, { children: [
+      /* @__PURE__ */ jsx(
+        Control,
+        {
+          onPress: handlePressPrev,
+          align: "start",
+          disabled: showSelectYear,
+          isLeft: true,
+          children: /* @__PURE__ */ jsx(
+            Icon,
+            {
+              name: "chevron-left",
+              type: "material-community",
+              size: "kilo",
+              colorVariant: "secondary",
+              colorTone: "medium"
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(TouchableOpacity, { onPress: handlePressSelectYear, children: /* @__PURE__ */ jsx(
+        Capitalized,
+        {
+          colorVariant: "secondary",
+          colorTone: "xdark",
+          fontWeight: "bold",
+          children: format(referenceDate, "MMMM yyyy", { locale })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        Control,
+        {
+          onPress: handlePressNext,
+          align: "end",
+          disabled: showSelectYear,
+          isRight: true,
+          children: /* @__PURE__ */ jsx(
+            Icon,
+            {
+              name: "chevron-right",
+              type: "material-community",
+              size: "kilo",
+              colorVariant: "secondary",
+              colorTone: "medium"
+            }
+          )
+        }
+      )
+    ] }),
+    showSelectYear ? /* @__PURE__ */ jsx(Content, { height: calendarHeightRef.current, children: /* @__PURE__ */ jsx(
+      SelectYear,
       {
-        name: "chevron-left",
-        type: "material-community",
-        size: "kilo",
-        colorVariant: "secondary",
-        colorTone: "medium"
+        currentYear: referenceDate.getFullYear(),
+        onSelectYear: handleSelectYear,
+        TextComponent,
+        ...selectYearProps
       }
-    )
-  ), /* @__PURE__ */ React.createElement(TouchableOpacity, { onPress: handlePressSelectYear }, /* @__PURE__ */ React.createElement(
-    Capitalized,
-    {
-      colorVariant: "secondary",
-      colorTone: "xdark",
-      fontWeight: "bold"
-    },
-    format(referenceDate, "MMMM yyyy", { locale })
-  )), /* @__PURE__ */ React.createElement(
-    Control,
-    {
-      onPress: handlePressNext,
-      align: "end",
-      disabled: showSelectYear,
-      isRight: true
-    },
-    /* @__PURE__ */ React.createElement(
-      Icon,
+    ) }) : /* @__PURE__ */ jsxs(
+      Content,
       {
-        name: "chevron-right",
-        type: "material-community",
-        size: "kilo",
-        colorVariant: "secondary",
-        colorTone: "medium"
+        onLayout: (e) => calendarHeightRef.current = e.nativeEvent.layout.height,
+        children: [
+          /* @__PURE__ */ jsx(
+            Weekdays,
+            {
+              locale,
+              calendar,
+              Capitalized
+            }
+          ),
+          calendar.map((week, index) => /* @__PURE__ */ jsx(
+            MonthWeek,
+            {
+              week,
+              type,
+              value,
+              onChange,
+              TextComponent,
+              referenceDate
+            },
+            `week-${index}`
+          ))
+        ]
       }
     )
-  )), showSelectYear ? /* @__PURE__ */ React.createElement(Content, { height: calendarHeightRef.current }, /* @__PURE__ */ React.createElement(
-    SelectYear,
-    {
-      currentYear: referenceDate.getFullYear(),
-      onSelectYear: handleSelectYear,
-      TextComponent,
-      ...selectYearProps
-    }
-  )) : /* @__PURE__ */ React.createElement(
-    Content,
-    {
-      onLayout: (e) => calendarHeightRef.current = e.nativeEvent.layout.height
-    },
-    /* @__PURE__ */ React.createElement(
-      Weekdays,
-      {
-        locale,
-        calendar,
-        Capitalized
-      }
-    ),
-    calendar.map((week, index) => /* @__PURE__ */ React.createElement(
-      MonthWeek,
-      {
-        week,
-        type,
-        value,
-        key: `week-${index}`,
-        onChange,
-        TextComponent,
-        referenceDate
-      }
-    ))
-  ));
+  ] });
 }
 
 export { Calendar as default };