@konstructio/ui 0.1.2-alpha.99 → 0.1.4

package/dist/components/Drawer/Drawer.js

@@ -1,76 +1,106 @@
 "use client";
-import { t as z } from "../../x-KjMYhcCb.js";
-import { t as B } from "../../dist-EV-1XXQr.js";
-import { t as o } from "../../utils-COaoD3PI.js";
-import { t as C } from "../../Combination-DFcElBFt.js";
-import { DrawerContext as F } from "./contexts/Drawer.context.js";
-import { Header as I } from "./components/Header/Header.js";
-import { Body as M } from "./components/Body/Body.js";
-import { Footer as j } from "./components/Footer/Footer.js";
-import { buttonCloseVariants as k, drawerVariants as A, overlayVariants as K, resizeHandleVariants as P } from "./Drawer.variants.js";
+import { t as j } from "../../dist-C_jtUTU9.js";
+import { t as k } from "../../x-BmNOD9Gr.js";
+import { t as A } from "../../es2015-B4px8XhV.js";
+import { t as K } from "../../Combination-CnMM05mt.js";
+import { t as o } from "../../utils-DnIJruo0.js";
+import { Body as U } from "./components/Body/Body.js";
+import { Footer as _ } from "./components/Footer/Footer.js";
+import { Header as L } from "./components/Header/Header.js";
+import { DrawerContext as O } from "./contexts/Drawer.context.js";
+import { buttonCloseVariants as X, drawerVariants as $, overlayVariants as q, resizeHandleVariants as G } from "./Drawer.variants.js";
 import "./constants/index.js";
