secullum-react-native-ui 4.15.1-beta.2 → 4.15.1-beta.4

package/lib/components/DropDown.d.ts

@@ -22,8 +22,11 @@ export interface DropDownProperties {
     nativeID?: string;
     icon?: string | undefined;
     arrowColor?: string | undefined;
-    searchable?: boolean;
-    minItemsToShowSearch: number;
+    searchable?: SearchableProps;
+}
+export interface SearchableProps {
+    placeHolder: string;
+    minItemsToSearch?: number;
 }
 export interface DropDownState {
     modalOpen: boolean;
@@ -32,7 +35,6 @@ export interface DropDownState {
 export declare class DropDown extends React.Component<DropDownProperties, DropDownState> {
     static defaultProps: {
         emptyMessage: string;
-        minItemsToShowSearch: number;
     };
     state: DropDownState;
     handleItemPress: (value: any) => void;

package/lib/components/DropDown.js

@@ -111,8 +111,11 @@ class DropDown extends React.Component {
             return items.filter(item => item.label.toLowerCase().includes(searchText.toLowerCase()));
         };
         this.shouldDisplaySearchField = () => {
-            const { items, searchable, minItemsToShowSearch } = this.props;
-            return items.length >= minItemsToShowSearch && searchable;
+            var _a;
+            const { items, searchable } = this.props;
+            const defaultQuantityToSearch = 10;
+            return (searchable &&
+                items.length >= ((_a = searchable.minItemsToSearch) !== null && _a !== void 0 ? _a : defaultQuantityToSearch));
         };
         this.renderClosedDropDown = (item, inputStyle) => {
             const { iconComponent } = this.props;
@@ -151,8 +154,9 @@ class DropDown extends React.Component {
             return null;
         };
         this.getStyles = () => {
+            var _a;
             const theme = (0, theme_1.getTheme)();
-            const { icon, arrowColor, minItemsToShowSearch } = this.props;
+            const { icon, arrowColor } = this.props;
             const styles = react_native_1.StyleSheet.create({
                 container: Object.assign({ paddingHorizontal: 16, paddingVertical: 8, borderWidth: 1, borderColor: theme.borderColor1, borderRadius: 3 }, (icon
                     ? {
@@ -196,10 +200,12 @@ class DropDown extends React.Component {
                     right: 16
                 },
                 modalOverlay: {
-                    justifyContent: this.props.items.length >= minItemsToShowSearch &&
-                        this.props.searchable
+                    justifyContent: this.shouldDisplaySearchField()
                         ? 'flex-start'
-                        : 'center'
+                        : 'center',
+                    paddingTop: this.shouldDisplaySearchField()
+                        ? (react_native_1.Platform.OS === 'ios' ? 44 : (_a = react_native_1.StatusBar.currentHeight) !== null && _a !== void 0 ? _a : 0)
+                        : 0
                 },
                 modalContainer: {
                     maxHeight: '95%',
@@ -292,8 +298,7 @@ class DropDown extends React.Component {
         const selectedItem = items.find(x => x.value === value);
         const styles = this.getStyles();
         const theme = (0, theme_1.getTheme)();
-        const filteredItems = this.filterItems();
-        const visibleItems = searchable ? filteredItems : items;
+        const filteredItems = searchable ? this.filterItems() : items;
         return (React.createElement(react_native_1.TouchableWithoutFeedback, { onPress: () => __awaiter(this, void 0, void 0, function* () {
                 if (onPress) {
                     const result = yield onPress();
@@ -325,10 +330,10 @@ class DropDown extends React.Component {
                             ] },
                             this.shouldDisplaySearchField() && (React.createElement(react_native_1.View, { style: styles.searchContainer },
                                 React.createElement(react_native_1.View, { style: styles.inputWrapper },
-                                    React.createElement(react_native_1.TextInput, { style: styles.searchInput, value: searchText, placeholder: "Buscar", onChangeText: text => this.setState({ searchText: text }) }),
+                                    React.createElement(react_native_1.TextInput, { style: styles.searchInput, value: searchText, placeholder: searchable === null || searchable === void 0 ? void 0 : searchable.placeHolder, onChangeText: text => this.setState({ searchText: text }) }),
                                     React.createElement(FontAwesome_1.default, { name: "search", size: 16, color: "gray", style: styles.searchIcon })))),
-                            filteredItems.length > 0 ? (React.createElement(react_native_1.FlatList, { data: visibleItems, initialNumToRender: visibleItems.length, keyExtractor: item => item.value.toString(), renderItem: ({ item, index }) => {
-                                    return (React.createElement(DropDownItem, { nativeID: item.nativeID, first: index === 0, last: index === visibleItems.length - 1, label: item.label, value: item.value, onPress: this.handleItemPress, icon: item.icon, iconComponent: iconComponent }));
+                            filteredItems.length > 0 ? (React.createElement(react_native_1.FlatList, { data: filteredItems, initialNumToRender: filteredItems.length, keyExtractor: item => item.value.toString(), renderItem: ({ item, index }) => {
+                                    return (React.createElement(DropDownItem, { nativeID: item.nativeID, first: index === 0, last: index === filteredItems.length - 1, label: item.label, value: item.value, onPress: this.handleItemPress, icon: item.icon, iconComponent: iconComponent }));
                                 } })) : (React.createElement(react_native_1.View, { style: styles.emptyMessageContainer },
                                 React.createElement(FontAwesome_1.default, { name: "warning", color: theme.warningColor, size: 24 }),
                                 React.createElement(react_native_1.Text, { style: styles.modalItem }, emptyMessage)))))))));
@@ -336,6 +341,5 @@ class DropDown extends React.Component {
 }
 exports.DropDown = DropDown;
 DropDown.defaultProps = {
-    emptyMessage: 'Não há registros cadastrados',
-    minItemsToShowSearch: 10
+    emptyMessage: 'Não há registros cadastrados'
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "secullum-react-native-ui",
-  "version": "4.15.1-beta.2",
+  "version": "4.15.1-beta.4",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "files": [