@tecsinapse/react-native-kit 3.5.1 → 3.5.2

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

@@ -9,7 +9,7 @@ var useSelect = require('./hooks/useSelect.js');
 
 function Select(props) {
   const {
-    groupKeyExtractor,
+    groupLabelExtractor,
     onSelect,
     selectModalTitle,
     selectModalTitleComponent,
@@ -46,11 +46,11 @@ function Select(props) {
     /* @__PURE__ */ React.createElement(
       Modal.Modal,
       {
-        options: selectOptions || [],
+        options: selectOptions ?? [],
         focused: true,
         keyExtractor,
         labelExtractor,
-        groupKeyExtractor,
+        groupLabelExtractor,
         searchBarPlaceholder,
         type,
         onSelect,
@@ -71,7 +71,7 @@ function Select(props) {
       }
     )
   );
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, controlComponent ? controlComponent(handlePressInput, getDisplayValue() || "") : /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, controlComponent ? controlComponent(handlePressInput, getDisplayValue() ?? "") : /* @__PURE__ */ React.createElement(
     reactCore.HintInputContainer,
     {
       ...rest,
@@ -93,7 +93,7 @@ function Select(props) {
         fontWeight: "bold",
         disabled
       },
-      getDisplayValue() || " "
+      getDisplayValue() ?? " "
     )
   ));
 }

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

@@ -4,7 +4,12 @@ var React = require('react');
 var styled = require('../styled.js');
 var reactNative = require('react-native');
 
-const Flat = ({ options, keyExtractor, renderItem, getData }) => {
+const Flat = ({
+  options,
+  keyExtractor,
+  renderItem,
+  getData
+}) => {
   const data = React.useMemo(
     () => typeof options !== "function" ? getData(options) : [],
     [options, getData]

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

@@ -41,6 +41,7 @@ const Component = (props) => {
     confirmButtonText,
     handleConfirm,
     close,
+    groupLabelExtractor,
     ...others
   } = useModal(props);
   return /* @__PURE__ */ React.createElement(BaseModalView.ModalView, { ...others, BoxComponent: ModalComponent, showCloseBar: false }, /* @__PURE__ */ React.createElement(
@@ -70,7 +71,8 @@ const Component = (props) => {
       options,
       getData,
       renderItem,
-      keyExtractor
+      keyExtractor,
+      groupLabelExtractor
     }
   ) : /* @__PURE__ */ React.createElement(
     Flat,

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

@@ -5,8 +5,17 @@ var styled = require('../styled.js');
 var reactNative = require('react-native');
 var Text = require('../../../atoms/Text/Text.js');
 
-const SectionHead = ({ section: { title } }) => /* @__PURE__ */ React.createElement(styled.SectionHeader, null, /* @__PURE__ */ React.createElement(Text, { fontWeight: "bold" }, title));
-const Section = ({ options, renderItem, getData, keyExtractor }) => {
+const SectionHead = ({
+  title,
+  groupLabelExtractor
+}) => /* @__PURE__ */ React.createElement(styled.SectionHeader, null, /* @__PURE__ */ React.createElement(Text, { fontWeight: "bold" }, groupLabelExtractor ? groupLabelExtractor(title) : title));
+const Section = ({
+  options,
+  renderItem,
+  getData,
+  keyExtractor,
+  groupLabelExtractor
+}) => {
   const sectionList = React.useMemo(
     () => options instanceof Map ? [...options].map(([key, value]) => ({
       title: key,
@@ -20,7 +29,7 @@ const Section = ({ options, renderItem, getData, keyExtractor }) => {
       sections: sectionList,
       renderItem,
       ItemSeparatorComponent: styled.Divider,
-      renderSectionHeader: SectionHead,
+      renderSectionHeader: ({ section: { title } }) => /* @__PURE__ */ React.createElement(SectionHead, { title, groupLabelExtractor }),
       keyExtractor
     }
   );

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

@@ -31,7 +31,7 @@ const useSelect = ({
   const modal = useLazyModalManager.useLazyModalManager();
   const [loading, setLoading] = React.useState(false);
   const onlyLabel = label && !placeholder;
-  const hasValue = type === "single" ? !!value : (value || []).length > 0;
+  const hasValue = type === "single" ? !!value : (value ?? []).length > 0;
   const _placeholder = onlyLabel ? label : placeholder;
   const _label = hasValue ? label : void 0;
   React.useEffect(() => {

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

@@ -7,7 +7,7 @@ import useSelect from './hooks/useSelect.js';
 
 function Select(props) {
   const {
-    groupKeyExtractor,
+    groupLabelExtractor,
     onSelect,
     selectModalTitle,
     selectModalTitleComponent,
@@ -44,11 +44,11 @@ function Select(props) {
     /* @__PURE__ */ React__default.createElement(
       Modal,
       {
-        options: selectOptions || [],
+        options: selectOptions ?? [],
         focused: true,
         keyExtractor,
         labelExtractor,
-        groupKeyExtractor,
+        groupLabelExtractor,
         searchBarPlaceholder,
         type,
         onSelect,
@@ -69,7 +69,7 @@ function Select(props) {
       }
     )
   );
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, controlComponent ? controlComponent(handlePressInput, getDisplayValue() || "") : /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, controlComponent ? controlComponent(handlePressInput, getDisplayValue() ?? "") : /* @__PURE__ */ React__default.createElement(
     HintInputContainer,
     {
       ...rest,
@@ -91,7 +91,7 @@ function Select(props) {
         fontWeight: "bold",
         disabled
       },
-      getDisplayValue() || " "
+      getDisplayValue() ?? " "
     )
   ));
 }

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

@@ -2,7 +2,12 @@ import React__default from 'react';
 import { Divider } from '../styled.js';
 import { FlatList } from 'react-native';
 
-const Flat = ({ options, keyExtractor, renderItem, getData }) => {
+const Flat = ({
+  options,
+  keyExtractor,
+  renderItem,
+  getData
+}) => {
   const data = React__default.useMemo(
     () => typeof options !== "function" ? getData(options) : [],
     [options, getData]

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

@@ -39,6 +39,7 @@ const Component = (props) => {
     confirmButtonText,
     handleConfirm,
     close,
+    groupLabelExtractor,
     ...others
   } = useModal(props);
   return /* @__PURE__ */ React__default.createElement(ModalView, { ...others, BoxComponent: ModalComponent, showCloseBar: false }, /* @__PURE__ */ React__default.createElement(
@@ -68,7 +69,8 @@ const Component = (props) => {
       options,
       getData,
       renderItem,
-      keyExtractor
+      keyExtractor,
+      groupLabelExtractor
     }
   ) : /* @__PURE__ */ React__default.createElement(
     Flat,

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

@@ -3,8 +3,17 @@ import { Divider, SectionHeader } from '../styled.js';
 import { SectionList } from 'react-native';
 import Text from '../../../atoms/Text/Text.js';
 
-const SectionHead = ({ section: { title } }) => /* @__PURE__ */ React__default.createElement(SectionHeader, null, /* @__PURE__ */ React__default.createElement(Text, { fontWeight: "bold" }, title));
-const Section = ({ options, renderItem, getData, keyExtractor }) => {
+const SectionHead = ({
+  title,
+  groupLabelExtractor
+}) => /* @__PURE__ */ React__default.createElement(SectionHeader, null, /* @__PURE__ */ React__default.createElement(Text, { fontWeight: "bold" }, groupLabelExtractor ? groupLabelExtractor(title) : title));
+const Section = ({
+  options,
+  renderItem,
+  getData,
+  keyExtractor,
+  groupLabelExtractor
+}) => {
   const sectionList = useMemo(
     () => options instanceof Map ? [...options].map(([key, value]) => ({
       title: key,
@@ -18,7 +27,7 @@ const Section = ({ options, renderItem, getData, keyExtractor }) => {
       sections: sectionList,
       renderItem,
       ItemSeparatorComponent: Divider,
-      renderSectionHeader: SectionHead,
+      renderSectionHeader: ({ section: { title } }) => /* @__PURE__ */ React__default.createElement(SectionHead, { title, groupLabelExtractor }),
       keyExtractor
     }
   );

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

@@ -29,7 +29,7 @@ const useSelect = ({
   const modal = useLazyModalManager();
   const [loading, setLoading] = useState(false);
   const onlyLabel = label && !placeholder;
-  const hasValue = type === "single" ? !!value : (value || []).length > 0;
+  const hasValue = type === "single" ? !!value : (value ?? []).length > 0;
   const _placeholder = onlyLabel ? label : placeholder;
   const _label = hasValue ? label : void 0;
   useEffect(() => {

package/dist/types/components/molecules/Select/components/Flat.d.ts

@@ -1,8 +1,4 @@
 /// <reference types="react" />
-declare const Flat: ({ options, keyExtractor, renderItem, getData }: {
-    options: any;
-    keyExtractor: any;
-    renderItem: any;
-    getData: any;
-}) => JSX.Element;
+import { BaseFlatList } from '../types';
+declare const Flat: <Data>({ options, keyExtractor, renderItem, getData, }: BaseFlatList<Data>) => JSX.Element;
 export default Flat;

package/dist/types/components/molecules/Select/components/Modal.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { IBaseModal } from '../../../atoms/Modal';
-import { LoadingProps, SelectNativeProps, SelectType } from '../types';
-export declare const Modal: <Data, Type extends SelectType>(props: SelectNativeProps<Data, Type> & LoadingProps & IBaseModal) => JSX.Element;
+import { LoadingProps, OverrideModalProps, SelectType } from '../types';
+export declare const Modal: <Data, Type extends SelectType>(props: OverrideModalProps<Data, Type> & LoadingProps & IBaseModal) => JSX.Element;

package/dist/types/components/molecules/Select/components/Section.d.ts

@@ -1,8 +1,4 @@
 /// <reference types="react" />
-declare const Section: ({ options, renderItem, getData, keyExtractor }: {
-    options: any;
-    renderItem: any;
-    getData: any;
-    keyExtractor: any;
-}) => JSX.Element;
+import { BaseSectionList } from '../types';
+declare const Section: <Data>({ options, renderItem, getData, keyExtractor, groupLabelExtractor, }: BaseSectionList<Data>) => JSX.Element;
 export default Section;

package/dist/types/components/molecules/Select/functions.d.ts

@@ -6,4 +6,4 @@ export declare const singleBuilder: <Data>(option: Data, src: Data[], keyExtract
 export declare const isMap: <Data>(value: Data[] | Map<string, Data[]>) => boolean;
 export declare const mapToArray: <Data>(map: Map<string, Data[]>) => Data[];
 export declare const getMultiLabel: <Data>(value: Data[], placeholder: string, options: Data[] | Map<string, Data[]>, keyExtractor: Extractor<Data>, labelExtractor: Extractor<Data>) => string;
-export declare const getSingleLabel: <Data>(value: Data, placeholder: string, options: Data[] | Map<string, Data[]>, keyExtractor: Extractor<Data>, labelExtractor: Extractor<Data>) => string;
+export declare const getSingleLabel: <Data>(value: Data | null | undefined, placeholder: string, options: Data[] | Map<string, Data[]>, keyExtractor: Extractor<Data>, labelExtractor: Extractor<Data>) => string;

package/dist/types/components/molecules/Select/hooks/useModal.d.ts

@@ -1,26 +1,18 @@
 import React from 'react';
-import { LoadingProps, OptionData, SelectNativeProps, SelectType } from '../types';
+import { LoadingProps, OptionData, OverrideModalProps, SelectType } from '../types';
 import { ListRenderItemInfo } from 'react-native';
 import { IBaseModal } from '../../../atoms/Modal';
-declare const useModal: <Data, Type extends SelectType>({ keyExtractor, labelExtractor, focused, type, value, onSelect, onSearch, close, closeOnPick, ...others }: SelectNativeProps<Data, Type> & LoadingProps & IBaseModal) => {
-    options: ((searchInput?: string | undefined) => Promise<Data[] | Map<string, Data[]>>) | Data[] | Map<string, Data[]>;
-    groupKeyExtractor?: import("../types").Extractor<Data> | undefined;
-    hideSearchBar?: boolean | undefined;
-    placeholder?: string | undefined;
-    onFocus?: (() => void) | undefined;
-    onBlur?: (() => void) | undefined;
-    searchBarPlaceholder?: string | undefined;
-    confirmButtonText?: string | undefined;
-    selectModalTitle?: string | undefined;
-    selectModalTitleComponent?: JSX.Element | undefined;
-    controlComponent?: ((onPress: () => void, displayValue?: string | undefined) => JSX.Element) | undefined;
-    numberOfLines?: number | undefined;
+declare const useModal: <Data, Type extends SelectType>({ keyExtractor, labelExtractor, focused, type, value, onSelect, onSearch, close, closeOnPick, ...others }: OverrideModalProps<Data, Type> & LoadingProps & IBaseModal) => {
     label?: string | undefined;
     style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    numberOfLines?: number | undefined;
     testID?: string | undefined;
     borderColor?: keyof import("@tecsinapse/react-core").Color | undefined;
+    onBlur?: (() => void) | undefined;
+    onFocus?: (() => void) | undefined;
     disabled?: boolean | undefined;
     variant?: import("@tecsinapse/react-core").InputVariantType | undefined;
+    placeholder?: string | undefined;
     labelColor?: keyof import("@tecsinapse/react-core").FontColor | undefined;
     labelColorVariant?: keyof import("@tecsinapse/react-core").Color | undefined;
     labelColorTone?: keyof import("@tecsinapse/react-core").ColorGradation | undefined;
@@ -34,6 +26,14 @@ declare const useModal: <Data, Type extends SelectType>({ keyExtractor, labelExt
     inputContainerStyle?: import("react-native").StyleProp<import("react-native").ViewStyle>;
     hint?: string | undefined;
     hintComponent?: JSX.Element | undefined;
+    controlComponent?: ((onPress: () => void, displayValue?: string | undefined) => JSX.Element) | undefined;
+    confirmButtonText?: string | undefined;
+    groupLabelExtractor?: ((title: string) => string) | undefined;
+    hideSearchBar?: boolean | undefined;
+    searchBarPlaceholder?: string | undefined;
+    selectModalTitle?: string | undefined;
+    selectModalTitleComponent?: JSX.Element | undefined;
+    options: Data[] | Map<string, Data[]>;
     loading?: boolean | undefined;
     visible?: boolean | undefined;
     BoxComponent?: React.FC<any> | undefined;

package/dist/types/components/molecules/Select/hooks/useSelect.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { SelectNativeProps, SelectType } from '../types';
 declare const useSelect: <Data, Type extends SelectType>({ value, options, keyExtractor, type, labelExtractor, placeholder, onFocus, onBlur, disabled, onSearch, label, ...rest }: SelectNativeProps<Data, Type>) => {
     onSelect: (option: Type extends "single" ? Data | undefined : Data[]) => void;
-    groupKeyExtractor?: import("../types").Extractor<Data> | undefined;
+    groupLabelExtractor?: ((title: string) => string) | undefined;
     hideSearchBar?: boolean | undefined;
     searchBarPlaceholder?: string | undefined;
     confirmButtonText?: string | undefined;

package/dist/types/components/molecules/Select/types.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import { InputContainerProps } from '@tecsinapse/react-core';
+import { ListRenderItemInfo } from 'react-native';
 export type OptionData<T> = T & {
     _checked: boolean;
 };
@@ -16,7 +17,7 @@ export interface SelectNativeProps<Data, Type extends SelectType> extends Omit<I
     type: Type;
     keyExtractor: Extractor<Data>;
     labelExtractor: Extractor<Data>;
-    groupKeyExtractor?: Extractor<Data>;
+    groupLabelExtractor?: (title: string) => string;
     hideSearchBar?: boolean;
     placeholder?: string;
     onFocus?: () => void | never;
@@ -30,4 +31,19 @@ export interface SelectNativeProps<Data, Type extends SelectType> extends Omit<I
     controlComponent?: (onPress: () => void, displayValue?: string) => JSX.Element;
     numberOfLines?: number;
 }
+type BaseList<Data> = {
+    renderItem: (item: ListRenderItemInfo<OptionData<Data>>) => JSX.Element;
+    getData: (options: Data[]) => OptionData<Data>[];
+    keyExtractor: Extractor<Data>;
+};
+export type BaseSectionList<Data> = BaseList<Data> & {
+    options: Map<string, Data[]>;
+    groupLabelExtractor?: (title: string) => string;
+};
+export type BaseFlatList<Data> = BaseList<Data> & {
+    options: Data[];
+};
+export type OverrideModalProps<Data, Type extends SelectType> = Omit<SelectNativeProps<Data, Type>, 'options'> & {
+    options: Data[] | Map<string, Data[]>;
+};
 export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tecsinapse/react-native-kit",
   "description": "React Native components library",
-  "version": "3.5.1",
+  "version": "3.5.2",
   "license": "MIT",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -20,7 +20,7 @@
   "dependencies": {
     "@emotion/native": "~11.11.0",
     "@emotion/react": "~11.11.0",
-    "@tecsinapse/react-core": "3.4.2",
+    "@tecsinapse/react-core": "3.4.3",
     "react-native-linear-gradient": "~2.8.3"
   },
   "devDependencies": {
@@ -42,5 +42,5 @@
     "react-native-safe-area-context": "^4.0.0",
     "react-native-vector-icons": "^9.2.0"
   },
-  "gitHead": "88caf1e99c9ff6e9a3cf84e60f79a6358fd3fc32"
+  "gitHead": "cb0b51647a39310e5cffadd41b1258ddadb2af94"
 }