UNPKG

react-native-actions-sheet-picker-serial-luncher

Version:
221 lines (195 loc) 9.86 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.onOpen = exports.onClose = exports.Picker = void 0; var _react = _interopRequireWildcard(require("react")); var _reactNative = require("react-native"); var _reactNativeActionsSheet = _interopRequireWildcard(require("react-native-actions-sheet")); var _reactNativeGestureHandler = require("react-native-gesture-handler"); function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; } function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } const onOpen = id => { _reactNativeActionsSheet.SheetManager.show(id); }; exports.onOpen = onOpen; const onClose = id => { _reactNativeActionsSheet.SheetManager.hide(id); }; exports.onClose = onClose; const Picker = _ref => { var _style$actionSheet$ba, _style$actionSheet, _style$input, _style$close, _style$close$text, _style$close2, _style$label, _style$label$text, _style$label2, _style$activityIndica, _style$activityIndica2, _style$activityIndica3; let { id, data = [], inputValue, searchable = false, loading = false, label, height = Math.floor(_reactNative.Dimensions.get('window').height * 0.5), closeText = 'Close', placeholderText = 'Search', noDataFoundText = 'No Data Found.', placeholderTextColor = '#8B93A5', setSelected, onSearch, searchInputProps, flatListProps, actionsSheetProps, renderListItem, style } = _ref; const [selectedKey, setSelectedKey] = (0, _react.useState)(null); const actionSheetRef = /*#__PURE__*/(0, _react.createRef)(); const scrollViewRef = (0, _react.useRef)(null); const onClose = () => { _reactNativeActionsSheet.SheetManager.hide(id); }; const Item = _ref2 => { var _style$item, _style$item2; let { item, index } = _ref2; return /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, { style: [{ paddingVertical: 20, borderBottomWidth: 0.5, borderColor: '#CDD4D9' }, style === null || style === void 0 ? void 0 : (_style$item = style.item) === null || _style$item === void 0 ? void 0 : _style$item.container], onPress: () => { itemOnPress(item); setSelectedKey(index); } }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, { style: [{ fontWeight: selectedKey !== index ? 'normal' : 'bold' }, style === null || style === void 0 ? void 0 : (_style$item2 = style.item) === null || _style$item2 === void 0 ? void 0 : _style$item2.text] }, item.name ? item.name : null)); }; const itemOnPress = item => { setSelected(item); onClose(); }; const keyExtractor = (_item, index) => index.toString(); return /*#__PURE__*/_react.default.createElement(_reactNativeActionsSheet.default, _extends({ id: id, ref: actionSheetRef, indicatorColor: 'transparent', gestureEnabled: true, keyboardShouldPersistTaps: "always" }, actionsSheetProps, { containerStyle: style === null || style === void 0 ? void 0 : style.actionSheet }), /*#__PURE__*/_react.default.createElement(_reactNative.SafeAreaView, { style: { height: height } }, /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.FlatList, _extends({ disableScrollViewPanResponder: true, contentContainerStyle: { paddingHorizontal: 20 }, stickyHeaderIndices: [0], ListHeaderComponent: /*#__PURE__*/_react.default.createElement(_reactNative.View, { style: { backgroundColor: (_style$actionSheet$ba = style === null || style === void 0 ? void 0 : (_style$actionSheet = style.actionSheet) === null || _style$actionSheet === void 0 ? void 0 : _style$actionSheet.backgroundColor) !== null && _style$actionSheet$ba !== void 0 ? _style$actionSheet$ba : '#fff' } }, searchable ? /*#__PURE__*/_react.default.createElement(_reactNative.View, { style: { flexDirection: 'row', width: '100%', alignItems: 'center', justifyContent: 'space-between', marginBottom: 10 } }, /*#__PURE__*/_react.default.createElement(_reactNative.View, { style: { flexBasis: '75%' } }, /*#__PURE__*/_react.default.createElement(_reactNative.TextInput, _extends({ style: (_style$input = style === null || style === void 0 ? void 0 : style.input) !== null && _style$input !== void 0 ? _style$input : { height: 40, borderWidth: 1, borderColor: '#CDD4D9', borderRadius: 6, padding: 10, color: '#333' }, value: inputValue, placeholderTextColor: placeholderTextColor, onChangeText: onSearch, placeholder: placeholderText, clearButtonMode: "always", autoCapitalize: "none", autoCorrect: false }, searchInputProps))), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, { style: [{ padding: 10 }, style === null || style === void 0 ? void 0 : (_style$close = style.close) === null || _style$close === void 0 ? void 0 : _style$close.container], onPress: () => { onClose(); } }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, { style: (_style$close$text = style === null || style === void 0 ? void 0 : (_style$close2 = style.close) === null || _style$close2 === void 0 ? void 0 : _style$close2.text) !== null && _style$close$text !== void 0 ? _style$close$text : { color: '#333' } }, closeText))) : null, /*#__PURE__*/_react.default.createElement(_reactNative.View, { style: [{ marginTop: 10, paddingBottom: 5 }, style === null || style === void 0 ? void 0 : (_style$label = style.label) === null || _style$label === void 0 ? void 0 : _style$label.container] }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, { style: (_style$label$text = style === null || style === void 0 ? void 0 : (_style$label2 = style.label) === null || _style$label2 === void 0 ? void 0 : _style$label2.text) !== null && _style$label$text !== void 0 ? _style$label$text : { color: '#333', fontSize: 16, fontWeight: 'bold' } }, label)), loading ? /*#__PURE__*/_react.default.createElement(_reactNative.ActivityIndicator, { style: [{ marginVertical: 20 }, style === null || style === void 0 ? void 0 : (_style$activityIndica = style.activityIndicator) === null || _style$activityIndica === void 0 ? void 0 : _style$activityIndica.style], color: (_style$activityIndica2 = style === null || style === void 0 ? void 0 : (_style$activityIndica3 = style.activityIndicator) === null || _style$activityIndica3 === void 0 ? void 0 : _style$activityIndica3.color) !== null && _style$activityIndica2 !== void 0 ? _style$activityIndica2 : '#999' }) : null), ListEmptyComponent: () => { if (!loading) { var _style$noDataFound, _style$noDataFound$te, _style$noDataFound2; return /*#__PURE__*/_react.default.createElement(_reactNative.View, { style: [{ flex: 1, alignItems: 'center', paddingTop: 20 }, style === null || style === void 0 ? void 0 : (_style$noDataFound = style.noDataFound) === null || _style$noDataFound === void 0 ? void 0 : _style$noDataFound.container] }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, { style: (_style$noDataFound$te = style === null || style === void 0 ? void 0 : (_style$noDataFound2 = style.noDataFound) === null || _style$noDataFound2 === void 0 ? void 0 : _style$noDataFound2.text) !== null && _style$noDataFound$te !== void 0 ? _style$noDataFound$te : { color: '#333' } }, noDataFoundText)); } return null; }, ref: scrollViewRef, nestedScrollEnabled: true, data: data, renderItem: _ref3 => { let { item, index } = _ref3; if (renderListItem) { return renderListItem(item, index); } return /*#__PURE__*/_react.default.createElement(Item, { item: item, index: index }); }, keyExtractor: keyExtractor, onMomentumScrollEnd: () => { var _actionSheetRef$curre; return (_actionSheetRef$curre = actionSheetRef.current) === null || _actionSheetRef$curre === void 0 ? void 0 : _actionSheetRef$curre.handleChildScrollEnd(); } }, flatListProps)))); }; exports.Picker = Picker; //# sourceMappingURL=Picker.js.map