@konstructio/ui 0.1.2-alpha.78 → 0.1.2-alpha.79

package/dist/components/Filter/components/BadgeDropdown/BadgeMultiSelect.hook.js

@@ -1,99 +1,65 @@
-import { useId as L, useRef as F, useState as m, useEffect as p, useCallback as d, useMemo as v } from "react";
-import { FilterEvent as O, sendOpenFilterEvent as k } from "../../events/index.js";
-import { useFilterContext as x } from "../../contexts/filter.hook.js";
-const B = ({
-  onApply: l,
-  options: a = []
-}) => {
-  const { closeOnApply: r } = x(), c = L(), u = F(null), [g, o] = m(!1), [n, i] = m([]);
-  p(() => {
+import { useFilterContext as L } from "../../contexts/filter.hook.js";
+import { FilterEvent as p, sendOpenFilterEvent as F } from "../../events/index.js";
+import { useCallback as r, useEffect as m, useId as k, useMemo as v, useRef as x, useState as O } from "react";
+var B = ({ onApply: l, options: c = [] }) => {
+  const { closeOnApply: o } = L(), a = k(), u = x(null), [g, d] = O(!1), [s, i] = O([]);
+  m(() => {
     const e = new AbortController();
-    return document.addEventListener(
-      O.OPEN,
-      (t) => {
-        t.detail !== c && o(!1);
-      },
-      {
-        signal: e.signal
-      }
-    ), document.addEventListener(
-      O.RESET,
-      () => {
-        i([]), l?.([]);
-      },
-      {
-        signal: e.signal
-      }
-    ), () => {
+    return document.addEventListener(p.OPEN, (t) => {
+      t.detail !== a && d(!1);
+    }, { signal: e.signal }), document.addEventListener(p.RESET, () => {
+      i([]), l?.([]);
+    }, { signal: e.signal }), () => {
       e.abort();
     };
-  }, [c, l]);
-  const E = d(
-    () => o((e) => (e || (k(c), i(
-      (t) => t.filter((s) => s.isApplied)
-    )), !e)),
-    [c, o]
-  ), f = d(() => o(!1), []), h = d(
-    (e, t) => {
-      i(t ? [
-        ...n,
-        { ...e, isApplied: !1 }
-      ] : n.map((s) => s.id === e.id ? { ...s, isRemoved: !0 } : s));
-    },
-    [i, n]
-  ), R = d(() => {
-    i([]), l?.([]), r && o(!1);
-  }, [r, l]), A = d(() => {
-    const e = n?.filter((t) => !t.isRemoved).map((t) => ({ ...t, isApplied: !0 }));
-    i(e), l?.(
-      e.map(
-        ({ isApplied: t, isRemoved: s, ...w }) => w
-      )
-    ), r && o(!1);
-  }, [r, l, n, i]), C = v(
-    () => n.filter((e) => e.isApplied),
-    [n]
-  ), S = v(
-    () => a.length > 0 && a.every(
-      (e) => n.some((t) => t.id === e.id && !t.isRemoved)
-    ),
-    [a, n]
-  ), b = d(
-    (e, t) => {
-      t && i(
-        e.map((s) => ({ ...s, isApplied: !1 }))
-      );
-    },
-    []
-  );
-  return p(() => {
-    const e = new AbortController(), t = (s) => {
-      u.current?.contains(s.target) || f();
+  }, [a, l]);
+  const h = r(() => d((e) => (e || (F(a), i((t) => t.filter((n) => n.isApplied))), !e)), [a, d]), f = r(() => d(!1), []), E = r((e, t) => {
+    i(t ? [...s, {
+      ...e,
+      isApplied: !1
+    }] : s.map((n) => n.id === e.id ? {
+      ...n,
+      isRemoved: !0
+    } : n));
+  }, [i, s]), R = r(() => {
+    i([]), l?.([]), o && d(!1);
+  }, [o, l]), A = r(() => {
+    const e = s?.filter((t) => !t.isRemoved).map((t) => ({
+      ...t,
+      isApplied: !0
+    }));
+    i(e), l?.(e.map(({ isApplied: t, isRemoved: n, ...w }) => w)), o && d(!1);
+  }, [
+    o,
+    l,
+    s,
+    i
+  ]), C = v(() => s.filter((e) => e.isApplied), [s]), S = v(() => c.length > 0 && c.every((e) => s.some((t) => t.id === e.id && !t.isRemoved)), [c, s]), b = r((e, t) => {
+    t && i(e.map((n) => ({
+      ...n,
+      isApplied: !1
+    })));
+  }, []);
+  return m(() => {
+    const e = new AbortController(), t = (n) => {
+      u.current?.contains(n.target) || f();
     };
-    return document.addEventListener("mousedown", t, {
-      signal: e.signal
-    }), document.addEventListener(
-      "visibilitychange",
-      () => {
-        document.hidden && f();
-      },
-      {
-        signal: e.signal
-      }
-    ), () => {
+    return document.addEventListener("mousedown", t, { signal: e.signal }), document.addEventListener("visibilitychange", () => {
+      document.hidden && f();
+    }, { signal: e.signal }), () => {
       e.abort();
     };
   }, [f, u]), {
     isOpen: g,
     isAllSelected: S,
     selectedCount: C,
-    selectedOptions: n,
+    selectedOptions: s,
     wrapperRef: u,
     handleApplyOptions: A,
-    handleOpen: E,
+    handleOpen: h,
     handleResetOptions: R,
     handleSelectAll: b,
-    handleSelectOption: h
+    handleSelectOption: E
   };
 };
 export {

package/dist/components/Filter/components/BadgeDropdown/BadgeMultiSelect.js

@@ -1,147 +1,75 @@
-import { jsxs as a, jsx as l } from "react/jsx-runtime";
+import { t as h } from "../../../../Checkbox-Cn0UWlk8.js";
+import { t as r } from "../../../../utils-DHuiYnx1.js";
+import { Button as f } from "../../../Button/Button.js";
+import { t as B } from "../../../../chevron-down-DgssmYWu.js";
 import { Badge as c } from "../../../Badge/Badge.js";
-import { Button as h } from "../../../Button/Button.js";
-import { Checkbox as f } from "../../../Checkbox/Checkbox.js";
-import { filterButtonIconVariants as B, filterButtonVariants as O } from "../../Filter.variants.js";
-import { cn as r } from "../../../../utils/index.js";
-import { useBadgeMultiSelect as A } from "./BadgeMultiSelect.hook.js";
-import { C as I } from "../../../../chevron-down-BBFYYzZq.js";
-const q = ({
-  options: t,
-  label: p,
-  position: i = "left",
-  onApply: g,
-  showSelectAll: u = !0,
-  selectAllLabel: b = "All"
-}) => {
-  const {
-    wrapperRef: x,
-    isOpen: d,
-    isAllSelected: s,
-    selectedOptions: v,
-    selectedCount: m,
-    handleOpen: k,
-    handleResetOptions: C,
-    handleApplyOptions: N,
-    handleSelectAll: y,
-    handleSelectOption: S
-  } = A({ onApply: g, options: t });
-  return t.length === 0 ? null : /* @__PURE__ */ a("div", { ref: x, className: "relative", children: [
-    /* @__PURE__ */ a(
-      "button",
-      {
-        className: r(O(), {
-          "text-slate-700 dark:text-metal-50": d
-        }),
-        onClick: k,
-        children: [
-          p,
-          m.length > 0 && /* @__PURE__ */ l(c, { label: m.length.toString() }),
-          /* @__PURE__ */ l(
-            I,
-            {
-              className: r(B(), {
-                "rotate-180 text-blue-600 dark:text-aurora-500": d
-              })
-            }
-          )
-        ]
-      }
-    ),
-    d && /* @__PURE__ */ a(
-      "div",
-      {
-        className: r(
-          "absolute",
-          "top-full",
-          "mt-1",
-          "bg-white",
-          "rounded-md",
-          "shadow-md",
-          "animate-in",
-          "fade-in-0",
-          "z-10",
-          "border",
-          "border-gray-200",
-          "dark:bg-metal-800",
-          "dark:border-metal-700",
-          {
-            "left-0": i === "left",
-            "right-0": i === "right"
-          }
-        ),
-        children: [
-          /* @__PURE__ */ l("div", { className: "px-6 py-4", children: /* @__PURE__ */ a("div", { className: "flex flex-col gap-2", children: [
-            u && /* @__PURE__ */ a("div", { className: "flex gap-4", children: [
-              /* @__PURE__ */ l(
-                f,
-                {
-                  defaultChecked: s,
-                  onChange: (e) => y(t, e)
-                },
-                `select-all-${s}`
-              ),
-              /* @__PURE__ */ l(c, { label: b })
-            ] }),
-            t.map((e) => {
-              const o = !!v.find(
-                (n) => n.id === e.id
-              );
-              return /* @__PURE__ */ a("div", { className: "flex gap-4", children: [
-                /* @__PURE__ */ l(
-                  f,
-                  {
-                    defaultChecked: o,
-                    "data-label": e.id,
-                    onChange: (n) => S(e, n)
-                  },
-                  `${e.id}-${o}`
-                ),
-                /* @__PURE__ */ l(
-                  c,
-                  {
-                    label: e.label,
-                    variant: e.variant,
-                    leftIcon: e.leftIcon,
-                    rightIcon: e.rightIcon,
-                    loading: e.loading
-                  }
-                )
-              ] }, e.id);
-            })
-          ] }) }),
-          /* @__PURE__ */ a(
-            "div",
-            {
-              className: r(
-                "flex",
-                "justify-center",
-                "items-center",
-                "gap-4",
-                "px-6",
-                "py-4",
-                "border-t",
-                "border-gray-200",
-                "dark:border-metal-700"
-              ),
-              children: [
-                /* @__PURE__ */ l(
-                  h,
-                  {
-                    variant: "secondary",
-                    appearance: "compact",
-                    onClick: C,
-                    children: "Reset"
-                  }
-                ),
-                /* @__PURE__ */ l(h, { appearance: "compact", onClick: N, children: "Apply" })
-              ]
-            }
-          )
-        ]
-      }
-    )
-  ] });
+import { filterButtonIconVariants as O, filterButtonVariants as A } from "../../Filter.variants.js";
+import { useBadgeMultiSelect as I } from "./BadgeMultiSelect.hook.js";
+import { jsx as a, jsxs as l } from "react/jsx-runtime";
+var q = ({ options: t, label: p, position: i = "left", onApply: g, showSelectAll: u = !0, selectAllLabel: b = "All" }) => {
+  const { wrapperRef: x, isOpen: d, isAllSelected: s, selectedOptions: v, selectedCount: m, handleOpen: k, handleResetOptions: C, handleApplyOptions: N, handleSelectAll: y, handleSelectOption: S } = I({
+    onApply: g,
+    options: t
+  });
+  return t.length === 0 ? null : /* @__PURE__ */ l("div", {
+    ref: x,
+    className: "relative",
+    children: [/* @__PURE__ */ l("button", {
+      className: r(A(), { "text-slate-700 dark:text-metal-50": d }),
+      onClick: k,
+      children: [
+        p,
+        m.length > 0 && /* @__PURE__ */ a(c, { label: m.length.toString() }),
+        /* @__PURE__ */ a(B, { className: r(O(), { "rotate-180 text-blue-600 dark:text-aurora-500": d }) })
+      ]
+    }), d && /* @__PURE__ */ l("div", {
+      className: r("absolute", "top-full", "mt-1", "bg-white", "rounded-md", "shadow-md", "animate-in", "fade-in-0", "z-10", "border", "border-gray-200", "dark:bg-metal-800", "dark:border-metal-700", {
+        "left-0": i === "left",
+        "right-0": i === "right"
+      }),
+      children: [/* @__PURE__ */ a("div", {
+        className: "px-6 py-4",
+        children: /* @__PURE__ */ l("div", {
+          className: "flex flex-col gap-2",
+          children: [u && /* @__PURE__ */ l("div", {
+            className: "flex gap-4",
+            children: [/* @__PURE__ */ a(h, {
+              defaultChecked: s,
+              onChange: (e) => y(t, e)
+            }, `select-all-${s}`), /* @__PURE__ */ a(c, { label: b })]
+          }), t.map((e) => {
+            const o = !!v.find((n) => n.id === e.id);
+            return /* @__PURE__ */ l("div", {
+              className: "flex gap-4",
+              children: [/* @__PURE__ */ a(h, {
+                defaultChecked: o,
+                "data-label": e.id,
+                onChange: (n) => S(e, n)
+              }, `${e.id}-${o}`), /* @__PURE__ */ a(c, {
+                label: e.label,
+                variant: e.variant,
+                leftIcon: e.leftIcon,
+                rightIcon: e.rightIcon,
+                loading: e.loading
+              })]
+            }, e.id);
+          })]
+        })
+      }), /* @__PURE__ */ l("div", {
+        className: r("flex", "justify-center", "items-center", "gap-4", "px-6", "py-4", "border-t", "border-gray-200", "dark:border-metal-700"),
+        children: [/* @__PURE__ */ a(f, {
+          variant: "secondary",
+          appearance: "compact",
+          onClick: C,
+          children: "Reset"
+        }), /* @__PURE__ */ a(f, {
+          appearance: "compact",
+          onClick: N,
+          children: "Apply"
+        })]
+      })]
+    })]
+  });
 };
 export {
   q as BadgeMultiSelect

package/dist/components/Filter/components/DateFilterDropdown/DateFilterDropdown.hook.js

@@ -1,87 +1,56 @@
-import { useRef as C, useId as S, useState as f, useMemo as y, useCallback as r, useEffect as E } from "react";
-import { sendOpenFilterEvent as F, FilterEvent as v } from "../../events/index.js";
-import { getLocale as R } from "../../utils/index.js";
-import { useFilterContext as k } from "../../contexts/filter.hook.js";
-const A = ({
-  onApply: n,
-  countryCode: g = "US"
-}) => {
-  const { closeOnApply: a } = k(), i = C(null), t = S(), [h, o] = f(!1), [l, c] = f(), [p, d] = f(), D = y(
-    () => p?.toLocaleDateString(R(g), {
-      day: "numeric",
-      month: "short",
-      year: "numeric"
-    }),
-    [p, g]
-  ), b = r(
-    () => o((e) => (e || F(t), !e)),
-    [t]
-  ), O = r(() => {
-    d(l), n?.(l), a && o(!1);
-  }, [a, n, l]), L = r((e) => c(e), []), u = r(() => o(!1), []), w = r(() => {
-    c(void 0), d(void 0), n?.(), a && o(!1);
-  }, [a, n]);
-  return E(() => {
+import { useFilterContext as C } from "../../contexts/filter.hook.js";
+import { FilterEvent as f, sendOpenFilterEvent as S } from "../../events/index.js";
+import { t as y } from "../../../../utils-CQSRNcoF.js";
+import { useCallback as a, useEffect as m, useId as F, useMemo as R, useRef as k, useState as g } from "react";
+var A = ({ onApply: n, countryCode: p = "US" }) => {
+  const { closeOnApply: r } = C(), i = k(null), t = F(), [E, o] = g(!1), [l, d] = g(), [v, c] = g(), h = R(() => v?.toLocaleDateString(y(p), {
+    day: "numeric",
+    month: "short",
+    year: "numeric"
+  }), [v, p]), D = a(() => o((e) => (e || S(t), !e)), [t]), b = a(() => {
+    c(l), n?.(l), r && o(!1);
+  }, [
+    r,
+    n,
+    l
+  ]), O = a((e) => d(e), []), u = a(() => o(!1), []), L = a(() => {
+    d(void 0), c(void 0), n?.(), r && o(!1);
+  }, [r, n]);
+  return m(() => {
     const e = new AbortController();
-    return document.addEventListener(
-      v.OPEN,
-      ((s) => {
-        s.detail !== t && o(!1);
-      }),
-      {
-        signal: e.signal
-      }
-    ), () => {
+    return document.addEventListener(f.OPEN, ((s) => {
+      s.detail !== t && o(!1);
+    }), { signal: e.signal }), () => {
       e.abort();
     };
-  }, [t]), E(() => {
+  }, [t]), m(() => {
     const e = new AbortController();
-    return document.addEventListener(
-      v.OPEN,
-      (s) => {
-        s.detail !== t && o(!1);
-      },
-      {
-        signal: e.signal
-      }
-    ), document.addEventListener(
-      v.RESET,
-      () => {
-        c(void 0), d(void 0), n?.();
-      },
-      {
-        signal: e.signal
-      }
-    ), () => {
+    return document.addEventListener(f.OPEN, (s) => {
+      s.detail !== t && o(!1);
+    }, { signal: e.signal }), document.addEventListener(f.RESET, () => {
+      d(void 0), c(void 0), n?.();
+    }, { signal: e.signal }), () => {
       e.abort();
     };
-  }, [t, n]), E(() => {
-    const e = new AbortController(), s = (m) => {
-      i.current?.contains(m.target) || u();
+  }, [t, n]), m(() => {
+    const e = new AbortController(), s = (w) => {
+      i.current?.contains(w.target) || u();
     };
-    return document.addEventListener("mousedown", s, {
-      signal: e.signal
-    }), document.addEventListener(
-      "visibilitychange",
-      () => {
-        document.hidden && u();
-      },
-      {
-        signal: e.signal
-      }
-    ), () => {
+    return document.addEventListener("mousedown", s, { signal: e.signal }), document.addEventListener("visibilitychange", () => {
+      document.hidden && u();
+    }, { signal: e.signal }), () => {
       e.abort();
     };
   }, [u, i]), {
     id: t,
-    appliedDay: D,
-    isOpen: h,
+    appliedDay: h,
+    isOpen: E,
     selectedDay: l,
     wrapperRef: i,
-    handleApply: O,
-    handleOpen: b,
-    handleSelect: L,
-    handleReset: w
+    handleApply: b,
+    handleOpen: D,
+    handleSelect: O,
+    handleReset: L
   };
 };
 export {