@opengis/filter 0.1.6 → 0.1.8

package/dist/index.js

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