@bigbinary/neetoui-rn 0.0.211 → 0.0.213
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/index.d.ts +16 -15
- package/lib/components/BottomSheet.js +1 -1
- package/lib/components/MultiSelect.js +1 -1
- package/lib/components/OrganizationItem.js +1 -1
- package/package.json +1 -1
- package/src/components/BottomSheet.js +10 -1
- package/src/components/MultiSelect.js +7 -0
- package/src/components/OrganizationItem.js +28 -35
package/index.d.ts
CHANGED
|
@@ -67,11 +67,11 @@ const theme: {
|
|
|
67
67
|
|
|
68
68
|
interface StyleProps
|
|
69
69
|
extends FlexboxProps,
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
70
|
+
SpaceProps,
|
|
71
|
+
BorderProps,
|
|
72
|
+
ColorProps,
|
|
73
|
+
LayoutProps,
|
|
74
|
+
PositionProps {
|
|
75
75
|
borderColor?: typeof theme.colors.border;
|
|
76
76
|
borderTopColor?: typeof theme.colors.border;
|
|
77
77
|
borderBottomColor?: typeof theme.colors.border;
|
|
@@ -95,11 +95,11 @@ interface TextProps extends RNTextProps, StyleProps, TypographyProps {
|
|
|
95
95
|
}
|
|
96
96
|
interface TextInputProps
|
|
97
97
|
extends RNTextInputAndroidProps,
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
interface FlatListProps extends RNFlatListProps, StyleProps {
|
|
102
|
-
interface ScrollViewProps extends RNScrollViewProps, StyleProps {
|
|
98
|
+
RNTextInputIOSProps,
|
|
99
|
+
StyleProps,
|
|
100
|
+
TypographyProps {}
|
|
101
|
+
interface FlatListProps extends RNFlatListProps, StyleProps {}
|
|
102
|
+
interface ScrollViewProps extends RNScrollViewProps, StyleProps {}
|
|
103
103
|
interface TouchableProps extends RippleProps, StyleProps, ButtonStyleProps {
|
|
104
104
|
children?: React.ReactNode;
|
|
105
105
|
}
|
|
@@ -139,7 +139,7 @@ interface AnimatedImageProps extends RNImageProps, FastImageProps {
|
|
|
139
139
|
|
|
140
140
|
interface AvatarProps extends ViewProps {
|
|
141
141
|
name?: string;
|
|
142
|
-
variant?: "extra-small" |"small" | "medium";
|
|
142
|
+
variant?: "extra-small" | "small" | "medium";
|
|
143
143
|
bgColor?: typeof theme.colors.background;
|
|
144
144
|
fontColor?: typeof theme.colors.font;
|
|
145
145
|
imageUrl?: string;
|
|
@@ -179,6 +179,7 @@ interface BottomSheetProps extends ViewProps {
|
|
|
179
179
|
onDonePress?: () => void;
|
|
180
180
|
valueExtractor?: () => {};
|
|
181
181
|
labelExtractor?: () => {};
|
|
182
|
+
searchbarProps?: SearchBarProps;
|
|
182
183
|
}
|
|
183
184
|
|
|
184
185
|
interface ButtonProps extends TouchableProps {
|
|
@@ -341,6 +342,7 @@ interface MultiSelectProps extends ViewProps {
|
|
|
341
342
|
maxItemSize?: number;
|
|
342
343
|
moreItemLabelContainerStyle?: ViewStyle;
|
|
343
344
|
moreItemLabelStyle?: TextStyle;
|
|
345
|
+
searchbarProps?: SearchBarProps;
|
|
344
346
|
}
|
|
345
347
|
|
|
346
348
|
type OnBoardingProps = {
|
|
@@ -352,12 +354,11 @@ type OnBoardingProps = {
|
|
|
352
354
|
|
|
353
355
|
interface OrganizationItemProps extends ViewProps {
|
|
354
356
|
label?: string;
|
|
355
|
-
|
|
356
|
-
containerProps?: ViewProps;
|
|
357
|
+
labelContainerProps?: ViewProps;
|
|
357
358
|
iconContainerProps?: ViewProps;
|
|
358
359
|
iconProps?: { size: number; color: typeof theme.colors.font; name: string };
|
|
359
|
-
textContainerProps?: ViewProps;
|
|
360
360
|
labelProps?: TypographyProps;
|
|
361
|
+
name: string;
|
|
361
362
|
nameProps?: TypographyProps;
|
|
362
363
|
}
|
|
363
364
|
|
|
@@ -381,7 +382,7 @@ interface ParentViewProps extends ViewProps {
|
|
|
381
382
|
interface PopoverItemProps {
|
|
382
383
|
Icon?: React.FC;
|
|
383
384
|
label?: string;
|
|
384
|
-
labelProps?: TypographyProps
|
|
385
|
+
labelProps?: TypographyProps;
|
|
385
386
|
}
|
|
386
387
|
type RNPopoverProps = typeof RNPopover.propTypes;
|
|
387
388
|
interface PopoverProps extends RNPopoverProps {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.BottomSheet=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeModal=_interopRequireDefault(require("react-native-modal"));var _reactNativeSafeAreaContext=require("react-native-safe-area-context");var _=require("./");var _theme=require("../theme");var _excluded=["showCreateOption","CreateItemComponent","showCreateOptionLoader","createSearchedOptionLabelStyle","createOptionLabel","onPressCreateOption","createSearchedOptionContainerStyle","data","title","hide","isVisible","onItemPress","bg","children","titleContainerStyle","titleTextStyle","modalParams","HeaderComponent","ContentRow","contentType","canSearch","onDonePress","disabled","noResultsLabelContainerStyle","noResultsLabelStyle","noResultsLabel","NoResultsComponent","labelExtractor","valueExtractor","selectedItem","onBackdropPress"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/BottomSheet.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Title=function Title(_ref){var title=_ref.title,bg=_ref.bg,isVisible=_ref.isVisible,hide=_ref.hide,titleContainerStyle=_ref.titleContainerStyle,titleTextStyle=_ref.titleTextStyle,contentType=_ref.contentType,canSearch=_ref.canSearch,setSearchText=_ref.setSearchText,onDonePress=_ref.onDonePress;var touchY;(0,_react.useEffect)(function(){setSearchText("");},[isVisible,setSearchText]);return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_.Container,(0,_extends2.default)({bg:bg,onTouchStart:function onTouchStart(e){return touchY=e.nativeEvent.pageY;},onTouchEnd:function onTouchEnd(e){if(e.nativeEvent.pageY-touchY>20)hide();},pb:12,borderRadius:20},titleContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:35,columnNumber:7}}),_react.default.createElement(_.Container,{mb:16,flexDirection:"row",justifyContent:"space-between",__self:_this,__source:{fileName:_jsxFileName,lineNumber:46,columnNumber:9}},title&&_react.default.createElement(_.Typography,(0,_extends2.default)({textStyle:"modalHeader"},titleTextStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:48,columnNumber:13}}),title),contentType&&_react.default.createElement(_.Touchable,{onPress:function onPress(){hide();onDonePress();},__self:_this,__source:{fileName:_jsxFileName,lineNumber:53,columnNumber:13}},_react.default.createElement(_.Typography,{textStyle:"modalHeader",color:"font.purple500",__self:_this,__source:{fileName:_jsxFileName,lineNumber:59,columnNumber:15}},"Done"))),canSearch&&_react.default.createElement(_.SearchBar,{debounceDelay:200,placeholder:"Search",onChangeText:setSearchText,onCancel:function onCancel(){setSearchText("");},showCancelButton:false,__self:_this,__source:{fileName:_jsxFileName,lineNumber:67,columnNumber:11}})));};Title.propTypes={title:_propTypes.default.string,isVisible:_propTypes.default.bool,hide:_propTypes.default.func,bg:_propTypes.default.string,titleContainerStyle:_propTypes.default.object,titleTextStyle:_propTypes.default.object,contentType:_propTypes.default.oneOf(["checkbox",null]),canSearch:_propTypes.default.bool,setSearchText:_propTypes.default.func,onDonePress:_propTypes.default.func};var BottomSheet=function BottomSheet(_ref2){var showCreateOption=_ref2.showCreateOption,CreateItemComponent=_ref2.CreateItemComponent,showCreateOptionLoader=_ref2.showCreateOptionLoader,createSearchedOptionLabelStyle=_ref2.createSearchedOptionLabelStyle,createOptionLabel=_ref2.createOptionLabel,onPressCreateOption=_ref2.onPressCreateOption,createSearchedOptionContainerStyle=_ref2.createSearchedOptionContainerStyle,_ref2$data=_ref2.data,data=_ref2$data===void 0?[]:_ref2$data,title=_ref2.title,hide=_ref2.hide,isVisible=_ref2.isVisible,onItemPress=_ref2.onItemPress,bg=_ref2.bg,children=_ref2.children,titleContainerStyle=_ref2.titleContainerStyle,titleTextStyle=_ref2.titleTextStyle,modalParams=_ref2.modalParams,HeaderComponent=_ref2.HeaderComponent,ContentRow=_ref2.ContentRow,contentType=_ref2.contentType,canSearch=_ref2.canSearch,onDonePress=_ref2.onDonePress,disabled=_ref2.disabled,noResultsLabelContainerStyle=_ref2.noResultsLabelContainerStyle,noResultsLabelStyle=_ref2.noResultsLabelStyle,noResultsLabel=_ref2.noResultsLabel,NoResultsComponent=_ref2.NoResultsComponent,labelExtractor=_ref2.labelExtractor,valueExtractor=_ref2.valueExtractor,selectedItem=_ref2.selectedItem,_onBackdropPress=_ref2.onBackdropPress,rest=(0,_objectWithoutProperties2.default)(_ref2,_excluded);var _useState=(0,_react.useState)(""),_useState2=(0,_slicedToArray2.default)(_useState,2),searchText=_useState2[0],setSearchText=_useState2[1];var getLabel=function getLabel(item,index){return(item==null?void 0:item.label)||labelExtractor(item,index)||item;};var generateData=function generateData(){if(searchText.length){return data.filter(function(item){return getLabel(item).toLowerCase().includes(searchText.toLowerCase());});}else{return data;}};var hideCreateComponent=function hideCreateComponent(){var filteredItemCount=generateData().filter(function(data){return getLabel(data).toLocaleLowerCase()===searchText.toLocaleLowerCase();}).length;return filteredItemCount>0;};var checkIsSelected=function checkIsSelected(item){var itemValue=(item==null?void 0:item.value)||valueExtractor(item)||item;var selectedItemValue=(selectedItem==null?void 0:selectedItem.value)||valueExtractor(selectedItem)||selectedItem;return itemValue===selectedItemValue;};return _react.default.createElement(_reactNativeModal.default,(0,_extends2.default)({style:styles.modalStyle,isVisible:isVisible,onBackdropPress:function onBackdropPress(){_onBackdropPress();hide();},useNativeDriver:true,avoidKeyboard:true,hideModalContentWhileAnimating:true,animationInTiming:600,animationOutTiming:600,onRequestClose:hide},modalParams,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:203,columnNumber:5}}),_react.default.createElement(_reactNativeSafeAreaContext.SafeAreaView,{style:styles.safeAreaView,__self:_this,__source:{fileName:_jsxFileName,lineNumber:218,columnNumber:7}},_react.default.createElement(_.Container,(0,_extends2.default)({bg:bg,borderTopRightRadius:20,borderTopLeftRadius:20,p:16,flexShrink:1},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:219,columnNumber:9}}),title&&_react.default.createElement(Title,{bg:bg,title:title,isVisible:isVisible,hide:hide,titleContainerStyle:titleContainerStyle,titleTextStyle:titleTextStyle,HeaderComponent:HeaderComponent,contentType:contentType,canSearch:canSearch,searchText:searchText,setSearchText:setSearchText,onDonePress:onDonePress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:228,columnNumber:13}}),data&&_react.default.createElement(_reactNative.FlatList,{ListFooterComponent:_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:247,columnNumber:17}},children,!!searchText&&!generateData().length&&!showCreateOption&&(NoResultsComponent?_react.default.createElement(NoResultsComponent,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:253,columnNumber:23}}):_react.default.createElement(_.Container,(0,_extends2.default)({alignItems:"center",py:2,mb:2},noResultsLabelContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:255,columnNumber:23}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"sf600",fontSize:"s",color:"font.grey"},noResultsLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:261,columnNumber:25}}),noResultsLabel||"No options found"))),!disabled&&!hideCreateComponent()&&(showCreateOptionLoader?_react.default.createElement(_reactNative.ActivityIndicator,{size:"small",color:_theme.theme.colors.background.base,__self:_this,__source:{fileName:_jsxFileName,lineNumber:275,columnNumber:23}}):!!searchText&&showCreateOption&&_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:282,columnNumber:25}},CreateItemComponent?_react.default.createElement(CreateItemComponent,{searchText:searchText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:284,columnNumber:29}}):_react.default.createElement(_.Touchable,(0,_extends2.default)({height:40,justifyContent:"center",alignItems:"center",onPress:function onPress(){return onPressCreateOption(searchText);}},createSearchedOptionContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:286,columnNumber:29}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"sf400",fontSize:"s",color:"font.grey"},createSearchedOptionLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:293,columnNumber:31}}),createOptionLabel||"Create "+searchText+" option"))))),initialNumToRender:data.length,onScrollBeginDrag:_reactNative.Keyboard.dismiss,data:generateData(),renderItem:function renderItem(_ref3){var item=_ref3.item,index=_ref3.index;return _react.default.createElement(ContentRow,{isSelected:checkIsSelected(item),key:index,onPress:function onPress(){!contentType&&hide();onItemPress({index:index,item:item});},index:index,item:item,__self:_this,__source:{fileName:_jsxFileName,lineNumber:314,columnNumber:19}});},keyExtractor:function keyExtractor(item,index){return index;},__self:_this,__source:{fileName:_jsxFileName,lineNumber:245,columnNumber:13}}))));};exports.BottomSheet=BottomSheet;BottomSheet.defaultProps={bg:"background.primary",showCreateOption:false,showCreateOptionLoader:false,createOptionLabel:null,onPressCreateOption:function onPressCreateOption(){},CreateItemComponent:null,onDonePress:function onDonePress(){},valueExtractor:function valueExtractor(){},labelExtractor:function labelExtractor(){},onBackdropPress:function onBackdropPress(){}};BottomSheet.propTypes={data:_propTypes.default.array,title:_propTypes.default.string,isVisible:_propTypes.default.bool,hide:_propTypes.default.func,onItemPress:_propTypes.default.func,onDonePress:_propTypes.default.func,bg:_propTypes.default.string,titleContainerStyle:_propTypes.default.object,titleTextStyle:_propTypes.default.object,showCreateOption:_propTypes.default.bool,showCreateOptionLoader:_propTypes.default.bool,createOptionLabel:_propTypes.default.string,onPressCreateOption:_propTypes.default.func,CreateItemComponent:_propTypes.default.node,createSearchedOptionLabelStyle:_propTypes.default.object,disabled:_propTypes.default.bool,createSearchedOptionContainerStyle:_propTypes.default.object,noResultsLabelContainerStyle:_propTypes.default.object,noResultsLabelStyle:_propTypes.default.object,noResultsLabel:_propTypes.default.string,NoResultsComponent:_propTypes.default.node,labelExtractor:_propTypes.default.func,valueExtractor:_propTypes.default.func,onBackdropPress:_propTypes.default.func,selectedItem:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.string]),modalParams:_propTypes.default.object,children:_propTypes.default.node,HeaderComponent:_propTypes.default.elementType,ContentRow:_propTypes.default.elementType,contentType:_propTypes.default.oneOf(["checkbox",null]),canSearch:_propTypes.default.bool};var styles=_reactNative.StyleSheet.create({safeAreaView:{maxHeight:"70%",backgroundColor:_theme.theme.colors.background.primary,borderTopRightRadius:20,borderTopLeftRadius:20},modalStyle:{margin:0,justifyContent:"flex-end",flex:1},inputContainerStyle:{backgroundColor:"white",borderRadius:10}});
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.BottomSheet=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeModal=_interopRequireDefault(require("react-native-modal"));var _reactNativeSafeAreaContext=require("react-native-safe-area-context");var _=require("./");var _theme=require("../theme");var _excluded=["showCreateOption","CreateItemComponent","showCreateOptionLoader","createSearchedOptionLabelStyle","createOptionLabel","onPressCreateOption","createSearchedOptionContainerStyle","data","title","hide","isVisible","onItemPress","bg","children","titleContainerStyle","titleTextStyle","modalParams","HeaderComponent","ContentRow","contentType","canSearch","onDonePress","disabled","noResultsLabelContainerStyle","noResultsLabelStyle","noResultsLabel","NoResultsComponent","labelExtractor","valueExtractor","selectedItem","onBackdropPress","searchBarProps"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/BottomSheet.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Title=function Title(_ref){var title=_ref.title,bg=_ref.bg,isVisible=_ref.isVisible,hide=_ref.hide,titleContainerStyle=_ref.titleContainerStyle,titleTextStyle=_ref.titleTextStyle,contentType=_ref.contentType,canSearch=_ref.canSearch,setSearchText=_ref.setSearchText,onDonePress=_ref.onDonePress,searchBarProps=_ref.searchBarProps;var touchY;(0,_react.useEffect)(function(){setSearchText("");},[isVisible,setSearchText]);return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_.Container,(0,_extends2.default)({bg:bg,onTouchStart:function onTouchStart(e){return touchY=e.nativeEvent.pageY;},onTouchEnd:function onTouchEnd(e){if(e.nativeEvent.pageY-touchY>20)hide();},pb:12,borderRadius:20},titleContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:36,columnNumber:7}}),_react.default.createElement(_.Container,{mb:16,flexDirection:"row",justifyContent:"space-between",__self:_this,__source:{fileName:_jsxFileName,lineNumber:47,columnNumber:9}},title&&_react.default.createElement(_.Typography,(0,_extends2.default)({textStyle:"modalHeader"},titleTextStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:49,columnNumber:13}}),title),contentType&&_react.default.createElement(_.Touchable,{onPress:function onPress(){hide();onDonePress();},__self:_this,__source:{fileName:_jsxFileName,lineNumber:54,columnNumber:13}},_react.default.createElement(_.Typography,{textStyle:"modalHeader",color:"font.purple500",__self:_this,__source:{fileName:_jsxFileName,lineNumber:60,columnNumber:15}},"Done"))),canSearch&&_react.default.createElement(_.SearchBar,(0,_extends2.default)({debounceDelay:200,placeholder:"Search",onChangeText:setSearchText,onCancel:function onCancel(){setSearchText("");},showCancelButton:false},searchBarProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:67,columnNumber:11}}))));};Title.propTypes={title:_propTypes.default.string,isVisible:_propTypes.default.bool,hide:_propTypes.default.func,bg:_propTypes.default.string,titleContainerStyle:_propTypes.default.object,titleTextStyle:_propTypes.default.object,contentType:_propTypes.default.oneOf(["checkbox",null]),canSearch:_propTypes.default.bool,setSearchText:_propTypes.default.func,onDonePress:_propTypes.default.func,searchBarProps:_propTypes.default.object};var BottomSheet=function BottomSheet(_ref2){var showCreateOption=_ref2.showCreateOption,CreateItemComponent=_ref2.CreateItemComponent,showCreateOptionLoader=_ref2.showCreateOptionLoader,createSearchedOptionLabelStyle=_ref2.createSearchedOptionLabelStyle,createOptionLabel=_ref2.createOptionLabel,onPressCreateOption=_ref2.onPressCreateOption,createSearchedOptionContainerStyle=_ref2.createSearchedOptionContainerStyle,_ref2$data=_ref2.data,data=_ref2$data===void 0?[]:_ref2$data,title=_ref2.title,hide=_ref2.hide,isVisible=_ref2.isVisible,onItemPress=_ref2.onItemPress,bg=_ref2.bg,children=_ref2.children,titleContainerStyle=_ref2.titleContainerStyle,titleTextStyle=_ref2.titleTextStyle,modalParams=_ref2.modalParams,HeaderComponent=_ref2.HeaderComponent,ContentRow=_ref2.ContentRow,contentType=_ref2.contentType,canSearch=_ref2.canSearch,onDonePress=_ref2.onDonePress,disabled=_ref2.disabled,noResultsLabelContainerStyle=_ref2.noResultsLabelContainerStyle,noResultsLabelStyle=_ref2.noResultsLabelStyle,noResultsLabel=_ref2.noResultsLabel,NoResultsComponent=_ref2.NoResultsComponent,labelExtractor=_ref2.labelExtractor,valueExtractor=_ref2.valueExtractor,selectedItem=_ref2.selectedItem,_onBackdropPress=_ref2.onBackdropPress,searchBarProps=_ref2.searchBarProps,rest=(0,_objectWithoutProperties2.default)(_ref2,_excluded);var _useState=(0,_react.useState)(""),_useState2=(0,_slicedToArray2.default)(_useState,2),searchText=_useState2[0],setSearchText=_useState2[1];var getLabel=function getLabel(item,index){return(item==null?void 0:item.label)||labelExtractor(item,index)||item;};var generateData=function generateData(){if(searchText.length){return data.filter(function(item){return getLabel(item).toLowerCase().includes(searchText.toLowerCase());});}else{return data;}};var hideCreateComponent=function hideCreateComponent(){var filteredItemCount=generateData().filter(function(data){return getLabel(data).toLocaleLowerCase()===searchText.toLocaleLowerCase();}).length;return filteredItemCount>0;};var checkIsSelected=function checkIsSelected(item){var itemValue=(item==null?void 0:item.value)||valueExtractor(item)||item;var selectedItemValue=(selectedItem==null?void 0:selectedItem.value)||valueExtractor(selectedItem)||selectedItem;return itemValue===selectedItemValue;};return _react.default.createElement(_reactNativeModal.default,(0,_extends2.default)({style:styles.modalStyle,isVisible:isVisible,onBackdropPress:function onBackdropPress(){_onBackdropPress();hide();},useNativeDriver:true,avoidKeyboard:true,hideModalContentWhileAnimating:true,animationInTiming:600,animationOutTiming:600,onRequestClose:hide},modalParams,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:206,columnNumber:5}}),_react.default.createElement(_reactNativeSafeAreaContext.SafeAreaView,{style:styles.safeAreaView,__self:_this,__source:{fileName:_jsxFileName,lineNumber:221,columnNumber:7}},_react.default.createElement(_.Container,(0,_extends2.default)({bg:bg,borderTopRightRadius:20,borderTopLeftRadius:20,p:16,flexShrink:1},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:222,columnNumber:9}}),title&&_react.default.createElement(Title,{bg:bg,title:title,isVisible:isVisible,hide:hide,titleContainerStyle:titleContainerStyle,titleTextStyle:titleTextStyle,HeaderComponent:HeaderComponent,contentType:contentType,canSearch:canSearch,searchText:searchText,setSearchText:setSearchText,onDonePress:onDonePress,searchBarProps:searchBarProps,__self:_this,__source:{fileName:_jsxFileName,lineNumber:231,columnNumber:13}}),data&&_react.default.createElement(_reactNative.FlatList,{ListFooterComponent:_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:251,columnNumber:17}},children,!!searchText&&!generateData().length&&!showCreateOption&&(NoResultsComponent?_react.default.createElement(NoResultsComponent,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:257,columnNumber:23}}):_react.default.createElement(_.Container,(0,_extends2.default)({alignItems:"center",py:2,mb:2},noResultsLabelContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:259,columnNumber:23}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"sf600",fontSize:"s",color:"font.grey"},noResultsLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:265,columnNumber:25}}),noResultsLabel||"No options found"))),!disabled&&!hideCreateComponent()&&(showCreateOptionLoader?_react.default.createElement(_reactNative.ActivityIndicator,{size:"small",color:_theme.theme.colors.background.base,__self:_this,__source:{fileName:_jsxFileName,lineNumber:279,columnNumber:23}}):!!searchText&&showCreateOption&&_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:286,columnNumber:25}},CreateItemComponent?_react.default.createElement(CreateItemComponent,{searchText:searchText,__self:_this,__source:{fileName:_jsxFileName,lineNumber:288,columnNumber:29}}):_react.default.createElement(_.Touchable,(0,_extends2.default)({height:40,justifyContent:"center",alignItems:"center",onPress:function onPress(){return onPressCreateOption(searchText);}},createSearchedOptionContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:290,columnNumber:29}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"sf400",fontSize:"s",color:"font.grey"},createSearchedOptionLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:297,columnNumber:31}}),createOptionLabel||"Create "+searchText+" option"))))),initialNumToRender:data.length,onScrollBeginDrag:_reactNative.Keyboard.dismiss,data:generateData(),renderItem:function renderItem(_ref3){var item=_ref3.item,index=_ref3.index;return _react.default.createElement(ContentRow,{isSelected:checkIsSelected(item),key:index,onPress:function onPress(){!contentType&&hide();onItemPress({index:index,item:item});},index:index,item:item,__self:_this,__source:{fileName:_jsxFileName,lineNumber:318,columnNumber:19}});},keyExtractor:function keyExtractor(item,index){return index;},__self:_this,__source:{fileName:_jsxFileName,lineNumber:249,columnNumber:13}}))));};exports.BottomSheet=BottomSheet;BottomSheet.defaultProps={bg:"background.primary",showCreateOption:false,showCreateOptionLoader:false,createOptionLabel:null,onPressCreateOption:function onPressCreateOption(){},CreateItemComponent:null,onDonePress:function onDonePress(){},valueExtractor:function valueExtractor(){},labelExtractor:function labelExtractor(){},onBackdropPress:function onBackdropPress(){},searchBarProps:{}};BottomSheet.propTypes={data:_propTypes.default.array,title:_propTypes.default.string,isVisible:_propTypes.default.bool,hide:_propTypes.default.func,onItemPress:_propTypes.default.func,onDonePress:_propTypes.default.func,bg:_propTypes.default.string,titleContainerStyle:_propTypes.default.object,titleTextStyle:_propTypes.default.object,showCreateOption:_propTypes.default.bool,showCreateOptionLoader:_propTypes.default.bool,createOptionLabel:_propTypes.default.string,onPressCreateOption:_propTypes.default.func,CreateItemComponent:_propTypes.default.node,createSearchedOptionLabelStyle:_propTypes.default.object,disabled:_propTypes.default.bool,createSearchedOptionContainerStyle:_propTypes.default.object,noResultsLabelContainerStyle:_propTypes.default.object,noResultsLabelStyle:_propTypes.default.object,noResultsLabel:_propTypes.default.string,NoResultsComponent:_propTypes.default.node,labelExtractor:_propTypes.default.func,valueExtractor:_propTypes.default.func,onBackdropPress:_propTypes.default.func,selectedItem:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.string]),searchBarProps:_propTypes.default.object,modalParams:_propTypes.default.object,children:_propTypes.default.node,HeaderComponent:_propTypes.default.elementType,ContentRow:_propTypes.default.elementType,contentType:_propTypes.default.oneOf(["checkbox",null]),canSearch:_propTypes.default.bool};var styles=_reactNative.StyleSheet.create({safeAreaView:{maxHeight:"70%",backgroundColor:_theme.theme.colors.background.primary,borderTopRightRadius:20,borderTopLeftRadius:20},modalStyle:{margin:0,justifyContent:"flex-end",flex:1},inputContainerStyle:{backgroundColor:"white",borderRadius:10}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.MultiSelect=void 0;var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _native=_interopRequireWildcard(require("styled-components/native"));var _styledSystem=require("styled-system");var _=require("./");var _excluded=["options","label","value","labelExtractor","valueExtractor","onSelect","deletedValue","isLoading","isSearchable","showCreateOption","labelStyle","containerStyle","inputContainerStyle","dropdownContainerStyle","itemContainerStyle","multiSelectedItemContainerStyle","multiSelectedItemLabelStyle","selectedValue","CreateItemComponent","showCreateOptionLoader","createSearchedOptionLabelStyle","onPressCreateOption","createSearchedOptionContainerStyle","onDonePress","disabled","noResultsLabelContainerStyle","noResultsLabelStyle","noResultsLabel","NoResultsComponent","maxItemSize","moreItemLabelContainerStyle","moreItemLabelStyle","MoreItemComponent","onBackdropPress"];var _templateObject,_this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/MultiSelect.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Typography=_native.default.Text(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2.default)(["\n ","\n ","\n ","\n ","\n ","\n ","\n ","\n ","\n"])),_styledSystem.textStyle,_styledSystem.space,_styledSystem.layout,_styledSystem.flexbox,_styledSystem.typography,_styledSystem.color,_styledSystem.position,(0,_styledSystem.system)({textDecoration:{property:"textDecoration",cssProperty:"textDecoration"},textTransform:{property:"textTransform",cssProperty:"textTransform"}}));var MultiSelectItem=function MultiSelectItem(_ref){var label=_ref.label,onUnselect=_ref.onUnselect,multiSelectedItemContainerStyle=_ref.multiSelectedItemContainerStyle,multiSelectedItemLabelStyle=_ref.multiSelectedItemLabelStyle,disabled=_ref.disabled;var theme=(0,_react.useContext)(_native.ThemeContext);return _react.default.createElement(_.Container,(0,_extends2.default)({bg:"background.secondary",borderRadius:12,flexDirection:"row",alignItems:"center",justifyContent:"space-between",px:2,py:1,m:1},multiSelectedItemContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:55,columnNumber:5}}),_react.default.createElement(Typography,(0,_extends2.default)({fontFamily:"sf400",fontSize:"s",mr:2,color:"font.grey800"},multiSelectedItemLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:66,columnNumber:7}}),label),!disabled&&_react.default.createElement(_reactNative.TouchableWithoutFeedback,{disabled:disabled,onPress:onUnselect,__self:_this,__source:{fileName:_jsxFileName,lineNumber:76,columnNumber:9}},_react.default.createElement(_reactNativeRemixIcon.default,{name:"ri-close-line",size:"20",color:theme.colors.font.grey800,__self:_this,__source:{fileName:_jsxFileName,lineNumber:77,columnNumber:11}})));};MultiSelectItem.propTypes={label:_propTypes.default.string,onUnselect:_propTypes.default.func,multiSelectedItemContainerStyle:_propTypes.default.object,multiSelectedItemLabelStyle:_propTypes.default.object,disabled:_propTypes.default.bool};var DropdownItem=function DropdownItem(_ref2){var label=_ref2.label,onPress=_ref2.onPress,defaultDropdownItemHeight=_ref2.defaultDropdownItemHeight,itemContainerStyle=_ref2.itemContainerStyle,itemLabelStyle=_ref2.itemLabelStyle;return _react.default.createElement(_.Touchable,{bg:"background.white",onPress:onPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:104,columnNumber:5}},_react.default.createElement(_.Container,(0,_extends2.default)({height:defaultDropdownItemHeight,p:2},itemContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:105,columnNumber:7}}),_react.default.createElement(Typography,(0,_extends2.default)({fontFamily:"sf400",fontSize:"s",color:"font.grey"},itemLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:110,columnNumber:9}}),label)));};DropdownItem.propTypes={label:_propTypes.default.string,onPress:_propTypes.default.func,defaultDropdownItemHeight:_propTypes.default.number,itemContainerStyle:_propTypes.default.object,itemLabelStyle:_propTypes.default.object};var AnimatedLabel=_reactNativeReanimated.default.createAnimatedComponent(Typography);var MultiSelect=function MultiSelect(_ref3){var options=_ref3.options,label=_ref3.label,value=_ref3.value,labelExtractor=_ref3.labelExtractor,valueExtractor=_ref3.valueExtractor,onSelect=_ref3.onSelect,deletedValue=_ref3.deletedValue,isLoading=_ref3.isLoading,isSearchable=_ref3.isSearchable,showCreateOption=_ref3.showCreateOption,labelStyle=_ref3.labelStyle,containerStyle=_ref3.containerStyle,inputContainerStyle=_ref3.inputContainerStyle,dropdownContainerStyle=_ref3.dropdownContainerStyle,itemContainerStyle=_ref3.itemContainerStyle,multiSelectedItemContainerStyle=_ref3.multiSelectedItemContainerStyle,multiSelectedItemLabelStyle=_ref3.multiSelectedItemLabelStyle,selectedValue=_ref3.selectedValue,CreateItemComponent=_ref3.CreateItemComponent,showCreateOptionLoader=_ref3.showCreateOptionLoader,createSearchedOptionLabelStyle=_ref3.createSearchedOptionLabelStyle,onPressCreateOption=_ref3.onPressCreateOption,createSearchedOptionContainerStyle=_ref3.createSearchedOptionContainerStyle,onDonePress=_ref3.onDonePress,disabled=_ref3.disabled,noResultsLabelContainerStyle=_ref3.noResultsLabelContainerStyle,noResultsLabelStyle=_ref3.noResultsLabelStyle,noResultsLabel=_ref3.noResultsLabel,NoResultsComponent=_ref3.NoResultsComponent,maxItemSize=_ref3.maxItemSize,moreItemLabelContainerStyle=_ref3.moreItemLabelContainerStyle,moreItemLabelStyle=_ref3.moreItemLabelStyle,MoreItemComponent=_ref3.MoreItemComponent,onBackdropPress=_ref3.onBackdropPress,rest=(0,_objectWithoutProperties2.default)(_ref3,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),showDropdown=_useState2[0],setShowDropdown=_useState2[1];var _useState3=(0,_react.useState)(""),_useState4=(0,_slicedToArray2.default)(_useState3,2),searchQuery=_useState4[0],setSearchQuery=_useState4[1];var dropdownAnimatedHeight=(0,_reactNativeReanimated.useSharedValue)(0);var animatedLabelValue=(0,_reactNativeReanimated.useSharedValue)(0);var formatStr=function formatStr(str){var _str$toLowerCase;return str==null?void 0:(_str$toLowerCase=str.toLowerCase())==null?void 0:_str$toLowerCase.trim();};var filteredOptions=options.filter(function(item,index){var optionValue=valueExtractor(item,index);var isItemAlreadySelected=Boolean(value==null?void 0:value.find(function(selectedItem){return valueExtractor(selectedItem)===optionValue;}));return!isItemAlreadySelected;}).filter(function(item,index){var optionLabel=labelExtractor(item,index);if(searchQuery.length===0)return true;return formatStr(optionLabel).includes(formatStr(searchQuery));});var isOptionsEmpty=!options||(options==null?void 0:options.length)===0;var isSearchedOptionsEmpty=searchQuery.length>0&&filteredOptions.length===0;var emptyOptionsPlaceholderHeight=40;var emptySearchedOptionsHeight=40;var searchInputHeight=35;var multipleOptionsSelected=(value==null?void 0:value.length)>0;var defaultDropdownItemHeight=(itemContainerStyle==null?void 0:itemContainerStyle.height)||32;var dropdownHeight=(dropdownContainerStyle==null?void 0:dropdownContainerStyle.height)||(dropdownContainerStyle==null?void 0:dropdownContainerStyle.maxHeight)||defaultDropdownItemHeight*Math.min(filteredOptions==null?void 0:filteredOptions.length,6)+(isSearchable?searchInputHeight+10:0)+(isOptionsEmpty&&!(isSearchedOptionsEmpty&&showCreateOption)?emptyOptionsPlaceholderHeight:0)+(isSearchedOptionsEmpty&&showCreateOption?emptySearchedOptionsHeight:0);var getValue=function getValue(item,index){return(item==null?void 0:item.value)||valueExtractor(item,index)||item;};var getLabel=function getLabel(item,index){return(item==null?void 0:item.label)||labelExtractor(item,index)||item;};var handleCheckbox=function handleCheckbox(item){var oldData=(0,_toConsumableArray2.default)(value);var index=value.findIndex(function(data,index){return getValue(data,index)===getValue(item);});if(index===-1){oldData.push(item);}else{oldData.splice(index,1);}onSelect(oldData);};var CheckBoxContent=function CheckBoxContent(_ref4){var onPress=_ref4.onPress,item=_ref4.item,index=_ref4.index;var itemIndex=value.findIndex(function(data,i){return getValue(data,i)===getValue(item,index);});return _react.default.createElement(_.Container,{py:12,__self:_this,__source:{fileName:_jsxFileName,lineNumber:283,columnNumber:7}},_react.default.createElement(_.CheckBox,{disabled:disabled,checked:itemIndex!==-1,onSelect:onPress,label:(item==null?void 0:item.label)||labelExtractor(item,index)||item,__self:_this,__source:{fileName:_jsxFileName,lineNumber:284,columnNumber:9}}));};var handleOpenDropdown=function handleOpenDropdown(){_reactNative.Keyboard.dismiss();setSearchQuery("");if(!showDropdown){setShowDropdown(true);}if(showDropdown){dropdownAnimatedHeight.value=0;}};var handleUnSelection=function handleUnSelection(item){var newValue=value.filter(function(selectedItem){return valueExtractor(selectedItem)!==valueExtractor(item);});onSelect(newValue);deletedValue(item);};(0,_react.useEffect)(function(){animatedLabelValue.value=(0,_reactNativeReanimated.withTiming)(value.length||showDropdown?1:0,{duration:250});},[value,showDropdown]);(0,_react.useEffect)(function(){if(showDropdown){dropdownAnimatedHeight.value=dropdownHeight;}},[showDropdown,dropdownHeight]);CheckBoxContent.propTypes={onPress:_propTypes.default.func,item:_propTypes.default.object,index:_propTypes.default.number};var animatedStyles=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{top:(0,_reactNativeReanimated.interpolate)(animatedLabelValue.value,[0,1],[7,-5]),fontSize:(0,_reactNativeReanimated.interpolate)(animatedLabelValue.value,[0,1],[17,13]),color:"font.grey600"};};_f._closure={interpolate:_reactNativeReanimated.interpolate,animatedLabelValue:animatedLabelValue};_f.asString="function _f(){const{interpolate,animatedLabelValue}=jsThis._closure;{return{top:interpolate(animatedLabelValue.value,[0,1],[7,-5]),fontSize:interpolate(animatedLabelValue.value,[0,1],[17,13]),color:\"font.grey600\"};}}";_f.__workletHash=10991286228666;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/MultiSelect.js (336:42)";_f.__optimalization=3;return _f;}());return _react.default.createElement(_.Container,(0,_extends2.default)({},containerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:345,columnNumber:5}}),_react.default.createElement(_reactNative.TouchableWithoutFeedback,{disabled:isLoading,onPress:handleOpenDropdown,__self:_this,__source:{fileName:_jsxFileName,lineNumber:346,columnNumber:7}},_react.default.createElement(_.Container,(0,_extends2.default)({borderRadius:12,borderWidth:1,borderColor:showDropdown?"border.base":"border.grey400",p:2,pr:2,minHeight:58},inputContainerStyle,rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:350,columnNumber:9}}),_react.default.createElement(_.Container,{flexDirection:"row",justifyContent:"space-between",alignItems:"center",__self:_this,__source:{fileName:_jsxFileName,lineNumber:360,columnNumber:11}},_react.default.createElement(AnimatedLabel,{position:"absolute",zIndex:1,style:[animatedStyles,(0,_extends2.default)({marginLeft:5},labelStyle)],__self:_this,__source:{fileName:_jsxFileName,lineNumber:365,columnNumber:13}},label),!multipleOptionsSelected&&_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:372,columnNumber:42}}),multipleOptionsSelected&&_react.default.createElement(_.Container,{flexWrap:"wrap",flexDirection:"row",maxWidth:"85%",onStartShouldSetResponder:function onStartShouldSetResponder(){return true;},mt:3,__self:_this,__source:{fileName:_jsxFileName,lineNumber:374,columnNumber:15}},value==null?void 0:value.slice(0,maxItemSize).map(function(item,index){return _react.default.createElement(MultiSelectItem,{key:index,label:getLabel(item),onUnselect:function onUnselect(){return handleUnSelection(item);},multiSelectedItemContainerStyle:multiSelectedItemContainerStyle,multiSelectedItemLabelStyle:multiSelectedItemLabelStyle,disabled:disabled,__self:_this,__source:{fileName:_jsxFileName,lineNumber:383,columnNumber:21}});}),(value==null?void 0:value.length)>maxItemSize&&(!MoreItemComponent?_react.default.createElement(_.Container,(0,_extends2.default)({bg:"background.secondary",borderRadius:12,flexDirection:"row",alignItems:"center",justifyContent:"space-between",px:2,py:1,m:1},moreItemLabelContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:397,columnNumber:21}}),_react.default.createElement(Typography,(0,_extends2.default)({},moreItemLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:408,columnNumber:23}}),"+",(value==null?void 0:value.length)-maxItemSize," More")):_react.default.createElement(MoreItemComponent,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:413,columnNumber:21}}))),_react.default.createElement(_.Container,{mt:10,__self:_this,__source:{fileName:_jsxFileName,lineNumber:417,columnNumber:13}},isLoading?_react.default.createElement(_reactNative.ActivityIndicator,{size:"small",color:theme.colors.background.base,__self:_this,__source:{fileName:_jsxFileName,lineNumber:419,columnNumber:17}}):_react.default.createElement(_reactNativeRemixIcon.default,{name:"arrow-"+(showDropdown?"up":"down")+"-s-line",size:"20",color:"grey",__self:_this,__source:{fileName:_jsxFileName,lineNumber:424,columnNumber:17}}))))),_react.default.createElement(_.BottomSheet,{title:label,onItemPress:function onItemPress(_ref5){var item=_ref5.item;handleCheckbox(item);selectedValue(item);},disabled:disabled,onDonePress:onDonePress,isVisible:showDropdown,hide:function hide(){return setShowDropdown(false);},canSearch:isSearchable,data:options,contentType:"checkbox",ContentRow:CheckBoxContent,showCreateOption:showCreateOption,CreateItemComponent:CreateItemComponent,showCreateOptionLoader:showCreateOptionLoader,createSearchedOptionLabelStyle:createSearchedOptionLabelStyle,onPressCreateOption:onPressCreateOption,createSearchedOptionContainerStyle:createSearchedOptionContainerStyle,noResultsLabelContainerStyle:noResultsLabelContainerStyle,noResultsLabelStyle:noResultsLabelStyle,noResultsLabel:noResultsLabel,NoResultsComponent:NoResultsComponent,valueExtractor:valueExtractor,labelExtractor:labelExtractor,onBackdropPress:onBackdropPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:435,columnNumber:7}}));};exports.MultiSelect=MultiSelect;MultiSelect.propTypes={label:_propTypes.default.string,options:_propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.string),_propTypes.default.arrayOf(_propTypes.default.object)]),labelExtractor:_propTypes.default.func,valueExtractor:_propTypes.default.func,value:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.array]),onSelect:_propTypes.default.func,selectedValue:_propTypes.default.func,deletedValue:_propTypes.default.func,isLoading:_propTypes.default.bool,isSearchable:_propTypes.default.bool,onDonePress:_propTypes.default.func,showCreateOption:_propTypes.default.bool,showCreateOptionLoader:_propTypes.default.bool,createOptionLabel:_propTypes.default.string,onPressCreateOption:_propTypes.default.func,labelStyle:_propTypes.default.object,containerStyle:_propTypes.default.object,inputContainerStyle:_propTypes.default.object,dropdownContainerStyle:_propTypes.default.object,itemContainerStyle:_propTypes.default.object,itemLabelStyle:_propTypes.default.object,multiSelectedItemContainerStyle:_propTypes.default.object,multiSelectedItemLabelStyle:_propTypes.default.object,searchInputContainerStyle:_propTypes.default.object,searchInputStyle:_propTypes.default.object,emptyOptionsContainerStyle:_propTypes.default.object,emptyOptionsLabelStyle:_propTypes.default.object,createSearchedOptionContainerStyle:_propTypes.default.object,createSearchedOptionLabelStyle:_propTypes.default.object,CreateItemComponent:_propTypes.default.node,disabled:_propTypes.default.bool,noResultsLabelContainerStyle:_propTypes.default.object,noResultsLabelStyle:_propTypes.default.object,noResultsLabel:_propTypes.default.string,NoResultsComponent:_propTypes.default.node,maxItemSize:_propTypes.default.number,moreItemLabelContainerStyle:_propTypes.default.object,moreItemLabelStyle:_propTypes.default.object,MoreItemComponent:_propTypes.default.node,onBackdropPress:_propTypes.default.func};MultiSelect.defaultProps={label:null,labelExtractor:function labelExtractor(option){return option==null?void 0:option.label;},valueExtractor:function valueExtractor(option){return option==null?void 0:option.value;},value:null,onSelect:function onSelect(){},selectedValue:function selectedValue(){},deletedValue:function deletedValue(){},isLoading:false,isSearchable:false,showCreateOption:false,showCreateOptionLoader:false,createOptionLabel:null,onPressCreateOption:function onPressCreateOption(){},onDonePress:function onDonePress(){},maxItemSize:5,onBackdropPress:function onBackdropPress(){}};
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.MultiSelect=void 0;var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _native=_interopRequireWildcard(require("styled-components/native"));var _styledSystem=require("styled-system");var _=require("./");var _excluded=["options","label","value","labelExtractor","valueExtractor","onSelect","deletedValue","isLoading","isSearchable","showCreateOption","labelStyle","containerStyle","inputContainerStyle","dropdownContainerStyle","itemContainerStyle","multiSelectedItemContainerStyle","multiSelectedItemLabelStyle","selectedValue","CreateItemComponent","showCreateOptionLoader","createSearchedOptionLabelStyle","onPressCreateOption","createSearchedOptionContainerStyle","onDonePress","disabled","noResultsLabelContainerStyle","noResultsLabelStyle","noResultsLabel","NoResultsComponent","maxItemSize","moreItemLabelContainerStyle","moreItemLabelStyle","MoreItemComponent","onBackdropPress","searchBarProps"];var _templateObject,_this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/MultiSelect.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Typography=_native.default.Text(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2.default)(["\n ","\n ","\n ","\n ","\n ","\n ","\n ","\n ","\n"])),_styledSystem.textStyle,_styledSystem.space,_styledSystem.layout,_styledSystem.flexbox,_styledSystem.typography,_styledSystem.color,_styledSystem.position,(0,_styledSystem.system)({textDecoration:{property:"textDecoration",cssProperty:"textDecoration"},textTransform:{property:"textTransform",cssProperty:"textTransform"}}));var MultiSelectItem=function MultiSelectItem(_ref){var label=_ref.label,onUnselect=_ref.onUnselect,multiSelectedItemContainerStyle=_ref.multiSelectedItemContainerStyle,multiSelectedItemLabelStyle=_ref.multiSelectedItemLabelStyle,disabled=_ref.disabled;var theme=(0,_react.useContext)(_native.ThemeContext);return _react.default.createElement(_.Container,(0,_extends2.default)({bg:"background.secondary",borderRadius:12,flexDirection:"row",alignItems:"center",justifyContent:"space-between",px:2,py:1,m:1},multiSelectedItemContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:55,columnNumber:5}}),_react.default.createElement(Typography,(0,_extends2.default)({fontFamily:"sf400",fontSize:"s",mr:2,color:"font.grey800"},multiSelectedItemLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:66,columnNumber:7}}),label),!disabled&&_react.default.createElement(_reactNative.TouchableWithoutFeedback,{disabled:disabled,onPress:onUnselect,__self:_this,__source:{fileName:_jsxFileName,lineNumber:76,columnNumber:9}},_react.default.createElement(_reactNativeRemixIcon.default,{name:"ri-close-line",size:"20",color:theme.colors.font.grey800,__self:_this,__source:{fileName:_jsxFileName,lineNumber:77,columnNumber:11}})));};MultiSelectItem.propTypes={label:_propTypes.default.string,onUnselect:_propTypes.default.func,multiSelectedItemContainerStyle:_propTypes.default.object,multiSelectedItemLabelStyle:_propTypes.default.object,disabled:_propTypes.default.bool};var DropdownItem=function DropdownItem(_ref2){var label=_ref2.label,onPress=_ref2.onPress,defaultDropdownItemHeight=_ref2.defaultDropdownItemHeight,itemContainerStyle=_ref2.itemContainerStyle,itemLabelStyle=_ref2.itemLabelStyle;return _react.default.createElement(_.Touchable,{bg:"background.white",onPress:onPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:104,columnNumber:5}},_react.default.createElement(_.Container,(0,_extends2.default)({height:defaultDropdownItemHeight,p:2},itemContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:105,columnNumber:7}}),_react.default.createElement(Typography,(0,_extends2.default)({fontFamily:"sf400",fontSize:"s",color:"font.grey"},itemLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:110,columnNumber:9}}),label)));};DropdownItem.propTypes={label:_propTypes.default.string,onPress:_propTypes.default.func,defaultDropdownItemHeight:_propTypes.default.number,itemContainerStyle:_propTypes.default.object,itemLabelStyle:_propTypes.default.object};var AnimatedLabel=_reactNativeReanimated.default.createAnimatedComponent(Typography);var MultiSelect=function MultiSelect(_ref3){var options=_ref3.options,label=_ref3.label,value=_ref3.value,labelExtractor=_ref3.labelExtractor,valueExtractor=_ref3.valueExtractor,onSelect=_ref3.onSelect,deletedValue=_ref3.deletedValue,isLoading=_ref3.isLoading,isSearchable=_ref3.isSearchable,showCreateOption=_ref3.showCreateOption,labelStyle=_ref3.labelStyle,containerStyle=_ref3.containerStyle,inputContainerStyle=_ref3.inputContainerStyle,dropdownContainerStyle=_ref3.dropdownContainerStyle,itemContainerStyle=_ref3.itemContainerStyle,multiSelectedItemContainerStyle=_ref3.multiSelectedItemContainerStyle,multiSelectedItemLabelStyle=_ref3.multiSelectedItemLabelStyle,selectedValue=_ref3.selectedValue,CreateItemComponent=_ref3.CreateItemComponent,showCreateOptionLoader=_ref3.showCreateOptionLoader,createSearchedOptionLabelStyle=_ref3.createSearchedOptionLabelStyle,onPressCreateOption=_ref3.onPressCreateOption,createSearchedOptionContainerStyle=_ref3.createSearchedOptionContainerStyle,onDonePress=_ref3.onDonePress,disabled=_ref3.disabled,noResultsLabelContainerStyle=_ref3.noResultsLabelContainerStyle,noResultsLabelStyle=_ref3.noResultsLabelStyle,noResultsLabel=_ref3.noResultsLabel,NoResultsComponent=_ref3.NoResultsComponent,maxItemSize=_ref3.maxItemSize,moreItemLabelContainerStyle=_ref3.moreItemLabelContainerStyle,moreItemLabelStyle=_ref3.moreItemLabelStyle,MoreItemComponent=_ref3.MoreItemComponent,onBackdropPress=_ref3.onBackdropPress,searchBarProps=_ref3.searchBarProps,rest=(0,_objectWithoutProperties2.default)(_ref3,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),showDropdown=_useState2[0],setShowDropdown=_useState2[1];var _useState3=(0,_react.useState)(""),_useState4=(0,_slicedToArray2.default)(_useState3,2),searchQuery=_useState4[0],setSearchQuery=_useState4[1];var dropdownAnimatedHeight=(0,_reactNativeReanimated.useSharedValue)(0);var animatedLabelValue=(0,_reactNativeReanimated.useSharedValue)(0);var formatStr=function formatStr(str){var _str$toLowerCase;return str==null?void 0:(_str$toLowerCase=str.toLowerCase())==null?void 0:_str$toLowerCase.trim();};var filteredOptions=options.filter(function(item,index){var optionValue=valueExtractor(item,index);var isItemAlreadySelected=Boolean(value==null?void 0:value.find(function(selectedItem){return valueExtractor(selectedItem)===optionValue;}));return!isItemAlreadySelected;}).filter(function(item,index){var optionLabel=labelExtractor(item,index);if(searchQuery.length===0)return true;return formatStr(optionLabel).includes(formatStr(searchQuery));});var isOptionsEmpty=!options||(options==null?void 0:options.length)===0;var isSearchedOptionsEmpty=searchQuery.length>0&&filteredOptions.length===0;var emptyOptionsPlaceholderHeight=40;var emptySearchedOptionsHeight=40;var searchInputHeight=35;var multipleOptionsSelected=(value==null?void 0:value.length)>0;var defaultDropdownItemHeight=(itemContainerStyle==null?void 0:itemContainerStyle.height)||32;var dropdownHeight=(dropdownContainerStyle==null?void 0:dropdownContainerStyle.height)||(dropdownContainerStyle==null?void 0:dropdownContainerStyle.maxHeight)||defaultDropdownItemHeight*Math.min(filteredOptions==null?void 0:filteredOptions.length,6)+(isSearchable?searchInputHeight+10:0)+(isOptionsEmpty&&!(isSearchedOptionsEmpty&&showCreateOption)?emptyOptionsPlaceholderHeight:0)+(isSearchedOptionsEmpty&&showCreateOption?emptySearchedOptionsHeight:0);var getValue=function getValue(item,index){return(item==null?void 0:item.value)||valueExtractor(item,index)||item;};var getLabel=function getLabel(item,index){return(item==null?void 0:item.label)||labelExtractor(item,index)||item;};var handleCheckbox=function handleCheckbox(item){var oldData=(0,_toConsumableArray2.default)(value);var index=value.findIndex(function(data,index){return getValue(data,index)===getValue(item);});if(index===-1){oldData.push(item);}else{oldData.splice(index,1);}onSelect(oldData);};var CheckBoxContent=function CheckBoxContent(_ref4){var onPress=_ref4.onPress,item=_ref4.item,index=_ref4.index;var itemIndex=value.findIndex(function(data,i){return getValue(data,i)===getValue(item,index);});return _react.default.createElement(_.Container,{py:12,__self:_this,__source:{fileName:_jsxFileName,lineNumber:284,columnNumber:7}},_react.default.createElement(_.CheckBox,{disabled:disabled,checked:itemIndex!==-1,onSelect:onPress,label:(item==null?void 0:item.label)||labelExtractor(item,index)||item,__self:_this,__source:{fileName:_jsxFileName,lineNumber:285,columnNumber:9}}));};var handleOpenDropdown=function handleOpenDropdown(){_reactNative.Keyboard.dismiss();setSearchQuery("");if(!showDropdown){setShowDropdown(true);}if(showDropdown){dropdownAnimatedHeight.value=0;}};var handleUnSelection=function handleUnSelection(item){var newValue=value.filter(function(selectedItem){return valueExtractor(selectedItem)!==valueExtractor(item);});onSelect(newValue);deletedValue(item);};(0,_react.useEffect)(function(){animatedLabelValue.value=(0,_reactNativeReanimated.withTiming)(value.length||showDropdown?1:0,{duration:250});},[value,showDropdown]);(0,_react.useEffect)(function(){if(showDropdown){dropdownAnimatedHeight.value=dropdownHeight;}},[showDropdown,dropdownHeight]);CheckBoxContent.propTypes={onPress:_propTypes.default.func,item:_propTypes.default.object,index:_propTypes.default.number};var animatedStyles=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{top:(0,_reactNativeReanimated.interpolate)(animatedLabelValue.value,[0,1],[7,-5]),fontSize:(0,_reactNativeReanimated.interpolate)(animatedLabelValue.value,[0,1],[17,13]),color:"font.grey600"};};_f._closure={interpolate:_reactNativeReanimated.interpolate,animatedLabelValue:animatedLabelValue};_f.asString="function _f(){const{interpolate,animatedLabelValue}=jsThis._closure;{return{top:interpolate(animatedLabelValue.value,[0,1],[7,-5]),fontSize:interpolate(animatedLabelValue.value,[0,1],[17,13]),color:\"font.grey600\"};}}";_f.__workletHash=10991286228666;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/MultiSelect.js (337:42)";_f.__optimalization=3;return _f;}());return _react.default.createElement(_.Container,(0,_extends2.default)({},containerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:346,columnNumber:5}}),_react.default.createElement(_reactNative.TouchableWithoutFeedback,{disabled:isLoading,onPress:handleOpenDropdown,__self:_this,__source:{fileName:_jsxFileName,lineNumber:347,columnNumber:7}},_react.default.createElement(_.Container,(0,_extends2.default)({borderRadius:12,borderWidth:1,borderColor:showDropdown?"border.base":"border.grey400",p:2,pr:2,minHeight:58},inputContainerStyle,rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:351,columnNumber:9}}),_react.default.createElement(_.Container,{flexDirection:"row",justifyContent:"space-between",alignItems:"center",__self:_this,__source:{fileName:_jsxFileName,lineNumber:361,columnNumber:11}},_react.default.createElement(AnimatedLabel,{position:"absolute",zIndex:1,style:[animatedStyles,(0,_extends2.default)({marginLeft:5},labelStyle)],__self:_this,__source:{fileName:_jsxFileName,lineNumber:366,columnNumber:13}},label),!multipleOptionsSelected&&_react.default.createElement(_.Container,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:373,columnNumber:42}}),multipleOptionsSelected&&_react.default.createElement(_.Container,{flexWrap:"wrap",flexDirection:"row",maxWidth:"85%",onStartShouldSetResponder:function onStartShouldSetResponder(){return true;},mt:3,__self:_this,__source:{fileName:_jsxFileName,lineNumber:375,columnNumber:15}},value==null?void 0:value.slice(0,maxItemSize).map(function(item,index){return _react.default.createElement(MultiSelectItem,{key:index,label:getLabel(item),onUnselect:function onUnselect(){return handleUnSelection(item);},multiSelectedItemContainerStyle:multiSelectedItemContainerStyle,multiSelectedItemLabelStyle:multiSelectedItemLabelStyle,disabled:disabled,__self:_this,__source:{fileName:_jsxFileName,lineNumber:384,columnNumber:21}});}),(value==null?void 0:value.length)>maxItemSize&&(!MoreItemComponent?_react.default.createElement(_.Container,(0,_extends2.default)({bg:"background.secondary",borderRadius:12,flexDirection:"row",alignItems:"center",justifyContent:"space-between",px:2,py:1,m:1},moreItemLabelContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:398,columnNumber:21}}),_react.default.createElement(Typography,(0,_extends2.default)({},moreItemLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:409,columnNumber:23}}),"+",(value==null?void 0:value.length)-maxItemSize," More")):_react.default.createElement(MoreItemComponent,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:414,columnNumber:21}}))),_react.default.createElement(_.Container,{mt:10,__self:_this,__source:{fileName:_jsxFileName,lineNumber:418,columnNumber:13}},isLoading?_react.default.createElement(_reactNative.ActivityIndicator,{size:"small",color:theme.colors.background.base,__self:_this,__source:{fileName:_jsxFileName,lineNumber:420,columnNumber:17}}):_react.default.createElement(_reactNativeRemixIcon.default,{name:"arrow-"+(showDropdown?"up":"down")+"-s-line",size:"20",color:"grey",__self:_this,__source:{fileName:_jsxFileName,lineNumber:425,columnNumber:17}}))))),_react.default.createElement(_.BottomSheet,{title:label,onItemPress:function onItemPress(_ref5){var item=_ref5.item;handleCheckbox(item);selectedValue(item);},disabled:disabled,onDonePress:onDonePress,isVisible:showDropdown,hide:function hide(){return setShowDropdown(false);},canSearch:isSearchable,data:options,contentType:"checkbox",ContentRow:CheckBoxContent,showCreateOption:showCreateOption,CreateItemComponent:CreateItemComponent,showCreateOptionLoader:showCreateOptionLoader,createSearchedOptionLabelStyle:createSearchedOptionLabelStyle,onPressCreateOption:onPressCreateOption,createSearchedOptionContainerStyle:createSearchedOptionContainerStyle,noResultsLabelContainerStyle:noResultsLabelContainerStyle,noResultsLabelStyle:noResultsLabelStyle,noResultsLabel:noResultsLabel,NoResultsComponent:NoResultsComponent,valueExtractor:valueExtractor,labelExtractor:labelExtractor,onBackdropPress:onBackdropPress,searchBarProps:searchBarProps,__self:_this,__source:{fileName:_jsxFileName,lineNumber:436,columnNumber:7}}));};exports.MultiSelect=MultiSelect;MultiSelect.propTypes={label:_propTypes.default.string,options:_propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.string),_propTypes.default.arrayOf(_propTypes.default.object)]),labelExtractor:_propTypes.default.func,valueExtractor:_propTypes.default.func,value:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.array]),onSelect:_propTypes.default.func,selectedValue:_propTypes.default.func,deletedValue:_propTypes.default.func,isLoading:_propTypes.default.bool,isSearchable:_propTypes.default.bool,onDonePress:_propTypes.default.func,showCreateOption:_propTypes.default.bool,showCreateOptionLoader:_propTypes.default.bool,createOptionLabel:_propTypes.default.string,onPressCreateOption:_propTypes.default.func,labelStyle:_propTypes.default.object,containerStyle:_propTypes.default.object,inputContainerStyle:_propTypes.default.object,dropdownContainerStyle:_propTypes.default.object,itemContainerStyle:_propTypes.default.object,itemLabelStyle:_propTypes.default.object,multiSelectedItemContainerStyle:_propTypes.default.object,multiSelectedItemLabelStyle:_propTypes.default.object,searchInputContainerStyle:_propTypes.default.object,searchInputStyle:_propTypes.default.object,emptyOptionsContainerStyle:_propTypes.default.object,emptyOptionsLabelStyle:_propTypes.default.object,createSearchedOptionContainerStyle:_propTypes.default.object,createSearchedOptionLabelStyle:_propTypes.default.object,CreateItemComponent:_propTypes.default.node,disabled:_propTypes.default.bool,noResultsLabelContainerStyle:_propTypes.default.object,noResultsLabelStyle:_propTypes.default.object,noResultsLabel:_propTypes.default.string,NoResultsComponent:_propTypes.default.node,maxItemSize:_propTypes.default.number,moreItemLabelContainerStyle:_propTypes.default.object,moreItemLabelStyle:_propTypes.default.object,MoreItemComponent:_propTypes.default.node,onBackdropPress:_propTypes.default.func,searchBarProps:_propTypes.default.object};MultiSelect.defaultProps={label:null,labelExtractor:function labelExtractor(option){return option==null?void 0:option.label;},valueExtractor:function valueExtractor(option){return option==null?void 0:option.value;},value:null,onSelect:function onSelect(){},selectedValue:function selectedValue(){},deletedValue:function deletedValue(){},isLoading:false,isSearchable:false,showCreateOption:false,showCreateOptionLoader:false,createOptionLabel:null,onPressCreateOption:function onPressCreateOption(){},onDonePress:function onDonePress(){},maxItemSize:5,onBackdropPress:function onBackdropPress(){},searchBarProps:{}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.OrganizationItem=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _=require("./");var _native=require("styled-components/native");var _excluded=["label","
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.OrganizationItem=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _=require("./");var _native=require("styled-components/native");var _excluded=["label","labelContainerProps","iconContainerProps","iconProps","labelProps","name","nameProps"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/OrganizationItem.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var OrganizationItem=function OrganizationItem(props){var label=props.label,labelContainerProps=props.labelContainerProps,iconContainerProps=props.iconContainerProps,iconProps=props.iconProps,labelProps=props.labelProps,name=props.name,nameProps=props.nameProps,rest=(0,_objectWithoutProperties2.default)(props,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);return _react.default.createElement(_.Container,(0,_extends2.default)({bg:"background.secondary",width:"100%",px:16,py:12,borderRadius:6,justifyContent:"space-between"},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:43,columnNumber:5}}),_react.default.createElement(_.Container,(0,_extends2.default)({flexDirection:"row",alignItems:"center"},labelContainerProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:52,columnNumber:7}}),_react.default.createElement(_.Container,(0,_extends2.default)({mr:9},iconContainerProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:57,columnNumber:9}}),_react.default.createElement(_reactNativeRemixIcon.default,(0,_extends2.default)({size:20,color:theme.colors.font.grey800,name:"building-line"},iconProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:58,columnNumber:11}}))),_react.default.createElement(_.Typography,(0,_extends2.default)({color:"font.grey800",fontSize:"l",fontFamily:"sf500"},labelProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:65,columnNumber:9}}),label||"Organization")),_react.default.createElement(_.Typography,(0,_extends2.default)({ml:29,color:"font.grey",fontSize:"m",fontFamily:"sf500",mt:"8px"},nameProps,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:74,columnNumber:7}}),name));};exports.OrganizationItem=OrganizationItem;OrganizationItem.propTypes={label:_propTypes.default.string,labelContainerProps:_propTypes.default.object,iconContainerProps:_propTypes.default.object,iconProps:_propTypes.default.object,labelProps:_propTypes.default.object,name:_propTypes.default.string.isRequired,nameProps:_propTypes.default.object};
|
package/package.json
CHANGED
|
@@ -23,6 +23,7 @@ const Title = ({
|
|
|
23
23
|
canSearch,
|
|
24
24
|
setSearchText,
|
|
25
25
|
onDonePress,
|
|
26
|
+
searchBarProps,
|
|
26
27
|
}) => {
|
|
27
28
|
let touchY;
|
|
28
29
|
|
|
@@ -62,7 +63,6 @@ const Title = ({
|
|
|
62
63
|
</Touchable>
|
|
63
64
|
)}
|
|
64
65
|
</Container>
|
|
65
|
-
|
|
66
66
|
{canSearch && (
|
|
67
67
|
<SearchBar
|
|
68
68
|
debounceDelay={200}
|
|
@@ -72,6 +72,7 @@ const Title = ({
|
|
|
72
72
|
setSearchText("");
|
|
73
73
|
}}
|
|
74
74
|
showCancelButton={false}
|
|
75
|
+
{...searchBarProps}
|
|
75
76
|
/>
|
|
76
77
|
)}
|
|
77
78
|
</Container>
|
|
@@ -90,6 +91,7 @@ Title.propTypes = {
|
|
|
90
91
|
canSearch: PropTypes.bool,
|
|
91
92
|
setSearchText: PropTypes.func,
|
|
92
93
|
onDonePress: PropTypes.func,
|
|
94
|
+
searchBarProps: PropTypes.object,
|
|
93
95
|
};
|
|
94
96
|
|
|
95
97
|
/**
|
|
@@ -165,6 +167,7 @@ export const BottomSheet = ({
|
|
|
165
167
|
valueExtractor,
|
|
166
168
|
selectedItem,
|
|
167
169
|
onBackdropPress,
|
|
170
|
+
searchBarProps,
|
|
168
171
|
...rest
|
|
169
172
|
}) => {
|
|
170
173
|
const [searchText, setSearchText] = useState("");
|
|
@@ -238,6 +241,7 @@ export const BottomSheet = ({
|
|
|
238
241
|
searchText={searchText}
|
|
239
242
|
setSearchText={setSearchText}
|
|
240
243
|
onDonePress={onDonePress}
|
|
244
|
+
searchBarProps={searchBarProps}
|
|
241
245
|
/>
|
|
242
246
|
)}
|
|
243
247
|
|
|
@@ -345,6 +349,7 @@ BottomSheet.defaultProps = {
|
|
|
345
349
|
valueExtractor: () => {},
|
|
346
350
|
labelExtractor: () => {},
|
|
347
351
|
onBackdropPress: () => {},
|
|
352
|
+
searchBarProps: {},
|
|
348
353
|
};
|
|
349
354
|
|
|
350
355
|
BottomSheet.propTypes = {
|
|
@@ -436,6 +441,10 @@ BottomSheet.propTypes = {
|
|
|
436
441
|
* Currently selected item
|
|
437
442
|
*/
|
|
438
443
|
selectedItem: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
|
|
444
|
+
/**
|
|
445
|
+
* Object to update the searchbar component
|
|
446
|
+
*/
|
|
447
|
+
searchBarProps: PropTypes.object,
|
|
439
448
|
/**
|
|
440
449
|
* To support more Modal params.
|
|
441
450
|
*/
|
|
@@ -207,6 +207,7 @@ export const MultiSelect = ({
|
|
|
207
207
|
moreItemLabelStyle,
|
|
208
208
|
MoreItemComponent,
|
|
209
209
|
onBackdropPress,
|
|
210
|
+
searchBarProps,
|
|
210
211
|
...rest
|
|
211
212
|
}) => {
|
|
212
213
|
const theme = useContext(ThemeContext);
|
|
@@ -459,6 +460,7 @@ export const MultiSelect = ({
|
|
|
459
460
|
valueExtractor={valueExtractor}
|
|
460
461
|
labelExtractor={labelExtractor}
|
|
461
462
|
onBackdropPress={onBackdropPress}
|
|
463
|
+
searchBarProps={searchBarProps}
|
|
462
464
|
/>
|
|
463
465
|
</Container>
|
|
464
466
|
);
|
|
@@ -628,6 +630,10 @@ MultiSelect.propTypes = {
|
|
|
628
630
|
* Function to customize back drop press
|
|
629
631
|
*/
|
|
630
632
|
onBackdropPress: PropTypes.func,
|
|
633
|
+
/**
|
|
634
|
+
* Object to update the searchbar component
|
|
635
|
+
*/
|
|
636
|
+
searchBarProps: PropTypes.object,
|
|
631
637
|
};
|
|
632
638
|
|
|
633
639
|
MultiSelect.defaultProps = {
|
|
@@ -647,4 +653,5 @@ MultiSelect.defaultProps = {
|
|
|
647
653
|
onDonePress: () => {},
|
|
648
654
|
maxItemSize: 5,
|
|
649
655
|
onBackdropPress: () => {},
|
|
656
|
+
searchBarProps: {},
|
|
650
657
|
};
|
|
@@ -30,12 +30,11 @@ import { ThemeContext } from "styled-components/native";
|
|
|
30
30
|
export const OrganizationItem = props => {
|
|
31
31
|
const {
|
|
32
32
|
label,
|
|
33
|
-
|
|
34
|
-
containerProps,
|
|
33
|
+
labelContainerProps,
|
|
35
34
|
iconContainerProps,
|
|
36
35
|
iconProps,
|
|
37
|
-
textContainerProps,
|
|
38
36
|
labelProps,
|
|
37
|
+
name,
|
|
39
38
|
nameProps,
|
|
40
39
|
...rest
|
|
41
40
|
} = props;
|
|
@@ -47,14 +46,13 @@ export const OrganizationItem = props => {
|
|
|
47
46
|
px={16}
|
|
48
47
|
py={12}
|
|
49
48
|
borderRadius={6}
|
|
50
|
-
alignItems="center"
|
|
51
49
|
justifyContent="space-between"
|
|
52
50
|
{...rest}
|
|
53
51
|
>
|
|
54
52
|
<Container
|
|
55
53
|
flexDirection="row"
|
|
56
|
-
alignItems="
|
|
57
|
-
{...
|
|
54
|
+
alignItems="center"
|
|
55
|
+
{...labelContainerProps}
|
|
58
56
|
>
|
|
59
57
|
<Container mr={9} {...iconContainerProps}>
|
|
60
58
|
<Icon
|
|
@@ -64,26 +62,25 @@ export const OrganizationItem = props => {
|
|
|
64
62
|
{...iconProps}
|
|
65
63
|
/>
|
|
66
64
|
</Container>
|
|
67
|
-
<
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
</Typography>
|
|
76
|
-
<Typography
|
|
77
|
-
color="font.grey"
|
|
78
|
-
fontSize="m"
|
|
79
|
-
fontFamily="sf500"
|
|
80
|
-
mt="8px"
|
|
81
|
-
{...nameProps}
|
|
82
|
-
>
|
|
83
|
-
{name}
|
|
84
|
-
</Typography>
|
|
85
|
-
</Container>
|
|
65
|
+
<Typography
|
|
66
|
+
color="font.grey800"
|
|
67
|
+
fontSize="l"
|
|
68
|
+
fontFamily="sf500"
|
|
69
|
+
{...labelProps}
|
|
70
|
+
>
|
|
71
|
+
{label || "Organization"}
|
|
72
|
+
</Typography>
|
|
86
73
|
</Container>
|
|
74
|
+
<Typography
|
|
75
|
+
ml={29}
|
|
76
|
+
color="font.grey"
|
|
77
|
+
fontSize="m"
|
|
78
|
+
fontFamily="sf500"
|
|
79
|
+
mt="8px"
|
|
80
|
+
{...nameProps}
|
|
81
|
+
>
|
|
82
|
+
{name}
|
|
83
|
+
</Typography>
|
|
87
84
|
</Container>
|
|
88
85
|
);
|
|
89
86
|
};
|
|
@@ -94,13 +91,9 @@ OrganizationItem.propTypes = {
|
|
|
94
91
|
*/
|
|
95
92
|
label: PropTypes.string,
|
|
96
93
|
/**
|
|
97
|
-
*
|
|
98
|
-
*/
|
|
99
|
-
name: PropTypes.string.isRequired,
|
|
100
|
-
/**
|
|
101
|
-
* Customize inner container
|
|
94
|
+
* Customize label container
|
|
102
95
|
*/
|
|
103
|
-
|
|
96
|
+
labelContainerProps: PropTypes.object,
|
|
104
97
|
/**
|
|
105
98
|
* Customize icon container
|
|
106
99
|
*/
|
|
@@ -109,14 +102,14 @@ OrganizationItem.propTypes = {
|
|
|
109
102
|
* Customize icon
|
|
110
103
|
*/
|
|
111
104
|
iconProps: PropTypes.object,
|
|
112
|
-
/**
|
|
113
|
-
* Customize label and name container
|
|
114
|
-
*/
|
|
115
|
-
textContainerProps: PropTypes.object,
|
|
116
105
|
/**
|
|
117
106
|
* Customize label
|
|
118
107
|
*/
|
|
119
108
|
labelProps: PropTypes.object,
|
|
109
|
+
/**
|
|
110
|
+
* Organization name
|
|
111
|
+
*/
|
|
112
|
+
name: PropTypes.string.isRequired,
|
|
120
113
|
/**
|
|
121
114
|
* Customize name
|
|
122
115
|
*/
|