@opengis/filter 0.1.5 → 0.1.7

package/dist/index.js

@@ -0,0 +1,2797 @@
+import { createElementBlock as k, openBlock as c, createElementVNode as i, defineComponent as O, ref as _, withModifiers as _e, normalizeClass as M, createCommentVNode as $, toDisplayString as K, computed as E, watch as D, createStaticVNode as Ee, Fragment as j, renderList as P, unref as e, createBlock as B, createVNode as H, createTextVNode as z, withDirectives as I, vShow as G, vModelText as Q, onBeforeUnmount as fe, onMounted as ne, isRef as Te, Teleport as Ae, normalizeStyle as Se, renderSlot as ie, nextTick as pe, withCtx as ee, resolveDynamicComponent as J, mergeProps as Y, toRaw as ae, cloneVNode as Ie, useSlots as me } from "vue";
+const X = (p, o) => {
+  const b = p.__vccOpts || p;
+  for (const [l, a] of o)
+    b[l] = a;
+  return b;
+}, Oe = {}, Ue = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "15px",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "icon icon-tabler icons-tabler-outline icon-tabler-reload absolute inline mr-1 text-gray-800 transition-all cursor-pointer active:rotate-90 right-1 top-1 hover:text-blue-500"
+};
+function ze(p, o) {
+  return c(), k("svg", Ue, o[0] || (o[0] = [
+    i("path", {
+      stroke: "none",
+      d: "M0 0h24v24H0z",
+      fill: "none"
+    }, null, -1),
+    i("path", { d: "M19.933 13.041a8 8 0 1 1 -9.925 -8.788c3.899 -1 7.935 1.007 9.425 4.747" }, null, -1),
+    i("path", { d: "M20 4v5h-5" }, null, -1)
+  ]));
+}
+const Ne = /* @__PURE__ */ X(Oe, [["render", ze]]), He = { class: "flex items-center justify-between w-full text-sm" }, Ye = { class: "flex items-center cursor-pointer w-full" }, Pe = {
+  key: 0,
+  width: "16",
+  height: "auto",
+  src: "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PScwIDAgMTYgMTYnIGZpbGw9J3doaXRlJyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnPjxwYXRoIGQ9J00xMi4yMDcgNC43OTNhMSAxIDAgMDEwIDEuNDE0bC01IDVhMSAxIDAgMDEtMS40MTQgMGwtMi0yYTEgMSAwIDAxMS40MTQtMS40MTRMNi41IDkuMDg2bDQuMjkzLTQuMjkzYTEgMSAwIDAxMS40MTQgMHonLz48L3N2Zz4="
+}, We = ["value"], qe = { class: "w-[calc(100%-18px)] flex flex-row items-center justify-between pl-[10px]" }, Qe = { class: "flex flex-row items-center font-normal text-gray-800 gap-x-1" }, Ge = {
+  key: 0,
+  class: "text-xs text-gray-500 dark:text-neutral-500 pr-1"
+}, ve = /* @__PURE__ */ O({
+  __name: "list-item",
+  props: {
+    layout: {},
+    count: {},
+    type: {},
+    label: {},
+    value: {},
+    isSelected: { type: Boolean },
+    color: {},
+    highlighted: { type: Boolean }
+  },
+  emits: ["itemClick"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b;
+    function n() {
+      a("itemClick", l.value);
+    }
+    const s = _(null);
+    return o({ el: s }), (m, y) => (c(), k("div", {
+      class: "flex items-center w-full rounded-lg group hover:bg-gray-100",
+      ref_key: "el",
+      ref: s
+    }, [
+      i("div", He, [
+        i("div", Ye, [
+          i("label", {
+            for: "radio-9740",
+            class: M([
+              ["inline", "popover"].includes(m.layout) ? "text-sm text-gray-500 px-2 w-full py-2 cursor-pointer !flex flex-row items-center" : "flex flex-row items-center w-full px-2 py-2 text-sm text-gray-500 cursor-pointer",
+              { "bg-blue-100": m.highlighted }
+            ]),
+            onClick: _e(n, ["stop", "prevent"])
+          }, [
+            i("div", {
+              class: M(["w-[18px] h-[18px] border flex items-center justify-center", [
+                m.type == "checkbox" ? "rounded-[4px]" : "rounded-full",
+                m.color ? `bg-[${m.color}] border-[#ffffff]` : m.isSelected ? "bg-[#2563eb] border-[#ffffff]" : "bg-[#ffffff] border-[#d9d9d9]"
+              ]])
+            }, [
+              m.isSelected ? (c(), k("img", Pe)) : $("", !0)
+            ], 2),
+            i("input", {
+              type: "checkbox",
+              class: "hidden",
+              id: "radio-9740",
+              value: m.value
+            }, null, 8, We),
+            i("div", qe, [
+              i("span", Qe, K(m.label ?? "Відсутні данні"), 1),
+              m.count ? (c(), k("div", Ge, " (" + K(m.count) + ") ", 1)) : $("", !0)
+            ])
+          ], 2)
+        ])
+      ])
+    ], 512));
+  }
+});
+function Be(p, o) {
+  const {
+    options: b = [],
+    limit: l = 20
+  } = p;
+  function a(u) {
+    return Array.isArray(u) ? u[0] : u;
+  }
+  const n = _(a(p.modelValue)), s = _(""), m = _(!1), y = _([]), h = _("id"), d = _("text"), r = _(!1), g = _(p.layout !== "popover" && b.length > l);
+  function w(u) {
+    const C = u.find(Boolean) ?? {}, F = ["id", "value", "code", "key"].find((W) => W in C) ?? "id", A = ["text", "label", "name", "title"].find((W) => W in C) ?? "text";
+    return { autoValueKey: F, autoLabelKey: A };
+  }
+  if (b.length > 0) {
+    const u = w(b);
+    h.value = u.autoValueKey, d.value = u.autoLabelKey;
+  }
+  const v = E(() => {
+    const u = y.value;
+    return p.layout === "popover" || r.value ? u : u.slice(0, l);
+  });
+  D(() => p.modelValue, (u) => {
+    n.value = a(u);
+  }, { immediate: !0 }), y.value = [...b].sort((u, C) => p.sort === "count" ? C.count && u.count ? C.count - u.count : 0 : p.sort === "name" ? String(u[d.value] ?? "").localeCompare(String(C[d.value] ?? "")) : 0);
+  function f(u) {
+    return n.value === u[h.value];
+  }
+  function t(u) {
+    n.value = u[h.value], o("update:modelValue", n.value), o("change", { name: p.name, value: n.value });
+  }
+  function x() {
+    n.value = void 0, o("update:modelValue", n.value), o("clear", p.name);
+  }
+  function V() {
+    r.value = !r.value;
+  }
+  return {
+    innerValue: n,
+    searchTerm: s,
+    filteredOptions: v,
+    isSelected: f,
+    selectItem: t,
+    clear: x,
+    toggleShowAll: V,
+    isReqProc: m,
+    showAll: r,
+    isEnableShowAll: g,
+    labelKey: d,
+    valueKey: h,
+    allOptions: y
+  };
+}
+const Xe = {}, Je = {
+  class: "w-48 mx-auto",
+  viewBox: "0 0 178 90",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+function Ze(p, o) {
+  return c(), k("svg", Je, o[0] || (o[0] = [
+    Ee('<rect x="27" y="50.5" width="124" height="39" rx="7.5" fill="currentColor" class="fill-white dark:fill-neutral-800"></rect><rect x="27" y="50.5" width="124" height="39" rx="7.5" stroke="currentColor" class="stroke-gray-50 dark:stroke-neutral-700/10"></rect><rect x="34.5" y="58" width="24" height="24" rx="4" fill="currentColor" class="fill-gray-50 dark:fill-neutral-700/30"></rect><rect x="66.5" y="61" width="60" height="6" rx="3" fill="currentColor" class="fill-gray-50 dark:fill-neutral-700/30"></rect><rect x="66.5" y="73" width="77" height="6" rx="3" fill="currentColor" class="fill-gray-50 dark:fill-neutral-700/30"></rect><rect x="19.5" y="28.5" width="139" height="39" rx="7.5" fill="currentColor" class="fill-white dark:fill-neutral-800"></rect><rect x="19.5" y="28.5" width="139" height="39" rx="7.5" stroke="currentColor" class="stroke-gray-100 dark:stroke-neutral-700/30"></rect><rect x="27" y="36" width="24" height="24" rx="4" fill="currentColor" class="fill-gray-100 dark:fill-neutral-700/70"></rect><rect x="59" y="39" width="60" height="6" rx="3" fill="currentColor" class="fill-gray-100 dark:fill-neutral-700/70"></rect><rect x="59" y="51" width="92" height="6" rx="3" fill="currentColor" class="fill-gray-100 dark:fill-neutral-700/70"></rect><g filter="url(#filter1)"><rect x="12" y="6" width="154" height="40" rx="8" fill="currentColor" class="fill-white dark:fill-neutral-800" shape-rendering="crispEdges"></rect><rect x="12.5" y="6.5" width="153" height="39" rx="7.5" stroke="currentColor" class="stroke-gray-100 dark:stroke-neutral-700/60" shape-rendering="crispEdges"></rect><rect x="20" y="14" width="24" height="24" rx="4" fill="currentColor" class="fill-gray-200 dark:fill-neutral-700"></rect><rect x="52" y="17" width="60" height="6" rx="3" fill="currentColor" class="fill-gray-200 dark:fill-neutral-700"></rect><rect x="52" y="29" width="106" height="6" rx="3" fill="currentColor" class="fill-gray-200 dark:fill-neutral-700"></rect></g><defs><filter id="filter1" x="0" y="0" width="178" height="64" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="6"></feOffset><feGaussianBlur stdDeviation="6"></feGaussianBlur><feComposite in2="hardAlpha" operator="out"></feComposite><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"></feColorMatrix><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1187_14810"></feBlend><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1187_14810" result="shape"></feBlend></filter></defs>', 12)
+  ]));
+}
+const ye = /* @__PURE__ */ X(Xe, [["render", Ze]]), et = {}, tt = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down w-[14px] rotate"
+};
+function lt(p, o) {
+  return c(), k("svg", tt, o[0] || (o[0] = [
+    i("path", {
+      stroke: "none",
+      d: "M0 0h24v24H0z",
+      fill: "none"
+    }, null, -1),
+    i("path", { d: "M6 9l6 6l6 -6" }, null, -1)
+  ]));
+}
+const de = /* @__PURE__ */ X(et, [["render", lt]]), ot = {}, at = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down w-[14px] rotate-[180deg]"
+};
+function nt(p, o) {
+  return c(), k("svg", at, o[0] || (o[0] = [
+    i("path", {
+      stroke: "none",
+      d: "M0 0h24v24H0z",
+      fill: "none"
+    }, null, -1),
+    i("path", { d: "M6 9l6 6l6 -6" }, null, -1)
+  ]));
+}
+const ge = /* @__PURE__ */ X(ot, [["render", nt]]), rt = {
+  key: 0,
+  class: "w-full"
+}, st = { class: "flex flex-col items-center justify-center p-5 text-center" }, ut = {
+  key: 0,
+  class: "flex justify-between p-2 border-t bg-gray-50 text-xs text-gray-500"
+}, it = {
+  key: 1,
+  class: "flex justify-between items-center text-xs text-gray-500 p-1 border-t"
+}, dt = /* @__PURE__ */ O({
+  __name: "radio",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: { default: () => [] },
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean, default: !1 },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: { default: 10 },
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = _(null), n = b, {
+      innerValue: s,
+      filteredOptions: m,
+      isSelected: y,
+      selectItem: h,
+      clear: d,
+      toggleShowAll: r,
+      isReqProc: g,
+      showAll: w,
+      isEnableShowAll: v,
+      labelKey: f,
+      valueKey: t,
+      allOptions: x
+    } = Be({
+      ...l,
+      modelValue: l.modelValue ?? l.default ?? ""
+    }, n);
+    return o({
+      clear: d,
+      inputTextRef: a
+    }), D(
+      () => l.modelValue,
+      (V) => {
+        V === void 0 && (s.value = void 0);
+      }
+    ), (V, u) => (c(), k("div", {
+      class: M([V.layout === "popover" ? "flex flex-col h-full" : "flex flex-col vs-filter-checkbox"])
+    }, [
+      i("div", {
+        class: M([
+          V.layout === "popover" ? "flex-1 overflow-y-auto max-h-64 p-2" : "",
+          V.layout === "inline" ? "flex-1 overflow-y-auto max-h-80" : ""
+        ])
+      }, [
+        (c(!0), k(j, null, P(e(m), (C) => (c(), B(ve, {
+          layout: V.layout,
+          key: C[e(t)],
+          count: C.count,
+          label: C[e(f)],
+          color: C.color,
+          type: "radio",
+          value: C[e(t)],
+          "is-selected": e(y)(C),
+          onItemClick: (F) => e(h)(C)
+        }, null, 8, ["layout", "count", "label", "color", "value", "is-selected", "onItemClick"]))), 128))
+      ], 2),
+      V.type === "select" && e(m).length === 0 && !e(g) ? (c(), k("div", rt, [
+        i("div", st, [
+          H(ye),
+          u[4] || (u[4] = i("div", { class: "max-w-sm mx-auto mt-6" }, [
+            i("p", { class: "font-medium text-gray-800 dark:text-neutral-200" }, "За вашим запитом нічого не знайдено"),
+            i("p", { class: "mt-2 text-sm text-gray-500 dark:text-neutral-500" })
+          ], -1))
+        ])
+      ])) : $("", !0),
+      V.layout !== "popover" && V.type !== "select" ? (c(), k(j, { key: 1 }, [
+        !e(w) && e(v) ? (c(), k("div", {
+          key: 0,
+          onClick: u[0] || (u[0] = //@ts-ignore
+          (...C) => e(r) && e(r)(...C)),
+          class: "inline-flex cursor-pointer items-center gap-x-1.5 text-[13px] text-gray-800 underline underline-offset-4 hover:text-blue-600 focus:outline-none focus:text-blue-600 mt-1 px-2"
+        }, [
+          u[5] || (u[5] = z(" Показати більше ", -1)),
+          H(de)
+        ])) : $("", !0),
+        e(w) ? (c(), k("div", {
+          key: 1,
+          onClick: u[1] || (u[1] = //@ts-ignore
+          (...C) => e(r) && e(r)(...C)),
+          class: "inline-flex cursor-pointer items-center gap-x-1.5 text-[13px] text-gray-800 underline underline-offset-4 hover:text-blue-600 focus:outline-none focus:text-blue-600 mt-1 px-2"
+        }, [
+          u[6] || (u[6] = z(" Показати менше ", -1)),
+          H(ge)
+        ])) : $("", !0)
+      ], 64)) : $("", !0),
+      V.cleanable ? (c(), k(j, { key: 2 }, [
+        V.layout === "inline" ? (c(), k("div", ut, [
+          z(K(e(s) || e(s) === null ? 1 : 0) + " з " + K(e(x).length) + " обрано ", 1),
+          I(i("button", {
+            class: "text-gray-600 hover:text-gray-800",
+            onClick: u[2] || (u[2] = //@ts-ignore
+            (...C) => e(d) && e(d)(...C))
+          }, " Очистити ", 512), [
+            [G, e(s) !== "" && e(s) !== void 0]
+          ])
+        ])) : $("", !0),
+        V.layout === "popover" ? (c(), k("div", it, [
+          i("span", null, K(e(s) || e(s) === null ? 1 : 0) + " з " + K(e(x).length) + " обрано", 1),
+          I(i("button", {
+            class: "text-gray-600 hover:text-gray-800",
+            onClick: u[3] || (u[3] = //@ts-ignore
+            (...C) => e(d) && e(d)(...C))
+          }, " Очистити ", 512), [
+            [G, e(s) !== "" && e(s) !== void 0]
+          ])
+        ])) : $("", !0)
+      ], 64)) : $("", !0)
+    ], 2));
+  }
+});
+function De(p, o) {
+  const {
+    options: b = [],
+    limit: l = 20
+  } = p;
+  function a(u) {
+    return Array.isArray(u) ? u : u ? [u] : [];
+  }
+  const n = _(a(p.modelValue)), s = _(""), m = _(!1), y = _([]), h = _("id"), d = _("text"), r = _(!1), g = _(p.layout !== "popover" && b.length > l);
+  function w(u) {
+    const C = u.find(Boolean) ?? {}, F = ["id", "value", "code", "key"].find((W) => W in C) ?? "id", A = ["text", "label", "name", "title"].find((W) => W in C) ?? "text";
+    return { autoValueKey: F, autoLabelKey: A };
+  }
+  if (b.length > 0) {
+    const u = w(b);
+    h.value = u.autoValueKey, d.value = u.autoLabelKey;
+  }
+  const v = E(() => {
+    const u = y.value;
+    return p.layout === "popover" || r.value ? u : u.slice(0, l);
+  });
+  D(() => p.modelValue, (u) => {
+    n.value = a(u);
+  }, { immediate: !0 }), y.value = [...b].sort((u, C) => p.sort === "count" ? C.count && u.count ? C.count - u.count : 0 : p.sort === "name" ? String(u[d.value]).localeCompare(String(C[d.value])) : 0);
+  function f(u) {
+    return n.value && n.value.includes(u[h.value]);
+  }
+  function t(u) {
+    const C = n.value.includes(u[h.value]);
+    n.value = C ? n.value.filter((F) => F !== u[h.value]) : [...n.value, u[h.value]], o("update:modelValue", n.value), o("change", { name: p.name, value: n.value });
+  }
+  function x() {
+    n.value = [], o("update:modelValue", n.value), o("clear", p.name);
+  }
+  function V() {
+    r.value = !r.value;
+  }
+  return {
+    innerValue: n,
+    searchTerm: s,
+    filteredOptions: v,
+    isSelected: f,
+    selectItem: t,
+    clear: x,
+    toggleShowAll: V,
+    isReqProc: m,
+    showAll: r,
+    isEnableShowAll: g,
+    labelKey: d,
+    valueKey: h,
+    allOptions: y
+  };
+}
+const ct = {
+  key: 0,
+  class: "w-full"
+}, ft = { class: "flex flex-col items-center justify-center p-5 text-center" }, pt = {
+  key: 0,
+  class: "flex justify-between p-2 border-t bg-gray-50 text-xs text-gray-500"
+}, mt = {
+  key: 1,
+  class: "flex justify-between items-center text-xs text-gray-500 p-1 border-t"
+}, ke = /* @__PURE__ */ O({
+  __name: "checkbox",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: { default: () => [] },
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean, default: !1 },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: { default: 10 },
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, {
+      innerValue: n,
+      filteredOptions: s,
+      isSelected: m,
+      selectItem: y,
+      clear: h,
+      toggleShowAll: d,
+      isReqProc: r,
+      showAll: g,
+      isEnableShowAll: w,
+      labelKey: v,
+      valueKey: f,
+      allOptions: t
+    } = De({
+      ...l,
+      modelValue: l.modelValue
+    }, a);
+    return D(
+      () => l.modelValue,
+      (x) => {
+        x === void 0 && (n.value = []);
+      }
+    ), o({
+      clear: h
+    }), (x, V) => (c(), k("div", {
+      class: M([x.layout === "popover" ? "flex flex-col h-full" : "flex flex-col vs-filter-checkbox space-y-0.5"])
+    }, [
+      i("div", {
+        class: M([
+          x.layout === "popover" ? "flex-1 overflow-y-auto  max-h-64 p-2" : "",
+          x.layout === "inline" ? "flex-1 overflow-y-auto max-h-80" : ""
+        ])
+      }, [
+        (c(!0), k(j, null, P(e(s), (u) => (c(), B(ve, {
+          layout: x.layout,
+          count: u.count,
+          label: u[e(v)],
+          color: u.color,
+          type: "checkbox",
+          value: u[e(f)],
+          "is-selected": e(m)(u),
+          onItemClick: (C) => e(y)(u)
+        }, null, 8, ["layout", "count", "label", "color", "value", "is-selected", "onItemClick"]))), 256))
+      ], 2),
+      x.type === "select" && e(s).length === 0 && !e(r) ? (c(), k("div", ct, [
+        i("div", ft, [
+          H(ye),
+          V[4] || (V[4] = i("div", { class: "max-w-sm mx-auto mt-6" }, [
+            i("p", { class: "font-medium text-gray-800 dark:text-neutral-200" }, "За вашим запитом нічого не знайдено"),
+            i("p", { class: "mt-2 text-sm text-gray-500 dark:text-neutral-500" })
+          ], -1))
+        ])
+      ])) : $("", !0),
+      x.layout !== "popover" && x.type !== "select" ? (c(), k(j, { key: 1 }, [
+        !e(g) && e(w) ? (c(), k("div", {
+          key: 0,
+          onClick: V[0] || (V[0] = //@ts-ignore
+          (...u) => e(d) && e(d)(...u)),
+          class: "inline-flex cursor-pointer items-center gap-x-1.5 text-[13px] text-gray-800 underline underline-offset-4 hover:text-blue-600 focus:outline-none focus:text-blue-600 mt-1 px-2"
+        }, [
+          V[5] || (V[5] = z(" Показати більше ", -1)),
+          H(de)
+        ])) : $("", !0),
+        e(g) ? (c(), k("div", {
+          key: 1,
+          onClick: V[1] || (V[1] = //@ts-ignore
+          (...u) => e(d) && e(d)(...u)),
+          class: "inline-flex cursor-pointer items-center gap-x-1.5 text-[13px] text-gray-800 underline underline-offset-4 hover:text-blue-600 focus:outline-none focus:text-blue-600 mt-1 px-2"
+        }, [
+          V[6] || (V[6] = z(" Показати менше ", -1)),
+          H(ge)
+        ])) : $("", !0)
+      ], 64)) : $("", !0),
+      x.cleanable ? (c(), k(j, { key: 2 }, [
+        x.layout === "inline" ? (c(), k("div", pt, [
+          z(K(e(n).length) + " з " + K(e(t).length) + " обрано ", 1),
+          I(i("button", {
+            class: "text-gray-600 hover:text-gray-800",
+            onClick: V[2] || (V[2] = //@ts-ignore
+            (...u) => e(h) && e(h)(...u))
+          }, " Очистити ", 512), [
+            [G, e(n).length !== 0]
+          ])
+        ])) : $("", !0),
+        x.layout === "popover" ? (c(), k("div", mt, [
+          i("span", null, K(e(n).length) + " з " + K(e(t).length) + " обрано", 1),
+          I(i("button", {
+            class: "text-gray-600 hover:text-gray-800",
+            onClick: V[3] || (V[3] = //@ts-ignore
+            (...u) => e(h) && e(h)(...u))
+          }, " Очистити ", 512), [
+            [G, e(n).length !== 0]
+          ])
+        ])) : $("", !0)
+      ], 64)) : $("", !0)
+    ], 2));
+  }
+}), vt = {}, yt = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "15px",
+  height: "15px",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "icon icon-tabler icons-tabler-outline icon-tabler-search stroke-gray-500 transition-all"
+};
+function gt(p, o) {
+  return c(), k("svg", yt, o[0] || (o[0] = [
+    i("path", {
+      stroke: "none",
+      d: "M0 0h24v24H0z",
+      fill: "none"
+    }, null, -1),
+    i("path", { d: "M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0" }, null, -1),
+    i("path", { d: "M21 21l-6 -6" }, null, -1)
+  ]));
+}
+const Re = /* @__PURE__ */ X(vt, [["render", gt]]), bt = {}, ht = {
+  xmlns: "http://www.w3.org/2000/svg",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "icon icon-tabler icons-tabler-outline icon-tabler-x stroke-gray-500 hover:stroke-red-500 transition-all",
+  width: "15px",
+  height: "15px"
+};
+function xt(p, o) {
+  return c(), k("svg", ht, o[0] || (o[0] = [
+    i("path", {
+      stroke: "none",
+      d: "M0 0h24v24H0z",
+      fill: "none"
+    }, null, -1),
+    i("path", { d: "M18 6l-12 12" }, null, -1),
+    i("path", { d: "M6 6l12 12" }, null, -1)
+  ]));
+}
+const Me = /* @__PURE__ */ X(bt, [["render", xt]]);
+class ce {
+  static getWidthClass(o) {
+    return typeof o == "number" ? `max-w-[${o}px]` : typeof o == "string" ? o.endsWith("%") || o.endsWith("px") ? `max-w-[${o}]` : `max-w-${o}` : "w-full";
+  }
+}
+const kt = { class: "absolute bottom-2/4 translate-y-2/4 cursor-pointer left-3" }, wt = ["placeholder"], Ct = /* @__PURE__ */ O({
+  __name: "text-input",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: { default: 220 },
+    options: {},
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: {},
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { emit: o }) {
+    const b = p, l = _((b.placeHolder || b.label || b.name || "search").toString()), a = o, n = _(b.modelValue?.toString() ?? "");
+    D(
+      () => b.modelValue,
+      (h) => {
+        h !== n.value && (n.value = h?.toString() ?? "");
+      }
+    );
+    let s = null;
+    function m() {
+      if (n.value = n.value.trimStart(), n.value.length === 0) {
+        y();
+        return;
+      }
+      s && clearTimeout(s), s = setTimeout(() => {
+        a("update:modelValue", n.value), a("change", { name: b.name, value: n.value });
+      }, 300);
+    }
+    function y() {
+      n.value = "", a("update:modelValue", ""), a("clear", b.name);
+    }
+    return (h, d) => (c(), k("div", {
+      class: M([
+        "vs-form-text relative bg-white rounded-lg [&>input]:py-[7px] [&>input]:max-h-[38px]  [&>input]:ps-10 [&>input]:pe-8 [&>input]:block [&>input]:w-full [&>input]:bg-gray-100 [&>input]:border-transparent [&>input]:rounded-lg [&>input]:text-sm [&>input]:focus:bg-white [&>input]:focus:border-blue-500 [&>input]:focus:ring-blue-500 [&>input]:disabled:opacity-50 [&>input]:disabled:pointer-events-none [&>input]:dark:bg-neutral-700 [&>input]:dark:border-transparent [&>input]:dark:text-neutral-400 [&>input]:dark:placeholder:text-neutral-400 dark:focus:bg-neutral-800 dark:focus:ring-neutral-600",
+        h.layout === "inline" ? e(ce).getWidthClass(h.width) : "mb-2" + (h.layout === "popover" ? " m-2" : "")
+      ])
+    }, [
+      i("div", kt, [
+        H(Re)
+      ]),
+      n.value !== "" ? (c(), k("div", {
+        key: 0,
+        onClick: y,
+        class: "absolute bottom-2/4 translate-y-2/4 right-3 cursor-pointer"
+      }, [
+        H(Me)
+      ])) : $("", !0),
+      I(i("input", {
+        type: "text",
+        "onUpdate:modelValue": d[0] || (d[0] = (r) => n.value = r),
+        onInput: m,
+        placeholder: l.value,
+        class: "!pr-7 !pl-8 bg-white h-[38px] min-w-[100px] text-sm py-2 px-3 block w-full border border-solid placeholder:text-nowrap border-stone-200 rounded-lg text-sm text-stone-800 placeholder:text-stone-400 focus:border-2 focus:z-10 focus:border-blue-500 focus:ring-blue-500 focus:outline-blue-500"
+      }, null, 40, wt), [
+        [Q, n.value]
+      ])
+    ], 2));
+  }
+});
+function je(p = { color: "blue" }) {
+  return E(() => {
+    const b = `w-full px-3 py-2 border-solid border border-gray-300 text-sm rounded focus:outline-none focus:ring-2 focus:ring-${p.color}-500 focus:border-transparent`;
+    return p?.size === "sm" ? `${b}h-[32px]` : `${b}h-[38px]`;
+  });
+}
+function Vt() {
+  return "rounded-md font-medium border-gray-200 border-solid disabled:pointer-events-none disabled:opacity-50 px-4 py-2 w-full bg-transparent border text-black text-sm h-[38px]";
+}
+function $t() {
+  return "font-medium border-gray-200 border-solid disabled:pointer-events-none disabled:opacity-50 border h-7 rounded-md text-xs px-2 py-1 hover:bg-gray-100";
+}
+function Fe(p) {
+  return p === "ghost" ? "inline-flex relative py-2 px-4 items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent            text-gray-600 hover:bg-blue-100 hover:text-gray-800 focus:outline-hidden focus:bg-gray-100 focus:text-gray-800 disabled:opacity-50 disabled:pointer-events-none           dark:text-gray-500 dark:hover:bg-blue-800/30 dark:hover:text-blue-400 dark:focus:bg-blue-800/30 dark:focus:text-blue-400" : p === "soft" ? "inline-flex relative py-2 px-4 items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent            bg-gray-100 text-gray-800 hover:bg-gray-200  hover:bg-gray-200 focus:outline-hidden focus:bg-gray-200 disabled:opacity-50            disabled:pointer-events-none dark:text-blue-400 dark:hover:bg-blue-900 dark:focus:bg-blue-900" : "relative border-solid border-gray-200 focus-visible:outline-hidden focus-visible:ring-ring           inline-flex items-center justify-center whitespace-nowrap          rounded-md text-sm font-medium focus-visible:ring-offset-2          disabled:pointer-events-none disabled:opacity-50 border-input           hover:bg-gray-100 border px-4 py-2 gap-2 bg-transparent h-[38px]";
+}
+const _t = {
+  key: 0,
+  class: "block text-xs font-medium text-gray-600 mb-1"
+}, At = ["placeholder", "disabled"], St = {
+  key: 0,
+  class: "block text-xs font-medium text-gray-600 mb-1"
+}, Bt = {
+  key: 0,
+  class: "block text-xs font-medium text-gray-600 mb-1"
+}, Dt = ["placeholder", "disabled"], Rt = ["disabled"];
+const Mt = /* @__PURE__ */ O({
+  __name: "range-input",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: {},
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean, default: !1 },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: {},
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = je(), a = Vt(), n = p, s = _(
+      n.modelValue ?? n.default ?? []
+    ), m = b, y = E({
+      get: () => n.modelValue ?? s.value,
+      set: (r) => {
+        n.modelValue !== void 0 ? m("update:modelValue", r) : s.value = r;
+      }
+    });
+    function h() {
+      m("change", { name: n.name, value: y.value || s.value });
+    }
+    function d() {
+      s.value = [], y.value = s.value, m("clear", n.name);
+    }
+    return D(() => n.modelValue, (r) => {
+      r !== void 0 && n.layout !== "popover" ? (s.value = r, m("update:modelValue", r)) : s.value = [];
+    }), o({
+      clear: d,
+      currentValue: y
+    }), (r, g) => (c(), k(j, null, [
+      i("div", null, [
+        i("div", {
+          class: M(r.layout === "vertical" ? "inline-flex items-center gap-2" : "space-y-3 p-2")
+        }, [
+          i("div", null, [
+            r.layout !== "vertical" ? (c(), k("label", _t, "Від")) : $("", !0),
+            I(i("input", {
+              type: "number",
+              class: M(e(l)),
+              placeholder: r.placeHolder?.[0] ?? "min",
+              step: "1",
+              style: { outline: "none" },
+              "onUpdate:modelValue": g[0] || (g[0] = (w) => y.value[0] = w),
+              disabled: r.disabled
+            }, null, 10, At), [
+              [Q, y.value[0]]
+            ])
+          ]),
+          r.layout === "vertical" ? (c(), k("label", St, " - ")) : $("", !0),
+          i("div", null, [
+            r.layout !== "vertical" ? (c(), k("label", Bt, "До")) : $("", !0),
+            I(i("input", {
+              type: "number",
+              class: M(e(l)),
+              placeholder: r.placeHolder?.[1] ?? "max",
+              min: "0",
+              max: "1000000000000000",
+              step: "1",
+              style: { outline: "none" },
+              "onUpdate:modelValue": g[1] || (g[1] = (w) => y.value[1] = w),
+              disabled: r.disabled
+            }, null, 10, Dt), [
+              [Q, y.value[1]]
+            ])
+          ]),
+          ["popover", "inline", "vertical"].includes(r.layout) ? (c(), k("button", {
+            key: 1,
+            onClick: h,
+            class: M(e(a) + (r.layout === "vertical" ? " w-[50px]" : " bg-blue-100 hover:bg-blue-200"))
+          }, K(r.layout === "vertical" ? "Ok" : "Застосувати"), 3)) : $("", !0),
+          ["popover", "inline"].includes(r.layout) ? (c(), k("button", {
+            key: 2,
+            disabled: !(y.value[0] || y.value[1]),
+            onClick: d,
+            class: M(e(a) + " hover:bg-gray-100")
+          }, "Очистити", 10, Rt)) : $("", !0)
+        ], 2)
+      ]),
+      (r.cleanable && s.value.length, $("", !0))
+    ], 64));
+  }
+});
+function jt(p) {
+  return String(p).charAt(0).toUpperCase() + String(p).slice(1);
+}
+class N {
+  static format(o) {
+    const b = o.getFullYear(), l = (o.getMonth() + 1).toString().padStart(2, "0"), a = o.getDate().toString().padStart(2, "0");
+    return `${b}-${l}-${a}`;
+  }
+  static getShiftedDay(o, b = 0) {
+    const l = o ? new Date(o) : /* @__PURE__ */ new Date();
+    return l.setDate(l.getDate() + b), this.format(l);
+  }
+  static getLastWeekRange(o, b, l = 0) {
+    if (o && b) {
+      const h = new Date(o), d = new Date(b);
+      return h.setDate(h.getDate() + l * 7), d.setDate(d.getDate() + l * 7), [this.format(h), this.format(d)];
+    }
+    const a = /* @__PURE__ */ new Date(), n = a.getDay(), s = n === 0 ? 13 : n - 1 + 7, m = new Date(a);
+    m.setDate(a.getDate() - s + l * 7);
+    const y = new Date(m);
+    return y.setDate(m.getDate() + 6), [this.format(m), this.format(y)];
+  }
+  static getMonthRange(o, b, l = 0) {
+    let a;
+    o ? a = new Date(o) : a = /* @__PURE__ */ new Date(), a = new Date(a.getFullYear(), a.getMonth() + l, 1);
+    const n = a, s = new Date(a.getFullYear(), a.getMonth() + 1, 0);
+    return [this.format(n), this.format(s)];
+  }
+  static getQuarterRange(o, b, l = 0) {
+    const a = o || b, n = a ? new Date(a) : /* @__PURE__ */ new Date();
+    let s = Math.floor(n.getMonth() / 3);
+    s += l;
+    const m = (s % 4 + 4) % 4 * 3, y = n.getFullYear() + Math.floor(s / 4), h = new Date(y, m, 1), d = new Date(y, m + 3, 0);
+    return [this.format(h), this.format(d)];
+  }
+  static getYear(o, b = 0) {
+    let l;
+    return o && /^\d{4}$/.test(o) ? l = parseInt(o, 10) : o ? l = new Date(o).getFullYear() : l = (/* @__PURE__ */ new Date()).getFullYear(), String(l + b);
+  }
+  static getYearRange(o, b = 0) {
+    let l;
+    return o && /^\d{4}$/.test(o) ? l = parseInt(o, 10) : o ? l = new Date(o).getFullYear() : l = (/* @__PURE__ */ new Date()).getFullYear(), [
+      this.format(new Date(l + b, 0, 1)),
+      this.format(new Date(l + b + 1, 0, 0))
+    ];
+  }
+  static getRangeFromDaysBefore(o) {
+    const b = /* @__PURE__ */ new Date(), l = new Date(b.getTime());
+    return l.setDate(b.getDate() - o), [this.format(l), this.format(b)];
+  }
+}
+function Ke(p, o) {
+  const {
+    popoverRef: b
+  } = p, l = _(""), a = _(
+    p.modelValue ?? p.default ?? []
+  ), n = _(0);
+  function s() {
+    const f = N.getRangeFromDaysBefore(n.value);
+    return a.value = [...f], o("change", { name: p.name, value: a.value }), o("update:modelValue", a.value), f;
+  }
+  function m(f) {
+    l.value = f, b.value?.close();
+    const t = [];
+    switch (l.value) {
+      case "today":
+        t.push(N.getShiftedDay()), t.push(N.getShiftedDay());
+        break;
+      case "week":
+        t.push(...N.getLastWeekRange());
+        break;
+      case "month":
+        t.push(...N.getMonthRange());
+        break;
+      case "quarter":
+        t.push(...N.getQuarterRange());
+        break;
+      case "year":
+        t.push(...N.getYearRange());
+        break;
+      case "last_7_days":
+        n.value = 7, s();
+        break;
+      case "range":
+        n.value = 7, t.push(...s());
+        break;
+    }
+    a.value = [...t], o("change", { name: p.name, value: a.value }), o("update:modelValue", a.value);
+  }
+  function y() {
+    const f = [];
+    switch (l.value) {
+      case "today":
+        f.push(N.getShiftedDay(a.value[0], 1));
+        break;
+      case "week":
+        f.push(...N.getLastWeekRange(a.value[0], a.value[1], 1));
+        break;
+      case "month":
+        f.push(...N.getMonthRange(a.value[0], a.value[1], 1));
+        break;
+      case "quarter":
+        f.push(...N.getQuarterRange(a.value[0], a.value[1], 1));
+        break;
+      case "year":
+        f.push(...N.getYearRange(a.value[0], 1));
+        break;
+    }
+    a.value = [...f], o("change", { name: p.name, value: a.value }), o("update:modelValue", a.value);
+  }
+  function h() {
+    const f = [];
+    switch (l.value) {
+      case "today":
+        f.push(N.getShiftedDay(a.value[0], -1));
+        break;
+      case "week":
+        f.push(...N.getLastWeekRange(a.value[0], a.value[1], -1));
+        break;
+      case "month":
+        f.push(...N.getMonthRange(a.value[0], a.value[1], -1));
+        break;
+      case "quarter":
+        f.push(...N.getQuarterRange(a.value[0], a.value[1], -1));
+        break;
+      case "year":
+        f.push(...N.getYearRange(a.value[0], -1));
+        break;
+    }
+    a.value = [...f], o("change", { name: p.name, value: a.value }), o("update:modelValue", a.value);
+  }
+  const d = [
+    "Січень",
+    "Лютий",
+    "Березень",
+    "Квітень",
+    "Травень",
+    "Червень",
+    "Липень",
+    "Серпень",
+    "Вересень",
+    "Жовтень",
+    "Листопад",
+    "Грудень"
+  ];
+  function r(f) {
+    const [t, x, V] = f.split("-");
+    return `${V}.${x}.${t}`;
+  }
+  function g(f) {
+    const { value: t } = a;
+    switch (f) {
+      case "today":
+        return r(t[0]);
+      case "range":
+        return "Період";
+      case "week":
+        return t[0] && t[1] ? `${r(t[0])} – ${r(t[1])}` : "";
+      case "quarter":
+        if (t[0]) {
+          const x = new Date(t[0]), V = x.getFullYear(), u = x.getMonth();
+          return `${Math.floor(u / 3) + 1} квартал ${V}`;
+        }
+        return "";
+      case "month":
+        if (t[0]) {
+          const [x, V] = t[0].split("-");
+          return `${d[parseInt(V, 10) - 1]} ${x}`;
+        }
+        return "";
+      case "year":
+        return t[0] || "";
+      case "last_7_days":
+        return "За останні дні";
+      default:
+        return p.label ?? "";
+    }
+  }
+  const w = E(() => l.value ? g(l.value) : p.label ?? "");
+  function v() {
+    l.value = "", a.value = [], o("update:modelValue", []), o("clear", p.name);
+  }
+  return {
+    activeMode: l,
+    innerValue: a,
+    daysBefore: n,
+    onDaysBeforeChange: s,
+    onSelectChange: m,
+    nextClick: y,
+    prevClick: h,
+    ukMonths: d,
+    formatDisplayDate: r,
+    getModeLabel: g,
+    currentLabel: w,
+    clear: v
+  };
+}
+const Ft = {
+  key: 0,
+  class: "relative flex w-full h-auto gap-2 filter-date m-2 flex-wrap"
+}, Kt = {
+  key: 0,
+  class: "flex gap-1 !w-[75%] rounded-lg"
+}, Lt = ["max", "disabled"], Et = ["min", "disabled"], Tt = {
+  key: 0,
+  class: "block text-xs font-medium text-gray-600 mb-1"
+}, It = ["max", "disabled"], Ot = {
+  key: 0,
+  class: "block text-xs font-medium text-gray-600 mb-1"
+}, Ut = {
+  key: 0,
+  class: "block text-xs font-medium text-gray-600 mb-1"
+}, zt = ["min", "disabled"], Nt = { class: "flex gap-1 pt-2" }, Ht = ["onClick"];
+const Yt = /* @__PURE__ */ O({
+  __name: "date-input",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: {},
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: {},
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = je(), n = $t(), s = b, m = _(null), {
+      activeMode: y,
+      innerValue: h,
+      onSelectChange: d,
+      nextClick: r,
+      prevClick: g,
+      clear: w
+    } = Ke({
+      ...l,
+      popoverRef: m
+    }, s);
+    return D(() => l.modelValue, (v) => {
+      v !== void 0 ? (h.value = v, s("update:modelValue", v)) : (y.value = "", h.value = []);
+    }), o({
+      clear: w,
+      popoverRef: m
+    }), (v, f) => (c(), k(j, null, [
+      v.layout === "inline" ? (c(), k("div", Ft, [
+        e(y) !== "" && e(y) === "range" ? (c(), k("div", Kt, [
+          I(i("input", {
+            type: "date",
+            max: e(h)[1],
+            locale: "uk-UA",
+            "onUpdate:modelValue": f[0] || (f[0] = (t) => e(h)[0] = t),
+            class: "px-2 p-0 border text-[12px] max-w-[calc(50%-5px)] h-[38px] rounded-lg focus:outline-blue-600",
+            disabled: v.disabled
+          }, null, 8, Lt), [
+            [Q, e(h)[0]]
+          ]),
+          I(i("input", {
+            type: "date",
+            min: e(h)[0],
+            locale: "uk-UA",
+            "onUpdate:modelValue": f[1] || (f[1] = (t) => e(h)[1] = t),
+            class: "px-2 p-0 border text-[12px] max-w-[calc(50%-5px)] h-[38px] rounded-lg focus:outline-blue-600 appearance-auto",
+            disabled: v.disabled
+          }, null, 8, Et), [
+            [Q, e(h)[1]]
+          ])
+        ])) : $("", !0)
+      ])) : $("", !0),
+      i("div", {
+        class: M(v.layout === "popover" ? "space-y-3 p-2" : "flex  items-center gap-2")
+      }, [
+        i("div", {
+          class: M(v.layout !== "popover" ? "w-[48%]" : "")
+        }, [
+          v.layout === "popover" ? (c(), k("label", Tt, "Від")) : $("", !0),
+          I(i("input", {
+            type: "date",
+            max: e(h)[1],
+            locale: "uk-UA",
+            "onUpdate:modelValue": f[2] || (f[2] = (t) => e(h)[0] = t),
+            class: M(e(a)),
+            disabled: v.disabled
+          }, null, 10, It), [
+            [Q, e(h)[0]]
+          ])
+        ], 2),
+        v.layout !== "popover" ? (c(), k("label", Ot, " - ")) : $("", !0),
+        i("div", {
+          class: M(v.layout !== "popover" ? "w-[48%]" : "")
+        }, [
+          v.layout === "popover" ? (c(), k("label", Ut, "До")) : $("", !0),
+          I(i("input", {
+            type: "date",
+            min: e(h)[0],
+            locale: "uk-UA",
+            "onUpdate:modelValue": f[3] || (f[3] = (t) => e(h)[1] = t),
+            class: M(e(a)),
+            disabled: v.disabled
+          }, null, 10, zt), [
+            [Q, e(h)[1]]
+          ])
+        ], 2)
+      ], 2),
+      i("div", Nt, [
+        (c(), k(j, null, P(["today", "week", "month", "quarter", "year"], (t) => i("button", {
+          key: t,
+          class: M(e(n) + (e(y) === t ? " bg-blue-100" : "")),
+          onClick: (x) => e(d)(t)
+        }, K(e(jt)(t)), 11, Ht)), 64)),
+        i("button", {
+          class: M(e(n)),
+          onClick: f[4] || (f[4] = //@ts-ignore
+          (...t) => e(g) && e(g)(...t))
+        }, " <", 2),
+        i("button", {
+          class: M(e(n)),
+          onClick: f[5] || (f[5] = //@ts-ignore
+          (...t) => e(r) && e(r)(...t))
+        }, " >", 2)
+      ]),
+      (v.cleanable, $("", !0))
+    ], 64));
+  }
+});
+function Pt(p, o) {
+  const {
+    api: b,
+    options: l = [],
+    limit: a = 20,
+    dataKey: n = "data"
+  } = p, s = p.multi;
+  function m(S) {
+    return s ? Array.isArray(S) ? S : S ? [S] : [] : Array.isArray(S) ? S[0] : S;
+  }
+  const y = _(m(p.modelValue)), h = _(""), d = _(!1), r = _(l), g = _("id"), w = _("text"), v = _(!1), f = _(p.layout !== "popover" && l.length > a), t = _([]), x = _(0);
+  function V(S) {
+    const U = S.find(Boolean) ?? {}, q = ["id", "value", "code", "key"].find((oe) => oe in U) ?? "id", ue = ["text", "label", "name", "title"].find((oe) => oe in U) ?? "text";
+    return { autoValueKey: q, autoLabelKey: ue };
+  }
+  if (l.length > 0) {
+    const S = V(l);
+    g.value = S.autoValueKey, w.value = S.autoLabelKey;
+  }
+  const u = E(() => {
+    if (b) return r.value;
+    const S = r.value;
+    if (p.layout === "popover") return S;
+    if (!h.value)
+      return v.value ? S : S.slice(0, a);
+    const U = h.value.toLowerCase();
+    return S.filter((q) => q[w.value].toLowerCase().includes(U));
+  });
+  let C = null;
+  async function F(S) {
+    if (b) {
+      d.value = !0;
+      try {
+        const U = new URL(b, window.location.origin);
+        U.searchParams.set("json", "1"), U.searchParams.set("key", S), U.searchParams.set("limit", a.toString());
+        const q = await fetch(U.toString());
+        if (!q.ok)
+          throw new Error(`HTTP error! status: ${q.status}`);
+        const ue = await q.json();
+        if (r.value = ue[n], r.value.length > 0) {
+          const oe = V(r.value);
+          g.value = oe.autoValueKey, w.value = oe.autoLabelKey;
+        }
+        x.value = ue.total;
+      } catch (U) {
+        console.error("Failed to fetch remote options:", U);
+      } finally {
+        d.value = !1;
+      }
+    }
+  }
+  D(h, (S) => {
+    b && (C && clearTimeout(C), C = setTimeout(() => {
+      F(S);
+    }, 200));
+  }), D(() => p.modelValue, (S) => {
+    y.value = m(S);
+  }, { immediate: !0 });
+  function A(S) {
+    return s && Array.isArray(y.value) ? y.value.includes(S[g.value]) : y.value && y.value === S[g.value];
+  }
+  function W(S) {
+    if (s && !Array.isArray(y.value) && (y.value = []), s && Array.isArray(y.value)) {
+      const U = y.value.includes(S[g.value]);
+      y.value = U ? y.value.filter((q) => q !== S[g.value]) : [...y.value, S[g.value]], t.value = U ? t.value.filter((q) => q !== S[w.value]) : [...t.value, S[w.value]];
+    } else
+      y.value = S[g.value], t.value = S[w.value];
+    o("update:modelValue", y.value), o("change", { name: p.name, value: y.value });
+  }
+  function le() {
+    s ? (y.value = [], t.value = []) : (y.value = void 0, t.value = []), o("update:modelValue", y.value), o("clear", p.name);
+  }
+  function T() {
+    C && clearTimeout(C), h.value = "", v.value = !1;
+  }
+  function L() {
+    v.value = !v.value;
+  }
+  fe(() => {
+    C && clearTimeout(C);
+  });
+  const R = _(-1);
+  D(u, () => {
+    R.value = u.value.length > 0 ? 0 : -1;
+  });
+  function re(S) {
+    const U = u.value.length;
+    if (S.key === "ArrowDown")
+      S.preventDefault(), R.value = (R.value + 1) % U;
+    else if (S.key === "ArrowUp")
+      S.preventDefault(), R.value = (R.value - 1 + U) % U;
+    else if (S.key === "Enter" && (S.preventDefault(), R.value >= 0 && R.value < u.value.length)) {
+      const q = u.value[R.value];
+      W(q);
+    }
+  }
+  function se() {
+    b && r.value.length === 0 && h.value.length === 0 && F(h.value);
+  }
+  return {
+    innerValue: y,
+    searchTerm: h,
+    filteredOptions: u,
+    isSelected: A,
+    selectItem: W,
+    clear: le,
+    resetSearch: T,
+    toggleShowAll: L,
+    isReqProc: d,
+    showAll: v,
+    isEnableShowAll: f,
+    labelKey: w,
+    valueKey: g,
+    allOptions: r,
+    highlightedIndex: R,
+    onKeyDown: re,
+    selectedLabels: t,
+    totalCount: x,
+    loadData: se
+  };
+}
+const Wt = { class: "h-[45px] shrink-0 px-[6px] py-[4px] flex items-center relative justify-center" }, qt = {
+  key: 0,
+  class: "w-full"
+}, Qt = { class: "flex flex-col items-center justify-center p-5 text-center" }, Gt = {
+  key: 0,
+  class: "flex justify-between p-2 border-t bg-gray-50 text-xs text-gray-500"
+}, Xt = {
+  key: 1,
+  class: "flex justify-between items-center text-xs text-gray-500 p-1 border-t"
+}, Jt = /* @__PURE__ */ O({
+  __name: "select",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: { default: () => [] },
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean, default: !1 },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: { default: 10 },
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, n = _(null), {
+      innerValue: s,
+      filteredOptions: m,
+      isSelected: y,
+      selectItem: h,
+      clear: d,
+      resetSearch: r,
+      toggleShowAll: g,
+      isReqProc: w,
+      showAll: v,
+      isEnableShowAll: f,
+      searchTerm: t,
+      labelKey: x,
+      valueKey: V,
+      highlightedIndex: u,
+      onKeyDown: C,
+      selectedLabels: F,
+      totalCount: A,
+      loadData: W
+    } = Pt({
+      ...l,
+      modelValue: l.modelValue
+    }, a);
+    ne(() => {
+      r(), l.layout !== "inline" && (W(), n.value && l.layout === "popover" && n.value.focus());
+    }), D(
+      () => l.modelValue,
+      (T) => {
+        T === void 0 && (l.multi ? s.value = [] : s.value = void 0);
+      }
+    );
+    const le = _([]);
+    return D(u, (T) => {
+      T >= 0 && le.value[T] && le.value[T]?.scrollIntoView({
+        block: "nearest",
+        behavior: "smooth"
+      });
+    }), D(m, () => {
+      le.value = [];
+    }), o({
+      clear: d,
+      inputTextRef: n,
+      selectedLabels: F,
+      loadData: W
+    }), (T, L) => (c(), k("div", {
+      class: M([T.layout === "popover" ? "flex flex-col h-full" : "flex flex-col vs-filter-checkbox space-y-0.5"])
+    }, [
+      i("div", Wt, [
+        I(i("input", {
+          "onUpdate:modelValue": L[0] || (L[0] = (R) => Te(t) ? t.value = R : null),
+          onKeydown: L[1] || (L[1] = //@ts-ignore
+          (...R) => e(C) && e(C)(...R)),
+          class: "w-full h-full text-[13px] px-4 border rounded-sm pl-9 focus:outline-none focus:ring-ring focus:ring-1 focus:ring-blue-500 text-gray-700",
+          placeholder: "Пошук",
+          type: "text",
+          ref_key: "inputTextRef",
+          ref: n
+        }, null, 544), [
+          [Q, e(t)]
+        ]),
+        H(Re, { class: "absolute text-gray-400 -translate-y-1/2 left-4 top-1/2" }),
+        e(t) != "" ? (c(), B(Me, {
+          key: 0,
+          onClick: L[2] || (L[2] = (R) => t.value = ""),
+          class: "absolute text-gray-400 -translate-y-1/2 cursor-pointer hover:text-red-500 right-4 top-1/2"
+        })) : $("", !0)
+      ]),
+      i("div", {
+        class: M([
+          T.layout === "popover" ? "flex-1 overflow-y-auto  max-h-64 p-2" : "",
+          T.layout === "inline" ? "flex-1 overflow-y-auto max-h-80" : ""
+        ])
+      }, [
+        (c(!0), k(j, null, P(e(m), (R, re) => (c(), B(ve, {
+          layout: T.layout,
+          count: R.count,
+          label: R[e(x)],
+          color: R.color,
+          type: T.multi ? "checkbox" : "radio",
+          value: R[e(V)],
+          "is-selected": e(y)(R),
+          highlighted: re === e(u),
+          onItemClick: (se) => e(h)(R),
+          ref_for: !0,
+          ref: (se) => le.value[re] = se?.el
+        }, null, 8, ["layout", "count", "label", "color", "type", "value", "is-selected", "highlighted", "onItemClick"]))), 256))
+      ], 2),
+      T.type === "select" && e(m).length === 0 && !e(w) ? (c(), k("div", qt, [
+        i("div", Qt, [
+          H(ye),
+          L[7] || (L[7] = i("div", { class: "max-w-sm mx-auto mt-6" }, [
+            i("p", { class: "font-medium text-gray-800 dark:text-neutral-200" }, "За вашим запитом нічого не знайдено"),
+            i("p", { class: "mt-2 text-sm text-gray-500 dark:text-neutral-500" })
+          ], -1))
+        ])
+      ])) : $("", !0),
+      T.layout !== "popover" && T.type !== "select" ? (c(), k(j, { key: 1 }, [
+        !e(v) && e(f) ? (c(), k("div", {
+          key: 0,
+          onClick: L[3] || (L[3] = //@ts-ignore
+          (...R) => e(g) && e(g)(...R)),
+          class: "inline-flex cursor-pointer items-center gap-x-1.5 text-[13px] text-gray-800 underline underline-offset-4 hover:text-blue-600 focus:outline-none focus:text-blue-600 mt-1 px-2"
+        }, [
+          L[8] || (L[8] = z(" Показати більше ", -1)),
+          H(de)
+        ])) : $("", !0),
+        e(v) ? (c(), k("div", {
+          key: 1,
+          onClick: L[4] || (L[4] = //@ts-ignore
+          (...R) => e(g) && e(g)(...R)),
+          class: "inline-flex cursor-pointer items-center gap-x-1.5 text-[13px] text-gray-800 underline underline-offset-4 hover:text-blue-600 focus:outline-none focus:text-blue-600 mt-1 px-2"
+        }, [
+          L[9] || (L[9] = z(" Показати менше ", -1)),
+          H(ge)
+        ])) : $("", !0)
+      ], 64)) : $("", !0),
+      T.cleanable ? (c(), k(j, { key: 2 }, [
+        T.layout === "inline" ? (c(), k("div", Gt, [
+          z(K(T.multi && Array.isArray(e(s)) ? e(s)?.length : e(s) !== void 0 && (e(s) || e(s) === null) ? 1 : 0) + " з " + K(e(A)) + " обрано ", 1),
+          I(i("button", {
+            class: "text-gray-600 hover:text-gray-800",
+            onClick: L[5] || (L[5] = //@ts-ignore
+            (...R) => e(d) && e(d)(...R))
+          }, " Очистити ", 512), [
+            [G, e(s) !== "" && e(s) !== void 0 || e(s)]
+          ])
+        ])) : $("", !0),
+        T.layout === "popover" ? (c(), k("div", Xt, [
+          i("span", null, K(T.multi && Array.isArray(e(s)) ? e(s)?.length : e(s) !== void 0 && (e(s) || e(s) === null) ? 1 : 0) + " з " + K(e(A)) + " обрано", 1),
+          I(i("button", {
+            class: "text-gray-600 hover:text-gray-800",
+            onClick: L[6] || (L[6] = //@ts-ignore
+            (...R) => e(d) && e(d)(...R))
+          }, " Очистити ", 512), [
+            [G, e(s) !== "" && e(s) !== void 0 || e(s)]
+          ])
+        ])) : $("", !0)
+      ], 64)) : $("", !0)
+    ], 2));
+  }
+}), Zt = ["for", "onClick"], el = ["id", "name", "value"], tl = { class: "block" }, ll = {
+  key: 0,
+  class: "flex justify-between p-2 border-t bg-gray-50 text-xs text-gray-500"
+}, ol = {
+  key: 1,
+  class: "flex justify-between items-center text-xs text-gray-500 p-1 border-t"
+}, al = /* @__PURE__ */ O({
+  __name: "tag-field",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: { default: () => [] },
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean, default: !1 },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: {},
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, {
+      innerValue: n,
+      isSelected: s,
+      selectItem: m,
+      clear: y,
+      labelKey: h,
+      valueKey: d,
+      allOptions: r
+    } = l.multi ? De({
+      ...l,
+      modelValue: l.modelValue ?? l.default ?? []
+    }, a) : Be({
+      ...l,
+      modelValue: l.modelValue !== void 0 ? l.modelValue : l.default ?? ""
+    }, a);
+    return o({
+      clear: y
+    }), D(
+      () => l.modelValue,
+      (g) => {
+        g === void 0 && (l.multi ? n.value = [] : n.value = void 0);
+      }
+    ), (g, w) => (c(), k(j, null, [
+      i("div", {
+        class: M(["grid grid-cols-3 gap-2 mx-[1px]", g.layout === "popover" ? "m-1" : "mb-1"])
+      }, [
+        (c(!0), k(j, null, P(e(r), (v) => (c(), k("label", {
+          key: `item-${v[e(d)]}`,
+          for: `item-${v[e(d)]}`,
+          onClick: _e((f) => e(m)(v), ["stop", "prevent"]),
+          class: M([e(s)(v) ? "ring-2 ring-indigo-600" : "", "p-2.5 group relative flex justify-center items-center gap-x-12 text-center text-xs bg-white text-gray-800 border border-gray-200 cursor-pointer rounded-lg dark:bg-neutral-900 dark:border-neutral-700 dark:text-neutral-200 peer-checked:text-indigo-600 dark:has-checked:text-indigo-500 peer-checked:border-indigo-600 dark:has-checked:border-indigo-500 peer-checked:ring peer-checked:shadow focus:ring dark:has-checked:ring-indigo-500 has-disabled:pointer-events-none has-disabled:text-gray-200 dark:has-disabled:text-neutral-700 has-disabled:after:absolute has-disabled:after:inset-0 has-disabled:after:bg-[linear-gradient(to_right_bottom,transparent_calc(50%-1px),var(--color-gray-200)_calc(50%-1px),var(--color-gray-200)_50%,transparent_50%)] dark:has-disabled:after:bg-[linear-gradient(to_right_bottom,transparent_calc(50%-1px),var(--color-neutral-700)_calc(50%-1px),var(--color-neutral-700)_50%,transparent_50%)]"])
+        }, [
+          i("input", {
+            type: "checkbox",
+            id: `item-${v[e(d)]}`,
+            class: "hidden w4poy border-gray-200 g41z1 g22e3 axcnw dark:text-indigo-500 dark:border-neutral-700 dark:focus:ring-neutral-900",
+            name: `item-${v[e(d)]}`,
+            value: v[e(d)]
+          }, null, 8, el),
+          i("span", tl, K(v[e(h)]), 1)
+        ], 10, Zt))), 128))
+      ], 2),
+      g.cleanable ? (c(), k(j, { key: 0 }, [
+        g.layout === "inline" ? (c(), k("div", ll, [
+          z(K(g.multi && Array.isArray(e(n)) ? e(n)?.length : e(n) !== void 0 && (e(n) || e(n) === null) ? 1 : 0) + " з " + K(e(r).length) + " обрано ", 1),
+          I(i("button", {
+            class: "text-gray-600 hover:text-gray-800",
+            onClick: w[0] || (w[0] = //@ts-ignore
+            (...v) => e(y) && e(y)(...v))
+          }, " Очистити ", 512), [
+            [G, e(n) !== "" && e(n) !== void 0 || e(n)]
+          ])
+        ])) : $("", !0),
+        g.layout === "popover" ? (c(), k("div", ol, [
+          i("span", null, K(g.multi && Array.isArray(e(n)) ? e(n)?.length : e(n) !== void 0 && (e(n) || e(n) === null) ? 1 : 0) + " з " + K(e(r).length) + " обрано", 1),
+          I(i("button", {
+            class: "text-gray-600 hover:text-gray-800",
+            onClick: w[1] || (w[1] = //@ts-ignore
+            (...v) => e(y) && e(y)(...v))
+          }, " Очистити ", 512), [
+            [G, e(n) !== void 0 && e(n) !== "" || e(n)]
+          ])
+        ])) : $("", !0)
+      ], 64)) : $("", !0)
+    ], 64));
+  }
+}), nl = ["disabled", "title"], rl = {
+  key: 0,
+  class: "absolute top-0 end-0 inline-flex min-h-[10px] min-w-[10px] z-10 items-center py-0.5 rounded-full text-xs font-medium transform -translate-y-1/2 translate-x-1/2 bg-blue-600 text-white px-1"
+}, sl = { class: "w-full text-sm text-stone-800 bg-white shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] rounded-lg focus:outline-none focus:bg-stone-100 after:h-4 after:absolute after:-bottom-4 after:start-0 after:w-full before:h-4 before:absolute before:-top-4 before:start-0 before:w-full" }, ul = { class: "w-[360px] max-h-[500px] overflow-auto [&::-webkit-scrollbar]:h-2 [&::-webkit-scrollbar]:w-1 [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-track]:bg-stone-100 [&::-webkit-scrollbar-thumb]:bg-stone-300 dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 before:w-full p-2" }, be = /* @__PURE__ */ O({
+  __name: "popover-field",
+  props: {
+    disabled: { type: Boolean, default: !1 },
+    label: {},
+    currentValue: {},
+    fieldRef: {},
+    width: {},
+    mode: {},
+    layout: {}
+  },
+  setup(p, { expose: o }) {
+    const b = p, l = E(() => Fe(b.mode)), a = _(!1), n = _({ top: 0, left: 0 }), s = _(null), m = _(null), y = _(null);
+    function h() {
+      const t = m.value, x = y.value;
+      if (!t || !x) return;
+      const V = t.getBoundingClientRect(), u = x.offsetWidth, C = window.innerWidth, F = V.bottom + 8;
+      let { left: A } = V;
+      A + u > C && (A = Math.max(C - u - 10, 10)), n.value = { top: F, left: A };
+    }
+    function d() {
+      console.log("~~~~~~~~~~"), console.log(a.value), a.value = !a.value, console.log(a.value), a.value && pe(() => {
+        h(), b.fieldRef?.inputTextRef && b.fieldRef?.inputTextRef?.focus?.(), b.fieldRef?.loadData && b.fieldRef?.loadData?.();
+      });
+    }
+    function r(t) {
+      !s.value?.contains(t.target) && !y.value?.contains(t.target) && !m.value?.contains(t.target) && (a.value = !1);
+    }
+    function g(t) {
+      t.key === "Escape" && (a.value = !1);
+    }
+    const w = _(!1);
+    ne(() => {
+      w.value = !0;
+    }), ne(() => {
+      document.addEventListener("click", r, !0), document.addEventListener("keydown", g), window.addEventListener("scroll", h, !0);
+    }), fe(() => {
+      document.removeEventListener("click", r, !0), document.removeEventListener("keydown", g), window.removeEventListener("scroll", h, !0);
+    });
+    function v() {
+      a.value = !1;
+    }
+    o({ close: v });
+    const f = E(() => {
+      const t = b.fieldRef?.selectedLabels;
+      return !t || ["inline"].includes(b.layout || "") ? b.label ?? "" : Array.isArray(t) ? t.length > 0 ? t.join(", ") : b.label ?? "" : String(t);
+    });
+    return (t, x) => (c(), k("div", null, [
+      i("button", {
+        onClick: d,
+        disabled: t.disabled,
+        ref_key: "triggerRef",
+        ref: m,
+        title: t.label,
+        class: M(l.value + " " + (t.width ? e(ce).getWidthClass(t.width) : "w-full"))
+      }, [
+        i("span", {
+          class: M(["truncate text-ellipsis block", t.width ? e(ce).getWidthClass(t.width - 50) : "w-full"])
+        }, K(f.value), 3),
+        H(de, { class: "h-4 w-4" }),
+        (Array.isArray(t.currentValue) ? t.currentValue === null || t.currentValue.length > 0 : t.currentValue === null || t.currentValue) && t.layout === "inline" ? (c(), k("span", rl)) : $("", !0)
+      ], 10, nl),
+      w.value ? (c(), B(Ae, {
+        key: 0,
+        to: "body"
+      }, [
+        I(i("div", {
+          ref_key: "popperRef",
+          ref: y,
+          class: "vsTailwind vs-popover__content bottom-right w-fit fixed z-[1000]",
+          style: Se({ top: `${n.value.top}px`, left: `${n.value.left}px` }),
+          "data-inside-popover": ""
+        }, [
+          i("div", sl, [
+            i("div", ul, [
+              ie(t.$slots, "default")
+            ])
+          ])
+        ], 4), [
+          [G, a.value]
+        ])
+      ])) : $("", !0)
+    ]));
+  }
+}), il = {}, dl = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "text-blue-600 w-[16px] h-[16px]"
+};
+function cl(p, o) {
+  return c(), k("svg", dl, o[0] || (o[0] = [
+    i("path", { d: "M20 6 9 17l-5-5" }, null, -1)
+  ]));
+}
+const Z = /* @__PURE__ */ X(il, [["render", cl]]), fl = {}, pl = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "15px",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down text-gray-800 rotate-[90deg]"
+};
+function ml(p, o) {
+  return c(), k("svg", pl, o[0] || (o[0] = [
+    i("path", {
+      stroke: "none",
+      d: "M0 0h24v24H0z",
+      fill: "none"
+    }, null, -1),
+    i("path", { d: "M6 9l6 6l6 -6" }, null, -1)
+  ]));
+}
+const vl = /* @__PURE__ */ X(fl, [["render", ml]]), yl = {}, gl = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "15px",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down text-gray-800 rotate-[270deg]"
+};
+function bl(p, o) {
+  return c(), k("svg", gl, o[0] || (o[0] = [
+    i("path", {
+      stroke: "none",
+      d: "M0 0h24v24H0z",
+      fill: "none"
+    }, null, -1),
+    i("path", { d: "M6 9l6 6l6 -6" }, null, -1)
+  ]));
+}
+const hl = /* @__PURE__ */ X(yl, [["render", bl]]), xl = { class: "flex" }, kl = { class: "mb-1" }, wl = { class: "mb-1" }, Cl = { class: "inline-flex rounded-lg shrink-0 pl-1" }, Vl = { class: "inline-flex rounded-lg shrink-0 pl-1" }, $l = {
+  key: 1,
+  class: "flex gap-1 !w-[75%] rounded-lg"
+}, _l = ["max", "disabled"], Al = ["min", "disabled"];
+const Sl = /* @__PURE__ */ O({
+  __name: "date-input-inline",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: {},
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: {},
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, n = _(null), {
+      activeMode: s,
+      innerValue: m,
+      onSelectChange: y,
+      nextClick: h,
+      prevClick: d,
+      currentLabel: r,
+      clear: g
+    } = Ke({
+      ...l,
+      popoverRef: n
+    }, a);
+    return D(() => l.modelValue, (w) => {
+      w !== void 0 ? (m.value = w, a("update:modelValue", w)) : (s.value = "", m.value = []);
+    }), o({
+      clear: g,
+      popoverRef: n
+    }), (w, v) => (c(), k(j, null, [
+      i("div", xl, [
+        H(be, {
+          ref_key: "popoverRef",
+          ref: n,
+          label: e(r),
+          "current-value": e(m),
+          mode: w.mode,
+          onClear: e(g),
+          layout: w.layout
+        }, {
+          default: ee(() => [
+            i("div", null, [
+              i("button", {
+                type: "button",
+                onClick: v[0] || (v[0] = (f) => e(y)("range")),
+                class: "flex items-center justify-between w-full px-4 py-2 text-sm text-left rounded-lg cursor-pointer filter-date__item hs-selected:bg-stone-100 text-stone-800 hover:bg-stone-100 focus:outline-none focus:bg-stone-100"
+              }, [
+                v[12] || (v[12] = z(" Період ", -1)),
+                e(s) === "range" ? (c(), B(Z, { key: 0 })) : $("", !0)
+              ])
+            ]),
+            v[19] || (v[19] = i("div", null, [
+              i("div", { class: "pt-1 mt-1 border-t" })
+            ], -1)),
+            i("div", null, [
+              i("button", {
+                type: "button",
+                onClick: v[1] || (v[1] = (f) => e(y)("today")),
+                class: "flex items-center justify-between w-full px-4 py-2 text-sm text-left rounded-lg cursor-pointer filter-date__item hs-selected:bg-stone-100 text-stone-800 hover:bg-stone-100 focus:outline-none focus:bg-stone-100"
+              }, [
+                v[13] || (v[13] = z(" Сьогодні ", -1)),
+                e(s) === "today" ? (c(), B(Z, { key: 0 })) : $("", !0)
+              ])
+            ]),
+            i("div", null, [
+              i("button", {
+                type: "button",
+                onClick: v[2] || (v[2] = (f) => e(y)("week")),
+                class: "flex items-center justify-between w-full px-4 py-2 text-sm text-left rounded-lg cursor-pointer filter-date__item hs-selected:bg-stone-100 text-stone-800 hover:bg-stone-100 focus:outline-none focus:bg-stone-100"
+              }, [
+                v[14] || (v[14] = z(" Тиждень ", -1)),
+                e(s) === "week" ? (c(), B(Z, { key: 0 })) : $("", !0)
+              ])
+            ]),
+            i("div", null, [
+              i("button", {
+                type: "button",
+                onClick: v[3] || (v[3] = (f) => e(y)("month")),
+                class: "flex items-center justify-between w-full px-4 py-2 text-sm text-left rounded-lg cursor-pointer filter-date__item hs-selected:bg-stone-100 text-stone-800 hover:bg-stone-100 focus:outline-none focus:bg-stone-100"
+              }, [
+                v[15] || (v[15] = z(" Місяць ", -1)),
+                e(s) === "month" ? (c(), B(Z, { key: 0 })) : $("", !0)
+              ])
+            ]),
+            i("div", null, [
+              i("button", {
+                type: "button",
+                onClick: v[4] || (v[4] = (f) => e(y)("quarter")),
+                class: "flex items-center justify-between w-full px-4 py-2 text-sm text-left rounded-lg cursor-pointer filter-date__item hs-selected:bg-stone-100 text-stone-800 hover:bg-stone-100 focus:outline-none focus:bg-stone-100"
+              }, [
+                v[16] || (v[16] = z(" Квартал ", -1)),
+                e(s) === "quarter" ? (c(), B(Z, { key: 0 })) : $("", !0)
+              ])
+            ]),
+            i("div", kl, [
+              i("button", {
+                type: "button",
+                onClick: v[5] || (v[5] = (f) => e(y)("year")),
+                class: "flex items-center justify-between w-full px-4 py-2 text-sm text-left rounded-lg cursor-pointer filter-date__item hs-selected:bg-stone-100 text-stone-800 hover:bg-stone-100 focus:outline-none focus:bg-stone-100"
+              }, [
+                v[17] || (v[17] = z(" Рік ", -1)),
+                e(s) === "year" ? (c(), B(Z, { key: 0 })) : $("", !0)
+              ])
+            ]),
+            i("div", wl, [
+              i("button", {
+                type: "button",
+                onClick: v[6] || (v[6] = (f) => e(g)()),
+                class: "flex items-center justify-between w-full px-4 py-2 text-sm text-left rounded-lg cursor-pointer filter-date__item hs-selected:bg-stone-100 text-stone-800 hover:bg-stone-100 focus:outline-none focus:bg-stone-100"
+              }, [
+                v[18] || (v[18] = z(" Весь час ", -1)),
+                e(m)[0] ? $("", !0) : (c(), B(Z, { key: 0 }))
+              ])
+            ])
+          ]),
+          _: 1,
+          __: [19]
+        }, 8, ["label", "current-value", "mode", "onClear", "layout"]),
+        e(s) !== "" && e(s) !== "range" && e(s) !== "last_7_days" ? (c(), k(j, { key: 0 }, [
+          i("div", Cl, [
+            i("button", {
+              type: "button",
+              title: "Попередній період",
+              class: "inline-flex h-[38px] items-center px-2 text-sm text-gray-800 bg-gray-100 gap-x-2 -ms-px first:rounded-s-lg first:ms-0 last:rounded-e-lg focus:z-10 hover:bg-gray-200 focus:bg-gray-200 duration-300",
+              onClick: v[7] || (v[7] = //@ts-ignore
+              (...f) => e(d) && e(d)(...f))
+            }, [
+              H(vl)
+            ])
+          ]),
+          i("div", Vl, [
+            i("button", {
+              type: "button",
+              title: "Наступний період",
+              class: "inline-flex h-[38px] items-center px-2 text-sm text-gray-800 gap-x-2 bg-gray-100 -ms-px first:rounded-s-lg first:ms-0 last:rounded-e-lg focus:z-10 hover:bg-gray-200 focus:bg-gray-200 duration-300",
+              onClick: v[8] || (v[8] = //@ts-ignore
+              (...f) => e(h) && e(h)(...f))
+            }, [
+              H(hl)
+            ])
+          ])
+        ], 64)) : $("", !0),
+        e(s) !== "" && e(s) === "range" ? (c(), k("div", $l, [
+          I(i("input", {
+            type: "date",
+            max: e(m)[1],
+            locale: "uk-UA",
+            "onUpdate:modelValue": v[9] || (v[9] = (f) => e(m)[0] = f),
+            class: "px-2 p-0 border text-[12px] max-w-[calc(50%-5px)] h-[38px] rounded-lg focus:outline-blue-600",
+            disabled: w.disabled
+          }, null, 8, _l), [
+            [Q, e(m)[0]]
+          ]),
+          I(i("input", {
+            type: "date",
+            min: e(m)[0],
+            locale: "uk-UA",
+            "onUpdate:modelValue": v[10] || (v[10] = (f) => e(m)[1] = f),
+            class: "px-2 p-0 border text-[12px] max-w-[calc(50%-5px)] h-[38px] rounded-lg focus:outline-blue-600 appearance-auto",
+            disabled: w.disabled
+          }, null, 8, Al), [
+            [Q, e(m)[1]]
+          ])
+        ])) : $("", !0)
+      ]),
+      (w.cleanable, $("", !0))
+    ], 64));
+  }
+}), we = {
+  radio: dt,
+  checkbox: ke,
+  check: ke,
+  text: Ct,
+  range: Mt,
+  date: Yt,
+  select: Jt,
+  tag: al,
+  "date:inline": Sl
+};
+function he(p, o) {
+  let b;
+  switch (p.toLowerCase()) {
+    case "autocomplete":
+      b = "select";
+      break;
+    case "check":
+      b = "checkbox";
+      break;
+    default:
+      b = p?.toString().toLowerCase();
+  }
+  return b === "date" && o && o === "inline" && (b = "date:inline"), {
+    component: we[b] || we.text,
+    type: b
+  };
+}
+const Bl = { style: { display: "inline-flex", margin: "0px", width: "100%" } }, Dl = { class: "relative w-full mb-2 p-4 bg-white rounded-lg shadow-sm" }, Rl = { class: "block mb-3 text-sm font-medium text-gray-800 dark:text-neutral-200" }, Ml = { class: "flex items-center" }, jl = { class: "text-sm font-medium max-w-[80%] text-gray-800 flex items-center gap-x-1" }, Fl = { class: "filter-layout__body" }, Kl = /* @__PURE__ */ O({
+  __name: "vertical-layout",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: {},
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean },
+    layout: {},
+    cleanable: { type: Boolean },
+    limit: {},
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, n = _(), s = he(l.type, l.layout), m = E({
+      get: () => l.modelValue,
+      set: (r) => a("update:modelValue", r)
+    });
+    function y(r) {
+      a("clear", r);
+    }
+    function h(r, g) {
+      a("change", { name: r, value: g }), l.modelValue !== void 0 && a("update:modelValue", g);
+    }
+    function d() {
+      n.value && n.value.clear(), a("clear", l.name);
+    }
+    return D(
+      () => l.default,
+      (r) => {
+        m.value = r;
+      }
+    ), D(
+      () => l.modelValue,
+      (r) => {
+        m.value = r;
+      }
+    ), o({
+      filterRef: n
+    }), (r, g) => (c(), k("div", Bl, [
+      i("div", Dl, [
+        i("div", Rl, [
+          i("div", Ml, [
+            i("span", jl, K(r.label), 1)
+          ]),
+          typeof m.value == "string" && m.value.trim() !== "" || Array.isArray(m.value) && m.value.length > 0 && m.value.some((w) => w !== void 0) || m.value === null ? (c(), B(Ne, {
+            key: 0,
+            onClick: d
+          })) : $("", !0)
+        ]),
+        i("div", Fl, [
+          e(s)?.type !== "select" ? (c(), B(J(e(s)?.component), Y({ key: 0 }, l, {
+            type: e(s)?.type,
+            onChange: g[0] || (g[0] = (w) => h(w.name, w.value)),
+            onClear: g[1] || (g[1] = (w) => y(w)),
+            ref_key: "filterRef",
+            ref: n
+          }), null, 16, ["type"])) : (c(), B(be, {
+            key: 1,
+            "current-value": m.value,
+            label: r.label,
+            mode: r.mode,
+            onClear: d,
+            fieldRef: n.value,
+            width: void 0,
+            disabled: r.disabled,
+            layout: "vertical"
+          }, {
+            default: ee(() => [
+              (c(), B(J(e(s)?.component), Y({
+                ref_key: "filterRef",
+                ref: n
+              }, l, {
+                type: e(s)?.type,
+                onChange: g[2] || (g[2] = (w) => h(w.name, w.value)),
+                onClear: g[3] || (g[3] = (w) => y(w))
+              }), null, 16, ["type"]))
+            ]),
+            _: 1
+          }, 8, ["current-value", "label", "mode", "fieldRef", "disabled"]))
+        ])
+      ])
+    ]));
+  }
+}), Ce = /* @__PURE__ */ O({
+  __name: "inline-layout",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: {},
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean },
+    layout: {},
+    cleanable: { type: Boolean },
+    limit: {},
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, n = _(), s = he(l.type, l.layout), m = E({
+      get: () => l.modelValue,
+      set: (d) => a("update:modelValue", d)
+    });
+    function y(d = l.name) {
+      a("clear", d);
+    }
+    function h(d, r) {
+      a("change", { name: d, value: r }), l.modelValue !== void 0 && a("update:modelValue", r);
+    }
+    return D(
+      () => l.default,
+      (d) => {
+        m.value = d;
+      }
+    ), D(
+      () => l.modelValue,
+      (d) => {
+        m.value = d;
+      }
+    ), o({
+      filterRef: n
+    }), (d, r) => ["text", "date"].includes(d.type.toLocaleLowerCase()) ? (c(), B(J(e(s)?.component), Y({ key: 0 }, l, {
+      type: e(s)?.type,
+      onChange: r[0] || (r[0] = (g) => h(g.name, g.value)),
+      onClear: r[1] || (r[1] = (g) => y(g)),
+      disabled: d.disabled,
+      modelValue: m.value,
+      "onUpdate:modelValue": r[2] || (r[2] = (g) => m.value = g)
+    }), null, 16, ["type", "disabled", "modelValue"])) : (c(), B(be, {
+      key: 1,
+      "current-value": m.value,
+      label: d.label,
+      mode: d.mode,
+      onClear: y,
+      fieldRef: n.value,
+      width: l.width,
+      disabled: d.disabled,
+      layout: "inline"
+    }, {
+      default: ee(() => [
+        (c(), B(J(e(s)?.component), Y({
+          ref_key: "filterRef",
+          ref: n
+        }, l, {
+          modelValue: m.value,
+          "onUpdate:modelValue": r[3] || (r[3] = (g) => m.value = g),
+          type: e(s)?.type,
+          onChange: r[4] || (r[4] = (g) => h(g.name, g.value)),
+          onClear: r[5] || (r[5] = (g) => y(g))
+        }), null, 16, ["modelValue", "type"]))
+      ]),
+      _: 1
+    }, 8, ["current-value", "label", "mode", "fieldRef", "width", "disabled"]));
+  }
+}), Ll = /* @__PURE__ */ O({
+  __name: "popover-layout",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: {},
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean },
+    layout: {},
+    cleanable: { type: Boolean },
+    limit: {},
+    multi: { type: Boolean },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: {},
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, n = _(), s = _(he(l.type, l.layout)), m = E({
+      get: () => l.modelValue,
+      set: (d) => a("update:modelValue", d)
+    });
+    function y(d) {
+      a("clear", d);
+    }
+    function h(d, r) {
+      a("change", { name: d, value: r }), l.modelValue !== void 0 && a("update:modelValue", r);
+    }
+    return D(
+      () => l.default,
+      (d) => {
+        m.value = d;
+      }
+    ), D(
+      () => l.modelValue,
+      (d) => {
+        m.value = d;
+      }
+    ), D(
+      () => l,
+      (d) => {
+        m.value = d;
+      }
+    ), o({
+      filterRef: n
+    }), (d, r) => (c(), B(J(s.value?.component), Y(l, {
+      type: s.value?.type,
+      modelValue: m.value,
+      "onUpdate:modelValue": r[0] || (r[0] = (g) => m.value = g),
+      onChange: r[1] || (r[1] = (g) => h(g.name, g.value)),
+      onClear: r[2] || (r[2] = (g) => y(g)),
+      ref_key: "filterRef",
+      ref: n
+    }), null, 16, ["type", "modelValue"]));
+  }
+}), te = /* @__PURE__ */ O({
+  __name: "filter-field",
+  props: {
+    id: {},
+    name: {},
+    type: {},
+    label: {},
+    width: {},
+    options: { default: () => [] },
+    placeHolder: {},
+    api: {},
+    data: {},
+    default: {},
+    modelValue: {},
+    disabled: { type: Boolean, default: !1 },
+    layout: { default: "inline" },
+    cleanable: { type: Boolean },
+    limit: { default: 10 },
+    multi: { type: Boolean, default: !0 },
+    dataKey: {},
+    valueKey: {},
+    mode: {},
+    labelKey: {},
+    sort: { default: "name" },
+    ua: {}
+  },
+  emits: ["update:modelValue", "change", "clear"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, n = _(), s = E({
+      get: () => l.modelValue,
+      set: (d) => a("update:modelValue", d)
+    });
+    function m(d) {
+      a("clear", d);
+    }
+    function y(d, r) {
+      a("change", { name: d, value: r }), l.modelValue !== void 0 && a("update:modelValue", r);
+    }
+    D(
+      () => l.default,
+      (d) => {
+        s.value = d;
+      }
+    ), D(
+      () => l.modelValue,
+      (d) => {
+        s.value = d;
+      }
+    ), o({
+      filterRef: n
+    });
+    function h() {
+      switch (l.layout) {
+        case "inline":
+          return Ce;
+        case "vertical":
+          return Kl;
+        case "popover":
+          return Ll;
+        default:
+          return Ce;
+      }
+    }
+    return (d, r) => (c(), B(J(h()), Y(l, {
+      onChange: r[0] || (r[0] = (g) => y(g.name, g.value)),
+      onClear: r[1] || (r[1] = (g) => m(g)),
+      modelValue: s.value,
+      "onUpdate:modelValue": r[2] || (r[2] = (g) => s.value = g)
+    }), null, 16, ["modelValue"]));
+  }
+});
+function xe(p, o) {
+  const {
+    slots: b
+  } = p, l = _(p.value ?? {}), a = E(() => (ae(b?.default?.()) ?? []).flatMap((x) => Array.isArray(x.children) ? x.children : [x]));
+  function n(t) {
+    delete l.value[t], o("clear", {
+      data: ae(l.value),
+      name: t
+    });
+  }
+  function s(t, x) {
+    x === void 0 ? n(t) : l.value = {
+      ...l.value,
+      [t]: x
+    }, o("change", {
+      data: ae(l.value),
+      name: t,
+      value: x
+    });
+  }
+  const m = E(() => a.value.map((t) => {
+    const x = t.props?.name;
+    return Ie(t, {
+      ...t.props,
+      layout: p.view,
+      showClean: !0,
+      modelValue: l.value[x],
+      "onUpdate:modelValue": (V) => {
+        s(x, V);
+      },
+      onClear: () => n(x)
+    });
+  })), y = E(
+    () => new Map(
+      m.value.map((t) => {
+        const x = t.props?.name;
+        return x ? [x, t] : null;
+      }).filter((t) => t !== null)
+    )
+  );
+  function h(t = !1) {
+    l.value = {}, t || o("clearAll", {
+      data: ae(l.value),
+      name: "ALL"
+    });
+  }
+  const d = _(""), r = E(() => p.schema?.value ? Object.entries(l.value).filter(([t, x]) => p.schema && !(t in p.schema.value) ? !1 : Array.isArray(x) ? x.some((V) => V !== "" && V !== void 0) : x !== "" && x !== void 0).length : 0), g = _();
+  D(d, async () => {
+    await pe(), g?.value?.filterRef?.inputTextRef && g.value.filterRef.inputTextRef.focus();
+  });
+  const w = E(() => p.schema?.value ? Object.fromEntries(Object.entries(p.schema?.value).slice(0, p.limit)) : {}), v = E(() => {
+    if (m.value.length === 0) return [];
+    let t = 0;
+    if (p.schema?.value) {
+      const x = Object.entries(p.schema.value).length;
+      p.limit && x < p.limit ? t = p.limit - x : t = 0;
+    }
+    return m.value.slice(0, t);
+  }), f = E(() => m.value.length === 0 ? [] : p.view !== "inline" ? m.value : m.value.slice(v.value.length));
+  return {
+    activeFilter: l,
+    activeFilterCount: r,
+    onFilterChange: s,
+    clearFilter: n,
+    clearAllFilters: h,
+    limitedSchema: w,
+    filtersSlot: m,
+    limitedFiltersSlot: v,
+    popoverFiltersSlot: f,
+    vnodeMap: y,
+    selectedFilter: d,
+    filterRef: g
+  };
+}
+const El = /* @__PURE__ */ O({
+  __name: "popover",
+  emits: ["open", "close"],
+  setup(p, { emit: o }) {
+    const b = _(!1), l = _(null), a = _(null), n = _(null), s = _({ top: "0px", left: "0px", position: "absolute" });
+    function m() {
+      b.value = !b.value;
+    }
+    function y() {
+      const w = n.value, v = l.value;
+      if (!w || !v) return;
+      const f = w.getBoundingClientRect(), t = v.offsetWidth, x = window.innerWidth - f.left;
+      let V = f.left + window.scrollX;
+      t > x && (V = window.innerWidth - t - 8, V < 8 && (V = 8)), s.value = {
+        position: "absolute",
+        top: `${f.bottom + window.scrollY + 8}px`,
+        left: `${V}px`
+      };
+    }
+    const h = E(() => Object.entries(s.value).map((w) => w.join(":")).join(";"));
+    function d(w) {
+      const v = w.target;
+      !n.value?.contains(w.target) && !l.value?.contains(w.target) && !v.closest("[data-inside-popover]") && (b.value = !1);
+    }
+    const r = _(!1);
+    ne(() => {
+      r.value = !0;
+    }), ne(() => {
+      n.value = a.value?.querySelector("[data-popover-trigger]") || null, n.value?.addEventListener("click", m), document.addEventListener("click", d), window.addEventListener("resize", y), window.addEventListener("scroll", y, !0);
+    }), fe(() => {
+      n.value?.removeEventListener("click", m), document.removeEventListener("click", d), window.removeEventListener("resize", y), window.removeEventListener("scroll", y, !0);
+    });
+    const g = o;
+    return D(b, async (w) => {
+      w ? (g("open"), await pe(), y()) : g("close");
+    }), (w, v) => (c(), k("div", {
+      ref_key: "wrapperRef",
+      ref: a
+    }, [
+      ie(w.$slots, "trigger"),
+      r.value ? (c(), B(Ae, {
+        key: 0,
+        to: "body"
+      }, [
+        I(i("div", {
+          ref_key: "popoverRef",
+          ref: l,
+          class: "absolute z-[50] w-[600px] rounded-md border bg-white shadow-md",
+          style: Se(h.value)
+        }, [
+          ie(w.$slots, "default")
+        ], 4), [
+          [G, b.value]
+        ])
+      ])) : $("", !0)
+    ], 512));
+  }
+}), Tl = {}, Il = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  class: "lucide lucide-filter h-4 w-4"
+};
+function Ol(p, o) {
+  return c(), k("svg", Il, o[0] || (o[0] = [
+    i("polygon", { points: "22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3" }, null, -1)
+  ]));
+}
+const Ul = /* @__PURE__ */ X(Tl, [["render", Ol]]), zl = {
+  key: 0,
+  class: "inline-flex rounded-sm items-center border font-semibold border-transparent hover:bg-secondary/80 bg-blue-500 text-white text-xs px-1.5"
+}, Nl = { class: "flex" }, Hl = { class: "w-64 border-r border-gray-200" }, Yl = { class: "p-2" }, Pl = ["onClick"], Wl = { class: "flex items-center gap-2" }, ql = { class: "text-sm font-medium" }, Ql = {
+  key: 0,
+  class: "inline-flex items-center rounded-full border font-semibold transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent hover:bg-secondary/80 bg-blue-100 text-blue-700 text-xs p-2"
+}, Gl = ["onClick"], Xl = { class: "flex items-center gap-2" }, Jl = { class: "text-sm font-medium" }, Zl = {
+  key: 0,
+  class: "inline-flex items-center rounded-full border font-semibold transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent hover:bg-secondary/80 bg-blue-100 text-blue-700 text-xs p-2"
+}, eo = {
+  key: 0,
+  class: "p-2 border-t"
+}, to = { class: "flex-1 min-h-[300px] overflow-y-auto" }, lo = {
+  key: 0,
+  class: "flex items-center justify-center h-full text-gray-500"
+}, Le = /* @__PURE__ */ O({
+  __name: "popover-filter-layout",
+  props: {
+    schema: {},
+    view: {},
+    value: {},
+    history: { type: Boolean },
+    mode: {},
+    limit: { default: 3 }
+  },
+  emits: ["change", "clear", "clearAll"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = Fe(l.mode), n = me(), s = b, m = _({}), y = E(() => m?.value ? l.view !== "inline" ? m?.value : Object.fromEntries(Object.entries(m?.value).slice(l.limit)) : {}), {
+      activeFilter: h,
+      activeFilterCount: d,
+      onFilterChange: r,
+      clearFilter: g,
+      clearAllFilters: w,
+      popoverFiltersSlot: v,
+      selectedFilter: f,
+      filterRef: t
+    } = xe({
+      ...l,
+      schema: m.value,
+      slots: n
+    }, s);
+    function x() {
+      if (y.value) {
+        const [V] = Object.keys(y.value);
+        f.value = V;
+      } else v.value.length > 0 ? f.value = v.value[0].props.name : f.value = "";
+    }
+    return D(
+      () => l.schema,
+      (V) => {
+        m.value = V;
+      },
+      { deep: !0, immediate: !0 }
+    ), o({
+      clearFilter: g,
+      clearAllFilters: w
+    }), (V, u) => (c(), B(El, {
+      onOpen: x,
+      onClose: u[5] || (u[5] = (C) => f.value = "")
+    }, {
+      trigger: ee(() => [
+        i("button", {
+          "data-popover-trigger": "",
+          "aria-haspopup": "dialog",
+          "aria-expanded": "false",
+          class: M(
+            e(a) + (e(d) > 0 ? "bg-blue-50 border-blue-200 text-blue-700 hover:bg-blue-100" : "text-gray-800 hover:bg-gray-200 focus:bg-gray-200")
+          ),
+          type: "button"
+        }, [
+          H(Ul),
+          u[6] || (u[6] = z(" Фільтр ", -1)),
+          e(d) > 0 ? (c(), k("div", zl, K(e(d)), 1)) : $("", !0)
+        ], 2)
+      ]),
+      default: ee(() => [
+        i("div", Nl, [
+          i("div", Hl, [
+            u[7] || (u[7] = i("div", { class: "p-4 border-b" }, [
+              i("p", { class: "text-sm text-gray-600" }, "Select a field to start creating a filter.")
+            ], -1)),
+            i("div", Yl, [
+              V.schema ? (c(!0), k(j, { key: 0 }, P(Object.entries(y.value), ([C, F]) => (c(), k("button", {
+                key: C,
+                onClick: () => {
+                  f.value = C;
+                },
+                class: M([
+                  "w-full flex items-center justify-between px-3 py-2 text-left hover:bg-gray-50 transition-colors",
+                  e(f) === C ? "bg-blue-50 text-blue-700 border-l-2 border-blue-500" : "text-gray-700"
+                ])
+              }, [
+                i("div", Wl, [
+                  i("span", ql, K(F.label), 1)
+                ]),
+                (Array.isArray(e(h)[C]) ? e(h)[C]?.length > 0 : e(h)[C] || e(h)[C] === null) ? (c(), k("div", Ql)) : $("", !0)
+              ], 10, Pl))), 128)) : $("", !0),
+              (c(!0), k(j, null, P(e(v), (C, F) => (c(), k("button", {
+                key: "slot-" + F,
+                onClick: (A) => f.value = C.props.name,
+                class: M([
+                  "w-full flex items-center justify-between px-3 py-2 text-left hover:bg-gray-50 transition-colors",
+                  e(f) === C.props.name ? "bg-blue-50 text-blue-700 border-l-2 border-blue-500" : ""
+                ])
+              }, [
+                i("div", Xl, [
+                  i("span", Jl, K(C.props.label), 1)
+                ]),
+                e(h)[C.props.name]?.length > 0 ? (c(), k("div", Zl)) : $("", !0)
+              ], 10, Gl))), 128))
+            ]),
+            e(d) > 0 ? (c(), k("div", eo, [
+              i("button", {
+                class: "w-full px-3 py-2 text-left text-sm text-gray-600 hover:bg-gray-50 transition-colors",
+                onClick: u[0] || (u[0] = (C) => e(w)()),
+                "data-inside-popover": ""
+              }, " Очистити всі ")
+            ])) : $("", !0)
+          ]),
+          i("div", to, [
+            e(f) === "" ? (c(), k("div", lo, u[8] || (u[8] = [
+              i("p", { class: "text-sm" }, "Select a field to start creating a filter.", -1)
+            ]))) : $("", !0),
+            e(f) ? (c(), k(j, { key: 1 }, [
+              y.value ? (c(!0), k(j, { key: 0 }, P(Object.entries(y.value), ([C, F]) => (c(), k(j, null, [
+                e(f) === C ? (c(), B(te, Y({
+                  key: C,
+                  layout: "popover",
+                  ref_for: !0,
+                  ref_key: "filterRef",
+                  ref: t
+                }, { ref_for: !0 }, F, {
+                  onChange: u[1] || (u[1] = (A) => e(r)(A.name, A.value)),
+                  onClear: u[2] || (u[2] = (A) => {
+                    e(g)(A), e(r)(A, void 0);
+                  }),
+                  modelValue: e(h)[C],
+                  "onUpdate:modelValue": (A) => e(h)[C] = A,
+                  cleanable: !0
+                }), null, 16, ["modelValue", "onUpdate:modelValue"])) : $("", !0)
+              ], 64))), 256)) : $("", !0),
+              (c(!0), k(j, null, P(e(v), (C, F) => (c(), k(j, {
+                key: "slot-" + F
+              }, [
+                e(f) === C.props.name ? (c(), B(te, Y({
+                  key: 0,
+                  layout: "popover"
+                }, { ref_for: !0 }, C.props, {
+                  ref_for: !0,
+                  ref_key: "filterRef",
+                  ref: t,
+                  onChange: u[3] || (u[3] = (A) => e(r)(A.name, A.value)),
+                  onClear: u[4] || (u[4] = (A) => {
+                    e(g)(A), e(r)(A, void 0);
+                  }),
+                  modelValue: e(h)[C.props.name],
+                  "onUpdate:modelValue": (A) => e(h)[C.props.name] = A,
+                  cleanable: !0
+                }), null, 16, ["modelValue", "onUpdate:modelValue"])) : $("", !0)
+              ], 64))), 128))
+            ], 64)) : $("", !0)
+          ])
+        ])
+      ]),
+      _: 1
+    }));
+  }
+}), oo = { class: "flex gap-1 items-center flex-wrap" }, Ve = /* @__PURE__ */ O({
+  __name: "inline-filter-layout",
+  props: {
+    schema: {},
+    view: {},
+    value: {},
+    history: { type: Boolean },
+    mode: {},
+    limit: { default: 3 }
+  },
+  emits: ["change", "clear", "clearAll"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, n = me(), s = _({}), m = E(() => Object.keys(l.schema).length > l.limit), {
+      activeFilter: y,
+      activeFilterCount: h,
+      onFilterChange: d,
+      clearFilter: r,
+      clearAllFilters: g,
+      limitedSchema: w,
+      filtersSlot: v,
+      limitedFiltersSlot: f
+    } = xe(
+      {
+        ...l,
+        schema: s,
+        slots: n
+      },
+      a
+    ), t = _();
+    function x() {
+      t.value && t.value.clearAllFilters(!0), g();
+    }
+    return D(
+      () => l.schema,
+      (V) => {
+        s.value = V;
+      },
+      { deep: !0, immediate: !0 }
+    ), o({
+      clearFilter: r,
+      clearAllFilters: g
+    }), (V, u) => (c(), k("div", oo, [
+      V.schema ? (c(!0), k(j, { key: 0 }, P(Object.entries(e(w)), ([C, F]) => (c(), B(te, Y({
+        key: C,
+        mode: V.mode
+      }, { ref_for: !0 }, F, {
+        onChange: u[0] || (u[0] = (A) => e(d)(A.name, A.value)),
+        onClear: e(r),
+        layout: "inline",
+        cleanable: !0,
+        modelValue: e(y)[C],
+        "onUpdate:modelValue": (A) => e(y)[C] = A
+      }), null, 16, ["mode", "onClear", "modelValue", "onUpdate:modelValue"]))), 128)) : $("", !0),
+      (c(!0), k(j, null, P(e(f), (C, F) => (c(), B(te, Y({
+        key: "slot-" + F,
+        layout: "inline"
+      }, { ref_for: !0 }, C.props, {
+        onChange: u[1] || (u[1] = (A) => e(d)(A.name, A.value)),
+        onClear: u[2] || (u[2] = (A) => {
+          e(r)(A), e(d)(A, void 0);
+        }),
+        cleanable: !0,
+        modelValue: e(y)[C.props.name],
+        "onUpdate:modelValue": (A) => e(y)[C.props.name] = A
+      }), null, 16, ["modelValue", "onUpdate:modelValue"]))), 128)),
+      m.value ? (c(), B(Le, Y({ key: 1 }, l, {
+        schema: V.schema,
+        limit: V.limit,
+        onChange: u[3] || (u[3] = (C) => e(d)(C.name, C.value)),
+        onClearAll: u[4] || (u[4] = (C) => e(g)()),
+        onClear: u[5] || (u[5] = (C) => e(r)(C.name)),
+        mode: V.mode,
+        ref_key: "popoverRef",
+        ref: t,
+        cleanable: !0
+      }), {
+        default: ee(() => [
+          (c(!0), k(j, null, P(e(v), (C, F) => (c(), B(J(C), Y({
+            key: "slot-" + F,
+            layout: "popover"
+          }, { ref_for: !0 }, C.props, { cleanable: !0 }), null, 16))), 128))
+        ]),
+        _: 1
+      }, 16, ["schema", "limit", "mode"])) : $("", !0),
+      e(h) > 0 ? (c(), k("button", {
+        key: 2,
+        onClick: x,
+        class: "relative py-2 px-3 inline-flex justify-center items-center gap-x-2 text-sm font-medium rounded-lg bg-gray-100 border border-transparent text-gray-800 hover:bg-gray-200 focus:bg-gray-200"
+      }, " Очистити ")) : $("", !0)
+    ]));
+  }
+}), ao = {
+  key: 0,
+  class: "p-2 overflow-y-auto overflow-hidden [&::-webkit-scrollbar]:w-2 [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-track]:bg-gray-100 [&::-webkit-scrollbar-thumb]:bg-gray-300 dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-800 max-h-[calc(100%-142px)] h-full bg-gray-100"
+}, no = { class: "flex items-center vst-filters vsTailwind flex-col w-full" }, ro = /* @__PURE__ */ O({
+  __name: "vertical-filter-layout",
+  props: {
+    schema: {},
+    view: {},
+    value: {},
+    history: { type: Boolean },
+    mode: {},
+    limit: { default: 3 }
+  },
+  emits: ["change", "clear", "clearAll"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = b, n = me(), {
+      activeFilter: s,
+      activeFilterCount: m,
+      onFilterChange: y,
+      clearFilter: h,
+      clearAllFilters: d,
+      filtersSlot: r
+    } = xe({
+      ...l,
+      slots: n
+    }, a);
+    return o({
+      clearFilter: h,
+      clearAllFilters: d
+    }), (g, w) => g.view === "vertical" ? (c(), k("div", ao, [
+      i("div", no, [
+        e(m) > 0 ? (c(), k("button", {
+          key: 0,
+          onClick: w[0] || (w[0] = (v) => e(d)()),
+          "data-popover-trigger": "",
+          "aria-haspopup": "dialog",
+          "aria-expanded": "false",
+          class: "w-full ring-offset-background focus-visible:outline-hidden focus-visible:ring-ring inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 hover:text-accent-foreground border h-10 px-4 py-2 gap-2 m-2 bg-white text-gray-800 hover:bg-gray-200 focus:bg-gray-200",
+          type: "button"
+        }, " Очистити ")) : $("", !0),
+        g.schema ? (c(!0), k(j, { key: 1 }, P(Object.entries(g.schema), ([v, f]) => (c(), B(te, Y({ layout: "vertical" }, { ref_for: !0 }, f, {
+          onChange: w[1] || (w[1] = (t) => e(y)(t.name, t.value)),
+          onClear: w[2] || (w[2] = (t) => {
+            e(h)(t), e(y)(t, void 0);
+          }),
+          modelValue: e(s)[v],
+          "onUpdate:modelValue": (t) => e(s)[v] = t,
+          showClean: !0
+        }), null, 16, ["modelValue", "onUpdate:modelValue"]))), 256)) : $("", !0),
+        (c(!0), k(j, null, P(e(r), (v, f) => (c(), B(te, Y({
+          key: "slot-" + f,
+          layout: "vertical"
+        }, { ref_for: !0 }, v.props, {
+          onChange: w[3] || (w[3] = (t) => e(y)(t.name, t.value)),
+          onClear: w[4] || (w[4] = (t) => {
+            e(h)(t), e(y)(t, void 0);
+          }),
+          modelValue: e(s)[v.props.name],
+          "onUpdate:modelValue": (t) => e(s)[v.props.name] = t,
+          showClean: !0
+        }), null, 16, ["modelValue", "onUpdate:modelValue"]))), 128))
+      ])
+    ])) : $("", !0);
+  }
+}), $e = /* @__PURE__ */ O({
+  __name: "filter",
+  props: {
+    schema: {},
+    view: { default: "inline" },
+    value: {},
+    history: { type: Boolean },
+    mode: {},
+    limit: { default: 3 }
+  },
+  emits: ["change", "clear", "clearAll"],
+  setup(p, { expose: o, emit: b }) {
+    const l = p, a = _(l.value ?? {}), n = b, s = _();
+    function m(f) {
+      if (Array.isArray(f))
+        return f.map((t) => m(t));
+      if (f !== null && typeof f == "object") {
+        const t = ae(f), x = {};
+        for (const V in t)
+          x[V] = m(t[V]);
+        return x;
+      }
+      return f;
+    }
+    function y(f, t) {
+      t !== void 0 ? a.value = {
+        ...a.value,
+        [f]: t
+      } : delete a.value[f], n("change", {
+        data: m(a.value),
+        name: f,
+        value: m(t)
+      });
+    }
+    function h(f) {
+      delete a.value[f], n("clear", {
+        data: m(a.value),
+        name: f
+      }), n("change", {
+        data: m(a.value),
+        name: f,
+        value: null
+      });
+    }
+    function d() {
+      a.value = {}, n("clear", {
+        data: m(a.value),
+        name: "ALL"
+      }), n("change", {
+        data: m(a.value),
+        name: "ALL",
+        value: null
+      });
+    }
+    const r = _({});
+    function g() {
+      switch (l.view) {
+        case "inline":
+          return Ve;
+        case "vertical":
+          return ro;
+        case "popover":
+          return Le;
+        default:
+          return Ve;
+      }
+    }
+    D(
+      () => l.schema,
+      (f) => {
+        if (!f) {
+          r.value = {};
+          return;
+        }
+        if (Array.isArray(f) && !f.length) {
+          r.value = {};
+          return;
+        }
+        Array.isArray(f) ? r.value = f.filter((t) => t.type).reduce((t, x) => (Object.assign(x, {
+          name: x.id || x.name,
+          type: { datepicker: "date" }[x.type.toLowerCase()] || x.type.toLowerCase(),
+          label: x.label || x.ua
+        }), t[x.name] = x, x.data && !x.api && !x.options && Object.assign(x, { api: `/api/suggest/${x.data}` }), t), {}) : (Object.entries(f).forEach(([t, x]) => {
+          Object.assign(x, { name: t || x.name || x.id, type: x.type.toLowerCase() });
+        }), r.value = { ...f });
+      },
+      { immediate: !0, deep: !0 }
+    );
+    function w(f) {
+      s.value.clearFilter(f), h(f);
+    }
+    function v() {
+      s.value.clearAllFilters(), d();
+    }
+    return D(
+      () => a.value,
+      (f) => {
+        if (l.history) {
+          const t = new URL(window.location.href), x = new URLSearchParams(window.location.search);
+          Object.keys(f).length > 0 ? x.set(
+            "filter",
+            Object.entries(f).filter(([, V]) => V).map(([V, u]) => `${V}=${u}`).join("|")
+          ) : x.delete("filter"), t.search = decodeURI(x.toString()), window.history.pushState({}, "", t);
+        }
+      }
+    ), o({
+      clearAllFilters: v,
+      clearFilter: w
+    }), (f, t) => (c(), B(J(g()), Y(l, {
+      schema: r.value,
+      onChange: t[0] || (t[0] = (x) => y(x.name, x.value)),
+      onClear: t[1] || (t[1] = (x) => h(x.name)),
+      onClearAll: d,
+      ref_key: "filterRef",
+      ref: s
+    }), {
+      default: ee(() => [
+        ie(f.$slots, "default")
+      ]),
+      _: 3
+    }, 16, ["schema"]));
+  }
+});
+$e.install = function(o) {
+  o.component("Filter", $e), o.component("FilterField", te);
+};
+export {
+  $e as Filter,
+  te as FilterField,
+  $e as default
+};