@bigbinary/neetoui-rn 0.0.120 → 0.0.124
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/components/Alert.js +1 -1
- package/lib/components/Avatar.js +1 -1
- package/lib/components/Badge.js +1 -1
- package/lib/components/BottomSheet.js +1 -1
- package/lib/components/Button.js +1 -1
- package/lib/components/ButtonGroup.js +1 -1
- package/lib/components/Card.js +1 -1
- package/lib/components/CheckBox.js +1 -1
- package/lib/components/Chip.js +1 -1
- package/lib/components/Container.js +1 -1
- package/lib/components/Divider.js +1 -1
- package/lib/components/FAB.js +1 -1
- package/lib/components/Input.js +1 -1
- package/lib/components/MultiSelect.js +1 -1
- package/lib/components/OtpInputs.js +1 -1
- package/lib/components/ParentView.js +1 -1
- package/lib/components/Popover.js +1 -1
- package/lib/components/RadioButton.js +1 -1
- package/lib/components/RichTextEditor.js +1 -1
- package/lib/components/Select.js +1 -1
- package/lib/components/Toast.js +1 -1
- package/lib/components/ToggleSwitch.js +1 -1
- package/lib/components/TopBar.js +1 -1
- package/lib/components/Touchable.js +1 -1
- package/lib/components/Typography.js +1 -1
- package/lib/config/toasterConfig.js +1 -1
- package/package.json +2 -1
- package/src/components/CheckBox.js +5 -4
- package/src/components/FAB.js +1 -0
- package/src/components/MultiSelect.js +89 -23
- package/src/components/RadioButton.js +4 -4
- package/src/components/Select.js +111 -46
package/lib/components/Select.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Select=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 _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _reactNative=require("react-native");var _native=require("styled-components/native");var _reactNativeGestureHandler=require("react-native-gesture-handler");var _=require("./");var _excluded=["options","label","value","placeholder","emptyOptionsPlaceholder","labelExtractor","valueExtractor","onSelect","isLoading","isSearchable","labelStyle","containerStyle","inputContainerStyle","dropdownContainerStyle","itemContainerStyle","itemTextStyle","selectedItemContainerStyle","selectedItemTextStyle","searchInputContainerStyle","searchInputStyle","emptyOptionsContainerStyle","emptyOptionsTextStyle"];var _this=this,_jsxFileName="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Select.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 DropdownItem=function DropdownItem(_ref){var label=_ref.label,isSelectedItem=_ref.isSelectedItem,defaultDropdownItemHeight=_ref.defaultDropdownItemHeight,onPress=_ref.onPress,itemContainerStyle=_ref.itemContainerStyle,selectedItemContainerStyle=_ref.selectedItemContainerStyle,itemTextStyle=_ref.itemTextStyle,selectedItemTextStyle=_ref.selectedItemTextStyle;return _react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:31,columnNumber:3}},_react.default.createElement(_.Container,(0,_extends2.default)({bg:isSelectedItem?"background.base":"background.white",height:defaultDropdownItemHeight,p:2},itemContainerStyle,isSelectedItem&&selectedItemContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:32,columnNumber:5}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"inter400",fontSize:"s",color:isSelectedItem?"font.white":"font.grey"},itemTextStyle,isSelectedItem&&selectedItemTextStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:39,columnNumber:7}}),label)));};DropdownItem.propTypes={label:_propTypes.default.string.isRequired,isSelectedItem:_propTypes.default.bool,defaultDropdownItemHeight:_propTypes.default.number,onPress:_propTypes.default.func,itemContainerStyle:_propTypes.default.object,selectedItemContainerStyle:_propTypes.default.object,itemTextStyle:_propTypes.default.object,selectedItemTextStyle:_propTypes.default.object};var Select=function Select(_ref2){var options=_ref2.options,label=_ref2.label,value=_ref2.value,placeholder=_ref2.placeholder,emptyOptionsPlaceholder=_ref2.emptyOptionsPlaceholder,labelExtractor=_ref2.labelExtractor,valueExtractor=_ref2.valueExtractor,onSelect=_ref2.onSelect,isLoading=_ref2.isLoading,isSearchable=_ref2.isSearchable,labelStyle=_ref2.labelStyle,containerStyle=_ref2.containerStyle,inputContainerStyle=_ref2.inputContainerStyle,dropdownContainerStyle=_ref2.dropdownContainerStyle,itemContainerStyle=_ref2.itemContainerStyle,itemTextStyle=_ref2.itemTextStyle,selectedItemContainerStyle=_ref2.selectedItemContainerStyle,selectedItemTextStyle=_ref2.selectedItemTextStyle,searchInputContainerStyle=_ref2.searchInputContainerStyle,searchInputStyle=_ref2.searchInputStyle,emptyOptionsContainerStyle=_ref2.emptyOptionsContainerStyle,emptyOptionsTextStyle=_ref2.emptyOptionsTextStyle,rest=(0,_objectWithoutProperties2.default)(_ref2,_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 isOptionsEmpty=!options||(options==null?void 0:options.length)===0;var emptyOptionsPlaceholderHeight=40;var searchInputHeight=35;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(options==null?void 0:options.length,6)+(isSearchable?searchInputHeight+10:0)+(isOptionsEmpty?emptyOptionsPlaceholderHeight:0);var selectedOptionLabel=labelExtractor(value||{});var selectedOptionValue=valueExtractor(value||{});var formatStr=function formatStr(str){var _str$toLowerCase;return str==null?void 0:(_str$toLowerCase=str.toLowerCase())==null?void 0:_str$toLowerCase.trim();};var animatedStyles=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{height:(0,_reactNativeReanimated.withTiming)(dropdownAnimatedHeight.value,{duration:100,easing:_reactNativeReanimated.Easing.ease},function(){var _f=function _f(){if(dropdownAnimatedHeight.value===0){(0,_reactNativeReanimated.runOnJS)(setShowDropdown)(false);}};_f._closure={dropdownAnimatedHeight:dropdownAnimatedHeight,runOnJS:_reactNativeReanimated.runOnJS,setShowDropdown:setShowDropdown};_f.asString="function _f(){const{dropdownAnimatedHeight,runOnJS,setShowDropdown}=jsThis._closure;{if(dropdownAnimatedHeight.value===0){runOnJS(setShowDropdown)(false);}}}";_f.__workletHash=8540692570337;_f.__location="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Select.js (158:8)";return _f;}())};};_f._closure={withTiming:_reactNativeReanimated.withTiming,dropdownAnimatedHeight:dropdownAnimatedHeight,Easing:{ease:_reactNativeReanimated.Easing.ease},runOnJS:_reactNativeReanimated.runOnJS,setShowDropdown:setShowDropdown};_f.asString="function _f(){const{withTiming,dropdownAnimatedHeight,Easing,runOnJS,setShowDropdown}=jsThis._closure;{return{height:withTiming(dropdownAnimatedHeight.value,{duration:100,easing:Easing.ease},function(){if(dropdownAnimatedHeight.value===0){runOnJS(setShowDropdown)(false);}})};}}";_f.__workletHash=4835541372615;_f.__location="/Users/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Select.js (150:42)";return _f;}());var toggleAnimation=function toggleAnimation(){dropdownAnimatedHeight.value=dropdownAnimatedHeight.value===0?dropdownHeight:0;};var handleOpenDropdown=function handleOpenDropdown(){_reactNative.Keyboard.dismiss();setSearchQuery("");if(!showDropdown){setShowDropdown(true);}if(showDropdown){toggleAnimation();}};var handleItemSelection=function handleItemSelection(item,index){toggleAnimation();onSelect(item,index);};(0,_react.useEffect)(function(){if(showDropdown){toggleAnimation();}},[showDropdown]);return _react.default.createElement(_.Container,(0,_extends2.default)({},containerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:196,columnNumber:5}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"inter400",mb:1,fontSize:"s",color:"font.base"},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:197,columnNumber:7}}),label),_react.default.createElement(_reactNative.TouchableWithoutFeedback,{disabled:isLoading,onPress:handleOpenDropdown,__self:_this,__source:{fileName:_jsxFileName,lineNumber:206,columnNumber:7}},_react.default.createElement(_.Container,(0,_extends2.default)({borderWidth:1,borderColor:"border.grey400",p:2,flexDirection:"row",justifyContent:"space-between",alignItems:"center"},inputContainerStyle,rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:210,columnNumber:9}}),_react.default.createElement(_.Typography,{fontFamily:"inter400",fontSize:"s",color:"font.grey",__self:_this,__source:{fileName:_jsxFileName,lineNumber:220,columnNumber:11}},selectedOptionLabel||placeholder),isLoading?_react.default.createElement(_reactNative.ActivityIndicator,{size:"small",color:theme.colors.background.base,__self:_this,__source:{fileName:_jsxFileName,lineNumber:224,columnNumber:13}}):_react.default.createElement(_reactNativeRemixIcon.default,{name:"arrow-"+(showDropdown?"up":"down")+"-s-line",size:"20",color:"grey",__self:_this,__source:{fileName:_jsxFileName,lineNumber:229,columnNumber:13}}))),showDropdown&&_react.default.createElement(_.Container,{overflow:"hidden",__self:_this,__source:{fileName:_jsxFileName,lineNumber:238,columnNumber:9}},_react.default.createElement(_reactNativeReanimated.default.View,{style:animatedStyles,__self:_this,__source:{fileName:_jsxFileName,lineNumber:239,columnNumber:11}},_react.default.createElement(_.Card,(0,_extends2.default)({bg:"background.white",borderWidth:1,borderColor:"border.grey400",maxHeight:dropdownHeight},dropdownContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:240,columnNumber:13}}),isSearchable&&_react.default.createElement(_.Container,(0,_extends2.default)({p:1},searchInputContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:248,columnNumber:17}}),_react.default.createElement(_.Input,(0,_extends2.default)({placeholder:"Search",onChangeText:setSearchQuery,fontSize:"s",containerStyles:{height:searchInputHeight,justifyContent:"center"}},searchInputStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:249,columnNumber:19}}))),isOptionsEmpty&&_react.default.createElement(_.Container,(0,_extends2.default)({height:emptyOptionsPlaceholderHeight,justifyContent:"center",alignItems:"center"},emptyOptionsContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:263,columnNumber:17}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"inter400",fontSize:"s",color:"font.grey"},emptyOptionsTextStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:269,columnNumber:19}}),emptyOptionsPlaceholder||"No Options")),_react.default.createElement(_.Container,{height:0,__self:_this,__source:{fileName:_jsxFileName,lineNumber:280,columnNumber:15}},_react.default.createElement(_.Input,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:281,columnNumber:17}})),_react.default.createElement(_reactNativeGestureHandler.ScrollView,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:283,columnNumber:15}},options.filter(function(item,index){var label=labelExtractor(item,index);if((searchQuery==null?void 0:searchQuery.length)===0)return true;return formatStr(label).includes(formatStr(searchQuery));}).map(function(item,index){var optionLabel=labelExtractor(item,index);var optionValue=valueExtractor(item,index);var isSelectedItem=selectedOptionValue&&selectedOptionValue===optionValue;return _react.default.createElement(DropdownItem,{key:index,label:optionLabel,isSelectedItem:isSelectedItem,defaultDropdownItemHeight:defaultDropdownItemHeight,onPress:function onPress(){return handleItemSelection(item,index);},itemContainerStyle:itemContainerStyle,selectedItemContainerStyle:selectedItemContainerStyle,itemTextStyle:itemTextStyle,selectedItemTextStyle:selectedItemTextStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:297,columnNumber:23}});}))))));};exports.Select=Select;Select.propTypes={label:_propTypes.default.string,options:_propTypes.default.arrayOf(_propTypes.default.shape({label:_propTypes.default.string,value:_propTypes.default.string})).isRequired,placeholder:_propTypes.default.string,emptyOptionsPlaceholder:_propTypes.default.string,labelExtractor:_propTypes.default.func,valueExtractor:_propTypes.default.func,value:_propTypes.default.object,onSelect:_propTypes.default.func,isLoading:_propTypes.default.bool,isSearchable:_propTypes.default.bool,labelStyle:_propTypes.default.object,containerStyle:_propTypes.default.object,inputContainerStyle:_propTypes.default.object,dropdownContainerStyle:_propTypes.default.object,itemContainerStyle:_propTypes.default.object,itemTextStyle:_propTypes.default.object,selectedItemContainerStyle:_propTypes.default.object,selectedItemTextStyle:_propTypes.default.object,searchInputContainerStyle:_propTypes.default.object,searchInputStyle:_propTypes.default.object,emptyOptionsContainerStyle:_propTypes.default.object,emptyOptionsTextStyle:_propTypes.default.object};Select.defaultProps={label:null,placeholder:"Select Option",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(){},isLoading:false,isSearchable:false};
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Select=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 _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _reactNative=require("react-native");var _native=require("styled-components/native");var _reactNativeGestureHandler=require("react-native-gesture-handler");var _=require("./");var _excluded=["options","label","value","placeholder","emptyOptionsPlaceholder","labelExtractor","valueExtractor","onSelect","isLoading","isSearchable","showCreateOption","showCreateOptionLoader","createOptionLabel","onPressCreateOption","labelStyle","containerStyle","inputContainerStyle","dropdownContainerStyle","itemContainerStyle","itemLabelStyle","selectedItemContainerStyle","selectedItemLabelStyle","searchInputContainerStyle","searchInputStyle","emptyOptionsContainerStyle","emptyOptionsLabelStyle","createSearchedOptionContainerStyle","createSearchedOptionLabelStyle"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Select.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 DropdownItem=function DropdownItem(_ref){var label=_ref.label,isSelectedItem=_ref.isSelectedItem,defaultDropdownItemHeight=_ref.defaultDropdownItemHeight,onPress=_ref.onPress,itemContainerStyle=_ref.itemContainerStyle,selectedItemContainerStyle=_ref.selectedItemContainerStyle,itemLabelStyle=_ref.itemLabelStyle,selectedItemLabelStyle=_ref.selectedItemLabelStyle;return _react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onPress,__self:_this,__source:{fileName:_jsxFileName,lineNumber:31,columnNumber:3}},_react.default.createElement(_.Container,(0,_extends2.default)({bg:isSelectedItem?"background.base":"background.white",height:defaultDropdownItemHeight,p:2},itemContainerStyle,isSelectedItem&&selectedItemContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:32,columnNumber:5}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"inter400",fontSize:"s",color:isSelectedItem?"font.white":"font.grey"},itemLabelStyle,isSelectedItem&&selectedItemLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:39,columnNumber:7}}),label)));};DropdownItem.propTypes={label:_propTypes.default.string.isRequired,isSelectedItem:_propTypes.default.bool,defaultDropdownItemHeight:_propTypes.default.number,onPress:_propTypes.default.func,itemContainerStyle:_propTypes.default.object,selectedItemContainerStyle:_propTypes.default.object,itemLabelStyle:_propTypes.default.object,selectedItemLabelStyle:_propTypes.default.object};var Select=function Select(_ref2){var options=_ref2.options,label=_ref2.label,value=_ref2.value,placeholder=_ref2.placeholder,emptyOptionsPlaceholder=_ref2.emptyOptionsPlaceholder,labelExtractor=_ref2.labelExtractor,valueExtractor=_ref2.valueExtractor,onSelect=_ref2.onSelect,isLoading=_ref2.isLoading,isSearchable=_ref2.isSearchable,showCreateOption=_ref2.showCreateOption,showCreateOptionLoader=_ref2.showCreateOptionLoader,createOptionLabel=_ref2.createOptionLabel,onPressCreateOption=_ref2.onPressCreateOption,labelStyle=_ref2.labelStyle,containerStyle=_ref2.containerStyle,inputContainerStyle=_ref2.inputContainerStyle,dropdownContainerStyle=_ref2.dropdownContainerStyle,itemContainerStyle=_ref2.itemContainerStyle,itemLabelStyle=_ref2.itemLabelStyle,selectedItemContainerStyle=_ref2.selectedItemContainerStyle,selectedItemLabelStyle=_ref2.selectedItemLabelStyle,searchInputContainerStyle=_ref2.searchInputContainerStyle,searchInputStyle=_ref2.searchInputStyle,emptyOptionsContainerStyle=_ref2.emptyOptionsContainerStyle,emptyOptionsLabelStyle=_ref2.emptyOptionsLabelStyle,createSearchedOptionContainerStyle=_ref2.createSearchedOptionContainerStyle,createSearchedOptionLabelStyle=_ref2.createSearchedOptionLabelStyle,rest=(0,_objectWithoutProperties2.default)(_ref2,_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 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 label=labelExtractor(item,index);if((searchQuery==null?void 0:searchQuery.length)===0)return true;return formatStr(label).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 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?emptyOptionsPlaceholderHeight:0)+(isSearchedOptionsEmpty&&showCreateOption?emptySearchedOptionsHeight:0);var selectedOptionLabel=labelExtractor(value||{});var selectedOptionValue=valueExtractor(value||{});var animatedStyles=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{height:(0,_reactNativeReanimated.withTiming)(dropdownAnimatedHeight.value,{duration:100,easing:_reactNativeReanimated.Easing.ease},function(){var _f=function _f(){if(dropdownAnimatedHeight.value===0){(0,_reactNativeReanimated.runOnJS)(setShowDropdown)(false);}};_f._closure={dropdownAnimatedHeight:dropdownAnimatedHeight,runOnJS:_reactNativeReanimated.runOnJS,setShowDropdown:setShowDropdown};_f.asString="function _f(){const{dropdownAnimatedHeight,runOnJS,setShowDropdown}=jsThis._closure;{if(dropdownAnimatedHeight.value===0){runOnJS(setShowDropdown)(false);}}}";_f.__workletHash=8540692570337;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Select.js (176:8)";return _f;}())};};_f._closure={withTiming:_reactNativeReanimated.withTiming,dropdownAnimatedHeight:dropdownAnimatedHeight,Easing:{ease:_reactNativeReanimated.Easing.ease},runOnJS:_reactNativeReanimated.runOnJS,setShowDropdown:setShowDropdown};_f.asString="function _f(){const{withTiming,dropdownAnimatedHeight,Easing,runOnJS,setShowDropdown}=jsThis._closure;{return{height:withTiming(dropdownAnimatedHeight.value,{duration:100,easing:Easing.ease},function(){if(dropdownAnimatedHeight.value===0){runOnJS(setShowDropdown)(false);}})};}}";_f.__workletHash=4835541372615;_f.__location="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Select.js (168:42)";return _f;}(),[]);var toggleAnimation=function toggleAnimation(){dropdownAnimatedHeight.value=dropdownAnimatedHeight.value===0?dropdownHeight:0;};var handleOpenDropdown=function handleOpenDropdown(){_reactNative.Keyboard.dismiss();setSearchQuery("");if(!showDropdown){setShowDropdown(true);}if(showDropdown){toggleAnimation();}};var handleItemSelection=function handleItemSelection(item,index){toggleAnimation();onSelect(item,index);};(0,_react.useEffect)(function(){if(showDropdown){dropdownAnimatedHeight.value=dropdownHeight;}},[showDropdown,dropdownHeight]);return _react.default.createElement(_.Container,(0,_extends2.default)({},containerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:214,columnNumber:5}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"inter400",mb:1,fontSize:"s",color:"font.base"},labelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:215,columnNumber:7}}),label),_react.default.createElement(_reactNative.TouchableWithoutFeedback,{disabled:isLoading,onPress:handleOpenDropdown,__self:_this,__source:{fileName:_jsxFileName,lineNumber:224,columnNumber:7}},_react.default.createElement(_.Container,(0,_extends2.default)({borderWidth:1,borderColor:"border.grey400",p:2,flexDirection:"row",justifyContent:"space-between",alignItems:"center"},inputContainerStyle,rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:228,columnNumber:9}}),_react.default.createElement(_.Typography,{fontFamily:"inter400",fontSize:"s",color:"font.grey",__self:_this,__source:{fileName:_jsxFileName,lineNumber:238,columnNumber:11}},selectedOptionLabel||placeholder),isLoading?_react.default.createElement(_reactNative.ActivityIndicator,{size:"small",color:theme.colors.background.base,__self:_this,__source:{fileName:_jsxFileName,lineNumber:242,columnNumber:13}}):_react.default.createElement(_reactNativeRemixIcon.default,{name:"arrow-"+(showDropdown?"up":"down")+"-s-line",size:"20",color:"grey",__self:_this,__source:{fileName:_jsxFileName,lineNumber:247,columnNumber:13}}))),showDropdown&&_react.default.createElement(_.Container,{overflow:"hidden",__self:_this,__source:{fileName:_jsxFileName,lineNumber:256,columnNumber:9}},_react.default.createElement(_reactNativeReanimated.default.View,{style:animatedStyles,__self:_this,__source:{fileName:_jsxFileName,lineNumber:257,columnNumber:11}},_react.default.createElement(_.Card,(0,_extends2.default)({bg:"background.white",borderWidth:1,borderColor:"border.grey400",maxHeight:dropdownHeight},dropdownContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:258,columnNumber:13}}),isSearchable&&_react.default.createElement(_.Container,(0,_extends2.default)({p:1},searchInputContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:266,columnNumber:17}}),_react.default.createElement(_.Input,(0,_extends2.default)({placeholder:"Search",onChangeText:setSearchQuery,fontSize:"s",containerStyles:{height:searchInputHeight,justifyContent:"center"}},searchInputStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:267,columnNumber:19}}))),isOptionsEmpty&&_react.default.createElement(_.Container,(0,_extends2.default)({height:emptyOptionsPlaceholderHeight,justifyContent:"center",alignItems:"center"},emptyOptionsContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:281,columnNumber:17}}),_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"inter400",fontSize:"s",color:"font.grey"},emptyOptionsLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:287,columnNumber:19}}),emptyOptionsPlaceholder||"No Options")),isSearchedOptionsEmpty&&showCreateOption&&_react.default.createElement(_.Touchable,(0,_extends2.default)({height:emptySearchedOptionsHeight,justifyContent:"center",alignItems:"center",onPress:function onPress(){return onPressCreateOption(searchQuery);}},createSearchedOptionContainerStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:298,columnNumber:17}}),showCreateOptionLoader?_react.default.createElement(_reactNative.ActivityIndicator,{size:"small",color:theme.colors.background.base,__self:_this,__source:{fileName:_jsxFileName,lineNumber:306,columnNumber:21}}):_react.default.createElement(_.Typography,(0,_extends2.default)({fontFamily:"inter400",fontSize:"s",color:"font.grey"},createSearchedOptionLabelStyle,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:311,columnNumber:21}}),createOptionLabel||"Create "+searchQuery+" option")),_react.default.createElement(_.Container,{height:0,__self:_this,__source:{fileName:_jsxFileName,lineNumber:323,columnNumber:15}},_react.default.createElement(_.Input,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:324,columnNumber:17}})),_react.default.createElement(_reactNativeGestureHandler.ScrollView,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:326,columnNumber:15}},filteredOptions.map(function(item,index){var optionLabel=labelExtractor(item,index);var optionValue=valueExtractor(item,index);var isSelectedItem=selectedOptionValue&&selectedOptionValue===optionValue;return _react.default.createElement(DropdownItem,{key:index,label:optionLabel,isSelectedItem:isSelectedItem,defaultDropdownItemHeight:defaultDropdownItemHeight,onPress:function onPress(){return handleItemSelection(item,index);},itemContainerStyle:itemContainerStyle,selectedItemContainerStyle:selectedItemContainerStyle,itemLabelStyle:itemLabelStyle,selectedItemLabelStyle:selectedItemLabelStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:333,columnNumber:21}});}))))));};exports.Select=Select;Select.propTypes={label:_propTypes.default.string,options:_propTypes.default.arrayOf(_propTypes.default.shape({label:_propTypes.default.string,value:_propTypes.default.string})).isRequired,placeholder:_propTypes.default.string,emptyOptionsPlaceholder:_propTypes.default.string,labelExtractor:_propTypes.default.func,valueExtractor:_propTypes.default.func,value:_propTypes.default.object,onSelect:_propTypes.default.func,isLoading:_propTypes.default.bool,isSearchable:_propTypes.default.bool,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,selectedItemContainerStyle:_propTypes.default.object,selectedItemLabelStyle:_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};Select.defaultProps={label:null,placeholder:"Select Option",emptyOptionsPlaceholder: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(){},isLoading:false,isSearchable:false,showCreateOption:false,showCreateOptionLoader:false,createOptionLabel:null,onPressCreateOption:function onPressCreateOption(){}};
|
package/lib/components/Toast.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Toast=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 _reactNativeToastMessage=_interopRequireDefault(require("react-native-toast-message"));var _config=require("../config");var _hooks=require("@react-native-community/hooks");var _excluded=["toasterConfig"];var _this=this,_jsxFileName="/
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Toast=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 _reactNativeToastMessage=_interopRequireDefault(require("react-native-toast-message"));var _config=require("../config");var _hooks=require("@react-native-community/hooks");var _excluded=["toasterConfig"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Toast.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 globalKeyboardState;var Toast=function Toast(_ref){var toasterConfig=_ref.toasterConfig,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var keyboard=(0,_hooks.useKeyboard)();React.useEffect(function(){globalKeyboardState=keyboard;},[keyboard]);return React.createElement(_reactNativeToastMessage.default,(0,_extends2.default)({},rest,{config:(0,_extends2.default)({},_config.defaultToasterConfig,toasterConfig),position:"bottom",__self:_this,__source:{fileName:_jsxFileName,lineNumber:64,columnNumber:5}}));};exports.Toast=Toast;Toast.show=function(params){if(globalKeyboardState.keyboardShown){_reactNativeToastMessage.default.show((0,_extends2.default)({},params,{position:"top"}));}else{_reactNativeToastMessage.default.show(params);}};Toast.hide=_reactNativeToastMessage.default.hide;Toast.propTypes={toasterConfig:_propTypes.default.object};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.ToggleSwitch=void 0;var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireWildcard(require("react"));var _reactNativeSwitchToggle=_interopRequireDefault(require("react-native-switch-toggle"));var _native=require("styled-components/native");var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _excluded=["value","onValueChange","label","disabled","labelPosition"];var _this=this,_jsxFileName="/
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.ToggleSwitch=void 0;var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireWildcard(require("react"));var _reactNativeSwitchToggle=_interopRequireDefault(require("react-native-switch-toggle"));var _native=require("styled-components/native");var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _excluded=["value","onValueChange","label","disabled","labelPosition"];var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/ToggleSwitch.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 Label=function Label(_ref){var label=_ref.label,textStyles=_ref.textStyles;return _react.default.createElement(_.Typography,(0,_extends2.default)({textStyle:"subtext"},textStyles,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:39,columnNumber:5}}),label);};var ToggleSwitch=function ToggleSwitch(_ref2){var value=_ref2.value,onValueChange=_ref2.onValueChange,label=_ref2.label,disabled=_ref2.disabled,labelPosition=_ref2.labelPosition,rest=(0,_objectWithoutProperties2.default)(_ref2,_excluded);var theme=(0,_react.useContext)(_native.ThemeContext);var circleColorOn=disabled?theme.colors.background.grey500:theme.colors.background.white;var circleColorOff=disabled?theme.colors.background.menubackground:theme.colors.background.white;return _react.default.createElement(_.Container,(0,_extends2.default)({flexDirection:"row",borderColor:theme.colors.border.primary,alignItems:"center"},rest.wrapperStyles,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:63,columnNumber:5}}),labelPosition==="left"&&_react.default.createElement(Label,{label:label,textStyles:rest.textStyles,__self:_this,__source:{fileName:_jsxFileName,lineNumber:70,columnNumber:9}}),_react.default.createElement(_reactNativeSwitchToggle.default,(0,_extends2.default)({switchOn:value,onPress:function onPress(){return!disabled&&onValueChange();},circleColorOn:circleColorOn,circleColorOff:circleColorOff,backgroundColorOff:theme.colors.background.grey200,backgroundColorOn:theme.colors.background.grey800,containerStyle:styles.containerStyle,circleStyle:styles.circleStyle},rest.switchStyles,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:72,columnNumber:7}})),labelPosition==="right"&&_react.default.createElement(Label,{label:label,textStyles:rest.textStyles,__self:_this,__source:{fileName:_jsxFileName,lineNumber:84,columnNumber:9}}));};exports.ToggleSwitch=ToggleSwitch;ToggleSwitch.defaultProps={labelPosition:"left",wrapperStyles:{},switchStyles:{},textStyles:{mr:2}};ToggleSwitch.propTypes={label:_propTypes.default.string,labelPosition:_propTypes.default.string,value:_propTypes.default.bool.isRequired,onValueChange:_propTypes.default.func,disabled:_propTypes.default.bool,wrapperStyles:_propTypes.default.object,switchStyles:_propTypes.default.object,textStyles:_propTypes.default.object};Label.propTypes={label:_propTypes.default.string,textStyles:_propTypes.default.object};var styles=_reactNative.StyleSheet.create({containerStyle:{width:38,height:18,borderRadius:10,padding:2},circleStyle:{width:14,height:14,borderRadius:7}});
|
package/lib/components/TopBar.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.TopBar=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _theme=require("../theme");var _this=this,_jsxFileName="/
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.TopBar=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _=require("./");var _theme=require("../theme");var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/TopBar.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 TopBar=function TopBar(_ref){var data=_ref.data,_ref$activeIndex=_ref.activeIndex,activeIndex=_ref$activeIndex===void 0?0:_ref$activeIndex,_ref$onActiveTabChang=_ref.onActiveTabChange,onActiveTabChange=_ref$onActiveTabChang===void 0?function(){}:_ref$onActiveTabChang,activeTabTextStyle=_ref.activeTabTextStyle,activeTabContainerStyle=_ref.activeTabContainerStyle,inActiveTabTextStyle=_ref.inActiveTabTextStyle,inActiveTabContainerStyle=_ref.inActiveTabContainerStyle,tabContainerStyle=_ref.tabContainerStyle;var _useState=(0,_react.useState)(activeIndex),_useState2=(0,_slicedToArray2.default)(_useState,2),selectedIndex=_useState2[0],setSelectedIndex=_useState2[1];(0,_react.useEffect)(function(){onActiveTabChange(selectedIndex);},[selectedIndex]);(0,_react.useEffect)(function(){setSelectedIndex(activeIndex);},[activeIndex]);return _react.default.createElement(_.Container,{height:50,style:[styles.defaultTabContainerStyle,tabContainerStyle],__self:_this,__source:{fileName:_jsxFileName,lineNumber:30,columnNumber:5}},_react.default.createElement(_reactNative.ScrollView,{horizontal:true,showsHorizontalScrollIndicator:false,__self:_this,__source:{fileName:_jsxFileName,lineNumber:34,columnNumber:7}},data.map(function(item,index){return _react.default.createElement(_.Touchable,{key:index,onPress:function onPress(){return setSelectedIndex(index);},style:selectedIndex===index?(0,_extends2.default)({},styles.defaultActiveContainerStyle,activeTabContainerStyle):(0,_extends2.default)({},styles.defaultInActiveTabContainerStyle,inActiveTabContainerStyle),justifyContent:"center",alignItems:"center",__self:_this,__source:{fileName:_jsxFileName,lineNumber:36,columnNumber:11}},_react.default.createElement(_.Typography,{style:selectedIndex===index?(0,_extends2.default)({},styles.defaultActiveTabTextStyle,activeTabTextStyle):(0,_extends2.default)({},styles.defaultInActiveTabTextStyle,inActiveTabTextStyle),__self:_this,__source:{fileName:_jsxFileName,lineNumber:53,columnNumber:13}},item));})));};exports.TopBar=TopBar;var styles=_reactNative.StyleSheet.create({defaultActiveContainerStyle:{backgroundColor:_theme.theme.colors.background.grey800,marginHorizontal:10,paddingHorizontal:10,marginVertical:5,borderRadius:5},defaultInActiveTabContainerStyle:{backgroundColor:_theme.theme.colors.background.white,marginHorizontal:20},defaultActiveTabTextStyle:{color:_theme.theme.colors.font.white},defaultInActiveTabTextStyle:{color:_theme.theme.colors.font.black},defaultTabContainerStyle:{backgroundColor:_theme.theme.colors.font.white}});TopBar.propTypes={data:_propTypes.default.array.isRequired,activeIndex:_propTypes.default.number,onActiveTabChange:_propTypes.default.func.isRequired,activeTabTextStyle:_propTypes.default.object,activeTabContainerStyle:_propTypes.default.object,inActiveTabTextStyle:_propTypes.default.object,inActiveTabContainerStyle:_propTypes.default.object,tabContainerStyle:_propTypes.default.object};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Touchable=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var React=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _propTypes2=_interopRequireDefault(require("@styled-system/prop-types"));var _reactNativeMaterialRipple=_interopRequireDefault(require("react-native-material-ripple"));var _native=_interopRequireDefault(require("styled-components/native"));var _styledSystem=require("styled-system");var _utils=require("../utils/utils");var _excluded=["children","elevation"];var _templateObject,_this=this,_jsxFileName="/
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Touchable=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var React=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _propTypes2=_interopRequireDefault(require("@styled-system/prop-types"));var _reactNativeMaterialRipple=_interopRequireDefault(require("react-native-material-ripple"));var _native=_interopRequireDefault(require("styled-components/native"));var _styledSystem=require("styled-system");var _utils=require("../utils/utils");var _excluded=["children","elevation"];var _templateObject,_this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Touchable.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 StyledRipple=(0,_native.default)(_reactNativeMaterialRipple.default)(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2.default)(["\n ","\n ","\n ","\n ","\n ","\n ","\n"])),_styledSystem.buttonStyle,_styledSystem.flexbox,_styledSystem.space,_styledSystem.border,_styledSystem.layout,_styledSystem.color);var Touchable=React.forwardRef(function(props,ref){var children=props.children,elevation=props.elevation,rest=(0,_objectWithoutProperties2.default)(props,_excluded);var shadowStyles=elevation?(0,_utils.getShadowStyles)(elevation):{};return React.createElement(StyledRipple,(0,_extends2.default)({rippleOpacity:0.09,rippleDuration:600,rippleContainerBorderRadius:rest.borderRadius?rest.borderRadius:0,style:shadowStyles,ref:ref},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:65,columnNumber:5}}),children);});exports.Touchable=Touchable;Touchable.propTypes=(0,_extends2.default)({},_propTypes2.default.flexbox,_propTypes2.default.space,_propTypes2.default.border,_propTypes2.default.layout,_propTypes2.default.color,_propTypes2.default.buttonStyle,{children:_propTypes.default.node});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Typography=exports.Text=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var React=_interopRequireWildcard(require("react"));var _native=_interopRequireDefault(require("styled-components/native"));var _styledSystem=require("styled-system");var _propTypes=_interopRequireDefault(require("@styled-system/prop-types"));var _propTypes2=_interopRequireDefault(require("prop-types"));var _excluded=["children"];var _templateObject,_this=this,_jsxFileName="/
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.Typography=exports.Text=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var React=_interopRequireWildcard(require("react"));var _native=_interopRequireDefault(require("styled-components/native"));var _styledSystem=require("styled-system");var _propTypes=_interopRequireDefault(require("@styled-system/prop-types"));var _propTypes2=_interopRequireDefault(require("prop-types"));var _excluded=["children"];var _templateObject,_this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/components/Typography.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 Text=_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"}}));exports.Text=Text;var Typography=function Typography(_ref){var children=_ref.children,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);return React.createElement(Text,(0,_extends2.default)({},rest,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:77,columnNumber:10}}),children);};exports.Typography=Typography;Typography.propTypes=(0,_extends2.default)({},_propTypes.default.space,_propTypes.default.layout,_propTypes.default.flexbox,_propTypes.default.typography,_propTypes.default.color,_propTypes.default.textStyle,{children:_propTypes2.default.node});Typography.defaultProps={textStyle:"defaultTextStyle"};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.defaultToasterConfig=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireDefault(require("react"));var _reactNativeToastMessage=_interopRequireWildcard(require("react-native-toast-message"));var _reactNative=require("react-native");var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _theme=require("../theme");var _this=this,_jsxFileName="/
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.defaultToasterConfig=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react=_interopRequireDefault(require("react"));var _reactNativeToastMessage=_interopRequireWildcard(require("react-native-toast-message"));var _reactNative=require("react-native");var _reactNativeRemixIcon=_interopRequireDefault(require("react-native-remix-icon"));var _theme=require("../theme");var _this=this,_jsxFileName="/home/runner/work/neeto-ui-rn/neeto-ui-rn/src/config/toasterConfig.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 CloseButton=function CloseButton(){return _react.default.createElement(_reactNative.Pressable,{style:styles.closeButtonStyle,onPress:_reactNativeToastMessage.default.hide,__self:_this,__source:{fileName:_jsxFileName,lineNumber:10,columnNumber:5}},_react.default.createElement(_reactNativeRemixIcon.default,{name:"ri-close-fill",size:25,color:_theme.theme.colors.background.white,__self:_this,__source:{fileName:_jsxFileName,lineNumber:11,columnNumber:7}}));};var defaultToasterConfig={success:function success(props){return _react.default.createElement(_reactNativeToastMessage.BaseToast,(0,_extends2.default)({},props,{leadingIconContainerStyle:styles.toasterBGColor,renderTrailingIcon:function renderTrailingIcon(){return _react.default.createElement(CloseButton,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:25,columnNumber:33}});},contentContainerStyle:styles.contentContainerStyle,text1Style:styles.text1Style,text2Style:styles.text2Style,text1NumberOfLines:10,text2NumberOfLines:10,touchableContainerProps:{style:[styles.touchableContainerProps,styles.successStyle]},__self:_this,__source:{fileName:_jsxFileName,lineNumber:22,columnNumber:5}}));},error:function error(props){return _react.default.createElement(_reactNativeToastMessage.BaseToast,(0,_extends2.default)({},props,{leadingIconContainerStyle:styles.toasterBGColor,renderTrailingIcon:function renderTrailingIcon(){return _react.default.createElement(CloseButton,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:40,columnNumber:33}});},contentContainerStyle:styles.contentContainerStyle,text1Style:styles.text1Style,text2Style:styles.text2Style,text1NumberOfLines:10,text2NumberOfLines:10,touchableContainerProps:{style:[styles.touchableContainerProps,styles.errorStyle]},__self:_this,__source:{fileName:_jsxFileName,lineNumber:37,columnNumber:5}}));},info:function info(props){return _react.default.createElement(_reactNativeToastMessage.BaseToast,(0,_extends2.default)({},props,{leadingIconContainerStyle:styles.toasterBGColor,renderTrailingIcon:function renderTrailingIcon(){return _react.default.createElement(CloseButton,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:55,columnNumber:33}});},contentContainerStyle:styles.contentContainerStyle,text1Style:styles.text1Style,text2Style:styles.text2Style,text1NumberOfLines:10,text2NumberOfLines:10,touchableContainerProps:{style:[styles.touchableContainerProps,styles.infoStyle]},__self:_this,__source:{fileName:_jsxFileName,lineNumber:52,columnNumber:5}}));},warning:function warning(props){return _react.default.createElement(_reactNativeToastMessage.BaseToast,(0,_extends2.default)({},props,{leadingIconContainerStyle:styles.toasterBGColor,renderTrailingIcon:function renderTrailingIcon(){return _react.default.createElement(CloseButton,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:70,columnNumber:33}});},contentContainerStyle:styles.contentContainerStyle,text1Style:styles.text1Style,text2Style:styles.text2Style,text1NumberOfLines:10,text2NumberOfLines:10,touchableContainerProps:{style:[styles.touchableContainerProps,styles.warningStyle]},__self:_this,__source:{fileName:_jsxFileName,lineNumber:67,columnNumber:5}}));}};exports.defaultToasterConfig=defaultToasterConfig;defaultToasterConfig.success.displayName="Success";defaultToasterConfig.error.displayName="Error";var styles=_reactNative.StyleSheet.create({touchableContainerProps:{flexDirection:"row",flex:1,paddingVertical:10,width:340,borderRadius:6,shadowOffset:{width:0,height:0},shadowOpacity:0.1,shadowRadius:6,elevation:2,backgroundColor:"#FFF",borderLeftWidth:5,borderLeftColor:"#D8D8D8"},successStyle:{borderLeftColor:_theme.theme.colors.toast.success,backgroundColor:_theme.theme.colors.background.grey800},errorStyle:{borderLeftColor:_theme.theme.colors.toast.error,backgroundColor:_theme.theme.colors.background.grey800},infoStyle:{borderLeftColor:_theme.theme.colors.toast.info,backgroundColor:_theme.theme.colors.background.grey800},warningStyle:{borderLeftColor:_theme.theme.colors.toast.warning,backgroundColor:_theme.theme.colors.background.grey800},toasterBGColor:{backgroundColor:_theme.theme.colors.background.grey800},contentContainerStyle:{paddingHorizontal:15,backgroundColor:_theme.theme.colors.background.grey800},text1Style:{fontSize:15,fontFamily:_theme.theme.fonts.inter700,color:_theme.theme.colors.font.white},text2Style:{fontSize:16,fontFamily:_theme.theme.fonts.inter700,color:_theme.theme.colors.font.white},closeButtonStyle:{justifyContent:"center",alignItems:"center",paddingRight:10,backgroundColor:_theme.theme.colors.background.grey800,shadowColor:_theme.theme.colors.background.grey800,flexDirection:"row",borderTopRightRadius:6,borderBottomRightRadius:6,shadowOffset:{width:0,height:0},shadowOpacity:0.1,shadowRadius:6,elevation:2}});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bigbinary/neetoui-rn",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.124",
|
|
4
4
|
"main": "lib/index.js",
|
|
5
5
|
"author": "BigBinary",
|
|
6
6
|
"license": "MIT",
|
|
@@ -96,6 +96,7 @@
|
|
|
96
96
|
"eslint-import-resolver-babel-module": "^5.3.1",
|
|
97
97
|
"eslint-plugin-import": "^2.25.3",
|
|
98
98
|
"eslint-plugin-jest": "^25.2.4",
|
|
99
|
+
"eslint-plugin-neeto": "git+https://neeto_gems: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@github.com/bigbinary/eslint-plugin-neeto#1.0.5",
|
|
99
100
|
"eslint-plugin-prettier": "^4.0.0",
|
|
100
101
|
"eslint-plugin-promise": "^5.1.1",
|
|
101
102
|
"eslint-plugin-react": "^7.27.0",
|
|
@@ -2,7 +2,8 @@ import React from "react";
|
|
|
2
2
|
import Proptypes from "prop-types";
|
|
3
3
|
|
|
4
4
|
import { Container, Typography, Touchable } from "@components";
|
|
5
|
-
|
|
5
|
+
|
|
6
|
+
const labelPositions = ["left", "right"];
|
|
6
7
|
|
|
7
8
|
const LabelComponent = ({ label, labelComponent, labelProp }) => {
|
|
8
9
|
return labelComponent || <Typography {...labelProp}>{label}</Typography>;
|
|
@@ -70,7 +71,7 @@ export const CheckBox = ({
|
|
|
70
71
|
alignItems="center"
|
|
71
72
|
{...rest}
|
|
72
73
|
>
|
|
73
|
-
{labelPosition ===
|
|
74
|
+
{labelPosition === labelPositions[0] ? (
|
|
74
75
|
<LabelComponent
|
|
75
76
|
label={label}
|
|
76
77
|
labelComponent={labelComponent}
|
|
@@ -95,7 +96,7 @@ export const CheckBox = ({
|
|
|
95
96
|
</Container>
|
|
96
97
|
)}
|
|
97
98
|
</Container>
|
|
98
|
-
{labelPosition ===
|
|
99
|
+
{labelPosition === labelPositions[1] ? (
|
|
99
100
|
<LabelComponent
|
|
100
101
|
label={label}
|
|
101
102
|
labelComponent={labelComponent}
|
|
@@ -142,7 +143,7 @@ CheckBox.propTypes = {
|
|
|
142
143
|
/**
|
|
143
144
|
* Position of label relative to the radio button. It can be either `left` or `right`
|
|
144
145
|
*/
|
|
145
|
-
labelPosition: Proptypes.oneOf(
|
|
146
|
+
labelPosition: Proptypes.oneOf(labelPositions),
|
|
146
147
|
/**
|
|
147
148
|
* Extra param to customize checkbox container
|
|
148
149
|
*/
|
package/src/components/FAB.js
CHANGED
|
@@ -42,6 +42,7 @@ import { Touchable } from "@components";
|
|
|
42
42
|
* @extends StyledSystems props /styled-system
|
|
43
43
|
*/
|
|
44
44
|
|
|
45
|
+
// eslint-disable-next-line neeto/no-dangling-constants
|
|
45
46
|
export const FAB = ({ Icon, bg, disabled, variant, onPress, ...rest }) => {
|
|
46
47
|
const shadowStyle = {
|
|
47
48
|
shadowColor: "#000",
|
|
@@ -22,7 +22,7 @@ const MultiSelectItem = ({
|
|
|
22
22
|
label,
|
|
23
23
|
onUnselect,
|
|
24
24
|
multiSelectedItemContainerStyle,
|
|
25
|
-
|
|
25
|
+
multiSelectedItemLabelStyle,
|
|
26
26
|
}) => (
|
|
27
27
|
<Container
|
|
28
28
|
borderWidth={1}
|
|
@@ -41,7 +41,7 @@ const MultiSelectItem = ({
|
|
|
41
41
|
fontSize="s"
|
|
42
42
|
mr={2}
|
|
43
43
|
maxWidth="90%"
|
|
44
|
-
{...
|
|
44
|
+
{...multiSelectedItemLabelStyle}
|
|
45
45
|
>
|
|
46
46
|
{label}
|
|
47
47
|
</Typography>
|
|
@@ -55,7 +55,7 @@ MultiSelectItem.propTypes = {
|
|
|
55
55
|
label: PropTypes.string,
|
|
56
56
|
onUnselect: PropTypes.func,
|
|
57
57
|
multiSelectedItemContainerStyle: PropTypes.object,
|
|
58
|
-
|
|
58
|
+
multiSelectedItemLabelStyle: PropTypes.object,
|
|
59
59
|
};
|
|
60
60
|
|
|
61
61
|
const DropdownItem = ({
|
|
@@ -63,7 +63,7 @@ const DropdownItem = ({
|
|
|
63
63
|
onPress,
|
|
64
64
|
defaultDropdownItemHeight,
|
|
65
65
|
itemContainerStyle,
|
|
66
|
-
|
|
66
|
+
itemLabelStyle,
|
|
67
67
|
}) => {
|
|
68
68
|
return (
|
|
69
69
|
<Touchable bg="background.white" onPress={onPress}>
|
|
@@ -76,7 +76,7 @@ const DropdownItem = ({
|
|
|
76
76
|
fontFamily="inter400"
|
|
77
77
|
fontSize="s"
|
|
78
78
|
color="font.grey"
|
|
79
|
-
{...
|
|
79
|
+
{...itemLabelStyle}
|
|
80
80
|
>
|
|
81
81
|
{label}
|
|
82
82
|
</Typography>
|
|
@@ -90,7 +90,7 @@ DropdownItem.propTypes = {
|
|
|
90
90
|
onPress: PropTypes.func,
|
|
91
91
|
defaultDropdownItemHeight: PropTypes.number,
|
|
92
92
|
itemContainerStyle: PropTypes.object,
|
|
93
|
-
|
|
93
|
+
itemLabelStyle: PropTypes.object,
|
|
94
94
|
};
|
|
95
95
|
|
|
96
96
|
/**
|
|
@@ -148,18 +148,24 @@ export const MultiSelect = ({
|
|
|
148
148
|
deletedValue,
|
|
149
149
|
isLoading,
|
|
150
150
|
isSearchable,
|
|
151
|
+
showCreateOption,
|
|
152
|
+
showCreateOptionLoader,
|
|
153
|
+
createOptionLabel,
|
|
154
|
+
onPressCreateOption,
|
|
151
155
|
labelStyle,
|
|
152
156
|
containerStyle,
|
|
153
157
|
inputContainerStyle,
|
|
154
158
|
dropdownContainerStyle,
|
|
155
159
|
itemContainerStyle,
|
|
156
|
-
|
|
160
|
+
itemLabelStyle,
|
|
157
161
|
multiSelectedItemContainerStyle,
|
|
158
|
-
|
|
162
|
+
multiSelectedItemLabelStyle,
|
|
159
163
|
searchInputContainerStyle,
|
|
160
164
|
searchInputStyle,
|
|
161
165
|
emptyOptionsContainerStyle,
|
|
162
|
-
|
|
166
|
+
emptyOptionsLabelStyle,
|
|
167
|
+
createSearchedOptionContainerStyle,
|
|
168
|
+
createSearchedOptionLabelStyle,
|
|
163
169
|
...rest
|
|
164
170
|
}) => {
|
|
165
171
|
const theme = useContext(ThemeContext);
|
|
@@ -167,13 +173,7 @@ export const MultiSelect = ({
|
|
|
167
173
|
const [searchQuery, setSearchQuery] = useState("");
|
|
168
174
|
const dropdownAnimatedHeight = useSharedValue(0);
|
|
169
175
|
|
|
170
|
-
const isOptionsEmpty = !options || options?.length === 0;
|
|
171
|
-
const emptyOptionsPlaceholderHeight = 40;
|
|
172
|
-
const searchInputHeight = 35;
|
|
173
|
-
const multipleOptionsSelected = value?.length > 0;
|
|
174
|
-
const defaultDropdownItemHeight = itemContainerStyle?.height || 32;
|
|
175
176
|
const formatStr = str => str?.toLowerCase()?.trim();
|
|
176
|
-
|
|
177
177
|
const filteredOptions = options
|
|
178
178
|
.filter((item, index) => {
|
|
179
179
|
const optionValue = valueExtractor(item, index);
|
|
@@ -190,12 +190,23 @@ export const MultiSelect = ({
|
|
|
190
190
|
return formatStr(optionLabel).includes(formatStr(searchQuery));
|
|
191
191
|
});
|
|
192
192
|
|
|
193
|
+
const isOptionsEmpty = !options || options?.length === 0;
|
|
194
|
+
const isSearchedOptionsEmpty =
|
|
195
|
+
searchQuery.length > 0 && filteredOptions.length === 0;
|
|
196
|
+
const emptyOptionsPlaceholderHeight = 40;
|
|
197
|
+
const emptySearchedOptionsHeight = 40;
|
|
198
|
+
const searchInputHeight = 35;
|
|
199
|
+
const multipleOptionsSelected = value?.length > 0;
|
|
200
|
+
const defaultDropdownItemHeight = itemContainerStyle?.height || 32;
|
|
193
201
|
const dropdownHeight =
|
|
194
202
|
dropdownContainerStyle?.height ||
|
|
195
203
|
dropdownContainerStyle?.maxHeight ||
|
|
196
204
|
defaultDropdownItemHeight * Math.min(filteredOptions?.length, 6) +
|
|
197
205
|
(isSearchable ? searchInputHeight + 10 : 0) +
|
|
198
|
-
(isOptionsEmpty ? emptyOptionsPlaceholderHeight : 0)
|
|
206
|
+
(isOptionsEmpty ? emptyOptionsPlaceholderHeight : 0) +
|
|
207
|
+
(isSearchedOptionsEmpty && showCreateOption
|
|
208
|
+
? emptySearchedOptionsHeight
|
|
209
|
+
: 0);
|
|
199
210
|
|
|
200
211
|
const animatedStyles = useAnimatedStyle(() => {
|
|
201
212
|
return {
|
|
@@ -212,7 +223,7 @@ export const MultiSelect = ({
|
|
|
212
223
|
}
|
|
213
224
|
),
|
|
214
225
|
};
|
|
215
|
-
});
|
|
226
|
+
}, []);
|
|
216
227
|
|
|
217
228
|
const handleOpenDropdown = () => {
|
|
218
229
|
Keyboard.dismiss();
|
|
@@ -295,7 +306,7 @@ export const MultiSelect = ({
|
|
|
295
306
|
multiSelectedItemContainerStyle={
|
|
296
307
|
multiSelectedItemContainerStyle
|
|
297
308
|
}
|
|
298
|
-
|
|
309
|
+
multiSelectedItemLabelStyle={multiSelectedItemLabelStyle}
|
|
299
310
|
/>
|
|
300
311
|
);
|
|
301
312
|
})}
|
|
@@ -352,12 +363,38 @@ export const MultiSelect = ({
|
|
|
352
363
|
fontFamily="inter400"
|
|
353
364
|
fontSize="s"
|
|
354
365
|
color="font.grey"
|
|
355
|
-
{...
|
|
366
|
+
{...emptyOptionsLabelStyle}
|
|
356
367
|
>
|
|
357
368
|
{emptyOptionsPlaceholder || "No Options"}
|
|
358
369
|
</Typography>
|
|
359
370
|
</Container>
|
|
360
371
|
)}
|
|
372
|
+
|
|
373
|
+
{isSearchedOptionsEmpty && showCreateOption && (
|
|
374
|
+
<Touchable
|
|
375
|
+
height={emptySearchedOptionsHeight}
|
|
376
|
+
justifyContent="center"
|
|
377
|
+
alignItems="center"
|
|
378
|
+
onPress={() => onPressCreateOption(searchQuery)}
|
|
379
|
+
{...createSearchedOptionContainerStyle}
|
|
380
|
+
>
|
|
381
|
+
{showCreateOptionLoader ? (
|
|
382
|
+
<ActivityIndicator
|
|
383
|
+
size="small"
|
|
384
|
+
color={theme.colors.background.base}
|
|
385
|
+
/>
|
|
386
|
+
) : (
|
|
387
|
+
<Typography
|
|
388
|
+
fontFamily="inter400"
|
|
389
|
+
fontSize="s"
|
|
390
|
+
color="font.grey"
|
|
391
|
+
{...createSearchedOptionLabelStyle}
|
|
392
|
+
>
|
|
393
|
+
{createOptionLabel || `Create ${searchQuery} option`}
|
|
394
|
+
</Typography>
|
|
395
|
+
)}
|
|
396
|
+
</Touchable>
|
|
397
|
+
)}
|
|
361
398
|
{/* Animation not working without this hidden input */}
|
|
362
399
|
<Container height={0}>
|
|
363
400
|
<Input />
|
|
@@ -372,7 +409,7 @@ export const MultiSelect = ({
|
|
|
372
409
|
onPress={() => handleSelection(item)}
|
|
373
410
|
itemContainerStyle={itemContainerStyle}
|
|
374
411
|
defaultDropdownItemHeight={defaultDropdownItemHeight}
|
|
375
|
-
|
|
412
|
+
itemLabelStyle={itemLabelStyle}
|
|
376
413
|
/>
|
|
377
414
|
);
|
|
378
415
|
})}
|
|
@@ -439,6 +476,22 @@ MultiSelect.propTypes = {
|
|
|
439
476
|
* Toggle Search bar within the options dropdown to search through the options.
|
|
440
477
|
*/
|
|
441
478
|
isSearchable: PropTypes.bool,
|
|
479
|
+
/**
|
|
480
|
+
* Show option to create the searched label if not present in the options list
|
|
481
|
+
*/
|
|
482
|
+
showCreateOption: PropTypes.bool,
|
|
483
|
+
/**
|
|
484
|
+
* Show loader while creating a searched option not present in the options list
|
|
485
|
+
*/
|
|
486
|
+
showCreateOptionLoader: PropTypes.bool,
|
|
487
|
+
/**
|
|
488
|
+
* Custom label for creating searched option not present in the options list
|
|
489
|
+
*/
|
|
490
|
+
createOptionLabel: PropTypes.string,
|
|
491
|
+
/**
|
|
492
|
+
* Callback when create searched option is pressed
|
|
493
|
+
*/
|
|
494
|
+
onPressCreateOption: PropTypes.func,
|
|
442
495
|
/**
|
|
443
496
|
* To customise floating label styles.
|
|
444
497
|
*/
|
|
@@ -462,7 +515,7 @@ MultiSelect.propTypes = {
|
|
|
462
515
|
/**
|
|
463
516
|
* To customise dropdown item text styles.
|
|
464
517
|
*/
|
|
465
|
-
|
|
518
|
+
itemLabelStyle: PropTypes.object,
|
|
466
519
|
/**
|
|
467
520
|
* To customise item container styles for multi selected items.
|
|
468
521
|
*/
|
|
@@ -470,7 +523,7 @@ MultiSelect.propTypes = {
|
|
|
470
523
|
/**
|
|
471
524
|
* To customise item text styles for multi selected item.
|
|
472
525
|
*/
|
|
473
|
-
|
|
526
|
+
multiSelectedItemLabelStyle: PropTypes.object,
|
|
474
527
|
/**
|
|
475
528
|
* To customise search input containerr style.
|
|
476
529
|
*/
|
|
@@ -486,12 +539,21 @@ MultiSelect.propTypes = {
|
|
|
486
539
|
/**
|
|
487
540
|
* To customise empty options placeholder text style.
|
|
488
541
|
*/
|
|
489
|
-
|
|
542
|
+
emptyOptionsLabelStyle: PropTypes.object,
|
|
543
|
+
/**
|
|
544
|
+
* To customise empty options placeholder container style.
|
|
545
|
+
*/
|
|
546
|
+
createSearchedOptionContainerStyle: PropTypes.object,
|
|
547
|
+
/**
|
|
548
|
+
* To customise empty options placeholder text style.
|
|
549
|
+
*/
|
|
550
|
+
createSearchedOptionLabelStyle: PropTypes.object,
|
|
490
551
|
};
|
|
491
552
|
|
|
492
553
|
MultiSelect.defaultProps = {
|
|
493
554
|
label: null,
|
|
494
555
|
placeholder: "Select Option",
|
|
556
|
+
emptyOptionsPlaceholder: null,
|
|
495
557
|
labelExtractor: option => option?.label,
|
|
496
558
|
valueExtractor: option => option?.value,
|
|
497
559
|
value: null,
|
|
@@ -500,4 +562,8 @@ MultiSelect.defaultProps = {
|
|
|
500
562
|
deletedValue: () => {},
|
|
501
563
|
isLoading: false,
|
|
502
564
|
isSearchable: false,
|
|
565
|
+
showCreateOption: false,
|
|
566
|
+
showCreateOptionLoader: false,
|
|
567
|
+
createOptionLabel: null,
|
|
568
|
+
onPressCreateOption: () => {},
|
|
503
569
|
};
|
|
@@ -2,7 +2,7 @@ import React from "react";
|
|
|
2
2
|
import PropTypes from "prop-types";
|
|
3
3
|
|
|
4
4
|
import { Container, Touchable, Typography } from "@components";
|
|
5
|
-
const
|
|
5
|
+
const labelPositions = ["left", "right"];
|
|
6
6
|
|
|
7
7
|
const LabelComponent = ({ label, labelComponent, labelProp }) => {
|
|
8
8
|
return labelComponent || <Typography {...labelProp}>{label}</Typography>;
|
|
@@ -69,7 +69,7 @@ export const RadioButton = ({
|
|
|
69
69
|
py={1}
|
|
70
70
|
{...rest}
|
|
71
71
|
>
|
|
72
|
-
{labelPosition ===
|
|
72
|
+
{labelPosition === labelPositions[0] ? (
|
|
73
73
|
<LabelComponent
|
|
74
74
|
label={label}
|
|
75
75
|
labelComponent={labelComponent}
|
|
@@ -101,7 +101,7 @@ export const RadioButton = ({
|
|
|
101
101
|
/>
|
|
102
102
|
</Container>
|
|
103
103
|
</Container>
|
|
104
|
-
{labelPosition ===
|
|
104
|
+
{labelPosition === labelPositions[1] ? (
|
|
105
105
|
<LabelComponent
|
|
106
106
|
label={label}
|
|
107
107
|
labelComponent={labelComponent}
|
|
@@ -136,7 +136,7 @@ RadioButton.propTypes = {
|
|
|
136
136
|
/**
|
|
137
137
|
* Position of label relative to the radio button. It can be either `left` or `right`
|
|
138
138
|
*/
|
|
139
|
-
labelPosition: PropTypes.oneOf(
|
|
139
|
+
labelPosition: PropTypes.oneOf(labelPositions),
|
|
140
140
|
/**
|
|
141
141
|
* Whether radio is disabled.
|
|
142
142
|
*/
|