-import { useDrawer as R } from "./hooks/useDrawer.js";
-import { useId as T, useMemo as E } from "react";
-import { createPortal as L } from "react-dom";
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-var d = ({ canResize: t = !1, children: f, className: u, classNames: r, container: c, defaultWidth: m = 500, isOpen: p, maxWidth: h, minWidth: w, position: i = "right", showCloseButton: y = !0, theme: v, onClose: a }) => {
-  const n = T(), { handleKeyDown: b, handleMouseDown: D, isAnimating: s, isVisible: x, translateClass: V, width: H } = R({
-    canResize: t,
-    defaultWidth: m,
-    isOpen: p,
-    maxWidth: h,
-    minWidth: w,
-    position: i,
-    onClose: a
-  }), g = E(() => ({
-    classNames: r,
-    headerId: n
-  }), [r, n]);
-  return x ? L(/* @__PURE__ */ e(F.Provider, {
+import { useDrawer as J } from "./hooks/useDrawer.js";
+import { useSwipeToClose as N } from "./hooks/useSwipeToClose.js";
+import { useId as Q, useMemo as W } from "react";
+import { createPortal as Y } from "react-dom";
+import { jsx as r, jsxs as d } from "react/jsx-runtime";
+var s = ({ canResize: a = !1, children: h, className: f, classNames: e, container: p, defaultWidth: u = 500, isOpen: w, maxWidth: v, minWidth: y, position: t = "right", showCloseButton: b = !0, closeOnSwipe: x = !0, fullScreenOnMobile: T = !0, initialFocus: D = "first", theme: P, onClose: n }) => {
+  const i = Q(), { handleKeyDown: z, handleResizePointerDown: C, handleResizePointerEnd: m, handleResizePointerMove: V, isAnimating: c, isVisible: H, translateClass: M, width: E } = J({
+    canResize: a,
+    defaultWidth: u,
+    isOpen: w,
+    maxWidth: v,
+    minWidth: y,
+    position: t,
+    onClose: n
+  }), { swipeOffset: l, handleTouchCancel: F, handleTouchEnd: I, handleTouchMove: R, handleTouchStart: S } = N({
+    enabled: x,
+    position: t,
+    onClose: n
+  }), g = W(() => ({
+    classNames: e,
+    headerId: i
+  }), [e, i]);
+  if (!H) return null;
+  const B = /* @__PURE__ */ r(O.Provider, {
     value: g,
-    children: /* @__PURE__ */ e(C, { children: /* @__PURE__ */ l("div", {
-      className: o("fixed inset-0 z-40", r?.root),
-      "data-theme": v,
-      children: [/* @__PURE__ */ e("div", {
-        className: o(K(), {
-          "opacity-50": s,
-          "opacity-0": !s
-        }, r?.overlay),
+    children: /* @__PURE__ */ r(K, { children: /* @__PURE__ */ d("div", {
+      className: o("fixed inset-0 z-40", e?.root),
+      "data-theme": P,
+      children: [/* @__PURE__ */ r("div", {
+        className: o(q(), {
+          "opacity-55": c,
+          "opacity-0": !c
+        }, e?.overlay),
         "aria-hidden": "true",
-        onClick: a,
+        onClick: n,
         role: "presentation"
-      }), /* @__PURE__ */ l("div", {
-        className: o(A({ position: i }), V, r?.panel, u),
-        style: { width: t ? H : m },
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-labelledby": n,
-        children: [
-          t && /* @__PURE__ */ e("button", {
-            type: "button",
-            "aria-label": "Resize drawer",
-            className: o(P({ position: i }), r?.resizeHandle),
-            onMouseDown: D,
-            onKeyDown: b
-          }),
-          y && /* @__PURE__ */ l("button", {
-            className: o(k(), r?.closeButton),
-            onClick: a,
-            type: "button",
-            children: [/* @__PURE__ */ e(z, { size: 20 }), /* @__PURE__ */ e(B, { children: "Dismiss drawer" })]
-          }),
-          /* @__PURE__ */ e("div", {
-            className: o("flex flex-1 flex-col h-full overflow-hidden", r?.content),
-            children: f
-          })
-        ]
+      }), /* @__PURE__ */ r(A, {
+        returnFocus: !0,
+        className: "contents",
+        children: /* @__PURE__ */ d("div", {
+          className: o($({
+            position: t,
+            fullScreenOnMobile: T
+          }), M, l !== null && "transition-none", e?.panel, f),
+          style: {
+            width: a ? E : u,
+            ...l !== null && { translate: `${l}px 0` }
+          },
+          onTouchStart: S,
+          onTouchMove: R,
+          onTouchEnd: I,
+          onTouchCancel: F,
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-labelledby": i,
+          ...D === "panel" ? {
+            tabIndex: -1,
+            "data-autofocus": !0
+          } : {},
+          children: [
+            a && /* @__PURE__ */ r("button", {
+              type: "button",
+              "aria-label": "Resize drawer",
+              "data-drawer-resize-handle": "",
+              className: o(G({ position: t }), e?.resizeHandle),
+              onPointerDown: C,
+              onPointerMove: V,
+              onPointerUp: m,
+              onPointerCancel: m,
+              onKeyDown: z
+            }),
+            b && /* @__PURE__ */ d("button", {
+              className: o(X(), e?.closeButton),
+              onClick: n,
+              type: "button",
+              children: [/* @__PURE__ */ r(k, { size: 20 }), /* @__PURE__ */ r(j, { children: "Dismiss drawer" })]
+            }),
+            /* @__PURE__ */ r("div", {
+              className: o("flex flex-1 flex-col h-full overflow-hidden", e?.content),
+              children: h
+            })
+          ]
+        })
       })]
     }) })
-  }), c || document.body) : null;
+  });
+  return Y(B, p || document.body);
 };
-d.Header = I;
-d.Body = M;
-d.Footer = j;
+s.Header = L;
+s.Body = U;
+s.Footer = _;
 export {
-  d as Drawer
+  s as Drawer
 };

package/dist/components/Drawer/Drawer.variants.js

@@ -1,5 +1,5 @@
-import { t } from "../../dist-Bcn6lMQe.js";
-var a = t([
+import { t as r } from "../../dist-B9GE4SXf.js";
+var e = r([
   "bg-white",
   "dark:bg-metal-900",
   "duration-300",
@@ -14,40 +14,59 @@ var a = t([
   "transition-transform",
   "z-50"
 ], {
-  variants: { position: {
-    left: [
-      "left-0",
-      "border-r",
-      "border-slate-200",
-      "dark:border-metal-700"
-    ],
-    right: [
-      "right-0",
-      "border-l",
-      "border-slate-200",
-      "dark:border-metal-700"
-    ]
-  } },
-  defaultVariants: { position: "right" }
-}), e = t([
+  variants: {
+    fullScreenOnMobile: {
+      true: ["max-md:w-full!", "max-md:border-0"],
+      false: ""
+    },
+    position: {
+      left: [
+        "left-0",
+        "border-r",
+        "border-slate-200",
+        "dark:border-metal-700"
+      ],
+      right: [
+        "right-0",
+        "border-l",
+        "border-slate-200",
+        "dark:border-metal-700"
+      ]
+    }
+  },
+  defaultVariants: {
+    position: "right",
+    fullScreenOnMobile: !0
+  }
+}), a = r([
   "fixed",
   "inset-0",
   "z-40",
   "bg-black",
   "transition-opacity",
   "duration-300"
-]), o = t([
+]), o = r([
   "absolute",
+  "rounded",
+  "outline-none",
+  "focus-visible:ring-1",
+  "focus-visible:ring-aurora-500",
+  "flex",
+  "items-center",
+  "justify-center",
+  "pointer-coarse:min-h-11",
+  "pointer-coarse:min-w-11",
   "right-3",
   "top-3",
   "cursor-pointer",
+  "tap-target",
   "text-slate-500",
   "hover:text-slate-700",
   "dark:text-metal-400",
   "dark:hover:text-metal-300",
   "transition-colors",
   "z-10"
-]), i = t([
+]), i = r([
   "absolute",
   "bg-slate-200",
   "dark:bg-metal-700",
@@ -57,6 +76,9 @@ var a = t([
   "opacity-0",
   "p-0",
   "top-0",
+  "tap-target",
+  "touch-hit-area",
+  "touch-none",
   "transition-opacity",
   "w-1",
   "z-50",
@@ -72,7 +94,7 @@ var a = t([
 });
 export {
   o as buttonCloseVariants,
-  a as drawerVariants,
-  e as overlayVariants,
+  e as drawerVariants,
+  a as overlayVariants,
   i as resizeHandleVariants
 };

package/dist/components/Drawer/components/Body/Body.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../../utils-COaoD3PI.js";
+import { t as e } from "../../../../utils-DnIJruo0.js";
 import { useDrawerContext as a } from "../../contexts/Drawer.context.js";
 import { memo as t } from "react";
 import { jsx as s } from "react/jsx-runtime";

package/dist/components/Drawer/components/Footer/Footer.js

@@ -1,11 +1,11 @@
-import { t } from "../../../../utils-COaoD3PI.js";
-import { useDrawerContext as m } from "../../contexts/Drawer.context.js";
-import { memo as a } from "react";
+import { t } from "../../../../utils-DnIJruo0.js";
+import { useDrawerContext as a } from "../../contexts/Drawer.context.js";
+import { memo as m } from "react";
 import { jsx as s } from "react/jsx-runtime";
-var i = a(({ children: r, className: o }) => {
-  const { classNames: e } = m();
+var i = m(({ children: r, className: e }) => {
+  const { classNames: o } = a();
   return /* @__PURE__ */ s("div", {
-    className: t("flex-shrink-0", "border-t", "border-slate-200", "dark:border-metal-700", "p-4", e?.footer, o),
+    className: t("flex-shrink-0", "border-t", "border-slate-200", "dark:border-metal-700", "p-4", "max-md:pb-[calc(1rem+env(safe-area-inset-bottom))]", o?.footer, e),
     children: r
   });
 });

package/dist/components/Drawer/components/Header/Header.js

@@ -1,4 +1,4 @@
-import { t as d } from "../../../../utils-COaoD3PI.js";
+import { t as d } from "../../../../utils-DnIJruo0.js";
 import { useDrawerContext as s } from "../../contexts/Drawer.context.js";
 import { memo as t } from "react";
 import { jsx as i } from "react/jsx-runtime";

package/dist/components/Drawer/constants/index.js

@@ -1,9 +1,14 @@
-var A = 500, _ = 400, I = 800, T = 10, D = 300, E = 20;
+var I = 500, _ = 400, E = 800, T = 10, A = 300, S = 20, r = 60, D = 0.25, a = 0.5, v = 8, L = 100;
 export {
   T as ANIMATION_DELAY_MS,
-  D as ANIMATION_DURATION_MS,
-  I as DEFAULT_MAX_WIDTH,
+  A as ANIMATION_DURATION_MS,
+  E as DEFAULT_MAX_WIDTH,
   _ as DEFAULT_MIN_WIDTH,
-  A as DEFAULT_WIDTH,
-  E as KEYBOARD_RESIZE_STEP
+  I as DEFAULT_WIDTH,
+  S as KEYBOARD_RESIZE_STEP,
+  v as SWIPE_AXIS_LOCK_DISTANCE,
+  D as SWIPE_DISTANCE_RATIO,
+  r as SWIPE_THRESHOLD,
+  a as SWIPE_VELOCITY,
+  L as SWIPE_VELOCITY_STALE_MS
 };

package/dist/components/Drawer/hooks/index.js

@@ -1,4 +1,6 @@
-import { useDrawer as e } from "./useDrawer.js";
+import { useDrawer as r } from "./useDrawer.js";
+import { useSwipeToClose as m } from "./useSwipeToClose.js";
 export {
-  e as useDrawer
+  r as useDrawer,
+  m as useSwipeToClose
 };

package/dist/components/Drawer/hooks/useDrawer.js

@@ -1,62 +1,47 @@
 import "../constants/index.js";
-import { useCallback as D, useEffect as c, useMemo as v, useRef as w, useState as E } from "react";
-var H = ({ canResize: n = !1, defaultWidth: I = 500, isOpen: s, maxWidth: u = 800, minWidth: l = 400, position: t = "right", onClose: M }) => {
-  const [T, g] = E(!1), [a, h] = E(!1), [L, f] = E(I), d = w(!1), i = w(() => {
-  }), m = w(() => {
-  });
+import { useCallback as b, useEffect as c, useRef as p, useState as f } from "react";
+var K = ({ canResize: o = !1, defaultWidth: D = 500, isOpen: n, maxWidth: d = 800, minWidth: y = 400, position: t = "right", onClose: I }) => {
+  const [T, h] = f(!1), [A, m] = f(!1), [w, l] = f(D), s = p(null);
   c(() => {
     let e;
-    return s ? (g(!0), e = setTimeout(() => h(!0), 10)) : (h(!1), e = setTimeout(() => g(!1), 300)), () => {
+    return n ? (h(!0), e = setTimeout(() => m(!0), 10)) : (m(!1), e = setTimeout(() => h(!1), 300)), () => {
       clearTimeout(e);
     };
-  }, [s]), c(() => {
-    if (!s) return;
-    const e = new AbortController(), r = (A) => {
-      A.code === "Escape" && M?.();
+  }, [n]), c(() => {
+    if (!n) return;
+    const e = new AbortController(), r = (a) => {
+      a.code === "Escape" && I?.();
     };
     return window.addEventListener("keydown", r, { signal: e.signal }), () => {
       e.abort();
     };
-  }, [s, M]);
-  const o = D(() => {
-    document.removeEventListener("mousemove", i.current), document.removeEventListener("mouseup", m.current), document.body.style.cursor = "", document.body.style.userSelect = "";
-  }, []);
-  c(() => {
-    i.current = (e) => {
-      if (!d.current || !n) return;
-      let r;
-      t === "right" ? r = window.innerWidth - e.clientX : r = e.clientX, r = Math.max(l, Math.min(u, r)), f(r);
-    }, m.current = () => {
-      d.current = !1, o();
-    };
-  }, [
-    t,
-    l,
-    u,
-    n,
-    o
-  ]);
-  const _ = D(() => {
-    d.current = !0, document.addEventListener("mousemove", i.current), document.addEventListener("mouseup", m.current), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none";
-  }, []), b = D((e) => {
-    if (!n) return;
-    const r = t === "right" && e.key === "ArrowLeft" || t === "left" && e.key === "ArrowRight", A = t === "right" && e.key === "ArrowRight" || t === "left" && e.key === "ArrowLeft";
-    r ? (e.preventDefault(), f((y) => Math.min(u, y + 20))) : A && (e.preventDefault(), f((y) => Math.max(l, y - 20)));
-  }, [
-    n,
-    t,
-    u,
-    l
-  ]);
-  return c(() => o, [o]), {
-    isAnimating: a,
+  }, [n, I]);
+  const i = b(() => {
+    document.body.style.cursor = "", document.body.style.userSelect = "";
+  }, []), g = (e) => {
+    !o || e.pointerType === "mouse" && e.button !== 0 || (e.preventDefault(), s.current = e.pointerId, e.currentTarget.setPointerCapture?.(e.pointerId), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none");
+  }, E = (e) => {
+    if (!o || s.current !== e.pointerId) return;
+    const r = t === "right" ? window.innerWidth - e.clientX : e.clientX;
+    l(Math.max(y, Math.min(d, r)));
+  }, M = (e) => {
+    s.current === e.pointerId && (s.current = null, e.currentTarget.hasPointerCapture?.(e.pointerId) && e.currentTarget.releasePointerCapture(e.pointerId), i());
+  }, _ = (e) => {
+    if (!o) return;
+    const r = t === "right" && e.key === "ArrowLeft" || t === "left" && e.key === "ArrowRight", a = t === "right" && e.key === "ArrowRight" || t === "left" && e.key === "ArrowLeft";
+    r ? (e.preventDefault(), l((u) => Math.min(d, u + 20))) : a && (e.preventDefault(), l((u) => Math.max(y, u - 20)));
+  };
+  return c(() => i, [i]), {
+    isAnimating: A,
     isVisible: T,
-    width: L,
-    translateClass: v(() => a ? "translate-x-0" : t === "left" ? "-translate-x-full" : "translate-x-full", [a, t]),
-    handleMouseDown: _,
-    handleKeyDown: b
+    width: w,
+    translateClass: A ? "translate-x-0" : t === "left" ? "-translate-x-full" : "translate-x-full",
+    handleKeyDown: _,
+    handleResizePointerDown: g,
+    handleResizePointerMove: E,
+    handleResizePointerEnd: M
   };
 };
 export {
-  H as useDrawer
+  K as useDrawer
 };

package/dist/components/Drawer/hooks/useSwipeToClose.js

@@ -0,0 +1,49 @@
+import { SWIPE_DISTANCE_RATIO as f } from "../constants/index.js";
+import { useRef as m, useState as E } from "react";
+var p = "[data-drawer-resize-handle]", g = ({ enabled: i, position: u, onClose: h }) => {
+  const [d, r] = E(null), s = m(null), l = u === "left" ? -1 : 1;
+  return {
+    swipeOffset: d,
+    handleTouchStart: (e) => {
+      const t = e.touches?.[0], a = e.target;
+      if (!i || !t || a?.closest?.(p)) {
+        s.current = null;
+        return;
+      }
+      s.current = {
+        startX: t.clientX,
+        startY: t.clientY,
+        axis: null,
+        lastX: t.clientX,
+        lastTime: e.timeStamp,
+        velocity: 0
+      };
+    },
+    handleTouchMove: (e) => {
+      const t = s.current, a = e.touches?.[0];
+      if (!t || !a) return;
+      const n = a.clientX - t.startX, o = a.clientY - t.startY;
+      if (t.axis === null) {
+        if (Math.max(Math.abs(n), Math.abs(o)) < 8) return;
+        t.axis = Math.abs(n) > Math.abs(o) ? "x" : "y";
+      }
+      if (t.axis !== "x") return;
+      const c = e.timeStamp - t.lastTime;
+      c > 0 && (t.velocity = (a.clientX - t.lastX) / c), t.lastX = a.clientX, t.lastTime = e.timeStamp, r(l * Math.max(0, n * l));
+    },
+    handleTouchEnd: (e) => {
+      const t = s.current, a = e.changedTouches?.[0];
+      if (s.current = null, r(null), !i || !t || !a || t.axis === "y") return;
+      const n = a.clientX - t.startX, o = a.clientY - t.startY;
+      if (Math.abs(n) <= Math.abs(o)) return;
+      const c = n * l, S = e.timeStamp - t.lastTime <= 100 ? t.velocity * l : 0, T = Math.max(60, e.currentTarget.offsetWidth * f);
+      c > 0 && (c >= T || S > 0.5) && h?.();
+    },
+    handleTouchCancel: () => {
+      s.current = null, r(null);
+    }
+  };
+};
+export {
+  g as useSwipeToClose
+};

package/dist/components/DropdownButton/DropdownButton.js

@@ -1,4 +1,4 @@
-import { t } from "../../DropdownButton-CWwjA3zI.js";
+import { t } from "../../DropdownButton-BTrOG4rh.js";
 export {
   t as DropdownButton
 };

package/dist/components/DropdownButton/components/ActionSheet/ActionSheet.js

@@ -0,0 +1,36 @@
+import { Sheet as u } from "../../../Sheet/Sheet.js";
+import { t } from "../../../../utils-DnIJruo0.js";
+import { Fragment as v } from "react";
+import { jsx as a, jsxs as r } from "react/jsx-runtime";
+var w = ({ isOpen: d, onClose: s, title: i, options: m, itemClassName: b, className: n, headerClassName: c, titleClassName: o, position: x = "bottom", theme: h }) => /* @__PURE__ */ a(u, {
+  isOpen: d,
+  onClose: s,
+  title: i,
+  position: x,
+  theme: h,
+  className: t("px-4", n),
+  headerClassName: t("px-2", c),
+  titleClassName: o,
+  bodyClassName: "overflow-visible",
+  children: /* @__PURE__ */ a("div", {
+    className: "flex flex-col",
+    children: m.map((e, f) => {
+      const l = e.disabled || !!e.disabledReason;
+      return /* @__PURE__ */ r(v, { children: [e.separator && /* @__PURE__ */ a("hr", { className: "-mx-4 my-2 border-slate-200 dark:border-metal-700" }), /* @__PURE__ */ r("button", {
+        type: "button",
+        disabled: l,
+        className: t("flex min-h-11 w-full items-center justify-between gap-4 rounded px-2 text-left text-base", "hover:bg-slate-50 focus-visible:bg-slate-50 dark:hover:bg-metal-700 dark:focus-visible:bg-metal-700", "outline-none disabled:cursor-not-allowed disabled:hover:bg-transparent", e.destructive && "text-red-600 dark:text-red-400", l && "text-slate-400 dark:text-metal-400", b),
+        onClick: () => {
+          e.onClick?.(), s();
+        },
+        children: [/* @__PURE__ */ a("span", { children: e.label }), e.disabledReason && /* @__PURE__ */ a("span", {
+          className: "shrink-0 text-xs text-slate-400 dark:text-metal-400",
+          children: e.disabledReason
+        })]
+      })] }, f);
+    })
+  })
+});
+export {
+  w as ActionSheet
+};

package/dist/components/Filter/Filter.js

@@ -1,34 +1,39 @@
 "use client";
-import { t as l } from "../../utils-COaoD3PI.js";
-import { FilterProvider as a } from "./contexts/filter.provider.js";
-import { filterVariants as p } from "./Filter.variants.js";
-import { BadgeMultiSelect as n } from "./components/BadgeDropdown/BadgeMultiSelect.js";
-import { DateFilterDropdown as d } from "./components/DateFilterDropdown/DateFilterDropdown.js";
-import { DateRangeFilterDropdown as f } from "./components/DateRangeFilterDropdown/DateRangeFilterDropdown.js";
-import { ResetButton as c } from "./components/ResetButton/ResetButton.js";
-import { TextMultiSelect as s } from "./components/TextMultiSelect/TextMultiSelect.js";
-import { TimeFilterDropdown as D } from "./components/TimeFilterDropdown/TimeFilterDropdown.js";
+import { t as a } from "../../utils-DnIJruo0.js";
+import { FilterProvider as p } from "./contexts/filter.provider.js";
+import { filterVariants as n } from "./Filter.variants.js";
+import { BadgeMultiSelect as d } from "./components/BadgeDropdown/BadgeMultiSelect.js";
+import { CustomDateRangeFilterDropdown as D } from "./components/CustomDateRangeFilterDropdown/CustomDateRangeFilterDropdown.js";
+import { DateFilterDropdown as f } from "./components/DateFilterDropdown/DateFilterDropdown.js";
+import { DateRangeFilterDropdown as s } from "./components/DateRangeFilterDropdown/DateRangeFilterDropdown.js";
+import { ResetButton as u } from "./components/ResetButton/ResetButton.js";
+import { TextMultiSelect as F } from "./components/TextMultiSelect/TextMultiSelect.js";
+import { TimeFilterDropdown as c } from "./components/TimeFilterDropdown/TimeFilterDropdown.js";
 import { jsx as e } from "react/jsx-runtime";
-var t = ({ className: r, theme: o = "civo", children: i, closeOnApply: m = !0 }) => /* @__PURE__ */ e(a, {
+var t = ({ className: o, theme: r, children: i, closeOnApply: m = !0, resetScope: l }) => /* @__PURE__ */ e(p, {
   closeOnApply: m,
+  resetScope: l,
+  theme: r,
   children: /* @__PURE__ */ e("div", {
-    className: l(p({ className: r })),
-    "data-theme": o,
+    className: a(n({ className: o })),
+    "data-theme": r,
     children: i
   })
 });
 t.displayName = "KonstructFilter";
-t.BadgeMultiSelect = n;
-t.TextMultiSelect = s;
-t.DateFilterDropdown = d;
-t.DateRangeFilterDropdown = f;
-t.TimeFilterDropdown = D;
-t.ResetButton = c;
+t.BadgeMultiSelect = d;
+t.TextMultiSelect = F;
+t.DateFilterDropdown = f;
+t.DateRangeFilterDropdown = s;
+t.CustomDateRangeFilterDropdown = D;
+t.TimeFilterDropdown = c;
+t.ResetButton = u;
 export {
-  n as BadgeMultiSelect,
-  d as DateFilterDropdown,
-  f as DateRangeFilterDropdown,
+  d as BadgeMultiSelect,
+  D as CustomDateRangeFilterDropdown,
+  f as DateFilterDropdown,
+  s as DateRangeFilterDropdown,
   t as Filter,
-  s as TextMultiSelect,
-  D as TimeFilterDropdown
+  F as TextMultiSelect,
+  c as TimeFilterDropdown
 };

package/dist/components/Filter/Filter.variants.js

@@ -1,4 +1,4 @@
-import { t } from "../../dist-Bcn6lMQe.js";
+import { t } from "../../dist-B9GE4SXf.js";
 var e = t([
   "flex",
   "gap-8",