@herca/rn-kit 0.1.30 → 0.1.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/module/BottomSheet/BottomSheet.js +1 -1
- package/lib/module/BottomSheet/BottomSheet.js.map +1 -1
- package/lib/module/Chip/Chip.js +20 -7
- package/lib/module/Chip/Chip.js.map +1 -1
- package/lib/module/Chip/ChipItem.js +3 -1
- package/lib/module/Chip/ChipItem.js.map +1 -1
- package/lib/module/Icon/Icon.js +3 -1
- package/lib/module/Icon/Icon.js.map +1 -1
- package/lib/module/Icon/icons/SettingsSlider.js +22 -0
- package/lib/module/Icon/icons/SettingsSlider.js.map +1 -0
- package/lib/module/Select/README_Select.md +31 -18
- package/lib/module/Select/Select.js +60 -29
- package/lib/module/Select/Select.js.map +1 -1
- package/lib/typescript/src/Chip/Chip.d.ts.map +1 -1
- package/lib/typescript/src/Chip/ChipItem.d.ts +1 -1
- package/lib/typescript/src/Chip/ChipItem.d.ts.map +1 -1
- package/lib/typescript/src/Chip/type.d.ts +2 -1
- package/lib/typescript/src/Chip/type.d.ts.map +1 -1
- package/lib/typescript/src/Icon/Icon.d.ts.map +1 -1
- package/lib/typescript/src/Icon/icons/SettingsSlider.d.ts +9 -0
- package/lib/typescript/src/Icon/icons/SettingsSlider.d.ts.map +1 -0
- package/lib/typescript/src/Icon/type.d.ts +1 -1
- package/lib/typescript/src/Icon/type.d.ts.map +1 -1
- package/lib/typescript/src/Select/Select.d.ts +1 -1
- package/lib/typescript/src/Select/Select.d.ts.map +1 -1
- package/lib/typescript/src/Select/type.d.ts +1 -0
- package/lib/typescript/src/Select/type.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/BottomSheet/BottomSheet.tsx +1 -1
- package/src/Chip/Chip.tsx +24 -5
- package/src/Chip/ChipItem.tsx +2 -0
- package/src/Chip/type.tsx +2 -1
- package/src/Icon/Icon.tsx +2 -0
- package/src/Icon/icons/SettingsSlider.tsx +29 -0
- package/src/Icon/type.tsx +1 -0
- package/src/Select/README_Select.md +31 -18
- package/src/Select/Select.tsx +73 -33
- package/src/Select/type.tsx +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","useRef","useState","useCallback","View","StyleSheet","PanResponder","TouchableOpacity","Animated","Modal","KeyboardAvoidingView","Keyboard","Dimensions","SafeAreaView","Platform","StatusBar","Container","Typography","Color","jsx","_jsx","jsxs","_jsxs","statusBarHeight","OS","currentHeight","screenHeight","get","height","actualScreenHeight","DEFAULT_PADDING_BOTTOM","BottomSheet","isOpen","onClose","children","backdrop","closable","onRequestClose","buttonClose","pullBar","footer","isVisible","setIsVisible","heightFooter","setHeightFooter","heighContent","setHeighContent","maxHeight","setMaxHeight","translateY","Value","current","panResponder","create","onStartShouldSetPanResponder","onMoveShouldSetPanResponder","onPanResponderMove","_","gestureState","dy","setValue","onPanResponderRelease","handleRequestClose","resetModalPosition","hideModal","timing","toValue","duration","useNativeDriver","start","showModal","spring","e","keyboardDidShowListener","addListener","keyboardHeight","endCoordinates","keyboardDidHideListener","remove","transparent","visible","animationType","style","styles","modalContainer","onPress","activeOpacity","backdropTouchable","behavior","undefined","enabled","keyboardAvoiding","bottomSheet","transform","paddingBottom","closeButton","panHandlers","dragIndicatorContainer","dragIndicator","contentContainer","contentWithFooter","onLayout","event","nativeEvent","layout","flex","justifyContent","backgroundColor","borderTopLeftRadius","borderTopRightRadius","position","paddingVertical","paddingHorizontal","borderRadius","top","right","zIndex","alignItems","width","marginTop","flexGrow","borderTopWidth","borderTopColor","gray","base","white100","paddingTop","
|
|
1
|
+
{"version":3,"names":["useEffect","useRef","useState","useCallback","View","StyleSheet","PanResponder","TouchableOpacity","Animated","Modal","KeyboardAvoidingView","Keyboard","Dimensions","SafeAreaView","Platform","StatusBar","Container","Typography","Color","jsx","_jsx","jsxs","_jsxs","statusBarHeight","OS","currentHeight","screenHeight","get","height","actualScreenHeight","DEFAULT_PADDING_BOTTOM","BottomSheet","isOpen","onClose","children","backdrop","closable","onRequestClose","buttonClose","pullBar","footer","isVisible","setIsVisible","heightFooter","setHeightFooter","heighContent","setHeighContent","maxHeight","setMaxHeight","translateY","Value","current","panResponder","create","onStartShouldSetPanResponder","onMoveShouldSetPanResponder","onPanResponderMove","_","gestureState","dy","setValue","onPanResponderRelease","handleRequestClose","resetModalPosition","hideModal","timing","toValue","duration","useNativeDriver","start","showModal","spring","e","keyboardDidShowListener","addListener","keyboardHeight","endCoordinates","keyboardDidHideListener","remove","transparent","visible","animationType","style","styles","modalContainer","onPress","activeOpacity","backdropTouchable","behavior","undefined","enabled","keyboardAvoiding","bottomSheet","transform","paddingBottom","closeButton","panHandlers","dragIndicatorContainer","dragIndicator","contentContainer","contentWithFooter","onLayout","event","nativeEvent","layout","flex","justifyContent","backgroundColor","borderTopLeftRadius","borderTopRightRadius","position","paddingVertical","paddingHorizontal","borderRadius","top","right","zIndex","alignItems","width","marginTop","flexGrow","borderTopWidth","borderTopColor","gray","base","white100","paddingTop","bottom","left"],"sourceRoot":"../../../src","sources":["BottomSheet/BottomSheet.tsx"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,WAAW,QAAQ,OAAO;AAChE,SACEC,IAAI,EACJC,UAAU,EACVC,YAAY,EACZC,gBAAgB,EAChBC,QAAQ,EACRC,KAAK,EACLC,oBAAoB,EACpBC,QAAQ,EACRC,UAAU,EACVC,YAAY,EACZC,QAAQ,EACRC,SAAS,QAEJ,cAAc;AACrB,OAAOC,SAAS,MAAM,oBAAiB;AACvC,OAAOC,UAAU,MAAM,6BAA0B;AACjD,OAAOC,KAAK,MAAM,mBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAGnC,MAAMC,eAAe,GACnBT,QAAQ,CAACU,EAAE,KAAK,SAAS,GAAIT,SAAS,CAACU,aAAa,IAAI,EAAE,GAAI,EAAE;AAClE,MAAMC,YAAY,GAAGd,UAAU,CAACe,GAAG,CAAC,QAAQ,CAAC,CAACC,MAAM;AACpD,MAAMC,kBAAkB,GAAGH,YAAY,GAAGH,eAAe;AACzD,MAAMO,sBAAsB,GAAG,EAAE;AACjC,eAAe,SAASC,WAAWA,CAAC;EAClCC,MAAM;EACNC,OAAO;EACPC,QAAQ;EACRC,QAAQ,GAAG,IAAI;EACfC,QAAQ,GAAG,IAAI;EACfC,cAAc;EACdC,WAAW,GAAG,KAAK;EACnBV,MAAM;EACNW,OAAO;EACPC;AACiB,CAAC,EAAE;EACpB,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGxC,QAAQ,CAAC,KAAK,CAAC;EACjD,MAAM,CAACyC,YAAY,EAAEC,eAAe,CAAC,GAAG1C,QAAQ,CAAC,CAAC,CAAC;EACnD,MAAM,CAAC2C,YAAY,EAAEC,eAAe,CAAC,GACnC5C,QAAQ,CAAwB,MAAM,CAAC;EACzC,MAAM,CAAC6C,SAAS,EAAEC,YAAY,CAAC,GAC7B9C,QAAQ,CAAwB2B,kBAAkB,CAAC;EACrD,MAAMoB,UAAU,GAAGhD,MAAM,CAAC,IAAIO,QAAQ,CAAC0C,KAAK,CAAC,GAAG,CAAC,CAAC,CAACC,OAAO;EAE1D,MAAMC,YAAY,GAAGnD,MAAM,CACzBK,YAAY,CAAC+C,MAAM,CAAC;IAClBC,4BAA4B,EAAEA,CAAA,KAAM,IAAI;IACxCC,2BAA2B,EAAEA,CAAA,KAAM,KAAK;IACxCC,kBAAkB,EAAEA,CAACC,CAAC,EAAEC,YAAY,KAAK;MACvC,IAAIA,YAAY,CAACC,EAAE,GAAG,CAAC,EAAE;QACvBV,UAAU,CAACW,QAAQ,CAACF,YAAY,CAACC,EAAE,CAAC;MACtC;IACF,CAAC;IACDE,qBAAqB,EAAEA,CAACJ,CAAC,EAAEC,YAAY,KAAK;MAC1C,IAAItB,QAAQ,IAAIsB,YAAY,CAACC,EAAE,GAAG,EAAE,EAAE;QACpCG,kBAAkB,CAAC,CAAC;MACtB,CAAC,MAAM;QACLC,kBAAkB,CAAC,CAAC;MACtB;IACF;EACF,CAAC,CACH,CAAC,CAACZ,OAAO;EAET,MAAMa,SAAS,GAAG7D,WAAW,CAAC,MAAM;IAClC,IAAIiC,QAAQ,EAAE;MACZ5B,QAAQ,CAACyD,MAAM,CAAChB,UAAU,EAAE;QAC1BiB,OAAO,EAAE,GAAG;QACZC,QAAQ,EAAE,GAAG;QACbC,eAAe,EAAE;MACnB,CAAC,CAAC,CAACC,KAAK,CAAC,MAAM;QACb3B,YAAY,CAAC,KAAK,CAAC;QACnBT,OAAO,IAAIA,OAAO,CAAC,KAAK,CAAC;MAC3B,CAAC,CAAC;IACJ;EACF,CAAC,EAAE,CAACG,QAAQ,EAAEa,UAAU,EAAEhB,OAAO,CAAC,CAAC;EAEnC,MAAMqC,SAAS,GAAGnE,WAAW,CAAC,MAAM;IAClCuC,YAAY,CAAC,IAAI,CAAC;IAClBlC,QAAQ,CAAC+D,MAAM,CAACtB,UAAU,EAAE;MAC1BiB,OAAO,EAAE,CAAC;MACVE,eAAe,EAAE;IACnB,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC;EACZ,CAAC,EAAE,CAACpB,UAAU,CAAC,CAAC;EAEhB,MAAMa,kBAAkB,GAAIU,CAAO,IAAK;IACtCR,SAAS,CAAC,CAAC;IACX3B,cAAc,IAAIA,cAAc,CAACmC,CAAC,CAAC;EACrC,CAAC;EAED,MAAMT,kBAAkB,GAAGA,CAAA,KAAM;IAC/BvD,QAAQ,CAAC+D,MAAM,CAACtB,UAAU,EAAE;MAC1BiB,OAAO,EAAE,CAAC;MACVE,eAAe,EAAE;IACnB,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC;EACZ,CAAC;EAEDrE,SAAS,CAAC,MAAM;IACd,IAAIgC,MAAM,EAAE;MACVsC,SAAS,CAAC,CAAC;IACb,CAAC,MAAM;MACLN,SAAS,CAAC,CAAC;IACb;EACF,CAAC,EAAE,CAAChC,MAAM,EAAEsC,SAAS,EAAEN,SAAS,CAAC,CAAC;EAElChE,SAAS,CAAC,MAAM;IACd,IAAI4B,MAAM,EAAE;MACVkB,eAAe,CAAClB,MAAM,CAAC;IACzB;EACF,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC;EAEZ5B,SAAS,CAAC,MAAM;IACd,MAAMyE,uBAAuB,GAAG9D,QAAQ,CAAC+D,WAAW,CAClD,iBAAiB,EAChBF,CAAgB,IAAK;MACpB,MAAMG,cAAc,GAAGH,CAAC,CAACI,cAAc,EAAEhD,MAAM,IAAI,GAAG;MACtDoB,YAAY,CAACtB,YAAY,GAAGH,eAAe,GAAGoD,cAAc,CAAC;IAC/D,CACF,CAAC;IAED,MAAME,uBAAuB,GAAGlE,QAAQ,CAAC+D,WAAW,CAClD,iBAAiB,EACjB,MAAM;MACJ1B,YAAY,CAACtB,YAAY,GAAGH,eAAe,CAAC;IAC9C,CACF,CAAC;IAED,OAAO,MAAM;MACXkD,uBAAuB,CAACK,MAAM,CAAC,CAAC;MAChCD,uBAAuB,CAACC,MAAM,CAAC,CAAC;IAClC,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE1D,IAAA,CAACX,KAAK;IACJsE,WAAW;IACXC,OAAO,EAAEvC,SAAU;IACnBJ,cAAc,EAAEyB,kBAAmB;IACnCmB,aAAa,EAAC,MAAM;IAAA/C,QAAA,eAEpBZ,KAAA,CAAClB,IAAI;MAAC8E,KAAK,EAAE,CAACC,MAAM,CAACC,cAAc,EAAEjD,QAAQ,IAAIgD,MAAM,CAAChD,QAAQ,CAAE;MAAAD,QAAA,gBAChEd,IAAA,CAACb,gBAAgB;QACf8E,OAAO,EAAEvB,kBAAmB;QAC5BwB,aAAa,EAAE,CAAE;QACjBJ,KAAK,EAAEC,MAAM,CAACI;MAAkB,CACjC,CAAC,eAEFnE,IAAA,CAACV,oBAAoB;QACnB8E,QAAQ,EAAE1E,QAAQ,CAACU,EAAE,KAAK,KAAK,GAAG,SAAS,GAAGiE,SAAU;QACxDC,OAAO;QACPR,KAAK,EAAEC,MAAM,CAACQ,gBAAiB;QAAAzD,QAAA,eAE/BZ,KAAA,CAACd,QAAQ,CAACJ,IAAI;UACZ8E,KAAK,EAAE,CACLC,MAAM,CAACS,WAAW,EAClB;YACEC,SAAS,EAAE,CAAC;cAAE5C;YAAW,CAAC,CAAC;YAC3BrB,MAAM,EAAEiB,YAAY;YACpBE,SAAS,EAAEA,SAAS;YACpB+C,aAAa,EAAEhE,sBAAsB,GAAGa;UAC1C,CAAC,CACD;UAAAT,QAAA,GAEDI,WAAW,iBACVlB,IAAA,CAACb,gBAAgB;YACf8E,OAAO,EAAEvB,kBAAmB;YAC5BoB,KAAK,EAAEC,MAAM,CAACY,WAAY;YAAA7D,QAAA,eAE1Bd,IAAA,CAACH,UAAU;cAAAiB,QAAA,EAAC;YAAC,CAAY;UAAC,CACV,CACnB,EACAE,QAAQ,iBACPhB,IAAA,CAAChB,IAAI;YAAA,GACCgD,YAAY,CAAC4C,WAAW;YAC5Bd,KAAK,EAAEC,MAAM,CAACc,sBAAuB;YAAA/D,QAAA,EAEpCK,OAAO,GAAGA,OAAO,gBAAGnB,IAAA,CAAChB,IAAI;cAAC8E,KAAK,EAAEC,MAAM,CAACe;YAAc,CAAE;UAAC,CACtD,CACP,eACD9E,IAAA,CAACP,YAAY;YACXqE,KAAK,EAAE,CACLC,MAAM,CAACgB,gBAAgB,EACvB,IAAI3D,MAAM,GAAG,CAAC2C,MAAM,CAACiB,iBAAiB,CAAC,GAAG,EAAE,CAAC,CAC7C;YAAAlE,QAAA,eAEFd,IAAA,CAACJ,SAAS;cAAAkB,QAAA,EAAEA;YAAQ,CAAY;UAAC,CACrB,CAAC,EACdM,MAAM,iBACLpB,IAAA,CAACP,YAAY;YACXwF,QAAQ,EAAGC,KAAK,IAAK;cACnB,MAAM;gBAAE1E;cAAO,CAAC,GAAG0E,KAAK,CAACC,WAAW,CAACC,MAAM;cAC3C5D,eAAe,CAAChB,MAAM,CAAC;YACzB,CAAE;YACFsD,KAAK,EAAEC,MAAM,CAAC3C,MAAO;YAAAN,QAAA,eAErBd,IAAA,CAACJ,SAAS;cAAAkB,QAAA,EAAEM;YAAM,CAAY;UAAC,CACnB,CACf;QAAA,CACY;MAAC,CACI,CAAC;IAAA,CACnB;EAAC,CACF,CAAC;AAEZ;AAEA,MAAM2C,MAAM,GAAG9E,UAAU,CAACgD,MAAM,CAAC;EAC/B+B,cAAc,EAAE;IACdqB,IAAI,EAAE,CAAC;IACPC,cAAc,EAAE;EAClB,CAAC;EACDvE,QAAQ,EAAE;IACRwE,eAAe,EAAE;EACnB,CAAC;EACDpB,iBAAiB,EAAE;IACjBkB,IAAI,EAAE;EACR,CAAC;EACDd,gBAAgB,EAAE;IAChBe,cAAc,EAAE;EAClB,CAAC;EACDd,WAAW,EAAE;IACXe,eAAe,EAAE,OAAO;IACxBC,mBAAmB,EAAE,EAAE;IACvBC,oBAAoB,EAAE;EACxB,CAAC;EACDd,WAAW,EAAE;IACXe,QAAQ,EAAE,UAAU;IACpBH,eAAe,EAAE,OAAO;IACxBI,eAAe,EAAE,EAAE;IACnBC,iBAAiB,EAAE,EAAE;IACrBC,YAAY,EAAE,EAAE;IAChBC,GAAG,EAAE,CAAC,EAAE;IACRC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE;EACV,CAAC;EACDnB,sBAAsB,EAAE;IACtBoB,UAAU,EAAE,QAAQ;IACpBvB,aAAa,EAAE;EACjB,CAAC;EACDI,aAAa,EAAE;IACboB,KAAK,EAAE,EAAE;IACT1F,MAAM,EAAE,CAAC;IACT2F,SAAS,EAAE,EAAE;IACbN,YAAY,EAAE,CAAC;IACfN,eAAe,EAAE;EACnB,CAAC;EACDR,gBAAgB,EAAE;IAChBqB,QAAQ,EAAE;EACZ,CAAC;EACDpB,iBAAiB,EAAE,CAAC,CAAC;EACrB5D,MAAM,EAAE;IACNiF,cAAc,EAAE,CAAC;IACjBC,cAAc,EAAExG,KAAK,CAACyG,IAAI,CAAC,GAAG,CAAC;IAC/BhB,eAAe,EAAEzF,KAAK,CAAC0G,IAAI,CAACC,QAAQ;IACpCf,QAAQ,EAAE,UAAU;IACpBgB,UAAU,EAAE,EAAE;IACdhC,aAAa,EAAE,EAAE;IACjBiC,MAAM,EAAE,CAAC;IACTC,IAAI,EAAE,CAAC;IACPb,KAAK,EAAE,CAAC;IACRC,MAAM,EAAE;EACV;AACF,CAAC,CAAC","ignoreList":[]}
|
package/lib/module/Chip/Chip.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import React, { useState, useEffect, useMemo } from 'react';
|
|
4
|
-
import { FlatList, StyleSheet } from 'react-native';
|
|
4
|
+
import { Dimensions, FlatList, StyleSheet } from 'react-native';
|
|
5
5
|
import ChipItem from "./ChipItem.js";
|
|
6
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
7
|
const Chip = ({
|
|
@@ -23,6 +23,11 @@ const Chip = ({
|
|
|
23
23
|
header
|
|
24
24
|
}) => {
|
|
25
25
|
const isHorizontal = direction === 'horizontal';
|
|
26
|
+
const [chipItemWidth, setChipItemWidth] = useState(0);
|
|
27
|
+
const screenWidth = Dimensions.get('window').width;
|
|
28
|
+
const contaierHorizontalPadding = 24;
|
|
29
|
+
const containerHorizontalChipGap = 8;
|
|
30
|
+
const availableContainerChipWidth = screenWidth - contaierHorizontalPadding;
|
|
26
31
|
const normalizeSelected = val => Array.isArray(val) ? val : val ? [val] : [];
|
|
27
32
|
const [internalSelected, setInternalSelected] = useState(normalizeSelected(selected));
|
|
28
33
|
useEffect(() => {
|
|
@@ -46,12 +51,14 @@ const Chip = ({
|
|
|
46
51
|
};
|
|
47
52
|
const numColumns = useMemo(() => {
|
|
48
53
|
if (isHorizontal || block) return 1;
|
|
49
|
-
return
|
|
50
|
-
}, [block, isHorizontal]);
|
|
54
|
+
return Math.floor(availableContainerChipWidth / (chipItemWidth + containerHorizontalChipGap));
|
|
55
|
+
}, [block, isHorizontal, availableContainerChipWidth, chipItemWidth]);
|
|
51
56
|
const handleOnPresChipItem = (isDisabled, item) => {
|
|
52
57
|
!isDisabled && handleSelect(item.value);
|
|
53
58
|
onPress?.(item.value);
|
|
54
59
|
};
|
|
60
|
+
const flexDirectionStyle = isHorizontal ? 'row' : 'column';
|
|
61
|
+
const alignItemsStyle = block ? 'stretch' : 'flex-start';
|
|
55
62
|
return /*#__PURE__*/_jsx(FlatList, {
|
|
56
63
|
data: options,
|
|
57
64
|
renderItem: ({
|
|
@@ -63,7 +70,13 @@ const Chip = ({
|
|
|
63
70
|
block: block,
|
|
64
71
|
onPress: handleOnPresChipItem,
|
|
65
72
|
size: size,
|
|
66
|
-
renderItem: renderItem
|
|
73
|
+
renderItem: renderItem,
|
|
74
|
+
onLayout: chipItemWidth ? undefined : e => {
|
|
75
|
+
const {
|
|
76
|
+
width
|
|
77
|
+
} = e.nativeEvent.layout;
|
|
78
|
+
setChipItemWidth(width);
|
|
79
|
+
}
|
|
67
80
|
}),
|
|
68
81
|
keyExtractor: item => String(item.value),
|
|
69
82
|
horizontal: isHorizontal,
|
|
@@ -74,13 +87,13 @@ const Chip = ({
|
|
|
74
87
|
keyboardShouldPersistTaps: "always",
|
|
75
88
|
numColumns: numColumns,
|
|
76
89
|
contentContainerStyle: [styles.container, {
|
|
77
|
-
flexDirection:
|
|
78
|
-
alignItems:
|
|
90
|
+
flexDirection: flexDirectionStyle,
|
|
91
|
+
alignItems: alignItemsStyle
|
|
79
92
|
}],
|
|
80
93
|
columnWrapperStyle: numColumns > 1 ? styles.wrapperStyle : undefined,
|
|
81
94
|
ListFooterComponent: footer,
|
|
82
95
|
ListHeaderComponent: header
|
|
83
|
-
});
|
|
96
|
+
}, `chip-${numColumns}`);
|
|
84
97
|
};
|
|
85
98
|
const styles = StyleSheet.create({
|
|
86
99
|
container: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useState","useEffect","useMemo","FlatList","StyleSheet","ChipItem","jsx","_jsx","Chip","options","selected","onSelect","onPress","direction","color","renderItem","multiple","scrollable","block","size","onRefresh","refreshing","onEndReached","footer","header","isHorizontal","normalizeSelected","val","Array","isArray","internalSelected","setInternalSelected","newSelected","JSON","stringify","isSelected","value","includes","handleSelect","length","filter","v","numColumns","handleOnPresChipItem","isDisabled","item","data","keyExtractor","String","horizontal","scrollEnabled","keyboardShouldPersistTaps","contentContainerStyle","styles","container","flexDirection","alignItems","columnWrapperStyle","wrapperStyle","
|
|
1
|
+
{"version":3,"names":["React","useState","useEffect","useMemo","Dimensions","FlatList","StyleSheet","ChipItem","jsx","_jsx","Chip","options","selected","onSelect","onPress","direction","color","renderItem","multiple","scrollable","block","size","onRefresh","refreshing","onEndReached","footer","header","isHorizontal","chipItemWidth","setChipItemWidth","screenWidth","get","width","contaierHorizontalPadding","containerHorizontalChipGap","availableContainerChipWidth","normalizeSelected","val","Array","isArray","internalSelected","setInternalSelected","newSelected","JSON","stringify","isSelected","value","includes","handleSelect","length","filter","v","numColumns","Math","floor","handleOnPresChipItem","isDisabled","item","flexDirectionStyle","alignItemsStyle","data","onLayout","undefined","e","nativeEvent","layout","keyExtractor","String","horizontal","scrollEnabled","keyboardShouldPersistTaps","contentContainerStyle","styles","container","flexDirection","alignItems","columnWrapperStyle","wrapperStyle","ListFooterComponent","ListHeaderComponent","create","gap","flexWrap","chip","borderRadius","borderWidth","alignSelf","chipSmall","paddingVertical","paddingHorizontal","chipMedium","chipLarge","blockChip"],"sourceRoot":"../../../src","sources":["Chip/Chip.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -12,7 +12,8 @@ export default function ChipItem({
|
|
|
12
12
|
size,
|
|
13
13
|
renderItem,
|
|
14
14
|
isHorizontal,
|
|
15
|
-
onPress
|
|
15
|
+
onPress,
|
|
16
|
+
onLayout
|
|
16
17
|
}) {
|
|
17
18
|
const validColors = ['default', 'success', 'danger', 'primary', 'warning', 'info', 'purple', 'orange'];
|
|
18
19
|
const safeColor = validColors.includes(color) ? color : 'default';
|
|
@@ -50,6 +51,7 @@ export default function ChipItem({
|
|
|
50
51
|
style: [styles.chip, getSizeStyle(), dynamicStyle, isBlockMode && styles.blockChip],
|
|
51
52
|
onPress: () => handleOnPres(isDisabled, item),
|
|
52
53
|
disabled: isDisabled,
|
|
54
|
+
onLayout: onLayout,
|
|
53
55
|
children: renderItem ? renderItem(item, selectedState, isDisabled) : /*#__PURE__*/_jsx(Typography, {
|
|
54
56
|
variant: "t2",
|
|
55
57
|
style: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Pressable","StyleSheet","Typography","CHIP_COLOR_MAP","jsx","_jsx","ChipItem","item","isSelected","color","block","size","renderItem","isHorizontal","onPress","validColors","safeColor","includes","colors","selectedState","value","isDisabled","disabled","dynamicStyle","borderColor","backgroundColor","selectedBorderColor","selectedBackgroundColor","disabledBorderColor","disabledBackgroundColor","isBlockMode","getSizeStyle","styles","chipSmall","chipLarge","chipMedium","handleOnPres","val","style","chip","blockChip","children","variant","fontSize","disabledTextColor","selectedTextColor","textColor","label","create","container","gap","borderRadius","borderWidth","alignSelf","paddingVertical","paddingHorizontal","width"],"sourceRoot":"../../../src","sources":["Chip/ChipItem.tsx"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,UAAU,QAAwB,cAAc;AACpE,OAAOC,UAAU,MAAM,6BAA0B;AACjD,SAASC,cAAc,QAA6C,WAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAG7E,eAAe,SAASC,QAAQA,CAAC;EAC/BC,IAAI;EACJC,UAAU;EACVC,KAAK,GAAG,SAAS;EACjBC,KAAK;EACLC,IAAI;EACJC,UAAU;EACVC,YAAY;EACZC;AACQ,CAAC,EAAE;EACX,MAAMC,WAA+B,GAAG,CACtC,SAAS,EACT,SAAS,EACT,QAAQ,EACR,SAAS,EACT,SAAS,EACT,MAAM,EACN,QAAQ,EACR,QAAQ,CACT;EAED,MAAMC,SAAS,GAAGD,WAAW,CAACE,QAAQ,
|
|
1
|
+
{"version":3,"names":["Pressable","StyleSheet","Typography","CHIP_COLOR_MAP","jsx","_jsx","ChipItem","item","isSelected","color","block","size","renderItem","isHorizontal","onPress","onLayout","validColors","safeColor","includes","colors","selectedState","value","isDisabled","disabled","dynamicStyle","borderColor","backgroundColor","selectedBorderColor","selectedBackgroundColor","disabledBorderColor","disabledBackgroundColor","isBlockMode","getSizeStyle","styles","chipSmall","chipLarge","chipMedium","handleOnPres","val","style","chip","blockChip","children","variant","fontSize","disabledTextColor","selectedTextColor","textColor","label","create","container","gap","borderRadius","borderWidth","alignSelf","paddingVertical","paddingHorizontal","width"],"sourceRoot":"../../../src","sources":["Chip/ChipItem.tsx"],"mappings":"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","ignoreList":[]}
|
package/lib/module/Icon/Icon.js
CHANGED
|
@@ -59,6 +59,7 @@ import WhatsAppFill from "./icons/WhatsappFill.js";
|
|
|
59
59
|
import Bold from "./icons/Bold.js";
|
|
60
60
|
import Italic from "./icons/Italic.js";
|
|
61
61
|
import UnderLine from "./icons/UnderLine.js";
|
|
62
|
+
import SettingsSlider from "./icons/SettingsSlider.js";
|
|
62
63
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
63
64
|
const icons = {
|
|
64
65
|
'Search': Search,
|
|
@@ -118,7 +119,8 @@ const icons = {
|
|
|
118
119
|
'whatsapp-fill': WhatsAppFill,
|
|
119
120
|
'Bold': Bold,
|
|
120
121
|
'Italic': Italic,
|
|
121
|
-
'UnderLine': UnderLine
|
|
122
|
+
'UnderLine': UnderLine,
|
|
123
|
+
'settings-slider': SettingsSlider
|
|
122
124
|
};
|
|
123
125
|
const Icon = ({
|
|
124
126
|
name,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","User","Eye","XCircle","ArrowRight","Document","Calendar","Download","StickyNote","Pdf","RadioButton","ArrowBackAlt","ArrowForwardAlt","Check","Filter","AirPlane","Camera","Image","Times","ArrowDown","ArrowUp","Search","ArrowLeft","EyeOpen","ExclamationMark","FileListCheck","FileText","FolderClock","HomeFill","HomeOutline","Plus","UserCircleFill","UserCircleOutline","ClipBoardListCheck","ClipBoardList","Megaphone","Bell","BookmarkUser","Scanner","ClockOutline","Clock","BoxOutline","ClipBoardListCheckOutline","Box","Minus","PlusSquare","AtSign","BriefCaseOutline","EditSquareOutline","GlobeEarth","LockFill","LogoHercaHris","QuestionCircleOutline","ShieldFill","Users","WhatsAppFill","Bold","Italic","UnderLine","jsx","_jsx","icons","Icon","name","size","color","style","SelectedIcon"],"sourceRoot":"../../../src","sources":["Icon/Icon.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAOC,IAAI,MAAM,iBAAc;AAC/B,OAAOC,GAAG,MAAM,gBAAa;AAC7B,OAAOC,OAAO,MAAM,oBAAiB;AACrC,OAAOC,UAAU,MAAM,uBAAoB;AAC3C,OAAOC,QAAQ,MAAM,qBAAkB;AACvC,OAAOC,QAAQ,MAAM,qBAAkB;AACvC,OAAOC,QAAQ,MAAM,qBAAkB;AACvC,OAAOC,UAAU,MAAM,uBAAoB;AAC3C,OAAOC,GAAG,MAAM,gBAAa;AAC7B,OAAOC,WAAW,MAAM,wBAAqB;AAC7C,OAAOC,YAAY,MAAM,yBAAsB;AAC/C,OAAOC,eAAe,MAAM,4BAAyB;AACrD,OAAOC,KAAK,MAAM,kBAAe;AACjC,OAAOC,MAAM,MAAM,mBAAgB;AACnC,OAAOC,QAAQ,MAAM,qBAAkB;AACvC,OAAOC,MAAM,MAAM,mBAAgB;AACnC,OAAOC,KAAK,MAAM,kBAAe;AAEjC,OAAOC,KAAK,MAAM,kBAAe;AACjC,OAAOC,SAAS,MAAM,sBAAmB;AACzC,OAAOC,OAAO,MAAM,oBAAiB;AACrC,OAAOC,MAAM,MAAM,mBAAgB;AACnC,OAAOC,SAAS,MAAM,sBAAmB;AACzC,OAAOC,OAAO,MAAM,oBAAiB;AACrC,OAAOC,eAAe,MAAM,4BAAyB;AACrD,OAAOC,aAAa,MAAM,0BAAuB;AACjD,OAAOC,QAAQ,MAAM,qBAAkB;AACvC,OAAOC,WAAW,MAAM,wBAAqB;AAC7C,OAAOC,QAAQ,MAAM,qBAAkB;AACvC,OAAOC,WAAW,MAAM,wBAAqB;AAC7C,OAAOC,IAAI,MAAM,iBAAc;AAC/B,OAAOC,cAAc,MAAM,2BAAwB;AACnD,OAAOC,iBAAiB,MAAM,8BAA2B;AACzD,OAAOC,kBAAkB,MAAM,+BAA4B;AAC3D,OAAOC,aAAa,MAAM,0BAAuB;AACjD,OAAOC,SAAS,MAAM,sBAAmB;AACzC,OAAOC,IAAI,MAAM,iBAAc;AAC/B,OAAOC,YAAY,MAAM,yBAAsB;AAC/C,OAAOC,OAAO,MAAM,oBAAiB;AACrC,OAAOC,YAAY,MAAM,yBAAsB;AAC/C,OAAOC,KAAK,MAAM,kBAAe;AACjC,OAAOC,UAAU,MAAM,uBAAoB;AAC3C,OAAOC,yBAAyB,MAAM,sCAAmC;AACzE,OAAOC,GAAG,MAAM,gBAAa;AAC7B,OAAOC,KAAK,MAAM,kBAAe;AACjC,OAAOC,UAAU,MAAM,uBAAoB;AAC3C,OAAOC,MAAM,MAAM,mBAAgB;AACnC,OAAOC,gBAAgB,MAAM,6BAA0B;AACvD,OAAOC,iBAAiB,MAAM,iBAAc;AAC5C,OAAOC,UAAU,MAAM,uBAAoB;AAC3C,OAAOC,QAAQ,MAAM,qBAAkB;AACvC,OAAOC,aAAa,MAAM,0BAAuB;AACjD,OAAOC,qBAAqB,MAAM,kCAA+B;AACjE,OAAOC,UAAU,MAAM,uBAAoB;AAC3C,OAAOC,KAAK,MAAM,kBAAe;AACjC,OAAOC,YAAY,MAAM,yBAAsB;AAC/C,OAAOC,IAAI,MAAM,iBAAc;AAC/B,OAAOC,MAAM,MAAM,mBAAgB;AACnC,OAAOC,SAAS,MAAM,sBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;
|
|
1
|
+
{"version":3,"names":["React","User","Eye","XCircle","ArrowRight","Document","Calendar","Download","StickyNote","Pdf","RadioButton","ArrowBackAlt","ArrowForwardAlt","Check","Filter","AirPlane","Camera","Image","Times","ArrowDown","ArrowUp","Search","ArrowLeft","EyeOpen","ExclamationMark","FileListCheck","FileText","FolderClock","HomeFill","HomeOutline","Plus","UserCircleFill","UserCircleOutline","ClipBoardListCheck","ClipBoardList","Megaphone","Bell","BookmarkUser","Scanner","ClockOutline","Clock","BoxOutline","ClipBoardListCheckOutline","Box","Minus","PlusSquare","AtSign","BriefCaseOutline","EditSquareOutline","GlobeEarth","LockFill","LogoHercaHris","QuestionCircleOutline","ShieldFill","Users","WhatsAppFill","Bold","Italic","UnderLine","SettingsSlider","jsx","_jsx","icons","Icon","name","size","color","style","SelectedIcon"],"sourceRoot":"../../../src","sources":["Icon/Icon.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import Svg, { Path } from 'react-native-svg';
|
|
5
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
+
const SettingsSlider = ({
|
|
7
|
+
size = 24,
|
|
8
|
+
color = '#000',
|
|
9
|
+
style
|
|
10
|
+
}) => /*#__PURE__*/_jsx(Svg, {
|
|
11
|
+
width: size,
|
|
12
|
+
height: size + 1,
|
|
13
|
+
viewBox: "0 0 24 25",
|
|
14
|
+
fill: "none",
|
|
15
|
+
style: style,
|
|
16
|
+
children: /*#__PURE__*/_jsx(Path, {
|
|
17
|
+
d: "M9.5 7.3075C9.5 9.23749 7.93 10.8075 6 10.8075C4.07 10.8075 2.5 9.23749 2.5 7.3075C2.5 5.3775 4.07 3.8075 6 3.8075C7.93 3.8075 9.5 5.3775 9.5 7.3075ZM18 13.8075C16.07 13.8075 14.5 15.3775 14.5 17.3075C14.5 19.2375 16.07 20.8075 18 20.8075C19.93 20.8075 21.5 19.2375 21.5 17.3075C21.5 15.3775 19.93 13.8075 18 13.8075ZM21.75 7.3075C21.75 6.8935 21.414 6.5575 21 6.5575H15C14.586 6.5575 14.25 6.8935 14.25 7.3075C14.25 7.7215 14.586 8.0575 15 8.0575H21C21.414 8.0575 21.75 7.7215 21.75 7.3075ZM9.75 17.3075C9.75 16.8935 9.414 16.5575 9 16.5575H3C2.586 16.5575 2.25 16.8935 2.25 17.3075C2.25 17.7215 2.586 18.0575 3 18.0575H9C9.414 18.0575 9.75 17.7215 9.75 17.3075Z",
|
|
18
|
+
fill: color
|
|
19
|
+
})
|
|
20
|
+
});
|
|
21
|
+
export default SettingsSlider;
|
|
22
|
+
//# sourceMappingURL=SettingsSlider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","Svg","Path","jsx","_jsx","SettingsSlider","size","color","style","width","height","viewBox","fill","children","d"],"sourceRoot":"../../../../src","sources":["Icon/icons/SettingsSlider.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,GAAG,IAAIC,IAAI,QAAQ,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQ7C,MAAMC,cAA+B,GAAGA,CAAC;EACvCC,IAAI,GAAG,EAAE;EACTC,KAAK,GAAG,MAAM;EACdC;AACF,CAAC,kBACCJ,IAAA,CAACH,GAAG;EACFQ,KAAK,EAAEH,IAAK;EACZI,MAAM,EAAEJ,IAAI,GAAG,CAAE;EACjBK,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACXJ,KAAK,EAAEA,KAAM;EAAAK,QAAA,eAEbT,IAAA,CAACF,IAAI;IACHY,CAAC,EAAC,ypBAAypB;IAC3pBF,IAAI,EAAEL;EAAM,CACb;AAAC,CACC,CACN;AAED,eAAeF,cAAc","ignoreList":[]}
|
|
@@ -14,22 +14,25 @@ Komponen `Select` adalah komponen pemilihan data berbasis bottom sheet dengan du
|
|
|
14
14
|
|
|
15
15
|
## 📦 Props
|
|
16
16
|
|
|
17
|
-
| Prop
|
|
18
|
-
|
|
19
|
-
| `isOpen`
|
|
20
|
-
| `data`
|
|
21
|
-
| `multiple`
|
|
22
|
-
| `renderItem`
|
|
23
|
-
| `onSubmit`
|
|
24
|
-
| `onClose`
|
|
25
|
-
| `onSearch`
|
|
26
|
-
| `required`
|
|
27
|
-
| `loading`
|
|
28
|
-
| `delaySearch
|
|
29
|
-
| `height`
|
|
30
|
-
| `onRefresh`
|
|
31
|
-
| `header`
|
|
32
|
-
| `footer`
|
|
17
|
+
| Prop | Tipe | Default | Keterangan |
|
|
18
|
+
| ---------------- | ----------------------------------------------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------ |
|
|
19
|
+
| `isOpen` | `boolean` | `false` | Menentukan apakah bottom sheet terbuka |
|
|
20
|
+
| `data` | `ChipOptionProps[]` | - | Data pilihan untuk ditampilkan |
|
|
21
|
+
| `multiple` | `boolean` | `false` | Mengizinkan multiple selection |
|
|
22
|
+
| `renderItem` | `(item, selected, disabled) => React.ReactNode` | - | Kustom tampilan item |
|
|
23
|
+
| `onSubmit` | `(selected: ChipSelectedProps) => void` | - | Callback saat tombol submit ditekan |
|
|
24
|
+
| `onClose` | `(val: boolean) => void` | - | Callback saat bottom sheet ditutup |
|
|
25
|
+
| `onSearch` | `(val: string) => void` | - | Callback saat input pencarian berubah, dipanggil setelah debounce berdasarkan `delaySearch` |
|
|
26
|
+
| `required` | `boolean` | `false` | Jika `true`, user wajib memilih minimal 1 item sebelum bisa submit. Untuk single select, item pertama akan langsung disubmit saat dipilih. |
|
|
27
|
+
| `loading` | `boolean` | `false` | Menampilkan loading saat data di-fetch |
|
|
28
|
+
| `delaySearch` | `number` | `300` | Delay pencarian dalam milidetik |
|
|
29
|
+
| `height` | `BottomSheetHeighProps` | - | Ukuran tinggi BottomSheet |
|
|
30
|
+
| `onRefresh` | `() => void` | - | Callback saat pull-to-refresh dilakukan |
|
|
31
|
+
| `header` | ReactElement | – | Jika ingin chip mempunyai header. |
|
|
32
|
+
| `footer` | ReactElement | – | Jika ingin chip mempunyai footer. |
|
|
33
|
+
| `submitBtnLabel` | `string` | 'Lanjutkan' | Label tombol submit saat multiple select |
|
|
34
|
+
| `refreshing` | `boolean` | `false` | Status untuk pull-to-refresh |
|
|
35
|
+
| `onEndReached` | `() => void` | - | Dipanggil saat scroll mencapai akhir list |
|
|
33
36
|
|
|
34
37
|
## 📌 Contoh Penggunaan
|
|
35
38
|
|
|
@@ -69,7 +72,7 @@ const MyScreen = () => {
|
|
|
69
72
|
|
|
70
73
|
## 🔧 Catatan
|
|
71
74
|
|
|
72
|
-
- Komponen ini membutuhkan komponen-komponen pendukung:
|
|
75
|
+
- Komponen ini membutuhkan komponen-komponen pendukung:
|
|
73
76
|
- `BottomSheet`
|
|
74
77
|
- `Input`
|
|
75
78
|
- `Button`
|
|
@@ -77,4 +80,14 @@ const MyScreen = () => {
|
|
|
77
80
|
- `Loading`
|
|
78
81
|
- `Toast` (untuk validasi/error)
|
|
79
82
|
|
|
80
|
-
- Jika ingin menambahkan animasi shimmer saat loading, bisa modifikasi komponen `Loading`.
|
|
83
|
+
- Jika ingin menambahkan animasi shimmer saat loading, bisa modifikasi komponen `Loading`.
|
|
84
|
+
- Props `onSearch` digunakan untuk melakukan pencarian dinamis (server-side atau filter lokal), dan hanya akan dipanggil setelah delay tertentu sesuai nilai `delaySearch`.
|
|
85
|
+
- Jika `required` dan `multiple` bernilai `false`, maka saat user memilih item, komponen langsung akan mengirimkan nilai ke `onSubmit` dan menutup bottom sheet secara otomatis.
|
|
86
|
+
- Jika `required` bernilai `false`, user bisa toggle pilihan item (aktif/nonaktif) dan submit tanpa memilih apapun.
|
|
87
|
+
|
|
88
|
+
## ⚠️ Behavior Penting
|
|
89
|
+
|
|
90
|
+
- Jika `multiple={false}` dan `required={true}`, maka:
|
|
91
|
+
- Item yang dipilih akan langsung dikirim ke `onSubmit`.
|
|
92
|
+
- BottomSheet akan langsung tertutup tanpa menekan tombol submit.
|
|
93
|
+
- Jika `required={false}`, user bisa membatalkan pilihan (deselect), dan mengirim data kosong.
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
3
|
+
import { useCallback, useState } from 'react';
|
|
4
|
+
import { Keyboard, StyleSheet, TouchableWithoutFeedback, View } from 'react-native';
|
|
5
5
|
import BottomSheet from "../BottomSheet/BottomSheet.js";
|
|
6
6
|
import Button from "../Button/Button.js";
|
|
7
|
-
import Input from "../Input/Input.js";
|
|
8
7
|
import Chip from "../Chip/Chip.js";
|
|
9
|
-
import
|
|
8
|
+
import Input from "../Input/Input.js";
|
|
10
9
|
import Loading from "../Loading/Loading.js";
|
|
10
|
+
import { useToast } from "../Toast/ToastContext.js";
|
|
11
|
+
import { useRef } from 'react';
|
|
11
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
13
|
export default function Select({
|
|
13
14
|
isOpen,
|
|
@@ -15,7 +16,7 @@ export default function Select({
|
|
|
15
16
|
renderItem,
|
|
16
17
|
onClose,
|
|
17
18
|
onSubmit,
|
|
18
|
-
multiple,
|
|
19
|
+
multiple = false,
|
|
19
20
|
onSearch,
|
|
20
21
|
required = false,
|
|
21
22
|
loading = false,
|
|
@@ -25,10 +26,12 @@ export default function Select({
|
|
|
25
26
|
refreshing,
|
|
26
27
|
footer,
|
|
27
28
|
header,
|
|
28
|
-
onEndReached
|
|
29
|
+
onEndReached,
|
|
30
|
+
submitBtnLabel
|
|
29
31
|
}) {
|
|
30
32
|
// const [isOpenSelect, setIsOpenSelect] = useState<boolean | undefined>(false);
|
|
31
33
|
const [selected, setSelected] = useState();
|
|
34
|
+
const [searchQuery, setSearchQuery] = useState();
|
|
32
35
|
const {
|
|
33
36
|
show
|
|
34
37
|
} = useToast();
|
|
@@ -46,12 +49,20 @@ export default function Select({
|
|
|
46
49
|
show('Please fill a item');
|
|
47
50
|
return false;
|
|
48
51
|
}
|
|
49
|
-
// setIsOpenSelect(false);
|
|
50
52
|
onSubmit?.(selected ? selected : []);
|
|
51
53
|
return true;
|
|
52
54
|
};
|
|
55
|
+
const searchTimeout = useRef(null);
|
|
53
56
|
const handleOnSearch = val => {
|
|
54
|
-
|
|
57
|
+
setSearchQuery(val);
|
|
58
|
+
|
|
59
|
+
// clear timeout sebelumnya
|
|
60
|
+
if (searchTimeout.current) {
|
|
61
|
+
clearTimeout(searchTimeout.current);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
// set timeout baru
|
|
65
|
+
searchTimeout.current = setTimeout(() => {
|
|
55
66
|
onSearch?.(val);
|
|
56
67
|
}, delaySearch);
|
|
57
68
|
};
|
|
@@ -59,11 +70,12 @@ export default function Select({
|
|
|
59
70
|
onClose: val => handleOnCloseBottom(val),
|
|
60
71
|
isOpen: isOpen,
|
|
61
72
|
height: height,
|
|
62
|
-
footer: /*#__PURE__*/_jsx(Button, {
|
|
63
|
-
title:
|
|
73
|
+
footer: multiple ? /*#__PURE__*/_jsx(Button, {
|
|
74
|
+
title: submitBtnLabel ?? 'Lanjutkan',
|
|
64
75
|
color: "primary",
|
|
76
|
+
disabled: (!selected || selected.length === 0) && required,
|
|
65
77
|
onPress: handleOnPresSubmitSelect
|
|
66
|
-
}),
|
|
78
|
+
}) : undefined,
|
|
67
79
|
children: /*#__PURE__*/_jsxs(View, {
|
|
68
80
|
style: styles.container,
|
|
69
81
|
children: [/*#__PURE__*/_jsx(View, {
|
|
@@ -75,36 +87,55 @@ export default function Select({
|
|
|
75
87
|
submitBehavior: "submit",
|
|
76
88
|
icon: "Search",
|
|
77
89
|
placeholder: "Search",
|
|
90
|
+
value: searchQuery,
|
|
78
91
|
onChangeText: val => handleOnSearch(val)
|
|
79
92
|
})
|
|
80
93
|
})
|
|
81
|
-
}), loading ? /*#__PURE__*/_jsx(Loading, {}) : /*#__PURE__*/_jsx(
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
94
|
+
}), loading ? /*#__PURE__*/_jsx(Loading, {}) : /*#__PURE__*/_jsx(View, {
|
|
95
|
+
style: styles.containerChip,
|
|
96
|
+
children: /*#__PURE__*/_jsx(Chip, {
|
|
97
|
+
options: data,
|
|
98
|
+
direction: "vertical",
|
|
99
|
+
scrollable: true,
|
|
100
|
+
selected: selected,
|
|
101
|
+
multiple: multiple,
|
|
102
|
+
onEndReached: onEndReached,
|
|
103
|
+
color: "primary",
|
|
104
|
+
size: "large",
|
|
105
|
+
renderItem: renderItem,
|
|
106
|
+
onRefresh: onRefresh,
|
|
107
|
+
block: true,
|
|
108
|
+
refreshing: refreshing,
|
|
109
|
+
footer: footer,
|
|
110
|
+
header: header,
|
|
111
|
+
onSelect: item => {
|
|
112
|
+
setSelected(item);
|
|
113
|
+
if (!multiple && required) {
|
|
114
|
+
onSubmit?.(item);
|
|
115
|
+
handleOnCloseBottom(false);
|
|
116
|
+
} else if (!multiple && !required) {
|
|
117
|
+
const isSame = Array.isArray(item) && Array.isArray(selected) ? item[0] === selected?.[0] : item === selected;
|
|
118
|
+
const nextValue = !multiple && !required && isSame ? [] : item;
|
|
119
|
+
setSelected(nextValue);
|
|
120
|
+
onSubmit?.(nextValue);
|
|
121
|
+
handleOnCloseBottom(false);
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
})
|
|
97
125
|
})]
|
|
98
126
|
})
|
|
99
127
|
});
|
|
100
128
|
}
|
|
101
129
|
const styles = StyleSheet.create({
|
|
102
130
|
container: {
|
|
103
|
-
marginBottom:
|
|
131
|
+
marginBottom: 195
|
|
104
132
|
},
|
|
105
133
|
containerSearch: {
|
|
106
134
|
gap: 14,
|
|
107
|
-
|
|
135
|
+
paddingBottom: 12
|
|
136
|
+
},
|
|
137
|
+
containerChip: {
|
|
138
|
+
paddingBottom: 12
|
|
108
139
|
}
|
|
109
140
|
});
|
|
110
141
|
//# sourceMappingURL=Select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["useCallback","useState","Keyboard","StyleSheet","TouchableWithoutFeedback","View","BottomSheet","Button","Chip","Input","Loading","useToast","useRef","jsx","_jsx","jsxs","_jsxs","Select","isOpen","data","renderItem","onClose","onSubmit","multiple","onSearch","required","loading","delaySearch","height","onRefresh","refreshing","footer","header","onEndReached","submitBtnLabel","selected","setSelected","searchQuery","setSearchQuery","show","handleOnCloseBottom","val","handleOnPresSubmitSelect","length","searchTimeout","handleOnSearch","current","clearTimeout","setTimeout","title","color","disabled","onPress","undefined","children","style","styles","container","containerSearch","dismiss","accessible","submitBehavior","icon","placeholder","value","onChangeText","containerChip","options","direction","scrollable","size","block","onSelect","item","isSame","Array","isArray","nextValue","create","marginBottom","gap","paddingBottom"],"sourceRoot":"../../../src","sources":["Select/Select.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../../src/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAO,EAEL,KAAK,SAAS,EAGf,MAAM,QAAQ,CAAC;AAGhB,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,
|
|
1
|
+
{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../../src/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAO,EAEL,KAAK,SAAS,EAGf,MAAM,QAAQ,CAAC;AAGhB,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAqH7B,CAAC;AAiCF,eAAe,IAAI,CAAC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { type ChipItem } from './type';
|
|
2
|
-
export default function ChipItem({ item, isSelected, color, block, size, renderItem, isHorizontal, onPress, }: ChipItem): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export default function ChipItem({ item, isSelected, color, block, size, renderItem, isHorizontal, onPress, onLayout, }: ChipItem): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
//# sourceMappingURL=ChipItem.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChipItem.d.ts","sourceRoot":"","sources":["../../../../src/Chip/ChipItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAkB,KAAK,QAAQ,EAAwB,MAAM,QAAQ,CAAC;AAG7E,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,IAAI,EACJ,UAAU,EACV,KAAiB,EACjB,KAAK,EACL,IAAI,EACJ,UAAU,EACV,YAAY,EACZ,OAAO,
|
|
1
|
+
{"version":3,"file":"ChipItem.d.ts","sourceRoot":"","sources":["../../../../src/Chip/ChipItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAkB,KAAK,QAAQ,EAAwB,MAAM,QAAQ,CAAC;AAG7E,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,IAAI,EACJ,UAAU,EACV,KAAiB,EACjB,KAAK,EACL,IAAI,EACJ,UAAU,EACV,YAAY,EACZ,OAAO,EACP,QAAQ,GACT,EAAE,QAAQ,2CAmFV"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ColorValue } from 'react-native';
|
|
1
|
+
import type { ColorValue, LayoutChangeEvent } from 'react-native';
|
|
2
2
|
import type { ColorVariantType } from '../Color/type';
|
|
3
3
|
export declare const CHIP_COLOR_MAP: Record<ColorVariantType, {
|
|
4
4
|
backgroundColor: ColorValue;
|
|
@@ -31,6 +31,7 @@ export interface ChipItem {
|
|
|
31
31
|
renderItem?: ChipRenderItemFn;
|
|
32
32
|
isHorizontal?: boolean;
|
|
33
33
|
onPress?: (isDisabled: boolean, value: ChipOptionProps) => void;
|
|
34
|
+
onLayout?: (event: LayoutChangeEvent) => void;
|
|
34
35
|
}
|
|
35
36
|
export interface ChipProps {
|
|
36
37
|
options: ChipOptionProps[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/Chip/type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/Chip/type.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmB1B,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmB1B,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,QAAQ,CAAC;AA6GvD,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAa7B,CAAC;AAEF,eAAe,IAAI,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SettingsSlider.d.ts","sourceRoot":"","sources":["../../../../../src/Icon/icons/SettingsSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,UAAU,KAAK;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiBnC,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type ViewStyle } from 'react-native';
|
|
2
|
-
export type IconNameProps = 'Search' | 'User' | 'Eye' | 'EyeOpen' | 'ArrowRight' | 'ArrowLeft' | 'Document' | 'Calendar' | 'ExclamationMark' | 'Download' | 'x-circle' | 'StickyNote' | 'RadioButton' | 'Pdf' | 'ArrowBackAlt' | 'ArrowForwardAlt' | 'ArrowDown' | 'ArrowUp' | 'Check' | 'Filter' | 'AirPlane' | 'Camera' | 'Image' | 'Times' | 'Plus' | 'Minus' | 'Bell' | 'file-list-check' | 'file-text' | 'bookmark-user' | 'folder-clock' | 'home-fill' | 'home-outline' | 'user-circle-outline' | 'user-circle-fill' | 'clipboard-list-check' | 'clipboard-list' | 'Megaphone' | 'Scanner' | 'Clock' | 'clock-outline' | 'clipboard-list-check-outline' | 'box-outline' | 'Box' | 'plus-square' | 'at-sign' | 'briefcase-outline' | 'edit-square-outline' | 'globe-earth' | 'lock-fill' | 'logo-herca-hris' | 'question-circle-outline' | 'shield-fill' | 'Users' | 'Bold' | 'Italic' | 'UnderLine' | 'whatsapp-fill';
|
|
2
|
+
export type IconNameProps = 'Search' | 'User' | 'Eye' | 'EyeOpen' | 'ArrowRight' | 'ArrowLeft' | 'Document' | 'Calendar' | 'ExclamationMark' | 'Download' | 'x-circle' | 'StickyNote' | 'RadioButton' | 'Pdf' | 'ArrowBackAlt' | 'ArrowForwardAlt' | 'ArrowDown' | 'ArrowUp' | 'Check' | 'Filter' | 'AirPlane' | 'Camera' | 'Image' | 'Times' | 'Plus' | 'Minus' | 'Bell' | 'file-list-check' | 'file-text' | 'bookmark-user' | 'folder-clock' | 'home-fill' | 'home-outline' | 'user-circle-outline' | 'user-circle-fill' | 'clipboard-list-check' | 'clipboard-list' | 'Megaphone' | 'Scanner' | 'Clock' | 'clock-outline' | 'clipboard-list-check-outline' | 'box-outline' | 'Box' | 'plus-square' | 'at-sign' | 'briefcase-outline' | 'edit-square-outline' | 'globe-earth' | 'lock-fill' | 'logo-herca-hris' | 'question-circle-outline' | 'shield-fill' | 'Users' | 'Bold' | 'Italic' | 'UnderLine' | 'settings-slider' | 'whatsapp-fill';
|
|
3
3
|
export interface IconProps {
|
|
4
4
|
name: IconNameProps;
|
|
5
5
|
size?: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/Icon/type.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,MAAM,MAAM,aAAa,GACrB,QAAQ,GACR,MAAM,GACN,KAAK,GACL,SAAS,GACT,YAAY,GACZ,WAAW,GACX,UAAU,GACV,UAAU,GACV,iBAAiB,GACjB,UAAU,GACV,UAAU,GACV,YAAY,GACZ,aAAa,GACb,KAAK,GACL,cAAc,GACd,iBAAiB,GACjB,WAAW,GACX,SAAS,GACT,OAAO,GACP,QAAQ,GACR,UAAU,GACV,QAAQ,GACR,OAAO,GACP,OAAO,GACP,MAAM,GACN,OAAO,GACP,MAAM,GACN,iBAAiB,GACjB,WAAW,GACX,eAAe,GACf,cAAc,GACd,WAAW,GACX,cAAc,GACd,qBAAqB,GACrB,kBAAkB,GAClB,sBAAsB,GACtB,gBAAgB,GAChB,WAAW,GACX,SAAS,GACT,OAAO,GACP,eAAe,GACf,8BAA8B,GAC9B,aAAa,GACb,KAAK,GACL,aAAa,GACb,SAAS,GACT,mBAAmB,GACnB,qBAAqB,GACrB,aAAa,GACb,WAAW,GACX,iBAAiB,GACjB,yBAAyB,GACzB,aAAa,GACb,OAAO,GACP,MAAM,GACN,QAAQ,GACR,WAAW,GACX,eAAe,CAAC;AAEpB,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,aAAa,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB"}
|
|
1
|
+
{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/Icon/type.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,MAAM,MAAM,aAAa,GACrB,QAAQ,GACR,MAAM,GACN,KAAK,GACL,SAAS,GACT,YAAY,GACZ,WAAW,GACX,UAAU,GACV,UAAU,GACV,iBAAiB,GACjB,UAAU,GACV,UAAU,GACV,YAAY,GACZ,aAAa,GACb,KAAK,GACL,cAAc,GACd,iBAAiB,GACjB,WAAW,GACX,SAAS,GACT,OAAO,GACP,QAAQ,GACR,UAAU,GACV,QAAQ,GACR,OAAO,GACP,OAAO,GACP,MAAM,GACN,OAAO,GACP,MAAM,GACN,iBAAiB,GACjB,WAAW,GACX,eAAe,GACf,cAAc,GACd,WAAW,GACX,cAAc,GACd,qBAAqB,GACrB,kBAAkB,GAClB,sBAAsB,GACtB,gBAAgB,GAChB,WAAW,GACX,SAAS,GACT,OAAO,GACP,eAAe,GACf,8BAA8B,GAC9B,aAAa,GACb,KAAK,GACL,aAAa,GACb,SAAS,GACT,mBAAmB,GACnB,qBAAqB,GACrB,aAAa,GACb,WAAW,GACX,iBAAiB,GACjB,yBAAyB,GACzB,aAAa,GACb,OAAO,GACP,MAAM,GACN,QAAQ,GACR,WAAW,GACX,iBAAiB,GACjB,eAAe,CAAC;AAEpB,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,aAAa,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { type SelectProps } from './type';
|
|
2
|
-
export default function Select({ isOpen, data, renderItem, onClose, onSubmit, multiple, onSearch, required, loading, delaySearch, height, onRefresh, refreshing, footer, header, onEndReached, }: SelectProps): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export default function Select({ isOpen, data, renderItem, onClose, onSubmit, multiple, onSearch, required, loading, delaySearch, height, onRefresh, refreshing, footer, header, onEndReached, submitBtnLabel, }: SelectProps): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
//# sourceMappingURL=Select.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/Select/Select.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/Select/Select.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,QAAQ,CAAC;AAE1C,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,MAAM,EACN,IAAI,EACJ,UAAU,EACV,OAAO,EACP,QAAQ,EACR,QAAgB,EAChB,QAAQ,EACR,QAAgB,EAChB,OAAe,EACf,WAAiB,EACjB,MAAM,EACN,SAAS,EACT,UAAU,EACV,MAAM,EACN,MAAM,EACN,YAAY,EACZ,cAAc,GACf,EAAE,WAAW,2CAsHb"}
|
|
@@ -21,6 +21,7 @@ export interface SelectProps {
|
|
|
21
21
|
onRefresh?: () => void;
|
|
22
22
|
onEndReached?: () => void;
|
|
23
23
|
refreshing?: boolean;
|
|
24
|
+
submitBtnLabel?: string;
|
|
24
25
|
footer?: React.ComponentType<any> | React.ReactElement | null | undefined;
|
|
25
26
|
header?: React.ComponentType<any> | React.ReactElement | null | undefined;
|
|
26
27
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/Select/type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACvE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAEjE,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,MAAM,qBAAqB,GAAG,CAClC,IAAI,EAAE,eAAe,EACrB,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,OAAO,KACd,KAAK,CAAC,SAAS,CAAC;AAErB,MAAM,WAAW,WAAW;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,eAAe,EAAE,CAAC;IACxB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,GAAG,SAAS,CAAC;IAC1E,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,GAAG,SAAS,CAAC;CAC3E"}
|
|
1
|
+
{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/Select/type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACvE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAEjE,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,MAAM,qBAAqB,GAAG,CAClC,IAAI,EAAE,eAAe,EACrB,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,OAAO,KACd,KAAK,CAAC,SAAS,CAAC;AAErB,MAAM,WAAW,WAAW;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,eAAe,EAAE,CAAC;IACxB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,GAAG,SAAS,CAAC;IAC1E,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,GAAG,SAAS,CAAC;CAC3E"}
|
package/package.json
CHANGED
package/src/Chip/Chip.tsx
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useState, useEffect, useMemo } from 'react';
|
|
2
|
-
import { FlatList, StyleSheet } from 'react-native';
|
|
2
|
+
import { Dimensions, FlatList, StyleSheet } from 'react-native';
|
|
3
3
|
import {
|
|
4
4
|
type ChipOptionProps,
|
|
5
5
|
type ChipProps,
|
|
@@ -27,6 +27,11 @@ const Chip: React.FC<ChipProps> = ({
|
|
|
27
27
|
header,
|
|
28
28
|
}) => {
|
|
29
29
|
const isHorizontal = direction === 'horizontal';
|
|
30
|
+
const [chipItemWidth, setChipItemWidth] = useState(0);
|
|
31
|
+
const screenWidth = Dimensions.get('window').width;
|
|
32
|
+
const contaierHorizontalPadding = 24;
|
|
33
|
+
const containerHorizontalChipGap = 8;
|
|
34
|
+
const availableContainerChipWidth = screenWidth - contaierHorizontalPadding;
|
|
30
35
|
|
|
31
36
|
const normalizeSelected = (val: ChipSelectedProps) =>
|
|
32
37
|
Array.isArray(val) ? val : val ? [val] : [];
|
|
@@ -64,17 +69,23 @@ const Chip: React.FC<ChipProps> = ({
|
|
|
64
69
|
|
|
65
70
|
const numColumns = useMemo(() => {
|
|
66
71
|
if (isHorizontal || block) return 1;
|
|
67
|
-
return
|
|
68
|
-
|
|
72
|
+
return Math.floor(
|
|
73
|
+
availableContainerChipWidth / (chipItemWidth + containerHorizontalChipGap)
|
|
74
|
+
);
|
|
75
|
+
}, [block, isHorizontal, availableContainerChipWidth, chipItemWidth]);
|
|
69
76
|
|
|
70
77
|
const handleOnPresChipItem = (isDisabled: boolean, item: ChipOptionProps) => {
|
|
71
78
|
!isDisabled && handleSelect(item.value);
|
|
72
79
|
onPress?.(item.value);
|
|
73
80
|
};
|
|
74
81
|
|
|
82
|
+
const flexDirectionStyle = isHorizontal ? 'row' : 'column';
|
|
83
|
+
const alignItemsStyle = block ? 'stretch' : 'flex-start';
|
|
84
|
+
|
|
75
85
|
return (
|
|
76
86
|
<FlatList
|
|
77
87
|
data={options}
|
|
88
|
+
key={`chip-${numColumns}`}
|
|
78
89
|
renderItem={({ item }) => (
|
|
79
90
|
<ChipItem
|
|
80
91
|
item={item}
|
|
@@ -84,6 +95,14 @@ const Chip: React.FC<ChipProps> = ({
|
|
|
84
95
|
onPress={handleOnPresChipItem}
|
|
85
96
|
size={size}
|
|
86
97
|
renderItem={renderItem}
|
|
98
|
+
onLayout={
|
|
99
|
+
chipItemWidth
|
|
100
|
+
? undefined
|
|
101
|
+
: (e) => {
|
|
102
|
+
const { width } = e.nativeEvent.layout;
|
|
103
|
+
setChipItemWidth(width);
|
|
104
|
+
}
|
|
105
|
+
}
|
|
87
106
|
/>
|
|
88
107
|
)}
|
|
89
108
|
keyExtractor={(item) => String(item.value)}
|
|
@@ -97,8 +116,8 @@ const Chip: React.FC<ChipProps> = ({
|
|
|
97
116
|
contentContainerStyle={[
|
|
98
117
|
styles.container,
|
|
99
118
|
{
|
|
100
|
-
flexDirection:
|
|
101
|
-
alignItems:
|
|
119
|
+
flexDirection: flexDirectionStyle,
|
|
120
|
+
alignItems: alignItemsStyle,
|
|
102
121
|
},
|
|
103
122
|
]}
|
|
104
123
|
columnWrapperStyle={numColumns > 1 ? styles.wrapperStyle : undefined}
|
package/src/Chip/ChipItem.tsx
CHANGED
|
@@ -12,6 +12,7 @@ export default function ChipItem({
|
|
|
12
12
|
renderItem,
|
|
13
13
|
isHorizontal,
|
|
14
14
|
onPress,
|
|
15
|
+
onLayout,
|
|
15
16
|
}: ChipItem) {
|
|
16
17
|
const validColors: ColorVariantType[] = [
|
|
17
18
|
'default',
|
|
@@ -74,6 +75,7 @@ export default function ChipItem({
|
|
|
74
75
|
]}
|
|
75
76
|
onPress={() => handleOnPres(isDisabled, item)}
|
|
76
77
|
disabled={isDisabled}
|
|
78
|
+
onLayout={onLayout}
|
|
77
79
|
>
|
|
78
80
|
{renderItem ? (
|
|
79
81
|
renderItem(item, selectedState, isDisabled)
|
package/src/Chip/type.tsx
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ColorValue } from 'react-native';
|
|
1
|
+
import type { ColorValue, LayoutChangeEvent } from 'react-native';
|
|
2
2
|
import Color from '../Color/Color';
|
|
3
3
|
import type { ColorVariantType } from '../Color/type';
|
|
4
4
|
|
|
@@ -134,6 +134,7 @@ export interface ChipItem {
|
|
|
134
134
|
renderItem?: ChipRenderItemFn;
|
|
135
135
|
isHorizontal?: boolean;
|
|
136
136
|
onPress?: (isDisabled: boolean, value: ChipOptionProps) => void;
|
|
137
|
+
onLayout?: (event: LayoutChangeEvent) => void;
|
|
137
138
|
}
|
|
138
139
|
export interface ChipProps {
|
|
139
140
|
options: ChipOptionProps[];
|
package/src/Icon/Icon.tsx
CHANGED
|
@@ -59,6 +59,7 @@ import WhatsAppFill from './icons/WhatsappFill';
|
|
|
59
59
|
import Bold from './icons/Bold';
|
|
60
60
|
import Italic from './icons/Italic';
|
|
61
61
|
import UnderLine from './icons/UnderLine';
|
|
62
|
+
import SettingsSlider from './icons/SettingsSlider';
|
|
62
63
|
|
|
63
64
|
const icons: Record<
|
|
64
65
|
IconNameProps,
|
|
@@ -122,6 +123,7 @@ const icons: Record<
|
|
|
122
123
|
'Bold': Bold,
|
|
123
124
|
'Italic': Italic,
|
|
124
125
|
'UnderLine': UnderLine,
|
|
126
|
+
'settings-slider': SettingsSlider,
|
|
125
127
|
};
|
|
126
128
|
|
|
127
129
|
const Icon: React.FC<IconProps> = ({
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import Svg, { Path } from 'react-native-svg';
|
|
3
|
+
|
|
4
|
+
interface Props {
|
|
5
|
+
size?: number;
|
|
6
|
+
color?: string;
|
|
7
|
+
style?: object;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
const SettingsSlider: React.FC<Props> = ({
|
|
11
|
+
size = 24,
|
|
12
|
+
color = '#000',
|
|
13
|
+
style,
|
|
14
|
+
}) => (
|
|
15
|
+
<Svg
|
|
16
|
+
width={size}
|
|
17
|
+
height={size + 1}
|
|
18
|
+
viewBox="0 0 24 25"
|
|
19
|
+
fill="none"
|
|
20
|
+
style={style}
|
|
21
|
+
>
|
|
22
|
+
<Path
|
|
23
|
+
d="M9.5 7.3075C9.5 9.23749 7.93 10.8075 6 10.8075C4.07 10.8075 2.5 9.23749 2.5 7.3075C2.5 5.3775 4.07 3.8075 6 3.8075C7.93 3.8075 9.5 5.3775 9.5 7.3075ZM18 13.8075C16.07 13.8075 14.5 15.3775 14.5 17.3075C14.5 19.2375 16.07 20.8075 18 20.8075C19.93 20.8075 21.5 19.2375 21.5 17.3075C21.5 15.3775 19.93 13.8075 18 13.8075ZM21.75 7.3075C21.75 6.8935 21.414 6.5575 21 6.5575H15C14.586 6.5575 14.25 6.8935 14.25 7.3075C14.25 7.7215 14.586 8.0575 15 8.0575H21C21.414 8.0575 21.75 7.7215 21.75 7.3075ZM9.75 17.3075C9.75 16.8935 9.414 16.5575 9 16.5575H3C2.586 16.5575 2.25 16.8935 2.25 17.3075C2.25 17.7215 2.586 18.0575 3 18.0575H9C9.414 18.0575 9.75 17.7215 9.75 17.3075Z"
|
|
24
|
+
fill={color}
|
|
25
|
+
/>
|
|
26
|
+
</Svg>
|
|
27
|
+
);
|
|
28
|
+
|
|
29
|
+
export default SettingsSlider;
|
package/src/Icon/type.tsx
CHANGED
|
@@ -14,22 +14,25 @@ Komponen `Select` adalah komponen pemilihan data berbasis bottom sheet dengan du
|
|
|
14
14
|
|
|
15
15
|
## 📦 Props
|
|
16
16
|
|
|
17
|
-
| Prop
|
|
18
|
-
|
|
19
|
-
| `isOpen`
|
|
20
|
-
| `data`
|
|
21
|
-
| `multiple`
|
|
22
|
-
| `renderItem`
|
|
23
|
-
| `onSubmit`
|
|
24
|
-
| `onClose`
|
|
25
|
-
| `onSearch`
|
|
26
|
-
| `required`
|
|
27
|
-
| `loading`
|
|
28
|
-
| `delaySearch
|
|
29
|
-
| `height`
|
|
30
|
-
| `onRefresh`
|
|
31
|
-
| `header`
|
|
32
|
-
| `footer`
|
|
17
|
+
| Prop | Tipe | Default | Keterangan |
|
|
18
|
+
| ---------------- | ----------------------------------------------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------ |
|
|
19
|
+
| `isOpen` | `boolean` | `false` | Menentukan apakah bottom sheet terbuka |
|
|
20
|
+
| `data` | `ChipOptionProps[]` | - | Data pilihan untuk ditampilkan |
|
|
21
|
+
| `multiple` | `boolean` | `false` | Mengizinkan multiple selection |
|
|
22
|
+
| `renderItem` | `(item, selected, disabled) => React.ReactNode` | - | Kustom tampilan item |
|
|
23
|
+
| `onSubmit` | `(selected: ChipSelectedProps) => void` | - | Callback saat tombol submit ditekan |
|
|
24
|
+
| `onClose` | `(val: boolean) => void` | - | Callback saat bottom sheet ditutup |
|
|
25
|
+
| `onSearch` | `(val: string) => void` | - | Callback saat input pencarian berubah, dipanggil setelah debounce berdasarkan `delaySearch` |
|
|
26
|
+
| `required` | `boolean` | `false` | Jika `true`, user wajib memilih minimal 1 item sebelum bisa submit. Untuk single select, item pertama akan langsung disubmit saat dipilih. |
|
|
27
|
+
| `loading` | `boolean` | `false` | Menampilkan loading saat data di-fetch |
|
|
28
|
+
| `delaySearch` | `number` | `300` | Delay pencarian dalam milidetik |
|
|
29
|
+
| `height` | `BottomSheetHeighProps` | - | Ukuran tinggi BottomSheet |
|
|
30
|
+
| `onRefresh` | `() => void` | - | Callback saat pull-to-refresh dilakukan |
|
|
31
|
+
| `header` | ReactElement | – | Jika ingin chip mempunyai header. |
|
|
32
|
+
| `footer` | ReactElement | – | Jika ingin chip mempunyai footer. |
|
|
33
|
+
| `submitBtnLabel` | `string` | 'Lanjutkan' | Label tombol submit saat multiple select |
|
|
34
|
+
| `refreshing` | `boolean` | `false` | Status untuk pull-to-refresh |
|
|
35
|
+
| `onEndReached` | `() => void` | - | Dipanggil saat scroll mencapai akhir list |
|
|
33
36
|
|
|
34
37
|
## 📌 Contoh Penggunaan
|
|
35
38
|
|
|
@@ -69,7 +72,7 @@ const MyScreen = () => {
|
|
|
69
72
|
|
|
70
73
|
## 🔧 Catatan
|
|
71
74
|
|
|
72
|
-
- Komponen ini membutuhkan komponen-komponen pendukung:
|
|
75
|
+
- Komponen ini membutuhkan komponen-komponen pendukung:
|
|
73
76
|
- `BottomSheet`
|
|
74
77
|
- `Input`
|
|
75
78
|
- `Button`
|
|
@@ -77,4 +80,14 @@ const MyScreen = () => {
|
|
|
77
80
|
- `Loading`
|
|
78
81
|
- `Toast` (untuk validasi/error)
|
|
79
82
|
|
|
80
|
-
- Jika ingin menambahkan animasi shimmer saat loading, bisa modifikasi komponen `Loading`.
|
|
83
|
+
- Jika ingin menambahkan animasi shimmer saat loading, bisa modifikasi komponen `Loading`.
|
|
84
|
+
- Props `onSearch` digunakan untuk melakukan pencarian dinamis (server-side atau filter lokal), dan hanya akan dipanggil setelah delay tertentu sesuai nilai `delaySearch`.
|
|
85
|
+
- Jika `required` dan `multiple` bernilai `false`, maka saat user memilih item, komponen langsung akan mengirimkan nilai ke `onSubmit` dan menutup bottom sheet secara otomatis.
|
|
86
|
+
- Jika `required` bernilai `false`, user bisa toggle pilihan item (aktif/nonaktif) dan submit tanpa memilih apapun.
|
|
87
|
+
|
|
88
|
+
## ⚠️ Behavior Penting
|
|
89
|
+
|
|
90
|
+
- Jika `multiple={false}` dan `required={true}`, maka:
|
|
91
|
+
- Item yang dipilih akan langsung dikirim ke `onSubmit`.
|
|
92
|
+
- BottomSheet akan langsung tertutup tanpa menekan tombol submit.
|
|
93
|
+
- Jika `required={false}`, user bisa membatalkan pilihan (deselect), dan mengirim data kosong.
|
package/src/Select/Select.tsx
CHANGED
|
@@ -1,25 +1,26 @@
|
|
|
1
|
+
import { useCallback, useState } from 'react';
|
|
1
2
|
import {
|
|
2
|
-
|
|
3
|
+
Keyboard,
|
|
3
4
|
StyleSheet,
|
|
4
5
|
TouchableWithoutFeedback,
|
|
5
|
-
|
|
6
|
+
View,
|
|
6
7
|
} from 'react-native';
|
|
7
|
-
import { useState, useCallback } from 'react';
|
|
8
|
-
import { type SelectProps } from './type';
|
|
9
8
|
import BottomSheet from '../BottomSheet/BottomSheet';
|
|
10
9
|
import Button from '../Button/Button';
|
|
11
|
-
import Input from '../Input/Input';
|
|
12
10
|
import Chip from '../Chip/Chip';
|
|
13
11
|
import { type ChipSelectedProps } from '../Chip/type';
|
|
14
|
-
import
|
|
12
|
+
import Input from '../Input/Input';
|
|
15
13
|
import Loading from '../Loading/Loading';
|
|
14
|
+
import { useToast } from '../Toast/ToastContext';
|
|
15
|
+
import { type SelectProps } from './type';
|
|
16
|
+
import { useRef } from 'react';
|
|
16
17
|
export default function Select({
|
|
17
18
|
isOpen,
|
|
18
19
|
data,
|
|
19
20
|
renderItem,
|
|
20
21
|
onClose,
|
|
21
22
|
onSubmit,
|
|
22
|
-
multiple,
|
|
23
|
+
multiple = false,
|
|
23
24
|
onSearch,
|
|
24
25
|
required = false,
|
|
25
26
|
loading = false,
|
|
@@ -30,9 +31,11 @@ export default function Select({
|
|
|
30
31
|
footer,
|
|
31
32
|
header,
|
|
32
33
|
onEndReached,
|
|
34
|
+
submitBtnLabel,
|
|
33
35
|
}: SelectProps) {
|
|
34
36
|
// const [isOpenSelect, setIsOpenSelect] = useState<boolean | undefined>(false);
|
|
35
37
|
const [selected, setSelected] = useState<ChipSelectedProps>();
|
|
38
|
+
const [searchQuery, setSearchQuery] = useState<string>();
|
|
36
39
|
const { show } = useToast();
|
|
37
40
|
// useEffect(() => {
|
|
38
41
|
// setIsOpenSelect(isOpen);
|
|
@@ -52,27 +55,40 @@ export default function Select({
|
|
|
52
55
|
show('Please fill a item');
|
|
53
56
|
return false;
|
|
54
57
|
}
|
|
55
|
-
// setIsOpenSelect(false);
|
|
56
58
|
onSubmit?.(selected ? selected : []);
|
|
57
59
|
return true;
|
|
58
60
|
};
|
|
59
61
|
|
|
62
|
+
const searchTimeout = useRef<NodeJS.Timeout | null>(null);
|
|
63
|
+
|
|
60
64
|
const handleOnSearch = (val: string) => {
|
|
61
|
-
|
|
65
|
+
setSearchQuery(val);
|
|
66
|
+
|
|
67
|
+
// clear timeout sebelumnya
|
|
68
|
+
if (searchTimeout.current) {
|
|
69
|
+
clearTimeout(searchTimeout.current);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
// set timeout baru
|
|
73
|
+
searchTimeout.current = setTimeout(() => {
|
|
62
74
|
onSearch?.(val);
|
|
63
75
|
}, delaySearch);
|
|
64
76
|
};
|
|
77
|
+
|
|
65
78
|
return (
|
|
66
79
|
<BottomSheet
|
|
67
80
|
onClose={(val: boolean) => handleOnCloseBottom(val)}
|
|
68
81
|
isOpen={isOpen}
|
|
69
82
|
height={height}
|
|
70
83
|
footer={
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
84
|
+
multiple ? (
|
|
85
|
+
<Button
|
|
86
|
+
title={submitBtnLabel ?? 'Lanjutkan'}
|
|
87
|
+
color="primary"
|
|
88
|
+
disabled={(!selected || selected.length === 0) && required}
|
|
89
|
+
onPress={handleOnPresSubmitSelect}
|
|
90
|
+
/>
|
|
91
|
+
) : undefined
|
|
76
92
|
}
|
|
77
93
|
>
|
|
78
94
|
<View style={styles.container}>
|
|
@@ -85,6 +101,7 @@ export default function Select({
|
|
|
85
101
|
submitBehavior="submit"
|
|
86
102
|
icon="Search"
|
|
87
103
|
placeholder="Search"
|
|
104
|
+
value={searchQuery}
|
|
88
105
|
onChangeText={(val) => handleOnSearch(val)}
|
|
89
106
|
/>
|
|
90
107
|
</TouchableWithoutFeedback>
|
|
@@ -92,23 +109,43 @@ export default function Select({
|
|
|
92
109
|
{loading ? (
|
|
93
110
|
<Loading />
|
|
94
111
|
) : (
|
|
95
|
-
<
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
+
<View style={styles.containerChip}>
|
|
113
|
+
<Chip
|
|
114
|
+
options={data}
|
|
115
|
+
direction="vertical"
|
|
116
|
+
scrollable={true}
|
|
117
|
+
selected={selected}
|
|
118
|
+
multiple={multiple}
|
|
119
|
+
onEndReached={onEndReached}
|
|
120
|
+
color="primary"
|
|
121
|
+
size="large"
|
|
122
|
+
renderItem={renderItem}
|
|
123
|
+
onRefresh={onRefresh}
|
|
124
|
+
block
|
|
125
|
+
refreshing={refreshing}
|
|
126
|
+
footer={footer}
|
|
127
|
+
header={header}
|
|
128
|
+
onSelect={(item) => {
|
|
129
|
+
setSelected(item);
|
|
130
|
+
if (!multiple && required) {
|
|
131
|
+
onSubmit?.(item);
|
|
132
|
+
handleOnCloseBottom(false);
|
|
133
|
+
} else if (!multiple && !required) {
|
|
134
|
+
const isSame =
|
|
135
|
+
Array.isArray(item) && Array.isArray(selected)
|
|
136
|
+
? item[0] === selected?.[0]
|
|
137
|
+
: item === selected;
|
|
138
|
+
|
|
139
|
+
const nextValue =
|
|
140
|
+
!multiple && !required && isSame ? [] : item;
|
|
141
|
+
|
|
142
|
+
setSelected(nextValue);
|
|
143
|
+
onSubmit?.(nextValue);
|
|
144
|
+
handleOnCloseBottom(false);
|
|
145
|
+
}
|
|
146
|
+
}}
|
|
147
|
+
/>
|
|
148
|
+
</View>
|
|
112
149
|
)}
|
|
113
150
|
</View>
|
|
114
151
|
</BottomSheet>
|
|
@@ -117,10 +154,13 @@ export default function Select({
|
|
|
117
154
|
|
|
118
155
|
const styles = StyleSheet.create({
|
|
119
156
|
container: {
|
|
120
|
-
marginBottom:
|
|
157
|
+
marginBottom: 195,
|
|
121
158
|
},
|
|
122
159
|
containerSearch: {
|
|
123
160
|
gap: 14,
|
|
124
|
-
|
|
161
|
+
paddingBottom: 12,
|
|
162
|
+
},
|
|
163
|
+
containerChip: {
|
|
164
|
+
paddingBottom: 12,
|
|
125
165
|
},
|
|
126
166
|
});
|
package/src/Select/type.tsx
CHANGED
|
@@ -28,6 +28,7 @@ export interface SelectProps {
|
|
|
28
28
|
onRefresh?: () => void;
|
|
29
29
|
onEndReached?: () => void;
|
|
30
30
|
refreshing?: boolean;
|
|
31
|
+
submitBtnLabel?: string;
|
|
31
32
|
footer?: React.ComponentType<any> | React.ReactElement | null | undefined;
|
|
32
33
|
header?: React.ComponentType<any> | React.ReactElement | null | undefined;
|
|
33
34
|
}
|