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

package/dist/cjs/components/molecules/LabeledSwitch/LabeledSwitch.js

@@ -1,7 +1,7 @@
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var reactCore = require('@tecsinapse/react-core');
-var React = require('react');
 var LabelComponent = require('./LabelComponent.js');
 var styled = require('./styled.js');
 
@@ -15,37 +15,41 @@ const LabeledSwitch = ({
   onChange,
   ...rest
 }) => {
-  return /* @__PURE__ */ React.createElement(styled.StyledView, null, leftLabel ? /* @__PURE__ */ React.createElement(
-    LabelComponent,
-    {
-      active,
-      label: leftLabel,
-      labelPosition: "left",
-      labelProps,
-      disabled: !pressableLabel || disabled,
-      switchDisabled: disabled,
-      onPress: () => onChange(!active)
-    }
-  ) : /* @__PURE__ */ React.createElement(React.Fragment, null), /* @__PURE__ */ React.createElement(
-    reactCore.Switch,
-    {
-      active,
-      onChange,
-      disabled,
-      ...rest
-    }
-  ), rightLabel ? /* @__PURE__ */ React.createElement(
-    LabelComponent,
-    {
-      active,
-      label: rightLabel,
-      labelPosition: "right",
-      labelProps,
-      disabled: !pressableLabel || disabled,
-      switchDisabled: disabled,
-      onPress: () => onChange(!active)
-    }
-  ) : /* @__PURE__ */ React.createElement(React.Fragment, null));
+  return /* @__PURE__ */ jsxRuntime.jsxs(styled.StyledView, { children: [
+    leftLabel ? /* @__PURE__ */ jsxRuntime.jsx(
+      LabelComponent,
+      {
+        active,
+        label: leftLabel,
+        labelPosition: "left",
+        labelProps,
+        disabled: !pressableLabel || disabled,
+        switchDisabled: disabled,
+        onPress: () => onChange(!active)
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      reactCore.Switch,
+      {
+        active,
+        onChange,
+        disabled,
+        ...rest
+      }
+    ),
+    rightLabel ? /* @__PURE__ */ jsxRuntime.jsx(
+      LabelComponent,
+      {
+        active,
+        label: rightLabel,
+        labelPosition: "right",
+        labelProps,
+        disabled: !pressableLabel || disabled,
+        switchDisabled: disabled,
+        onPress: () => onChange(!active)
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {})
+  ] });
 };
 
 module.exports = LabeledSwitch;

package/dist/cjs/components/molecules/ScrollableSelector/ScrollableSelector.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var reactNative = require('react-native');
 var Text = require('../../atoms/Text/Text.js');
@@ -101,32 +102,41 @@ const ScrollableSelector = ({
       }
     });
   }, [format, date, months, years, hour, minutes]);
