@niku/react-native-dropdown-select/lib/commonjs/DropdownOptionGroup/index.js

A Dropdown select component for React Native

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.renderOptionItemOrGroup = renderOptionItemOrGroup;
exports.default = void 0;

var _react = _interopRequireDefault(require("react"));

var _reactNative = require("react-native");

var _OptionItem = _interopRequireDefault(require("../OptionItem"));

var _utils = require("../utils");

var _styles = require("./styles");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const DropdownOptionGroup = ({
  group,
  compareOption,
  optionProps,
  onOptionPress,
  optionComponent,
  renderOption,
  selectedOption,
  deep = 1,
  padding = 8
}) => {
  const renderItem = _react.default.useCallback(({
    item: option
  }) => {
    return renderOptionItemOrGroup({ ...optionProps,
      style: [optionProps.style, {
        paddingLeft: (deep + 1) * padding
      }],
      selectedOption,
      renderOption,
      optionComponent,
      selectOption: onOptionPress,
      option,
      compareOption,
      deep: deep + 1,
      optionGroupPadding: padding
    });
  }, [optionProps, selectedOption, renderOption, onOptionPress, deep, padding]);

  const renderHeader = _react.default.useCallback(() => {
    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
      style: {
        paddingLeft: deep * padding
      }
    }, typeof group.label === 'string' ? /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
      numberOfLines: 1,
      style: [_styles.styles.title]
    }, group.label) : group.label);
  }, [group, deep, padding]);

  return /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
    data: group.options,
    renderItem: renderItem,
    keyExtractor: (option, index) => (0, _utils.isDropdownOptionItem)(option) ? option.value : (typeof option.label === 'string' ? option.label : index) + '-' + option.options.length,
    ListHeaderComponent: renderHeader
  });
};

var _default = DropdownOptionGroup;
exports.default = _default;

function renderOptionItemOrGroup({
  compareOption,
  selectedOption,
  renderOption,
  optionComponent,
  style,
  disabledStyle,
  activeStyle,
  labelStyle,
  disabledLabelStyle,
  activeLabelStyle,
  option,
  selectOption,
  optionGroupComponent,
  renderOptionGroup,
  deep,
  optionGroupPadding
}) {
  if ((0, _utils.isDropdownOptionItem)(option)) {
    const optionProps = {
      option: option,
      active: selectedOption ? compareOption(selectedOption, option) : false,
      style,
      activeStyle,
      labelStyle,
      activeLabelStyle,
      disabledLabelStyle,
      disabledStyle
    };

    const optionPressed = () => {
      selectOption(option);
    };

    return /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
      disabled: option.disabled,
      onPress: optionPressed
    }, (0, _utils.getRenderComponent)(optionProps, optionComponent, renderOption) || /*#__PURE__*/_react.default.createElement(_OptionItem.default, optionProps));
  } else {
    const optionProps = {
      style,
      activeStyle,
      labelStyle,
      activeLabelStyle,
      disabledStyle,
      disabledLabelStyle
    };
    console.log({
      deep
    });
    const groupProps = {
      group: option,
      optionProps,
      selectedOption,
      compareOption,
      optionComponent,
      renderOption,
      onOptionPress: selectOption,
      padding: optionGroupPadding
    };
    return (0, _utils.getRenderComponent)(groupProps, optionGroupComponent, renderOptionGroup) || /*#__PURE__*/_react.default.createElement(DropdownOptionGroup, groupProps);
  }
}
//# sourceMappingURL=index.js.map