"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const index = require("../../icons/index.cjs");
;/* empty css                                                                                                                                                                                        */
;/* empty css                                                                                                                                                                                         */
;/* empty css                                                                                                                                                                                                 */
;/* empty css                                                                                                                                                                                            */
;/* empty css                                                                                                                                                                                            */
const helper = require("./helper.cjs");
const useProps = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/core/MantineProvider/use-props/use-props.cjs");
const MantineThemeProvider = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.cjs");
const useCombobox = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Combobox/use-combobox/use-combobox.cjs");
const useUncontrolled = require("../../node_modules/.pnpm/@mantine_hooks@7.15.2_react@18.3.1/node_modules/@mantine/hooks/esm/use-uncontrolled/use-uncontrolled.cjs");
const getParsedComboboxData = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Combobox/get-parsed-combobox-data/get-parsed-combobox-data.cjs");
const getOptionsLockup = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Combobox/get-options-lockup/get-options-lockup.cjs");
const defaultOptionsFilter = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Combobox/OptionsDropdown/default-options-filter.cjs");
const Pill = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Pill/Pill.cjs");
const isOptionsGroup = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Combobox/OptionsDropdown/is-options-group.cjs");
const Combobox = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Combobox/Combobox.cjs");
const InputBase = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/InputBase/InputBase.cjs");
const Loader = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Loader/Loader.cjs");
const Input = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Input/Input.cjs");
const ScrollArea = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/ScrollArea/ScrollArea.cjs");
const Group = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Group/Group.cjs");
const Box = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/core/Box/Box.cjs");
const Checkbox = require("../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Checkbox/Checkbox.cjs");
const Option = ({ data, withCheckIcon, value, checkIconPosition, unstyled, renderOption }) => {
  if (!isOptionsGroup.isOptionsGroup(data)) {
    const checked = helper.isValueChecked(value, data.value);
    const check = withCheckIcon && /* @__PURE__ */ jsxRuntime.jsx(Checkbox.Checkbox, { size: "xs", checked });
    const defaultContent = /* @__PURE__ */ jsxRuntime.jsxs(Group.Group, { children: [
      checkIconPosition === "left" && check,
      /* @__PURE__ */ jsxRuntime.jsx(Box.Box, { sx: { flex: 1 }, children: data.label }),
      checkIconPosition === "right" && check
    ] });
    return /* @__PURE__ */ jsxRuntime.jsx(
      Combobox.Combobox.Option,
      {
        value: data.value,
        disabled: data.disabled,
        "data-reverse": checkIconPosition === "right" || void 0,
        "data-checked": checked || void 0,
        "aria-selected": checked,
        active: checked,
        styles: (theme) => ({
          option: {
            "&:hover": {
              backgroundColor: theme.colors.carbon[3]
            }
          }
        }),
        children: typeof renderOption === "function" ? renderOption({ option: data, checked }) : defaultContent
      }
    );
  }
  const options = data.items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
    Option,
    {
      data: item,
      value,
      unstyled,
      withCheckIcon,
      checkIconPosition,
      renderOption
    },
    item.value
  ));
  return /* @__PURE__ */ jsxRuntime.jsx(Combobox.Combobox.Group, { label: data.group, children: options });
};
const defaultProps = {
  maxValues: Infinity,
  withCheckIcon: true,
  checkIconPosition: "left",
  hiddenInputValuesDivider: ","
};
const ProMultiSelect = (_props) => {
  const props = useProps.useProps("MultiSelect", defaultProps, _props);
  const {
    data,
    value,
    defaultValue,
    limit,
    searchable,
    searchValue,
    defaultSearchValue,
    maxValues,
    readOnly,
    disabled,
    size,
    width,
    selectFirstOptionOnChange,
    placeholder,
    clearable,
    label,
    nothingFoundMessage,
    dropdownOpened,
    defaultDropdownOpened,
    loading,
    maxDropdownHeight,
    error,
    onOptionSubmit,
    renderOption,
    filter,
    onChange,
    onSearchChange,
    onRemove,
    onClear
  } = props;
  const theme = MantineThemeProvider.useMantineTheme();
  const combobox = useCombobox.useCombobox({
    opened: dropdownOpened,
    defaultOpened: defaultDropdownOpened,
    onDropdownClose: () => {
      combobox.resetSelectedOption();
      setSearchValue("");
    },
    onDropdownOpen: () => {
      combobox.focusSearchInput();
    }
  });
  const [_value, setValue] = useUncontrolled.useUncontrolled({
    value,
    defaultValue,
    finalValue: [],
    onChange
  });
  const [_searchValue, setSearchValue] = useUncontrolled.useUncontrolled({
    value: searchValue,
    defaultValue: defaultSearchValue,
    finalValue: "",
    onChange: onSearchChange
  });
  const parsedData = getParsedComboboxData.getParsedComboboxData(data);
  const optionsLockup = getOptionsLockup.getOptionsLockup(parsedData);
  const shouldFilter = typeof _searchValue === "string";
  const filteredData = shouldFilter ? (filter || defaultOptionsFilter.defaultOptionsFilter)({
    options: parsedData,
    search: searchable ? _searchValue : "",
    limit: limit ?? Infinity
  }) : parsedData;
  const [targetIndex, setTargetIndex] = React.useState(0);
  const hideCount = _value.length - targetIndex - 1;
  const values = _value.map((item, index2) => {
    var _a, _b;
    return /* @__PURE__ */ jsxRuntime.jsxs(
      Pill.Pill,
      {
        withRemoveButton: !readOnly && !((_a = optionsLockup[item]) == null ? void 0 : _a.disabled),
        onRemove: () => {
          setValue(_value.filter((i) => item !== i));
          onRemove == null ? void 0 : onRemove(item);
        },
        disabled,
        styles: (theme2) => ({ root: { backgroundColor: theme2.colors.carbon[3], borderRadius: theme2.radius.sm } }),
        sx: { position: "relative" },
        children: [
          ((_b = optionsLockup[item]) == null ? void 0 : _b.label) || item,
          targetIndex === index2 && /* @__PURE__ */ jsxRuntime.jsxs(
            Pill.Pill,
            {
              styles: (theme2) => ({
                root: { backgroundColor: theme2.colors.carbon[3], borderRadius: theme2.radius.sm, padding: "0 5px" }
              }),
              sx: { position: "absolute", right: 0, transform: "translateX(calc(100% + 8px))" },
              children: [
                "+",
                hideCount
              ]
            }
          )
        ]
      },
      `${item}-${index2}`
    );
  });
  const inputRef = React.useRef(null);
  React.useLayoutEffect(() => {
    var _a;
    const child = (_a = inputRef.current) == null ? void 0 : _a.children;
    if (!child || (child == null ? void 0 : child.length) === 0) return;
    const index2 = Array.from(child).findIndex((child2) => child2.offsetTop > 20);
    setTargetIndex(index2 - 1);
  }, [values]);
  const options = filteredData == null ? void 0 : filteredData.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
    Option,
    {
      data: item,
      value: _value,
      unstyled: false,
      withCheckIcon: true,
      checkIconPosition: "left",
      renderOption
    },
    isOptionsGroup.isOptionsGroup(item) ? item.group : item.value
  ));
  const handleOptionSubmit = (val) => {
    onOptionSubmit == null ? void 0 : onOptionSubmit(val);
    setSearchValue("");
    combobox.updateSelectedOptionIndex("selected");
    if (_value.includes(optionsLockup[val].value)) {
      setValue(_value.filter((v) => v !== optionsLockup[val].value));
      onRemove == null ? void 0 : onRemove(optionsLockup[val].value);
    } else if (_value.length < maxValues) {
      setValue([..._value, optionsLockup[val].value]);
    }
  };
  const clearButton = /* @__PURE__ */ jsxRuntime.jsx(
    Combobox.Combobox.ClearButton,
    {
      onClear: () => {
        onClear == null ? void 0 : onClear();
        setValue([]);
        setSearchValue("");
      }
    }
  );
  const _clearable = clearable && _value.length > 0 && !disabled && !readOnly;
  return /* @__PURE__ */ jsxRuntime.jsxs(
    Combobox.Combobox,
    {
      store: combobox,
      withinPortal: true,
      size,
      readOnly,
      onOptionSubmit: handleOptionSubmit,
      shadow: "sm",
      styles: {
        search: {
          borderRadius: theme.radius.md
        }
      },
      children: [
        /* @__PURE__ */ jsxRuntime.jsx(Combobox.Combobox.Target, { children: /* @__PURE__ */ jsxRuntime.jsxs(
          InputBase.InputBase,
          {
            error,
            w: width,
            component: "button",
            type: "button",
            pointer: true,
            disabled: disabled || loading,
            rightSection: loading ? /* @__PURE__ */ jsxRuntime.jsx(Loader.Loader, { size: "sm" }) : _clearable ? clearButton : /* @__PURE__ */ jsxRuntime.jsx(Combobox.Combobox.Chevron, {}),
            label,
            styles: {
              label: { color: theme.colors.carbon[8], marginBottom: 6, fontSize: 14, lineHeight: "20px" },
              description: { color: theme.colors.carbon[6] },
              error: { color: theme.colors.red[7] }
            },
            rightSectionPointerEvents: value === null ? "none" : "all",
            onClick: () => combobox.toggleDropdown(),
            children: [
              _value.length === 0 && !!placeholder && /* @__PURE__ */ jsxRuntime.jsx(Input.Input.Placeholder, { children: placeholder }),
              /* @__PURE__ */ jsxRuntime.jsx(
                Pill.Pill.Group,
                {
                  ref: inputRef,
                  mah: 22,
                  sx: {
                    flexWrap: "wrap",
                    overflowY: "clip",
                    maxWidth: `calc(100% - ${(hideCount.toString().length + 2) * 8}px)`
                  },
                  children: values
                }
              )
            ]
          }
        ) }),
        /* @__PURE__ */ jsxRuntime.jsxs(Combobox.Combobox.Dropdown, { children: [
          searchable && /* @__PURE__ */ jsxRuntime.jsx(
            Combobox.Combobox.Search,
            {
              leftSection: /* @__PURE__ */ jsxRuntime.jsx(index.IconSearchLg, { size: 16, c: "gray.9", strokeWidth: 2 }),
              value: _searchValue,
              onChange: (event) => {
                setSearchValue(event.currentTarget.value);
                searchable && combobox.openDropdown();
                selectFirstOptionOnChange && combobox.selectFirstOption();
              },
              placeholder: "Find"
            }
          ),
          /* @__PURE__ */ jsxRuntime.jsx(ScrollArea.ScrollArea.Autosize, { type: "scroll", mah: maxDropdownHeight ?? 200, children: /* @__PURE__ */ jsxRuntime.jsx(Combobox.Combobox.Options, { children: options.length > 0 ? options : /* @__PURE__ */ jsxRuntime.jsx(Combobox.Combobox.Empty, { children: nothingFoundMessage || "Nothing found" }) }) })
        ] })
      ]
    }
  );
};
exports.ProMultiSelect = ProMultiSelect;