-  return /* @__PURE__ */ React.createElement(reactNative.View, { style: { flexDirection: "column", width: "100%" } }, /* @__PURE__ */ React.createElement(styled.BlockLabels, null, format === "MM-yyyy" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TextComponent, null, monthLabel), /* @__PURE__ */ React.createElement(TextComponent, null, yearLabel)) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TextComponent, null, hourLabel), /* @__PURE__ */ React.createElement(TextComponent, null, minuteLabel))), /* @__PURE__ */ React.createElement(
-    reactNative.View,
-    {
-      style: [styles.picker, { height: pickerHeight, width: pickerWidth }]
-    },
-    getOrder().map((el, index) => {
-      return /* @__PURE__ */ React.createElement(
-        DateBlock,
-        {
-          date: value ?? /* @__PURE__ */ new Date(),
-          digits: el.digits,
-          value: el.value,
-          onChange: changeHandle,
-          height: pickerHeight,
-          fontSize: fontSize ?? 22,
-          textColor,
-          markColor,
-          markHeight,
-          markWidth: markWidth ?? 70,
-          type: el.name,
-          key: index,
-          locale
-        }
-      );
-    })
-  ));
+  return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: { flexDirection: "column", width: "100%" }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(styled.BlockLabels, { children: format === "MM-yyyy" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(TextComponent, { children: monthLabel }),
+      /* @__PURE__ */ jsxRuntime.jsx(TextComponent, { children: yearLabel })
+    ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(TextComponent, { children: hourLabel }),
+      /* @__PURE__ */ jsxRuntime.jsx(TextComponent, { children: minuteLabel })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      reactNative.View,
+      {
+        style: [styles.picker, { height: pickerHeight, width: pickerWidth }],
+        children: getOrder().map((el, index) => {
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            DateBlock,
+            {
+              date: value ?? /* @__PURE__ */ new Date(),
+              digits: el.digits,
+              value: el.value,
+              onChange: changeHandle,
+              height: pickerHeight,
+              fontSize: fontSize ?? 22,
+              textColor,
+              markColor,
+              markHeight,
+              markWidth: markWidth ?? 70,
+              type: el.name,
+              locale
+            },
+            index
+          );
+        })
+      }
+    )
+  ] });
 };
 const styles = reactNative.StyleSheet.create({
   picker: {

package/dist/cjs/components/molecules/ScrollableSelector/components/DateBlock.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var reactNative = require('react-native');
 var styled = require('../styled.js');
@@ -44,54 +45,57 @@ const DateBlock = ({
       return value2.toString().padStart(2, "0");
     }
   };
-  return /* @__PURE__ */ React.createElement(styled.Block, null, /* @__PURE__ */ React.createElement(
-    styled.Mark,
-    {
-      markTop: (height - mHeight) / 2,
-      markColor: markColor ?? "rgba(0, 0, 0, 0.05)",
-      markHeight: 24,
-      markWidth: mWidth
-    }
-  ), /* @__PURE__ */ React.createElement(
-    styled.StyledScrollView,
-    {
-      ref: scrollRef,
-      snapToOffsets: offsets,
-      decelerationRate: "fast",
-      showsVerticalScrollIndicator: false,
-      scrollEventThrottle: 0,
-      onMomentumScrollEnd: handleMomentumScrollEnd,
-      fadingEdgeLength: 300
-    },
-    digits.map((value2, index) => {
-      return /* @__PURE__ */ React.createElement(
-        reactNative.TouchableOpacity,
-        {
-          key: index,
-          onPress: () => {
-            onChange(type, digits[index]);
-            snapScrollToIndex(index);
-          }
-        },
-        /* @__PURE__ */ React.createElement(
-          TextComponent,
-          {
-            style: {
-              textAlign: "center",
-              fontSize: fontSize || 22,
-              color: textColor || "#000000",
-              marginBottom: index === digits.length - 1 ? height / 2 - dHeight / 2 : 0,
-              marginTop: index === 0 ? height / 2 - dHeight / 2 : 0,
-              lineHeight: dHeight,
-              height: dHeight,
-              textTransform: "capitalize"
-            }
-          },
-          getDisplayedValue(type)(value2)
-        )
-      );
-    })
-  ));
+  return /* @__PURE__ */ jsxRuntime.jsxs(styled.Block, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      styled.Mark,
+      {
+        markTop: (height - mHeight) / 2,
+        markColor: markColor ?? "rgba(0, 0, 0, 0.05)",
+        markHeight: 24,
+        markWidth: mWidth
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      styled.StyledScrollView,
+      {
+        ref: scrollRef,
+        snapToOffsets: offsets,
+        decelerationRate: "fast",
+        showsVerticalScrollIndicator: false,
+        scrollEventThrottle: 0,
+        onMomentumScrollEnd: handleMomentumScrollEnd,
+        fadingEdgeLength: 300,
+        children: digits.map((value2, index) => {
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            reactNative.TouchableOpacity,
+            {
+              onPress: () => {
+                onChange(type, digits[index]);
+                snapScrollToIndex(index);
+              },
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                TextComponent,
+                {
+                  style: {
+                    textAlign: "center",
+                    fontSize: fontSize || 22,
+                    color: textColor || "#000000",
+                    marginBottom: index === digits.length - 1 ? height / 2 - dHeight / 2 : 0,
+                    marginTop: index === 0 ? height / 2 - dHeight / 2 : 0,
+                    lineHeight: dHeight,
+                    height: dHeight,
+                    textTransform: "capitalize"
+                  },
+                  children: getDisplayedValue(type)(value2)
+                }
+              )
+            },
+            index
+          );
+        })
+      }
+    )
+  ] });
 };
 
 module.exports = DateBlock;

