bj-web-components 0.2.34 → 0.2.36

package/dist/web/ProductField/ProductField.mjs

@@ -1,226 +1,441 @@
-import { jsxs as s, jsx as t, Fragment as ae } from "react/jsx-runtime";
-import { useState as h, useRef as m, useCallback as U, useLayoutEffect as le, useEffect as H, useMemo as de } from "react";
-import { createPortal as ue } from "react-dom";
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+import { jsxs as i, jsx as t, Fragment as Ne } from "react/jsx-runtime";
+import { useState as h, useRef as p, useCallback as Y, useLayoutEffect as Le, useEffect as ee, useMemo as Pe } from "react";
+import { createPortal as Oe } from "react-dom";
 /* empty css                   */
-import fe from "./no_data_light.svg.mjs";
-import q from "./arrow-up.svg.mjs";
-import me from "./sort.svg.mjs";
-import pe from "./search.svg.mjs";
-import _e from "./checkbox-no.svg.mjs";
-import he from "./checkbox-ok.svg.mjs";
-function G({ size: l = 20 }) {
-  return /* @__PURE__ */ t("svg", { width: l, height: l, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ t("path", { d: "M16.5613 6.73027C16.7558 6.53571 17.0723 6.53442 17.2684 6.72736C17.4644 6.92032 17.4657 7.23444 17.2713 7.42901L12.7036 12.0002L17.2713 16.5714C17.4657 16.766 17.4644 17.0801 17.2684 17.273C17.0723 17.4659 16.7558 17.4646 16.5613 17.2701L11.9996 12.7047L7.43794 17.2701C7.24352 17.4647 6.92699 17.4659 6.73091 17.273C6.53485 17.0801 6.53355 16.7659 6.72798 16.5714L11.2955 12.0002L6.72798 7.42901C6.53355 7.23442 6.53485 6.92032 6.73091 6.72736C6.92698 6.53442 7.2435 6.53571 7.43794 6.73027L11.9996 11.2955L16.5613 6.73027Z", fill: "currentColor" }) });
+import Ce from "./no_data_light.svg.mjs";
+import te from "./arrow-up.svg.mjs";
+import xe from "./sort.svg.mjs";
+import ye from "./search.svg.mjs";
+import ke from "./checkbox-no.svg.mjs";
+import Ee from "./checkbox-ok.svg.mjs";
+var De = Object.defineProperty,
+  Ie = Object.defineProperties,
+  Me = Object.getOwnPropertyDescriptors,
+  re = Object.getOwnPropertySymbols,
+  Fe = Object.prototype.hasOwnProperty,
+  je = Object.prototype.propertyIsEnumerable,
+  ne = function ne(s, n, l) {
+    return n in s ? De(s, n, {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: l
+    }) : s[n] = l;
+  },
+  oe = function oe(s, n) {
+    for (var l in n || (n = {})) Fe.call(n, l) && ne(s, l, n[l]);
+    if (re) {
+      var _iterator = _createForOfIteratorHelper(re(n)),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var l = _step.value;
+          je.call(n, l) && ne(s, l, n[l]);
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    }
+    return s;
+  },
+  se = function se(s, n) {
+    return Ie(s, Me(n));
+  };
+function le(_ref) {
+  var _ref$size = _ref.size,
+    s = _ref$size === void 0 ? 20 : _ref$size;
+  return /* @__PURE__ */t("svg", {
+    width: s,
+    height: s,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: /* @__PURE__ */t("path", {
+      d: "M16.5613 6.73027C16.7558 6.53571 17.0723 6.53442 17.2684 6.72736C17.4644 6.92032 17.4657 7.23444 17.2713 7.42901L12.7036 12.0002L17.2713 16.5714C17.4657 16.766 17.4644 17.0801 17.2684 17.273C17.0723 17.4659 16.7558 17.4646 16.5613 17.2701L11.9996 12.7047L7.43794 17.2701C7.24352 17.4647 6.92699 17.4659 6.73091 17.273C6.53485 17.0801 6.53355 16.7659 6.72798 16.5714L11.2955 12.0002L6.72798 7.42901C6.53355 7.23442 6.53485 6.92032 6.73091 6.72736C6.92698 6.53442 7.2435 6.53571 7.43794 6.73027L11.9996 11.2955L16.5613 6.73027Z",
+      fill: "currentColor"
+    })
+  });
 }
-function De({
-  options: l = [],
-  value: a = [],
-  onChange: o,
-  placeholder: O = "请选择",
-  emptyText: M = "暂无产品数据",
-  onManageField: J,
-  multiple: u = !0,
-  showSearch: C = !0,
-  showSort: F = !0,
-  addButtonText: I,
-  onAdd: K,
-  labels: r,
-  className: Q,
-  style: V,
-  getPopupContainer: v
-}) {
-  const W = (r == null ? void 0 : r.searchPlaceholder) ?? "搜索", Y = (r == null ? void 0 : r.sortDefault) ?? "默认顺序", ee = (r == null ? void 0 : r.sortAsc) ?? "名称A-Z", te = (r == null ? void 0 : r.sortDesc) ?? "名称Z-A", P = (r == null ? void 0 : r.noMatchText) ?? "暂无选项", re = (r == null ? void 0 : r.manageFieldPre) ?? "请前往", ne = (r == null ? void 0 : r.manageFieldLink) ?? "管理字段", ce = (r == null ? void 0 : r.manageFieldPost) ?? "添加", [f, R] = h(!1), [b, $] = h(""), [p, T] = h("none"), [L, k] = h(!1), g = m(null), x = m(null), X = m(null), [y, se] = h({ top: 0, left: 0, width: 0 }), d = U(() => {
-    if (!g.current) return;
-    const e = g.current.getBoundingClientRect();
-    se({
-      top: e.bottom + 4,
-      left: e.left,
-      width: e.width
-    });
-  }, []);
-  le(() => {
-    f && d();
-  }, [f, d]), H(() => {
+function He(_ref2) {
+  var _ref2$options = _ref2.options,
+    s = _ref2$options === void 0 ? [] : _ref2$options,
+    _ref2$value = _ref2.value,
+    n = _ref2$value === void 0 ? [] : _ref2$value,
+    l = _ref2.onChange,
+    _ref2$placeholder = _ref2.placeholder,
+    y = _ref2$placeholder === void 0 ? "请选择" : _ref2$placeholder,
+    _ref2$emptyText = _ref2.emptyText,
+    k = _ref2$emptyText === void 0 ? "暂无产品数据" : _ref2$emptyText,
+    ae = _ref2.onManageField,
+    _ref2$multiple = _ref2.multiple,
+    d = _ref2$multiple === void 0 ? !0 : _ref2$multiple,
+    _ref2$showSearch = _ref2.showSearch,
+    E = _ref2$showSearch === void 0 ? !0 : _ref2$showSearch,
+    _ref2$showSort = _ref2.showSort,
+    D = _ref2$showSort === void 0 ? !0 : _ref2$showSort,
+    I = _ref2.addButtonText,
+    ce = _ref2.onAdd,
+    a = _ref2.labels,
+    ie = _ref2.className,
+    ue = _ref2.style,
+    M = _ref2.getPopupContainer;
+  var F, j, R, $, S, T, X, z, A;
+  var de = (F = a == null ? void 0 : a.searchPlaceholder) != null ? F : "搜索",
+    fe = (j = a == null ? void 0 : a.sortDefault) != null ? j : "默认顺序",
+    pe = (R = a == null ? void 0 : a.sortAsc) != null ? R : "名称A-Z",
+    _e = ($ = a == null ? void 0 : a.sortDesc) != null ? $ : "名称Z-A",
+    B = (S = a == null ? void 0 : a.noMatchText) != null ? S : "暂无选项",
+    me = (T = a == null ? void 0 : a.manageFieldPre) != null ? T : "请前往",
+    ge = (X = a == null ? void 0 : a.manageFieldLink) != null ? X : "管理字段",
+    he = (z = a == null ? void 0 : a.manageFieldPost) != null ? z : "添加",
+    _h = h(!1),
+    _h2 = _slicedToArray(_h, 2),
+    f = _h2[0],
+    Z = _h2[1],
+    _h3 = h(""),
+    _h4 = _slicedToArray(_h3, 2),
+    w = _h4[0],
+    U = _h4[1],
+    _h5 = h("none"),
+    _h6 = _slicedToArray(_h5, 2),
+    _ = _h6[0],
+    H = _h6[1],
+    _h7 = h(!1),
+    _h8 = _slicedToArray(_h7, 2),
+    N = _h8[0],
+    L = _h8[1],
+    b = p(null),
+    P = p(null),
+    V = p(null),
+    _h9 = h({
+      top: 0,
+      left: 0,
+      width: 0
+    }),
+    _h0 = _slicedToArray(_h9, 2),
+    O = _h0[0],
+    be = _h0[1],
+    u = Y(function () {
+      if (!b.current) return;
+      var e = b.current.getBoundingClientRect();
+      be({
+        top: e.bottom + 4,
+        left: e.left,
+        width: e.width
+      });
+    }, []);
+  Le(function () {
+    f && u();
+  }, [f, u]), ee(function () {
     if (!f) return;
-    const e = (n) => {
-      var i, N;
-      const c = n.target;
-      (i = X.current) != null && i.contains(c) || (N = g.current) != null && N.contains(c) || E();
+    var e = function e(r) {
+      var o, c;
+      var g = r.target;
+      (o = V.current) != null && o.contains(g) || (c = b.current) != null && c.contains(g) || C();
     };
-    return document.addEventListener("mousedown", e), window.addEventListener("scroll", d, !0), window.addEventListener("resize", d), () => {
-      document.removeEventListener("mousedown", e), window.removeEventListener("scroll", d, !0), window.removeEventListener("resize", d);
+    return document.addEventListener("mousedown", e), window.addEventListener("scroll", u, !0), window.addEventListener("resize", u), function () {
+      document.removeEventListener("mousedown", e), window.removeEventListener("scroll", u, !0), window.removeEventListener("resize", u);
     };
-  }, [f, d]), H(() => {
-    if (!L) return;
-    const e = (n) => {
-      x.current && !x.current.contains(n.target) && k(!1);
+  }, [f, u]), ee(function () {
+    if (!N) return;
+    var e = function e(r) {
+      P.current && !P.current.contains(r.target) && L(!1);
     };
-    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, [L]);
-  const z = m(null), A = m(null), w = m({ dragging: !1, startX: 0, scrollLeft: 0, target: null }), B = U((e) => ({
-    onMouseDown: (n) => {
-      const c = e.current;
-      c && (w.current = { dragging: !0, startX: n.clientX, scrollLeft: c.scrollLeft, target: c });
-    },
-    onMouseMove: (n) => {
-      const { dragging: c, startX: i, scrollLeft: N, target: Z } = w.current;
-      !c || !Z || (n.preventDefault(), Z.scrollLeft = N - (n.clientX - i));
-    },
-    onMouseUp: () => {
-      w.current.dragging = !1;
-    },
-    onMouseLeave: () => {
-      w.current.dragging = !1;
-    }
-  }), []);
-  function oe(e) {
-    if (!u) {
-      o == null || o(a.includes(e) ? [] : [e]), a.includes(e) || E();
+    return document.addEventListener("mousedown", e), function () {
+      return document.removeEventListener("mousedown", e);
+    };
+  }, [N]);
+  var q = p(null),
+    G = p(null),
+    v = p({
+      dragging: !1,
+      startX: 0,
+      scrollLeft: 0,
+      target: null
+    }),
+    J = Y(function (e) {
+      return {
+        onMouseDown: function onMouseDown(r) {
+          var o = e.current;
+          o && (v.current = {
+            dragging: !0,
+            startX: r.clientX,
+            scrollLeft: o.scrollLeft,
+            target: o
+          });
+        },
+        onMouseMove: function onMouseMove(r) {
+          var _v$current = v.current,
+            o = _v$current.dragging,
+            c = _v$current.startX,
+            g = _v$current.scrollLeft,
+            W = _v$current.target;
+          !o || !W || (r.preventDefault(), W.scrollLeft = g - (r.clientX - c));
+        },
+        onMouseUp: function onMouseUp() {
+          v.current.dragging = !1;
+        },
+        onMouseLeave: function onMouseLeave() {
+          v.current.dragging = !1;
+        }
+      };
+    }, []);
+  function ve(e) {
+    if (!d) {
+      l == null || l(n.includes(e) ? [] : [e]), n.includes(e) || C();
       return;
     }
-    const n = a.includes(e) ? a.filter((c) => c !== e) : [...a, e];
-    o == null || o(n);
+    var r = n.includes(e) ? n.filter(function (o) {
+      return o !== e;
+    }) : [].concat(_toConsumableArray(n), [e]);
+    l == null || l(r);
   }
-  function S(e) {
-    o == null || o(a.filter((n) => n !== e));
+  function K(e) {
+    l == null || l(n.filter(function (r) {
+      return r !== e;
+    }));
   }
-  function E() {
-    R(!1), $(""), T("none");
+  function C() {
+    Z(!1), U(""), H("none");
   }
-  function ie(e) {
-    T(e), k(!1);
+  function we(e) {
+    H(e), L(!1);
   }
-  const j = de(() => {
-    let e = l.filter((c) => (c.searchText ?? (typeof c.label == "string" ? c.label : "")).toLowerCase().includes(b.toLowerCase()));
-    const n = (c) => c.searchText ?? (typeof c.label == "string" ? c.label : "");
-    return p === "asc" && (e = [...e].sort((c, i) => n(c).localeCompare(n(i)))), p === "desc" && (e = [...e].sort((c, i) => n(i).localeCompare(n(c)))), e;
-  }, [l, b, p]), _ = l.filter((e) => a.includes(e.value)), D = l.length > 0;
-  return /* @__PURE__ */ s("div", { ref: g, className: ["bu-pf", Q].filter(Boolean).join(" "), style: V, children: [
-    !f && /* @__PURE__ */ s("div", { className: `bu-pf__trigger${_.length > 0 ? " bu-pf__trigger--selected" : ""}`, onClick: () => R(!0), children: [
-      _.length > 0 ? /* @__PURE__ */ t(
-        "div",
-        {
-          className: "bu-pf__trigger-tags",
-          ref: A,
-          ...B(A),
-          children: _.map((e) => /* @__PURE__ */ s("span", { className: `bu-pf__tag${u ? "" : " bu-pf__tag--single"}`, children: [
-            /* @__PURE__ */ t("span", { className: "bu-pf__tag-text", children: e.label }),
-            /* @__PURE__ */ t(
-              "button",
-              {
-                type: "button",
-                className: "bu-pf__tag-close",
-                onClick: (n) => {
-                  n.stopPropagation(), S(e.value);
-                },
-                children: /* @__PURE__ */ t(G, { size: 12 })
-              }
-            )
-          ] }, e.value))
-        }
-      ) : /* @__PURE__ */ t("span", { className: "bu-pf__placeholder", children: O }),
-      /* @__PURE__ */ t("span", { className: "bu-pf__arrow", children: /* @__PURE__ */ t("img", { src: q, width: 24, height: 24, alt: "" }) })
-    ] }),
-    f && /* @__PURE__ */ s(ae, { children: [
-      /* @__PURE__ */ t("div", { className: "bu-pf__panel", children: /* @__PURE__ */ s("div", { className: "bu-pf__header", children: [
-        /* @__PURE__ */ t(
-          "div",
-          {
+  var Q = Pe(function () {
+      var e = s.filter(function (o) {
+        var c;
+        return ((c = o.searchText) != null ? c : typeof o.label == "string" ? o.label : "").toLowerCase().includes(w.toLowerCase());
+      });
+      var r = function r(o) {
+        var c;
+        return (c = o.searchText) != null ? c : typeof o.label == "string" ? o.label : "";
+      };
+      return _ === "asc" && (e = _toConsumableArray(e).sort(function (o, c) {
+        return r(o).localeCompare(r(c));
+      })), _ === "desc" && (e = _toConsumableArray(e).sort(function (o, c) {
+        return r(c).localeCompare(r(o));
+      })), e;
+    }, [s, w, _]),
+    m = s.filter(function (e) {
+      return n.includes(e.value);
+    }),
+    x = s.length > 0;
+  return /* @__PURE__ */i("div", {
+    ref: b,
+    className: ["bu-pf", ie].filter(Boolean).join(" "),
+    style: ue,
+    children: [!f && /* @__PURE__ */i("div", {
+      className: "bu-pf__trigger".concat(m.length > 0 ? " bu-pf__trigger--selected" : ""),
+      onClick: function onClick() {
+        return Z(!0);
+      },
+      children: [m.length > 0 ? /* @__PURE__ */t("div", se(oe({
+        className: "bu-pf__trigger-tags",
+        ref: G
+      }, J(G)), {
+        children: m.map(function (e) {
+          return /* @__PURE__ */i("span", {
+            className: "bu-pf__tag".concat(d ? "" : " bu-pf__tag--single"),
+            children: [/* @__PURE__ */t("span", {
+              className: "bu-pf__tag-text",
+              children: e.label
+            }), /* @__PURE__ */t("button", {
+              type: "button",
+              className: "bu-pf__tag-close",
+              onClick: function onClick(r) {
+                r.stopPropagation(), K(e.value);
+              },
+              children: /* @__PURE__ */t(le, {
+                size: 12
+              })
+            })]
+          }, e.value);
+        })
+      })) : /* @__PURE__ */t("span", {
+        className: "bu-pf__placeholder",
+        children: y
+      }), /* @__PURE__ */t("span", {
+        className: "bu-pf__arrow",
+        children: /* @__PURE__ */t("img", {
+          src: te,
+          width: 24,
+          height: 24,
+          alt: ""
+        })
+      })]
+    }), f && /* @__PURE__ */i(Ne, {
+      children: [/* @__PURE__ */t("div", {
+        className: "bu-pf__panel",
+        children: /* @__PURE__ */i("div", {
+          className: "bu-pf__header",
+          children: [/* @__PURE__ */t("div", se(oe({
             className: "bu-pf__tags",
-            ref: z,
-            ...B(z),
-            children: _.length > 0 ? _.map((e) => /* @__PURE__ */ s("span", { className: `bu-pf__tag${u ? "" : " bu-pf__tag--single"}`, children: [
-              /* @__PURE__ */ t("span", { className: "bu-pf__tag-text", children: e.label }),
-              /* @__PURE__ */ t(
-                "button",
-                {
+            ref: q
+          }, J(q)), {
+            children: m.length > 0 ? m.map(function (e) {
+              return /* @__PURE__ */i("span", {
+                className: "bu-pf__tag".concat(d ? "" : " bu-pf__tag--single"),
+                children: [/* @__PURE__ */t("span", {
+                  className: "bu-pf__tag-text",
+                  children: e.label
+                }), /* @__PURE__ */t("button", {
                   type: "button",
                   className: "bu-pf__tag-close",
-                  onClick: () => S(e.value),
-                  children: /* @__PURE__ */ t(G, { size: 12 })
-                }
-              )
-            ] }, e.value)) : /* @__PURE__ */ t("span", { className: "bu-pf__placeholder-inline", children: O })
-          }
-        ),
-        /* @__PURE__ */ t("button", { type: "button", className: "bu-pf__close", onClick: E, children: /* @__PURE__ */ t("img", { src: q, width: 24, height: 24, alt: "" }) })
-      ] }) }),
-      ue(
-        /* @__PURE__ */ t("div", { ref: X, className: "bu-pf__portal", style: { position: "fixed", top: y.top, left: y.left, width: y.width, zIndex: 1050 }, children: /* @__PURE__ */ s("div", { className: "bu-pf__dropdown", children: [
-          (C || F) && /* @__PURE__ */ s("div", { className: "bu-pf__toolbar", children: [
-            C && /* @__PURE__ */ s("div", { className: "bu-pf__search", children: [
-              /* @__PURE__ */ t("span", { className: "bu-pf__search-icon", children: /* @__PURE__ */ t("img", { src: pe, width: 20, height: 20, alt: "" }) }),
-              /* @__PURE__ */ t(
-                "input",
-                {
-                  className: "bu-pf__search-input",
-                  placeholder: W,
-                  value: b,
-                  onChange: (e) => $(e.target.value)
-                }
-              )
-            ] }),
-            F && /* @__PURE__ */ s("div", { ref: x, className: "bu-pf__sort-wrap", children: [
-              /* @__PURE__ */ t(
-                "button",
-                {
-                  type: "button",
-                  className: `bu-pf__sort-btn${p !== "none" ? " bu-pf__sort-btn--active" : ""}`,
-                  onClick: () => k((e) => !e),
-                  children: /* @__PURE__ */ t("img", { src: me, width: 24, height: 24, alt: "" })
+                  onClick: function onClick() {
+                    return K(e.value);
+                  },
+                  children: /* @__PURE__ */t(le, {
+                    size: 12
+                  })
+                })]
+              }, e.value);
+            }) : /* @__PURE__ */t("span", {
+              className: "bu-pf__placeholder-inline",
+              children: y
+            })
+          })), /* @__PURE__ */t("button", {
+            type: "button",
+            className: "bu-pf__close",
+            onClick: C,
+            children: /* @__PURE__ */t("img", {
+              src: te,
+              width: 24,
+              height: 24,
+              alt: ""
+            })
+          })]
+        })
+      }), Oe(/* @__PURE__ */t("div", {
+        ref: V,
+        className: "bu-pf__portal",
+        style: {
+          position: "fixed",
+          top: O.top,
+          left: O.left,
+          width: O.width,
+          zIndex: 1050
+        },
+        children: /* @__PURE__ */i("div", {
+          className: "bu-pf__dropdown",
+          children: [(E || D) && /* @__PURE__ */i("div", {
+            className: "bu-pf__toolbar",
+            children: [E && /* @__PURE__ */i("div", {
+              className: "bu-pf__search",
+              children: [/* @__PURE__ */t("span", {
+                className: "bu-pf__search-icon",
+                children: /* @__PURE__ */t("img", {
+                  src: ye,
+                  width: 20,
+                  height: 20,
+                  alt: ""
+                })
+              }), /* @__PURE__ */t("input", {
+                className: "bu-pf__search-input",
+                placeholder: de,
+                value: w,
+                onChange: function onChange(e) {
+                  return U(e.target.value);
                 }
-              ),
-              L && /* @__PURE__ */ t("div", { className: "bu-pf__sort-dropdown", children: [
-                { key: "none", label: Y },
-                { key: "asc", label: ee },
-                { key: "desc", label: te }
-              ].map(({ key: e, label: n }) => /* @__PURE__ */ t(
-                "div",
-                {
-                  className: `bu-pf__sort-option${p === e ? " bu-pf__sort-option--active" : ""}`,
-                  onClick: () => ie(e),
-                  children: n
+              })]
+            }), D && /* @__PURE__ */i("div", {
+              ref: P,
+              className: "bu-pf__sort-wrap",
+              children: [/* @__PURE__ */t("button", {
+                type: "button",
+                className: "bu-pf__sort-btn".concat(_ !== "none" ? " bu-pf__sort-btn--active" : ""),
+                onClick: function onClick() {
+                  return L(function (e) {
+                    return !e;
+                  });
                 },
-                e
-              )) })
-            ] })
-          ] }),
-          /* @__PURE__ */ t("div", { className: "bu-pf__list", children: D && j.length > 0 ? j.map((e) => {
-            const n = a.includes(e.value);
-            return /* @__PURE__ */ s(
-              "div",
-              {
-                className: `bu-pf__option${u ? " bu-pf__option--multiple" : ""}${n && !u ? " bu-pf__option--selected" : ""}`,
-                onClick: () => oe(e.value),
-                children: [
-                  u && /* @__PURE__ */ t(
-                    "img",
-                    {
-                      className: "bu-pf__checkbox-img",
-                      src: n ? he : _e,
-                      alt: ""
-                    }
-                  ),
-                  /* @__PURE__ */ t("span", { className: "bu-pf__option-label", children: e.label })
-                ]
-              },
-              e.value
-            );
-          }) : /* @__PURE__ */ s("div", { className: "bu-pf__no-match", children: [
-            /* @__PURE__ */ t("img", { className: "bu-pf__no-match-img", src: fe, alt: D ? P : M }),
-            /* @__PURE__ */ t("p", { className: "bu-pf__no-match-text", children: D ? P : M }),
-            /* @__PURE__ */ s("p", { className: "bu-pf__no-match-hint", children: [
-              re,
-              /* @__PURE__ */ t("button", { type: "button", className: "bu-pf__manage-btn", onClick: J, children: ne }),
-              ce
-            ] })
-          ] }) }),
-          I && /* @__PURE__ */ t("div", { className: "bu-pf__add-row", onClick: K, children: I })
-        ] }) }),
-        (v == null ? void 0 : v()) ?? document.body
-      )
-    ] })
-  ] });
+                children: /* @__PURE__ */t("img", {
+                  src: xe,
+                  width: 24,
+                  height: 24,
+                  alt: ""
+                })
+              }), N && /* @__PURE__ */t("div", {
+                className: "bu-pf__sort-dropdown",
+                children: [{
+                  key: "none",
+                  label: fe
+                }, {
+                  key: "asc",
+                  label: pe
+                }, {
+                  key: "desc",
+                  label: _e
+                }].map(function (_ref3) {
+                  var e = _ref3.key,
+                    r = _ref3.label;
+                  return /* @__PURE__ */t("div", {
+                    className: "bu-pf__sort-option".concat(_ === e ? " bu-pf__sort-option--active" : ""),
+                    onClick: function onClick() {
+                      return we(e);
+                    },
+                    children: r
+                  }, e);
+                })
+              })]
+            })]
+          }), /* @__PURE__ */t("div", {
+            className: "bu-pf__list",
+            children: x && Q.length > 0 ? Q.map(function (e) {
+              var r = n.includes(e.value);
+              return /* @__PURE__ */i("div", {
+                className: "bu-pf__option".concat(d ? " bu-pf__option--multiple" : "").concat(r && !d ? " bu-pf__option--selected" : ""),
+                onClick: function onClick() {
+                  return ve(e.value);
+                },
+                children: [d && /* @__PURE__ */t("img", {
+                  className: "bu-pf__checkbox-img",
+                  src: r ? Ee : ke,
+                  alt: ""
+                }), /* @__PURE__ */t("span", {
+                  className: "bu-pf__option-label",
+                  children: e.label
+                })]
+              }, e.value);
+            }) : /* @__PURE__ */i("div", {
+              className: "bu-pf__no-match",
+              children: [/* @__PURE__ */t("img", {
+                className: "bu-pf__no-match-img",
+                src: Ce,
+                alt: x ? B : k
+              }), /* @__PURE__ */t("p", {
+                className: "bu-pf__no-match-text",
+                children: x ? B : k
+              }), /* @__PURE__ */i("p", {
+                className: "bu-pf__no-match-hint",
+                children: [me, /* @__PURE__ */t("button", {
+                  type: "button",
+                  className: "bu-pf__manage-btn",
+                  onClick: ae,
+                  children: ge
+                }), he]
+              })]
+            })
+          }), I && /* @__PURE__ */t("div", {
+            className: "bu-pf__add-row",
+            onClick: ce,
+            children: I
+          })]
+        })
+      }), (A = M == null ? void 0 : M()) != null ? A : document.body)]
+    })]
+  });
 }
-export {
-  De as default
-};
+export { He as default };