import { jsx } from 'react/jsx-runtime';
import { useState, useEffect } from 'react';
import { useBoolean, Text } from '@chakra-ui/react';
import { Select } from 'chakra-react-select';

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
  var target = {};
  for (var prop in source)
    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
      target[prop] = source[prop];
  if (source != null && __getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(source)) {
      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
        target[prop] = source[prop];
    }
  return target;
};
const SelectNext = (_a) => {
  var _b = _a, {
    name,
    placeholder,
    defaultValue,
    isGroup,
    isMulti,
    max,
    options,
    onChange,
    onBlur,
    onReset,
    classNames,
    components,
    styles,
    chakraStyles
  } = _b, otherProps = __objRest(_b, [
    "name",
    "placeholder",
    "defaultValue",
    "isGroup",
    "isMulti",
    "max",
    "options",
    "onChange",
    "onBlur",
    "onReset",
    "classNames",
    "components",
    "styles",
    "chakraStyles"
  ]);
  const [menuIsOpen, setMenuIsOpen] = useBoolean();
  const controlledSelectOptions = options || [];
  const defaultMultiValue = isMulti && controlledSelectOptions.filter(
    ({ value }) => defaultValue == null ? void 0 : defaultValue.includes(value)
  );
  const defaultSingleValue = !isMulti && controlledSelectOptions.find(({ value }) => defaultValue === value);
  const [currentSelection, setCurrentSelection] = useState(
    defaultMultiValue || defaultSingleValue || ""
  );
  const selectOptions = isGroup && controlledSelectOptions.length > 0 ? [...new Set(controlledSelectOptions.map(({ group }) => group))].map((group) => ({
    label: group,
    options: controlledSelectOptions.filter((option) => option.group === group)
  })) : controlledSelectOptions;
  const isMaxLimitReached = isMulti && max ? (currentSelection == null ? void 0 : currentSelection.length) >= max : false;
  useEffect(() => {
    if (isMaxLimitReached) {
      setMenuIsOpen.off();
    }
  }, [isMaxLimitReached, setMenuIsOpen]);
  useEffect(() => {
    if (isMulti && currentSelection.length === void 0) {
      setCurrentSelection([currentSelection]);
      onChange == null ? void 0 : onChange([currentSelection]);
    }
  }, [isMulti]);
  useEffect(() => {
    const optionValues = options.map(({ value }) => value);
    const hasMissingOptionListSelected = isMulti && options.length > 0 && currentSelection.length && (currentSelection == null ? void 0 : currentSelection.some(
      ({ value }) => !optionValues.includes(value)
    ));
    const hasMissingOptionSelected = currentSelection && !isMulti && !optionValues.includes(currentSelection.value);
    if (hasMissingOptionListSelected || hasMissingOptionSelected) {
      setCurrentSelection("");
      onReset == null ? void 0 : onReset();
    }
  }, [options]);
  return /* @__PURE__ */ jsx(
    Select,
    __spreadProps(__spreadValues({}, otherProps), {
      "data-testid": `${name}_field`,
      placeholder,
      options: selectOptions,
      formatGroupLabel: (group) => /* @__PURE__ */ jsx(Text, { children: group.label }),
      isMulti,
      value: currentSelection,
      onChange: (newValue) => {
        if (newValue)
          setCurrentSelection(newValue);
        onChange == null ? void 0 : onChange(newValue);
      },
      onBlur,
      onMenuOpen: () => {
        if (!isMaxLimitReached) {
          setMenuIsOpen.on();
        }
      },
      onMenuClose: () => setMenuIsOpen.off(),
      menuIsOpen,
      closeMenuOnSelect: isMulti ? isMaxLimitReached : true,
      hideSelectedOptions: false,
      tagVariant: "outline",
      selectedOptionColor: "brand",
      selectedOptionStyle: "check"
    })
  );
};

export { SelectNext as default };
//# sourceMappingURL=SelectNext.js.map