package/dist/cjs/components/molecules/Select/Select.js

@@ -1,7 +1,7 @@
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var reactCore = require('@tecsinapse/react-core');
-var React = require('react');
 var Text = require('../../atoms/Text/Text.js');
 var Modal = require('./components/Modal.js');
 var styled = require('./styled.js');
@@ -43,7 +43,7 @@ function Select(props) {
     ...rest
   } = useSelect(props);
   modal.sync(
-    /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ jsxRuntime.jsx(
       Modal.Modal,
       {
         options: selectOptions ?? [],
@@ -71,7 +71,7 @@ function Select(props) {
       }
     )
   );
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, controlComponent ? controlComponent(handlePressInput, getDisplayValue() ?? "") : /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: controlComponent ? controlComponent(handlePressInput, getDisplayValue() ?? "") : /* @__PURE__ */ jsxRuntime.jsx(
     reactCore.HintInputContainer,
     {
       ...rest,
@@ -84,18 +84,21 @@ function Select(props) {
       hint,
       hintComponent,
       label: _label,
-      rightComponent: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(styled.SelectIcon, { name: "chevron-down", type: "ionicon", size: "centi" }), rightComponent)
-    },
-    /* @__PURE__ */ React.createElement(
-      styled.StyledSelectionText,
-      {
-        numberOfLines,
-        fontWeight: "bold",
-        disabled
-      },
-      getDisplayValue() ?? " "
-    )
-  ));
+      rightComponent: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(styled.SelectIcon, { name: "chevron-down", type: "ionicon", size: "centi" }),
+        rightComponent
+      ] }),
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        styled.StyledSelectionText,
+        {
+          numberOfLines,
+          fontWeight: "bold",
+          disabled,
+          children: getDisplayValue() ?? " "
+        }
+      )
+    }
+  ) });
 }
 
 module.exports = Select;

package/dist/cjs/components/molecules/Select/components/Flat.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var styled = require('../styled.js');
 var reactNative = require('react-native');
