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

A Dropdown select component for React Native

"use strict";

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

var _react = require("react");

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

const useDropdownSelect = ({
  defaultValue,
  options,
  compareFunc,
  onShowDropdown,
  onHideDropdown,
  onSelectOption,
  value
}) => {
  const [show, setShow] = (0, _react.useState)(false);
  const [selectedOption, setSelectedOption] = (0, _react.useState)();
  const [showEventListeners, setShowEventListener] = (0, _react.useState)([]);
  const [hideEventListeners, setHideEventListener] = (0, _react.useState)([]);
  const [chooseOptionEventListeners, setChooseOptionEventListener] = (0, _react.useState)([]);
  /**
   * Event listener
   */

  const callShowEventListeners = (0, _react.useCallback)(() => {
    showEventListeners.forEach(listener => {
      listener();
    });
  }, [showEventListeners]);
  const addShowEventListener = (0, _react.useCallback)(callback => {
    setShowEventListener(state => {
      const newState = [...state];
      newState.push(callback);
      return newState;
    });
  }, []);
  const removeShowEventListener = (0, _react.useCallback)(callback => {
    setShowEventListener(state => {
      const newState = [...state];
      const index = newState.findIndex(listener => listener === callback);

      if (index > -1) {
        newState.splice(index, 1);
      }

      return newState;
    });
  }, []);
  const callHideEventListeners = (0, _react.useCallback)(() => {
    hideEventListeners.forEach(listener => {
      listener();
    });
  }, [hideEventListeners]);
  const addHideEventListener = (0, _react.useCallback)(callback => {
    setHideEventListener(state => {
      const newState = [...state];
      newState.push(callback);
      return newState;
    });
  }, []);
  const removeHideEventListener = (0, _react.useCallback)(callback => {
    setHideEventListener(state => {
      const newState = [...state];
      const index = newState.findIndex(listener => listener === callback);

      if (index > -1) {
        newState.splice(index, 1);
      }

      return newState;
    });
  }, []);
  const callChooseOptionEventListeners = (0, _react.useCallback)(option => {
    chooseOptionEventListeners.forEach(listener => {
      listener(option);
    });
  }, [chooseOptionEventListeners]);
  const addChooseOptionEventListener = (0, _react.useCallback)(callback => {
    setChooseOptionEventListener(state => {
      const newState = [...state];
      newState.push(callback);
      return newState;
    });
  }, []);
  const removeChooseOptionEventListener = (0, _react.useCallback)(callback => {
    setChooseOptionEventListener(state => {
      const newState = [...state];
      const index = newState.findIndex(listener => listener === callback);

      if (index > -1) {
        newState.splice(index, 1);
      }

      return newState;
    });
  }, []);
  const showDropdown = (0, _react.useCallback)(() => {
    callShowEventListeners();
    setShow(true);
  }, [callShowEventListeners]);
  const hideDropdown = (0, _react.useCallback)(() => {
    callHideEventListeners();
    setShow(false);
  }, [callHideEventListeners]);
  const selectOption = (0, _react.useCallback)((option, fireEvent = true) => {
    if (fireEvent) {
      callChooseOptionEventListeners(option);
      hideDropdown();
    }

    setSelectedOption(option);
  }, [callChooseOptionEventListeners, hideDropdown]);
  const compareOption = (0, _react.useCallback)((option1, option2) => {
    if (!option1 || !option2) {
      return false;
    }

    if (compareFunc) {
      return compareFunc(option1, option2);
    }

    return option1.value === option2.value;
  }, [compareFunc]);
  const findOptionMatchValue = (0, _react.useCallback)((val, inputOptions) => {
    if (!inputOptions) {
      inputOptions = options;
    }

    if (val !== undefined) {
      for (const option of inputOptions) {
        if ((0, _utils.isDropdownOptionItem)(option)) {
          const isCurrentOption = (0, _utils.isDropdownOptionItem)(val) ? compareOption(option, val) : val === option.value;

          if (isCurrentOption) {
            return option;
          }
        } else {
          const matchedOption = findOptionMatchValue(val, option.options);

          if (matchedOption) {
            return matchedOption;
          }
        }
      }
    }

    return undefined;
  }, [options, compareOption, _utils.isDropdownOptionItem]);
  (0, _react.useEffect)(() => {
    setSelectedOption(findOptionMatchValue(defaultValue));
  }, []);
  (0, _react.useEffect)(() => {
    setSelectedOption(findOptionMatchValue(value));
  }, [value]);
  (0, _react.useEffect)(() => {
    if (onShowDropdown) {
      addShowEventListener(onShowDropdown);
    }

    if (onHideDropdown) {
      addHideEventListener(onHideDropdown);
    }

    if (onSelectOption) {
      addChooseOptionEventListener(onSelectOption);
    }

    return () => {
      if (onShowDropdown) {
        removeShowEventListener(onShowDropdown);
      }

      if (onHideDropdown) {
        removeHideEventListener(onHideDropdown);
      }

      if (onSelectOption) {
        removeChooseOptionEventListener(onSelectOption);
      }
    };
  }, [addChooseOptionEventListener, addHideEventListener, addShowEventListener, onHideDropdown, onSelectOption, onShowDropdown, removeChooseOptionEventListener, removeHideEventListener, removeShowEventListener]);
  return {
    show,
    showDropdown,
    hideDropdown,
    selectOption,
    selectedOption,
    addShowEventListener,
    addHideEventListener,
    addChooseOptionEventListener,
    removeShowEventListener,
    removeHideEventListener,
    removeChooseOptionEventListener,
    compareOption
  };
};

exports.useDropdownSelect = useDropdownSelect;
//# sourceMappingURL=index.js.map