@react-form-fields/native-base/Select/List.js

Native Base Form Fields

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var useConfigContext_1 = require("@react-form-fields/core/hooks/useConfigContext");
var native_base_1 = require("native-base");
var React = require("react");
var react_native_1 = require("react-native");
var context_1 = require("./context");
var ListItem_1 = require("./ListItem");
var List = React.memo(function (props) {
    var multiple = props.multiple, options = props.options, internalValue = props.internalValue, setInternalValue = props.setInternalValue;
    var config = useConfigContext_1.default();
    config.select = config.select || {};
    var renderItem = React.useCallback(function (_a) {
        var item = _a.item;
        return React.createElement(ListItem_1.default, { item: item });
    }, []);
    var keyExtractor = React.useCallback(function (item) { return item.label + "-" + item.value; }, []);
    var contextValue = React.useMemo(function () { return ({
        multiple: multiple,
        value: internalValue,
        setValue: function (value, checked) {
            if (!multiple) {
                setInternalValue(new Set([value]));
                return;
            }
            checked ? internalValue.add(value) : internalValue.delete(value);
            setInternalValue(new Set(internalValue));
        }
    }); }, [internalValue, multiple, setInternalValue]);
    return (React.createElement(context_1.default.Provider, { value: contextValue },
        React.createElement(native_base_1.View, { style: styles.container },
            React.createElement(react_native_1.FlatList, { data: props.renderOptions ? options : [], keyExtractor: keyExtractor, renderItem: renderItem, maxToRenderPerBatch: 2, ListEmptyComponent: !!props.renderOptions && React.createElement(native_base_1.Text, { style: styles.notFound }, config.select.notFound || 'Not found') }))));
});
var styles = react_native_1.StyleSheet.create({
    container: {
        flex: 1
    },
    notFound: {
        textAlign: 'center',
        fontSize: 16,
        padding: 16,
        fontStyle: 'italic',
        opacity: 0.8
    }
});
exports.default = List;
//# sourceMappingURL=List.js.map