var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/components/iconSelect/index.tsx
var iconSelect_exports = {};
__export(iconSelect_exports, {
  default: () => iconSelect_default
});
module.exports = __toCommonJS(iconSelect_exports);
var import_react = __toESM(require("react"));
var import_antd = require("antd");
var import_icons = require("@ant-design/icons");
var import_ahooks = require("ahooks");
var import_utils = require("@pisell/utils");
var import_locales = require("../../locales");
var import_utils2 = require("./utils");
var import_index = require("./index.less");
var IconGroupNameMap = {
  outlined: (0, import_locales.getText)("pisell-icon-select-outlined"),
  filled: (0, import_locales.getText)("pisell-icon-select-filled"),
  "two-tone": (0, import_locales.getText)("pisell-icon-select-two-tone"),
  iconfont: (0, import_locales.getText)("pisell-icon-select-iconfont")
};
var Icon = (props) => {
  const { type, icons = {}, ...rest } = props;
  const Comp = icons[type];
  if (!Comp) return null;
  return /* @__PURE__ */ import_react.default.createElement(Comp, { ...rest });
};
var IconContent = ({
  selectedGroup,
  groups,
  setSelectedGroup,
  search,
  setSearch,
  list,
  handleChange,
  icons
}) => /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-icon-select-popup" }, /* @__PURE__ */ import_react.default.createElement(
  import_antd.Radio.Group,
  {
    className: "pisell-lowcode-icon-select-radio-group",
    size: "middle",
    value: selectedGroup,
    onChange: (e) => setSelectedGroup(e.target.value)
  },
  groups.map((item) => /* @__PURE__ */ import_react.default.createElement(import_antd.Radio.Button, { key: item.group, value: item.group }, IconGroupNameMap[item.group]))
), /* @__PURE__ */ import_react.default.createElement(
  import_antd.Input,
  {
    value: search,
    size: "middle",
    placeholder: (0, import_locales.getText)("pisell-icon-select-search"),
    allowClear: true,
    prefix: /* @__PURE__ */ import_react.default.createElement(import_icons.SearchOutlined, null),
    onChange: (e) => setSearch(e.target.value),
    style: { width: "100%" },
    className: "pisell-lowcode-icon-select-search"
  }
), /* @__PURE__ */ import_react.default.createElement("ul", { className: "pisell-lowcode-icon-select-content" }, list.map((item) => /* @__PURE__ */ import_react.default.createElement(
  "li",
  {
    className: "pisell-lowcode-icon-select-item",
    key: item.name,
    onClick: () => handleChange(item.name),
    title: item.name
  },
  /* @__PURE__ */ import_react.default.createElement(Icon, { type: item.name, icons })
))));
var IconSelect = (props) => {
  const { disabled, defaultValue } = props;
  const [open, setOpen] = (0, import_react.useState)(false);
  const [search, setSearch] = (0, import_react.useState)("");
  const [icons, setIcons] = (0, import_react.useState)({});
  const [groups, setGroups] = (0, import_react.useState)([]);
  const [selectedGroup, setSelectedGroup] = (0, import_react.useState)("outlined");
  const [firstLoad, setFirstLoad] = (0, import_react.useState)(true);
  const [list, setList] = (0, import_react.useState)([]);
  const [value, onChange] = (0, import_ahooks.useControllableValue)(props, {
    defaultValue
  });
  if (firstLoad && defaultValue && (0, import_utils.isUndefined)(value)) {
    onChange(defaultValue);
    setFirstLoad(false);
  }
  (0, import_react.useEffect)(() => {
    var _a;
    const iconList = (0, import_utils2.getIconList)();
    const groups2 = [];
    const icons2 = {};
    iconList.forEach((item) => {
      const { group, name, icon } = item;
      if (groups2.every((item2) => item2.group !== group)) {
        groups2.push({ group, list: [] });
      }
      const target = groups2.find((item2) => item2.group === group);
      target.list.push(item);
      icons2[item.name] = item == null ? void 0 : item.icon;
    });
    setIcons(icons2);
    setGroups(groups2);
    setSelectedGroup((_a = groups2[0]) == null ? void 0 : _a.group);
  }, []);
  (0, import_react.useEffect)(() => {
    const currentGroup = groups.find((item) => item.group === selectedGroup);
    setList(
      ((currentGroup == null ? void 0 : currentGroup.list) ?? []).filter((item) => {
        return search ? item.name.toLowerCase().indexOf(search.toLowerCase()) > -1 : true;
      })
    );
  }, [selectedGroup, search, groups]);
  const handleChange = (icon) => {
    onChange == null ? void 0 : onChange(icon);
    hide();
  };
  const triggerNode = /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-icon-select-trigger" }, /* @__PURE__ */ import_react.default.createElement(Icon, { type: value, icons, style: { fontSize: 24 } }));
  const hide = () => {
    setOpen(false);
  };
  const handleOpenChange = (newOpen) => {
    setOpen(newOpen);
  };
  return /* @__PURE__ */ import_react.default.createElement(import_antd.Space.Compact, { block: true, className: "pisell-lowcode-icon-select" }, /* @__PURE__ */ import_react.default.createElement(
    import_antd.Popover,
    {
      content: /* @__PURE__ */ import_react.default.createElement(
        IconContent,
        {
          selectedGroup,
          groups,
          setSelectedGroup,
          search,
          setSearch,
          list,
          handleChange,
          icons
        }
      ),
      trigger: "click",
      placement: "bottom",
      open,
      onOpenChange: handleOpenChange
    },
    value ? /* @__PURE__ */ import_react.default.createElement(
      import_antd.Button,
      {
        size: "large",
        disabled,
        icon: triggerNode,
        className: "pisell-lowcode-icon-select-button"
      }
    ) : /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { className: "pisell-lowcode-icon-select-button-text", size: "large" }, (0, import_locales.getText)("pisell-icon-select-select"))
  ), value && !disabled && /* @__PURE__ */ import_react.default.createElement(
    import_antd.Button,
    {
      size: "large",
      icon: /* @__PURE__ */ import_react.default.createElement(import_icons.CloseOutlined, null),
      className: "pisell-lowcode-icon-select-button",
      onClick: () => onChange == null ? void 0 : onChange("")
    }
  ));
};
var iconSelect_default = IconSelect;
