@tecsinapse/react-native-kit 3.5.13 → 3.5.14-beta.0

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

@@ -1,3 +1,4 @@
+import { jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import { Dimensions, ScrollView, View } from 'react-native';
 import { extractNumbersFromString } from '@tecsinapse/react-core';
@@ -22,7 +23,7 @@ const SnappingSlider = ({
     const padCompensation = horizontalPadding * Math.sign(index);
     return offset + padCompensation;
   });
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     ScrollView,
     {
       horizontal: true,
@@ -30,24 +31,24 @@ const SnappingSlider = ({
       snapToStart: true,
       snapToEnd: true,
       showsHorizontalScrollIndicator: false,
-      ...rest
-    },
-    React.Children.map(children, (child, index) => {
-      const isFirst = index === 0;
-      const isLast = index === childCount - 1;
-      return /* @__PURE__ */ React.createElement(
-        View,
-        {
-          style: {
-            width: totalSlideWidth,
-            paddingHorizontal: horizontalPadding,
-            paddingLeft: isFirst ? 0 : horizontalPadding,
-            paddingRight: isLast ? 0 : horizontalPadding
+      ...rest,
+      children: React.Children.map(children, (child, index) => {
+        const isFirst = index === 0;
+        const isLast = index === childCount - 1;
+        return /* @__PURE__ */ jsx(
+          View,
+          {
+            style: {
+              width: totalSlideWidth,
+              paddingHorizontal: horizontalPadding,
+              paddingLeft: isFirst ? 0 : horizontalPadding,
+              paddingRight: isLast ? 0 : horizontalPadding
+            },
+            children: child
           }
-        },
-        child
-      );
-    })
+        );
+      })
+    }
   );
 };
 

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

@@ -1,21 +1,21 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { Tag as Tag$1 } from '@tecsinapse/react-core';
 import Text from '../Text/Text.js';
 
 const Tag = ({ value, ...rest }) => {
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     Tag$1,
     {
-      value: /* @__PURE__ */ React__default.createElement(
+      value: /* @__PURE__ */ jsx(
         Text,
         {
           colorVariant: "secondary",
           colorTone: "dark",
           fontStack: "default",
           fontWeight: "bold",
-          typography: rest.variant === "small" ? "sub" : "base"
-        },
-        value
+          typography: rest.variant === "small" ? "sub" : "base",
+          children: value
+        }
       ),
       ...rest
     }

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

@@ -1,8 +1,8 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { StyledNativeText } from './styled.js';
 
 const Text = ({ children, ...rest }) => {
-  return /* @__PURE__ */ React__default.createElement(StyledNativeText, { ...rest }, children);
+  return /* @__PURE__ */ jsx(StyledNativeText, { ...rest, children });
 };
 
 export { Text as default };

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

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { useInputFocus, TextArea as TextArea$1 } from '@tecsinapse/react-core';
 import Text from '../Text/Text.js';
 import { StyledNativeInput } from './styled.js';
@@ -34,7 +34,7 @@ const TextArea = ({
     onBlur,
     !disabled
   );
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     TextArea$1,
     {
       label,
@@ -58,23 +58,23 @@ const TextArea = ({
       hint,
       style,
       TextComponent: Text,
-      maxLength
-    },
-    /* @__PURE__ */ React__default.createElement(
-      StyledNativeInput,
-      {
-        ...rest,
-        fontStack: inputFontStack,
-        fontWeight: inputFontWeight,
-        disabled,
-        onFocus: handleFocus,
-        onBlur: handleBlur,
-        textAlignVertical: "top",
-        multiline: true,
-        value,
-        maxLength
-      }
-    )
+      maxLength,
+      children: /* @__PURE__ */ jsx(
+        StyledNativeInput,
+        {
+          ...rest,
+          fontStack: inputFontStack,
+          fontWeight: inputFontWeight,
+          disabled,
+          onFocus: handleFocus,
+          onBlur: handleBlur,
+          textAlignVertical: "top",
+          multiline: true,
+          value,
+          maxLength
+        }
+      )
+    }
   );
 };
 

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

@@ -1,5 +1,5 @@
+import { jsx } from 'react/jsx-runtime';
 import { Calendar as Calendar$1 } from '@tecsinapse/react-core';
-import React__default from 'react';
 import { getLocale } from '../../../utils/date.js';
 import Text from '../../atoms/Text/Text.js';
 
@@ -7,7 +7,7 @@ const Calendar = ({
   locale,
   ...rest
 }) => {
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     Calendar$1,
     {
       ...rest,

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

@@ -1,5 +1,6 @@
+import { jsx } from 'react/jsx-runtime';
 import { DatePicker as DatePicker$1 } from '@tecsinapse/react-core';
-import React__default, { useMemo } from 'react';
+import { useMemo } from 'react';
 import { getLocale } from '../../../utils/date.js';
 import 'react-native';
 import { ModalView } from '../../atoms/Modal/ui/BaseModalView.js';
@@ -42,7 +43,7 @@ const DatePicker = ({
     }
     return void 0;
   }, [value]);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     DatePicker$1,
     {
       ...rest,
@@ -56,12 +57,12 @@ const DatePicker = ({
       onChange: handleChange,
       requestShowCalendar: modal.show,
       requestCloseCalendar: modal.close,
-      renderCalendar: (calendar, blur) => modal.sync(/* @__PURE__ */ React__default.createElement(NativeModal, { onClose: blur }, calendar))
+      renderCalendar: (calendar, blur) => modal.sync(/* @__PURE__ */ jsx(NativeModal, { onClose: blur, children: calendar }))
     }
   );
 };
 const NativeModal = ({ children, ...others }) => {
-  return /* @__PURE__ */ React__default.createElement(ModalView, { BoxComponent: CalendarBoxContent, ...others }, children);
+  return /* @__PURE__ */ jsx(ModalView, { BoxComponent: CalendarBoxContent, ...others, children });
 };
 
 export { DatePicker };

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

@@ -1,6 +1,7 @@
+import { jsx } from 'react/jsx-runtime';
 import { DateTimePicker as DateTimePicker$1, ControlledDateTimeSelector } from '@tecsinapse/react-core';
-import React__default from 'react';
 import { getLocale } from '../../../utils/date.js';
+import 'react';
 import 'react-native';
 import { ModalView } from '../../atoms/Modal/ui/BaseModalView.js';
 import { useLazyModalManager } from '../../atoms/Modal/useLazyModalManager.js';
@@ -12,12 +13,12 @@ const DateTimePicker = ({
   ...rest
 }) => {
   const modal = useLazyModalManager();
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     DateTimePicker$1,
     {
       ...rest,
       TextComponent: Text,
-      DateTimeSelectorComponent: (props) => /* @__PURE__ */ React__default.createElement(
+      DateTimeSelectorComponent: (props) => /* @__PURE__ */ jsx(
         ControlledDateTimeSelector,
         {
           SelectorComponent: DateTimePickerSelector,
@@ -27,12 +28,12 @@ const DateTimePicker = ({
       locale: locale ?? getLocale(),
       requestShowSelector: modal.show,
       requestCloseSelector: modal.close,
-      renderSelector: (selector, blur) => modal.sync(/* @__PURE__ */ React__default.createElement(NativeModal, { onClose: blur }, selector))
+      renderSelector: (selector, blur) => modal.sync(/* @__PURE__ */ jsx(NativeModal, { onClose: blur, children: selector }))
     }
   );
 };
 const NativeModal = ({ children, ...others }) => {
-  return /* @__PURE__ */ React__default.createElement(ModalView, { ...others }, children);
+  return /* @__PURE__ */ jsx(ModalView, { ...others, children });
 };
 
 export { DateTimePicker };

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { Button } from '../../atoms/Button/Button.js';
 import { Icon } from '@tecsinapse/react-core';
 import Text from '../../atoms/Text/Text.js';
@@ -26,44 +26,51 @@ const DateTimePickerSelector = ({
   minuteLabel,
   ...rest
 }) => {
-  return /* @__PURE__ */ React.createElement(Root, { ...rest }, /* @__PURE__ */ React.createElement(Header, null, currentMode === 1 && /* @__PURE__ */ React.createElement(BackButton, { onPress: handlePressBack }, /* @__PURE__ */ React.createElement(
-    Icon,
-    {
-      type: "material-community",
-      name: "chevron-left",
-      size: "mega",
-      colorVariant: "secondary"
-    }
-  )), /* @__PURE__ */ React.createElement(TextComponent, { typography: "base", colorVariant: "secondary" }, modalTitle)), isDate ? /* @__PURE__ */ React.createElement(
-    Calendar,
-    {
-      type: "day",
-      value: date,
-      onChange: handleCalendarChange,
-      year: date.getFullYear(),
-      month: date.getMonth()
-    }
-  ) : isMonth ? /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(
-    ScrollableSelector,
-    {
-      onChange: setDate,
-      value: date,
-      yearLabel,
-      monthLabel,
-      format: "MM-yyyy",
-      locale: locale ?? getLocale()
-    }
-  )) : /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(
-    ScrollableSelector,
-    {
-      onChange: setDate,
-      value: date,
-      hourLabel,
-      minuteLabel,
-      format: "HH-mm",
-      locale: locale ?? getLocale()
-    }
-  )), /* @__PURE__ */ React.createElement(Button, { color: "primary", onPress: handlePressConfirm }, /* @__PURE__ */ React.createElement(TextComponent, { fontWeight: "bold", fontColor: "light" }, confirmButtonText || "OK")));
+  return /* @__PURE__ */ jsxs(Root, { ...rest, children: [
+    /* @__PURE__ */ jsxs(Header, { children: [
+      currentMode === 1 && /* @__PURE__ */ jsx(BackButton, { onPress: handlePressBack, children: /* @__PURE__ */ jsx(
+        Icon,
+        {
+          type: "material-community",
+          name: "chevron-left",
+          size: "mega",
+          colorVariant: "secondary"
+        }
+      ) }),
+      /* @__PURE__ */ jsx(TextComponent, { typography: "base", colorVariant: "secondary", children: modalTitle })
+    ] }),
+    isDate ? /* @__PURE__ */ jsx(
+      Calendar,
+      {
+        type: "day",
+        value: date,
+        onChange: handleCalendarChange,
+        year: date.getFullYear(),
+        month: date.getMonth()
+      }
+    ) : isMonth ? /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsx(
+      ScrollableSelector,
+      {
+        onChange: setDate,
+        value: date,
+        yearLabel,
+        monthLabel,
+        format: "MM-yyyy",
+        locale: locale ?? getLocale()
+      }
+    ) }) : /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsx(
+      ScrollableSelector,
+      {
+        onChange: setDate,
+        value: date,
+        hourLabel,
+        minuteLabel,
+        format: "HH-mm",
+        locale: locale ?? getLocale()
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Button, { color: "primary", onPress: handlePressConfirm, children: /* @__PURE__ */ jsx(TextComponent, { fontWeight: "bold", fontColor: "light", children: confirmButtonText || "OK" }) })
+  ] });
 };
 
 export { DateTimePickerSelector as default };

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

@@ -1,3 +1,4 @@
+import { jsx } from 'react/jsx-runtime';
 import React__default from 'react';
 import { View } from 'react-native';
 import GridItem from './Item/Item.js';
@@ -12,7 +13,7 @@ const Grid = ({
 }) => {
   if (layout) {
     const flatLayout = layout.flat();
-    return /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ jsx(
       View,
       {
         style: [
@@ -23,21 +24,21 @@ const Grid = ({
             flexWrap: "wrap"
           }
         ],
-        ...rest
-      },
-      React__default.Children.map(children, (child, index) => /* @__PURE__ */ React__default.createElement(
-        GridItem,
-        {
-          key: `child-${index}`,
-          columns,
-          span: flatLayout[index],
-          spacing
-        },
-        child
-      ))
+        ...rest,
+        children: React__default.Children.map(children, (child, index) => /* @__PURE__ */ jsx(
+          GridItem,
+          {
+            columns,
+            span: flatLayout[index],
+            spacing,
+            children: child
+          },
+          `child-${index}`
+        ))
+      }
     );
   }
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     View,
     {
       style: [
@@ -48,16 +49,16 @@ const Grid = ({
           flexWrap: "wrap"
         }
       ],
-      ...rest
-    },
-    React__default.Children.map(children, (child, index) => {
-      return React__default.cloneElement(child, {
-        ...child?.props,
-        columns,
-        spacing: child?.props.spacing ?? spacing,
-        key: `child-${index}`
-      });
-    })
+      ...rest,
+      children: React__default.Children.map(children, (child, index) => {
+        return React__default.cloneElement(child, {
+          ...child?.props,
+          columns,
+          spacing: child?.props.spacing ?? spacing,
+          key: `child-${index}`
+        });
+      })
+    }
   );
 };
 

package/dist/esm/components/molecules/Grid/Item/Item.js

@@ -1,3 +1,4 @@
+import { jsx } from 'react/jsx-runtime';
 import React__default from 'react';
 import { View } from 'react-native';
 import { useTheme, getGridItemColumSpan, getGridItemPadding } from '@tecsinapse/react-core';
@@ -49,7 +50,7 @@ const GridItem = ({
     ...children?.props,
     style: wrapper ? children?.props.style : { ..._style, ...children?.props.style }
   });
-  return wrapper ? /* @__PURE__ */ React__default.createElement(View, { ...rest, style: [style, _style] }, clone) : clone;
+  return wrapper ? /* @__PURE__ */ jsx(View, { ...rest, style: [style, _style], children: clone }) : clone;
 };
 
 export { GridItem as default };

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

@@ -1,5 +1,5 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { IconComponent, fontColorVC } from '@tecsinapse/react-core';
-import React__default from 'react';
 import { StyledIconTextButton } from './styled.js';
 import TextComponent from './TextComponent.js';
 
@@ -12,31 +12,35 @@ const IconTextButton = ({
   size = "default",
   ...rest
 }) => {
-  return /* @__PURE__ */ React__default.createElement(StyledIconTextButton, { boxed: !label, variant, ...rest }, iconPosition === "left" ? /* @__PURE__ */ React__default.createElement(
-    IconComponent,
-    {
-      iconProps,
-      size,
-      defaultFontColor: fontColorVC[variant]
-    }
-  ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null), /* @__PURE__ */ React__default.createElement(
-    TextComponent,
-    {
-      label,
-      defaultFontColor: fontColorVC[variant],
-      hasIcon: !!iconProps,
-      iconPosition,
-      textProps,
-      size
-    }
-  ), iconPosition === "right" ? /* @__PURE__ */ React__default.createElement(
-    IconComponent,
-    {
-      iconProps,
-      size,
-      defaultFontColor: fontColorVC[variant]
-    }
-  ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
+  return /* @__PURE__ */ jsxs(StyledIconTextButton, { boxed: !label, variant, ...rest, children: [
+    iconPosition === "left" ? /* @__PURE__ */ jsx(
+      IconComponent,
+      {
+        iconProps,
+        size,
+        defaultFontColor: fontColorVC[variant]
+      }
+    ) : /* @__PURE__ */ jsx(Fragment, {}),
+    /* @__PURE__ */ jsx(
+      TextComponent,
+      {
+        label,
+        defaultFontColor: fontColorVC[variant],
+        hasIcon: !!iconProps,
+        iconPosition,
+        textProps,
+        size
+      }
+    ),
+    iconPosition === "right" ? /* @__PURE__ */ jsx(
+      IconComponent,
+      {
+        iconProps,
+        size,
+        defaultFontColor: fontColorVC[variant]
+      }
+    ) : /* @__PURE__ */ jsx(Fragment, {})
+  ] });
 };
 
 export { IconTextButton as default };

package/dist/esm/components/molecules/IconTextButton/TextComponent.js

@@ -1,3 +1,4 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
 import React__default from 'react';
 import { StyledText } from './styled.js';
 
@@ -9,7 +10,7 @@ const TextComponent = ({
   iconPosition = "left",
   hasIcon = false
 }) => {
-  return label ? /* @__PURE__ */ React__default.createElement(
+  return label ? /* @__PURE__ */ jsx(
     StyledText,
     {
       typography: textProps?.typography ?? size === "small" ? "sub" : "base",
@@ -17,10 +18,10 @@ const TextComponent = ({
       fontColor: textProps?.fontColor ?? defaultFontColor,
       iconPosition,
       hasIcon,
-      ...textProps
-    },
-    label
-  ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null);
+      ...textProps,
+      children: label
+    }
+  ) : /* @__PURE__ */ jsx(Fragment, {});
 };
 var TextComponent$1 = React__default.memo(TextComponent);
 

package/dist/esm/components/molecules/IconTextButton/styled.js

@@ -1,7 +1,7 @@
 import styled, { css } from '@emotion/native';
 import { Button } from '../../atoms/Button/Button.js';
+import 'react/jsx-runtime';
 import '@tecsinapse/react-core';
-import 'react';
 import Text from '../../atoms/Text/Text.js';
 
 const boxedStyle = ({ theme }) => `

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

@@ -1,3 +1,4 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { InputPasswordIcon } from '@tecsinapse/react-core';
 import React__default, { useState } from 'react';
 import Input from '../../atoms/Input/Input.js';
@@ -5,20 +6,23 @@ import Input from '../../atoms/Input/Input.js';
 const InputPassword = React__default.forwardRef(
   ({ rightComponent, ...rest }, ref) => {
     const [revealed, setRevealed] = useState(false);
-    return /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ jsx(
       Input,
       {
         ...rest,
         ref,
         secureTextEntry: !revealed,
-        rightComponent: /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
-          InputPasswordIcon,
-          {
-            onChangeState: setRevealed,
-            revealed,
-            effect: "none"
-          }
-        ), rightComponent)
+        rightComponent: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            InputPasswordIcon,
+            {
+              onChangeState: setRevealed,
+              revealed,
+              effect: "none"
+            }
+          ),
+          rightComponent
+        ] })
       }
     );
   }

package/dist/esm/components/molecules/LabeledSwitch/LabelComponent.js

@@ -1,3 +1,4 @@
+import { jsx } from 'react/jsx-runtime';
 import React__default from 'react';
 import { Pressable } from 'react-native';
 import { StyledLabel } from './styled.js';
@@ -12,16 +13,16 @@ const LabelComponent = ({
 }) => {
   const defaultFontColor = active && !switchDisabled ? "dark" : "medium";
   const defaultFontWeight = active && !switchDisabled ? "bold" : "regular";
-  return /* @__PURE__ */ React__default.createElement(Pressable, { ...rest }, /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(Pressable, { ...rest, children: /* @__PURE__ */ jsx(
     StyledLabel,
     {
       labelPosition,
       fontColor: labelProps?.fontColor ?? defaultFontColor,
       fontWeight: labelProps?.fontWeight ?? defaultFontWeight,
-      ...labelProps
-    },
-    label
-  ));
+      ...labelProps,
+      children: label
+    }
+  ) });
 };
 var LabelComponent$1 = React__default.memo(LabelComponent);