@@ -14,7 +15,7 @@ const Flat = ({
     () => typeof options !== "function" ? getData(options) : [],
     [options, getData]
   );
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     reactNative.FlatList,
     {
       data,

package/dist/cjs/components/molecules/Select/components/Modal.js

@@ -1,11 +1,12 @@
 'use strict';
 
-var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
 var Button = require('../../../atoms/Button/Button.js');
 var reactCore = require('@tecsinapse/react-core');
 var Text = require('../../../atoms/Text/Text.js');
 var Header = require('../../../atoms/Header/Header.js');
 var Input = require('../../../atoms/Input/Input.js');
+require('react');
 require('react-native');
 var BaseModalView = require('../../../atoms/Modal/ui/BaseModalView.js');
 var styled = require('../styled.js');
@@ -13,15 +14,15 @@ var Section = require('./Section.js');
 var Flat = require('./Flat.js');
 var useModal = require('../hooks/useModal.js');
 
-const ModalTitle = ({ title }) => title ? /* @__PURE__ */ React.createElement(
+const ModalTitle = ({ title }) => title ? /* @__PURE__ */ jsxRuntime.jsx(
   styled.TextTitleModal,
   {
     typography: "h4",
     fontWeight: "bold",
     numberOfLines: 3,
-    style: { maxWidth: reactCore.RFValue(250) }
-  },
-  title
+    style: { maxWidth: reactCore.RFValue(250) },
+    children: title
+  }
 ) : null;
 const Component = (props) => {
   const {
@@ -44,54 +45,60 @@ const Component = (props) => {
     groupLabelExtractor,
     ...others
   } = useModal(props);
-  return /* @__PURE__ */ React.createElement(BaseModalView.ModalView, { ...others, BoxComponent: ModalComponent, showCloseBar: false }, /* @__PURE__ */ React.createElement(
-    Header,
-    {
-      rightButton: {
-        onPress: close,
-        icon: {
-          name: "close",
-          type: "material-community",
-          fontColor: "light"
-        }
+  return /* @__PURE__ */ jsxRuntime.jsxs(BaseModalView.ModalView, { ...others, BoxComponent: ModalComponent, showCloseBar: false, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Header,
+      {
+        rightButton: {
+          onPress: close,
+          icon: {
+            name: "close",
+            type: "material-community",
+            fontColor: "light"
+          }
+        },
+        children: selectModalTitleComponent ? selectModalTitleComponent : /* @__PURE__ */ jsxRuntime.jsx(ModalTitle, { title: selectModalTitle })
       }
-    },
-    selectModalTitleComponent ? selectModalTitleComponent : /* @__PURE__ */ React.createElement(ModalTitle, { title: selectModalTitle })
-  ), !hideSearchBar ? /* @__PURE__ */ React.createElement(styled.SearchBarContainer, null, /* @__PURE__ */ React.createElement(
-    Input,
-    {
-      placeholder: searchBarPlaceholder,
-      value: searchArg,
-      onChange: setSearchArg,
-      leftComponent: /* @__PURE__ */ React.createElement(styled.SelectIcon, { name: "search", type: "ionicon", size: "centi" })
-    }
-  )) : null, loading ? /* @__PURE__ */ React.createElement(styled.FetchIndicator, { animating: true, color: "grey", size: "large" }) : null, options instanceof Map ? /* @__PURE__ */ React.createElement(
-    Section,
-    {
-      options,
-      getData,
-      renderItem,
-      keyExtractor,
-      groupLabelExtractor
-    }
-  ) : /* @__PURE__ */ React.createElement(
-    Flat,
-    {
-      renderItem,
-      getData,
-      options,
-      keyExtractor
-    }
-  ), !closeOnPick ? /* @__PURE__ */ React.createElement(styled.ModalFooter, null, /* @__PURE__ */ React.createElement(
-    Button.Button,
-    {
-      variant: "filled",
-      color: "primary",
-      onPress: handleConfirm,
-      disabled: loading
-    },
-    /* @__PURE__ */ React.createElement(Text, { fontColor: "light", fontWeight: "bold" }, confirmButtonText)
-  )) : null);
+    ),
+    !hideSearchBar ? /* @__PURE__ */ jsxRuntime.jsx(styled.SearchBarContainer, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      Input,
+      {
+        placeholder: searchBarPlaceholder,
+        value: searchArg,
+        onChange: setSearchArg,
+        leftComponent: /* @__PURE__ */ jsxRuntime.jsx(styled.SelectIcon, { name: "search", type: "ionicon", size: "centi" })
+      }
+    ) }) : null,
+    loading ? /* @__PURE__ */ jsxRuntime.jsx(styled.FetchIndicator, { animating: true, color: "grey", size: "large" }) : null,
+    options instanceof Map ? /* @__PURE__ */ jsxRuntime.jsx(
+      Section,
+      {
+        options,
+        getData,
+        renderItem,
+        keyExtractor,
+        groupLabelExtractor
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsx(
+      Flat,
+      {
+        renderItem,
+        getData,
+        options,
+        keyExtractor
+      }
+    ),
+    !closeOnPick ? /* @__PURE__ */ jsxRuntime.jsx(styled.ModalFooter, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      Button.Button,
+      {
+        variant: "filled",
+        color: "primary",
+        onPress: handleConfirm,
+        disabled: loading,
+        children: /* @__PURE__ */ jsxRuntime.jsx(Text, { fontColor: "light", fontWeight: "bold", children: confirmButtonText })
+      }
+    ) }) : null
+  ] });
 };
 const Modal = Component;
 

package/dist/cjs/components/molecules/Select/components/Option.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
 var styled = require('../styled.js');
 var reactNative = require('react-native');
 var reactCore = require('@tecsinapse/react-core');
@@ -12,39 +12,39 @@ const Component = ({
   type
 }) => {
   const label = labelExtractor(item);
-  return /* @__PURE__ */ React.createElement(styled.ListItem, { onPress: () => handlePressItem(item) }, /* @__PURE__ */ React.createElement(reactNative.View, { pointerEvents: "none" }, type === "multi" ? /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxRuntime.jsx(styled.ListItem, { onPress: () => handlePressItem(item), children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { pointerEvents: "none", children: type === "multi" ? /* @__PURE__ */ jsxRuntime.jsx(
     reactCore.Checkbox,
     {
       color: "primary",
       labelPosition: "right",
-      checked: item._checked
-    },
-    /* @__PURE__ */ React.createElement(
-      styled.StyledTextItemSelect,
-      {
-        fontWeight: item._checked ? "bold" : "regular",
-        ellipsizeMode: "tail",
-        numberOfLines: 1
-      },
-      label
-    )
-  ) : /* @__PURE__ */ React.createElement(
+      checked: item._checked,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        styled.StyledTextItemSelect,
+        {
+          fontWeight: item._checked ? "bold" : "regular",
+          ellipsizeMode: "tail",
+          numberOfLines: 1,
+          children: label
+        }
+      )
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(
     reactCore.RadioButton,
     {
       color: "primary",
       labelPosition: "right",
-      checked: item._checked
-    },
-    /* @__PURE__ */ React.createElement(
-      styled.StyledTextItemSelect,
-      {
-        fontWeight: item._checked ? "bold" : "regular",
-        ellipsizeMode: "tail",
-        numberOfLines: 1
-      },
-      label
-    )
-  )));
+      checked: item._checked,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        styled.StyledTextItemSelect,
+        {
+          fontWeight: item._checked ? "bold" : "regular",
+          ellipsizeMode: "tail",
+          numberOfLines: 1,
+          children: label
+        }
+      )
+    }
+  ) }) });
 };
 
 module.exports = Component;

package/dist/cjs/components/molecules/Select/components/Section.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var styled = require('../styled.js');
 var reactNative = require('react-native');
@@ -8,7 +9,7 @@ var Text = require('../../../atoms/Text/Text.js');
 const SectionHead = ({
   title,
   groupLabelExtractor
-}) => /* @__PURE__ */ React.createElement(styled.SectionHeader, null, /* @__PURE__ */ React.createElement(Text, { fontWeight: "bold" }, groupLabelExtractor ? groupLabelExtractor(title) : title));
+}) => /* @__PURE__ */ jsxRuntime.jsx(styled.SectionHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(Text, { fontWeight: "bold", children: groupLabelExtractor ? groupLabelExtractor(title) : title }) });
 const Section = ({
   options,
   renderItem,
@@ -23,13 +24,13 @@ const Section = ({
     })) : [],
     [options, getData]
   );
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     reactNative.SectionList,
     {
       sections: sectionList,
       renderItem,
       ItemSeparatorComponent: styled.Divider,
-      renderSectionHeader: ({ section: { title } }) => /* @__PURE__ */ React.createElement(SectionHead, { title, groupLabelExtractor }),
+      renderSectionHeader: ({ section: { title } }) => /* @__PURE__ */ jsxRuntime.jsx(SectionHead, { title, groupLabelExtractor }),
       keyExtractor
     }
   );

package/dist/cjs/components/molecules/Select/hooks/useModal.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var styled = require('../styled.js');
 var Option = require('../components/Option.js');
@@ -67,7 +68,7 @@ const useModal = ({
     close?.();
   }, [selectedValues]);
   const renderItem = React.useCallback(
-    ({ item }) => /* @__PURE__ */ React.createElement(
+    ({ item }) => /* @__PURE__ */ jsxRuntime.jsx(
       Option,
       {
         item,

package/dist/cjs/components/molecules/Select/hooks/useSelect.js

@@ -1,6 +1,7 @@
 'use strict';
 
 var React = require('react');
+require('react/jsx-runtime');
 require('react-native');
 var reactCore = require('@tecsinapse/react-core');
 require('react-native-safe-area-context');

package/dist/cjs/components/molecules/Snackbar/Snackbar.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
 var Text = require('../../atoms/Text/Text.js');
 var styled = require('./styled.js');
 
@@ -9,7 +9,7 @@ const Snackbar = ({
   textProps = { colorVariant: "primary", colorTone: "medium" },
   ...rest
 }) => {
-  return /* @__PURE__ */ React.createElement(styled.SnackbarStyled, { ...rest }, /* @__PURE__ */ React.createElement(Text, { fontWeight: "bold", typography: "base", ...textProps }, value));
+  return /* @__PURE__ */ jsxRuntime.jsx(styled.SnackbarStyled, { ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(Text, { fontWeight: "bold", typography: "base", ...textProps, children: value }) });
 };
 
 module.exports = Snackbar;