@forgedevstack/bear 1.3.0 → 1.3.1

package/dist/components/DateRangePicker/DateRangePicker.js

@@ -1,146 +1,155 @@
-import { jsxs as d, jsx as t } from "react/jsx-runtime";
-import { useState as h, useRef as P, useEffect as T, useCallback as _ } from "react";
-import { createPortal as le } from "react-dom";
-import { cn as p } from "../../utils/cn.js";
-import { getDefaultPresets as ie, LABEL_CLASSES as ce, SIZE_CLASSES as de, TRIGGER_CLASSES as be, PRESET_BTN_CLASSES as $, ERROR_CLASSES as me, HELPER_CLASSES as ue, ROOT_CLASSES as he, CALENDAR_HEADER_CLASSES as pe, NAV_BTN_CLASSES as G, MONTH_LABELS as Se, DAY_LABELS as fe, DAY_TODAY_CLASSES as we, DAY_IN_RANGE_CLASSES as Ee, DAY_SELECTED_CLASSES as ge, DAY_DISABLED_CLASSES as Le, DAY_HOVER_CLASSES as ve, DAY_BASE_CLASSES as Ae } from "./DateRangePicker.const.js";
-import { formatDate as F, getCalendarDays as ke, isSameDay as Y, isInRange as xe } from "./DateRangePicker.utils.js";
-const Z = ({ year: L, month: c, range: r, onDayClick: v, onNav: A, minDate: b, maxDate: k }) => {
-  const x = ke(L, c), S = /* @__PURE__ */ new Date();
-  return S.setHours(0, 0, 0, 0), /* @__PURE__ */ d("div", { className: "bear-w-64", children: [
-    /* @__PURE__ */ d("div", { className: pe, children: [
-      /* @__PURE__ */ t("button", { type: "button", onClick: () => A(-1), className: G, "aria-label": "Previous month", children: /* @__PURE__ */ t("svg", { className: "bear-w-4 bear-h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ t("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }) }),
-      /* @__PURE__ */ d("span", { className: "bear-text-sm bear-font-semibold bear-text-gray-900 dark:bear-text-white", children: [
-        Se[c],
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { useState as h, useRef as O, useEffect as le, useCallback as g } from "react";
+import { cn as R } from "../../utils/cn.js";
+import { useClickOutsideMultiple as ie } from "../../hooks/useClickOutside.js";
+import "../../context/BearProvider.js";
+import "../../hooks/useBearComponent/useBearComponent.js";
+import { ZERO as P, PRESET_SIDEBAR_MIN_WIDTH_PX as ce, HOURS_MIDNIGHT as D, NEGATIVE_ONE as de, ONE as I, LAST_MONTH_INDEX as Y } from "../../constants/numbers.const.js";
+import { PLACEHOLDER_SELECT_DATE_RANGE as me, BOOLEAN_FALSE as fe, BOOLEAN_TRUE as X, SIZE_MD as pe, PICKING_START as he, EMPTY_STRING as ge, LABEL_CLEAR as ue } from "../../constants/generals.const.js";
+import { useFixedAnchorPosition as xe } from "../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.js";
+import { resolveOverlayEffects as ye } from "../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.utils.js";
+import "../FormControl/FormControl.context.js";
+import { CalendarIcon as ke } from "../Icon/index.js";
+import { OverlayPortal as Ne } from "../OverlayPortal/OverlayPortal.js";
+import { DATERANGE_DROPDOWN_HEIGHT_PX as Ee, SIZE_CLASSES as ve, DATERANGE_DROPDOWN_Z_INDEX as _e, DATERANGE_DROPDOWN_ATTR as De, MONTH_LABELS as Re, DAY_LABELS as we } from "./DateRangePicker.const.js";
+import { getDefaultPresets as Ae, formatDate as Z, resolveRightMonth as Te, getCalendarDays as Le, isSameDay as z, isInRange as Oe } from "./DateRangePicker.utils.js";
+const $ = ({ year: d, month: b, range: r, onDayClick: u, onNav: x, minDate: i, maxDate: y }) => {
+  const k = Le(d, b), m = /* @__PURE__ */ new Date();
+  return m.setHours(D, D, D, D), /* @__PURE__ */ l("div", { className: "bear-w-64", children: [
+    /* @__PURE__ */ l("div", { className: "bear-flex bear-items-center bear-justify-between bear-mb-2", children: [
+      /* @__PURE__ */ e("button", { type: "button", onClick: () => x(de), className: "bear-p-1 bear-rounded hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700 bear-text-gray-500 dark:bear-text-zinc-400", "aria-label": "Previous month", children: /* @__PURE__ */ e("svg", { className: "bear-w-4 bear-h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }) }),
+      /* @__PURE__ */ l("span", { className: "bear-text-sm bear-font-semibold bear-text-gray-900 dark:bear-text-white", children: [
+        Re[b],
         " ",
-        L
+        d
       ] }),
-      /* @__PURE__ */ t("button", { type: "button", onClick: () => A(1), className: G, "aria-label": "Next month", children: /* @__PURE__ */ t("svg", { className: "bear-w-4 bear-h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ t("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) }) })
+      /* @__PURE__ */ e("button", { type: "button", onClick: () => x(I), className: "bear-p-1 bear-rounded hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700 bear-text-gray-500 dark:bear-text-zinc-400", "aria-label": "Next month", children: /* @__PURE__ */ e("svg", { className: "bear-w-4 bear-h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) }) })
     ] }),
-    /* @__PURE__ */ t("div", { className: "bear-grid bear-grid-cols-7 bear-gap-0.5 bear-mb-1", children: fe.map((a) => /* @__PURE__ */ t("div", { className: "bear-text-xs bear-text-center bear-font-medium bear-text-gray-400 dark:bear-text-zinc-500 bear-py-1", children: a }, a)) }),
-    /* @__PURE__ */ t("div", { className: "bear-grid bear-grid-cols-7 bear-gap-0.5", children: x.map((a, D) => {
-      if (!a) return /* @__PURE__ */ t("div", {}, `e-${D}`);
-      const f = b && a < b || k && a > k, l = Y(a, r.start) || Y(a, r.end), m = xe(a, r.start, r.end), R = Y(a, S);
-      return /* @__PURE__ */ t(
+    /* @__PURE__ */ e("div", { className: "bear-grid bear-grid-cols-7 bear-gap-0.5 bear-mb-1", children: we.map((t) => /* @__PURE__ */ e("div", { className: "bear-text-xs bear-text-center bear-font-medium bear-text-gray-400 dark:bear-text-zinc-500 bear-py-1", children: t }, t)) }),
+    /* @__PURE__ */ e("div", { className: "bear-grid bear-grid-cols-7 bear-gap-0.5", children: k.map((t, w) => {
+      if (!t) return /* @__PURE__ */ e("div", {}, `e-${w}`);
+      const f = i && t < i || y && t > y, o = z(t, r.start) || z(t, r.end), c = Oe(t, r.start, r.end), A = z(t, m);
+      return /* @__PURE__ */ e(
         "button",
         {
           type: "button",
           disabled: !!f,
-          onClick: () => v(a),
-          className: p(
-            Ae,
-            f ? Le : ve,
-            l && ge,
-            !l && m && Ee,
-            !l && !m && R && we,
-            !l && !m && !f && "bear-text-gray-700 dark:bear-text-zinc-300"
+          onClick: () => u(t),
+          className: R(
+            "bear-w-8 bear-h-8 bear-text-sm bear-rounded-full bear-transition-colors bear-cursor-pointer",
+            f ? "bear-text-gray-300 dark:bear-text-zinc-600 bear-cursor-not-allowed" : "hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700",
+            o && "bear-bg-primary-500 bear-text-white",
+            !o && c && "bear-bg-primary-100 dark:bear-bg-primary-900/30 bear-text-primary-800 dark:bear-text-primary-200",
+            !o && !c && A && "bear-ring-1 bear-ring-primary-400",
+            !o && !c && !f && "bear-text-gray-700 dark:bear-text-zinc-300"
           ),
-          children: a.getDate()
+          children: t.getDate()
         },
-        a.getTime()
+        t.getTime()
       );
     }) })
   ] });
-}, Pe = (L) => {
+}, Ke = (d) => {
   const {
-    value: c,
+    value: b,
     onChange: r,
-    label: v,
-    placeholder: A = "Select date range",
-    disabled: b = !1,
-    clearable: k = !0,
-    minDate: x,
-    maxDate: S,
-    presets: a,
-    showPresets: D = !0,
-    size: f = "md",
-    error: l,
-    helperText: m,
-    className: R,
-    testId: q,
-    ...J
-  } = L, [N, y] = h(!1), [z, K] = h({ top: 0, left: 0 }), [s, w] = h(c ?? { start: null, end: null }), [H, C] = h("start"), O = P(null), M = P(null), I = P(null), W = /* @__PURE__ */ new Date(), [u, Q] = h(W.getMonth()), [E, U] = h(W.getFullYear()), X = u === 11 ? 0 : u + 1, ee = u === 11 ? E + 1 : E;
-  T(() => {
-    c && w(c);
-  }, [c]), T(() => {
-    if (!N || !M.current) return;
-    const e = 8, n = 420, o = () => {
-      const i = M.current.getBoundingClientRect(), g = window.innerHeight;
-      let B = g - i.bottom < n && i.top > n ? i.top - n - e : i.bottom + e;
-      B = Math.max(8, Math.min(B, g - n - 8));
-      const se = Math.min(640, window.innerWidth - 16);
-      let oe = Math.max(8, Math.min(i.left, window.innerWidth - se - 8));
-      K({ top: B, left: oe });
-    };
-    return o(), window.addEventListener("resize", o), window.addEventListener("scroll", o, !0), () => {
-      window.removeEventListener("resize", o), window.removeEventListener("scroll", o, !0);
-    };
-  }, [N]), T(() => {
-    const e = (n) => {
-      var i, g;
-      const o = n.target;
-      (i = O.current) != null && i.contains(o) || (g = I.current) != null && g.contains(o) || y(!1);
-    };
-    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, []);
-  const j = _((e) => {
-    if (H === "start")
-      w({ start: e, end: null }), C("end");
+    label: u,
+    placeholder: x = me,
+    disabled: i = fe,
+    clearable: y = X,
+    minDate: k,
+    maxDate: m,
+    presets: t,
+    showPresets: w = X,
+    size: f = pe,
+    error: o,
+    helperText: c,
+    className: A,
+    testId: F,
+    openEffect: Pe,
+    closeEffect: ze,
+    effect: Ie,
+    ...U
+  } = d, { openEffect: V, closeEffect: K } = ye(d), [N, T] = h(!1), [n, p] = h(b ?? { start: null, end: null }), [S, E] = h(he), C = O(null), M = O(null), B = O(null), { style: q, ready: J } = xe({
+    anchorRef: M,
+    open: N,
+    estimatedHeightPx: Ee
+  }), H = /* @__PURE__ */ new Date(), [v, Q] = h(H.getMonth()), [_, ee] = h(H.getFullYear()), G = Te(v), re = G.month, ae = _ + G.yearDelta;
+  le(() => {
+    b && p(b);
+  }, [b]);
+  const te = g(() => T(!1), []);
+  ie([C, B], te, { enabled: N });
+  const W = g((a) => {
+    if (S === "start")
+      p({ start: a, end: null }), E("end");
     else {
-      const n = e >= (s.start ?? e) ? { start: s.start, end: e } : { start: e, end: s.start };
-      w(n), C("start"), r == null || r(n);
+      const s = a >= (n.start ?? a) ? { start: n.start, end: a } : { start: a, end: n.start };
+      p(s), E("start"), r == null || r(s);
     }
-  }, [H, s.start, r]), te = _((e) => {
-    w(e), r == null || r(e), y(!1), C("start");
-  }, [r]), re = _(() => {
-    const e = { start: null, end: null };
-    w(e), r == null || r(e), C("start");
-  }, [r]), ae = _((e) => {
-    let n = u + e, o = E;
-    n < 0 && (n = 11, o--), n > 11 && (n = 0, o++), Q(n), U(o);
-  }, [u, E]), V = a ?? (D ? ie() : []), ne = s.start ? `${F(s.start)}${s.end ? ` – ${F(s.end)}` : ""}` : A;
-  return /* @__PURE__ */ d("div", { ref: O, className: p(he, R), "data-testid": q, ...J, children: [
-    v && /* @__PURE__ */ t("label", { className: ce, children: v }),
-    /* @__PURE__ */ d(
+  }, [S, n.start, r]), ne = g((a) => {
+    p(a), r == null || r(a), T(!1), E("start");
+  }, [r]), oe = g(() => {
+    const a = { start: null, end: null };
+    p(a), r == null || r(a), E("start");
+  }, [r]), se = g((a) => {
+    let s = v + a, L = _;
+    s < P && (s = Y, L -= I), s > Y && (s = P, L += I), Q(s), ee(L);
+  }, [v, _]), j = t ?? (w ? Ae() : []), be = n.start ? `${Z(n.start)}${n.end ? ` – ${Z(n.end)}` : ""}` : x;
+  return /* @__PURE__ */ l("div", { ref: C, className: R("Bear-DateRangePicker bear-relative bear-inline-block", A), "data-testid": F, ...U, children: [
+    u && /* @__PURE__ */ e("label", { className: "Bear-DateRangePicker__label bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-zinc-300 bear-mb-1.5", children: u }),
+    /* @__PURE__ */ l(
       "button",
       {
         ref: M,
         type: "button",
-        disabled: b,
-        onClick: () => !b && y(!N),
-        className: p(be, de[f], b && "bear-opacity-50 bear-cursor-not-allowed"),
+        disabled: i,
+        onClick: () => !i && T(!N),
+        className: R(
+          "bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-bg-white dark:bear-bg-zinc-800 bear-text-gray-900 dark:bear-text-white bear-transition-colors focus:bear-ring-2 focus:bear-ring-primary-500 bear-outline-none",
+          ve[f],
+          i && "bear-opacity-50 bear-cursor-not-allowed"
+        ),
         children: [
-          /* @__PURE__ */ t("span", { className: p(!s.start && "bear-text-gray-400 dark:bear-text-zinc-500"), children: ne }),
-          /* @__PURE__ */ t("svg", { className: "bear-w-4 bear-h-4 bear-ml-2 bear-text-gray-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ t("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }) })
+          /* @__PURE__ */ e("span", { className: R(!n.start && "bear-text-gray-400 dark:bear-text-zinc-500"), children: be }),
+          /* @__PURE__ */ e(ke, { className: "bear-w-4 bear-h-4 bear-ml-2 bear-text-gray-400" })
         ]
       }
     ),
-    N && typeof document < "u" && le(
-      /* @__PURE__ */ t(
-        "div",
-        {
-          ref: I,
-          "data-bear-daterangepicker-dropdown": !0,
-          className: p(
-            "bear-fixed bear-z-[10000] bear-max-w-[calc(100vw-16px)] bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-xl bear-shadow-xl bear-p-4 bear-overflow-x-auto"
+    /* @__PURE__ */ e(
+      Ne,
+      {
+        open: N,
+        ready: J,
+        style: q,
+        zIndex: _e,
+        openEffect: V,
+        closeEffect: K,
+        panelRef: B,
+        className: "bear-max-w-[calc(100vw-16px)] bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-xl bear-shadow-xl bear-p-4 bear-overflow-x-auto",
+        attributes: { [De]: ge },
+        children: /* @__PURE__ */ l("div", { className: "bear-flex bear-gap-4", children: [
+          j.length > P && /* @__PURE__ */ l(
+            "div",
+            {
+              className: "bear-border-r bear-border-gray-200 dark:bear-border-zinc-700 bear-pr-3 bear-space-y-1",
+              style: { minWidth: ce },
+              children: [
+                j.map((a) => /* @__PURE__ */ e("button", { type: "button", onClick: () => ne(a.range()), className: "bear-w-full bear-text-left bear-px-3 bear-py-1.5 bear-text-sm bear-rounded bear-transition-colors hover:bear-bg-primary-50 dark:hover:bear-bg-primary-900/20 bear-text-gray-700 dark:bear-text-zinc-300", children: a.label }, a.label)),
+                y && n.start && /* @__PURE__ */ e("button", { type: "button", onClick: oe, className: "bear-w-full bear-text-left bear-px-3 bear-py-1.5 bear-text-sm bear-rounded bear-transition-colors hover:bear-bg-primary-50 dark:hover:bear-bg-primary-900/20 bear-text-red-500", children: ue })
+              ]
+            }
           ),
-          style: { top: z.top, left: z.left },
-          children: /* @__PURE__ */ d("div", { className: "bear-flex bear-gap-4", children: [
-            V.length > 0 && /* @__PURE__ */ d("div", { className: "bear-border-r bear-border-gray-200 dark:bear-border-zinc-700 bear-pr-3 bear-space-y-1 bear-min-w-[120px]", children: [
-              V.map((e) => /* @__PURE__ */ t("button", { type: "button", onClick: () => te(e.range()), className: $, children: e.label }, e.label)),
-              k && s.start && /* @__PURE__ */ t("button", { type: "button", onClick: re, className: p($, "bear-text-red-500"), children: "Clear" })
-            ] }),
-            /* @__PURE__ */ t(Z, { year: E, month: u, range: s, onDayClick: j, onNav: ae, minDate: x, maxDate: S }),
-            /* @__PURE__ */ t(Z, { year: ee, month: X, range: s, onDayClick: j, onNav: () => {
-            }, minDate: x, maxDate: S })
-          ] })
-        }
-      ),
-      document.body
+          /* @__PURE__ */ e($, { year: _, month: v, range: n, onDayClick: W, onNav: se, minDate: k, maxDate: m }),
+          /* @__PURE__ */ e($, { year: ae, month: re, range: n, onDayClick: W, onNav: () => {
+          }, minDate: k, maxDate: m })
+        ] })
+      }
     ),
-    l && /* @__PURE__ */ t("p", { className: me, children: l }),
-    !l && m && /* @__PURE__ */ t("p", { className: ue, children: m })
+    o && /* @__PURE__ */ e("p", { className: "bear-mt-1 bear-text-xs bear-text-red-500", children: o }),
+    !o && c && /* @__PURE__ */ e("p", { className: "bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500", children: c })
   ] });
 };
 export {
-  Pe as DateRangePicker
+  Ke as DateRangePicker
 };

package/dist/components/DateRangePicker/DateRangePicker.types.d.ts

@@ -1,4 +1,5 @@
 import { HTMLAttributes } from 'react';
+import { OverlayEffectProps } from '../../hooks';
 export interface DateRange {
     start: Date | null;
     end: Date | null;
@@ -7,7 +8,7 @@ export interface DateRangePreset {
     label: string;
     range: () => DateRange;
 }
-export interface DateRangePickerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+export interface DateRangePickerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>, OverlayEffectProps {
     id?: string;
     value?: DateRange;
     onChange?: (range: DateRange) => void;

package/dist/components/DateRangePicker/DateRangePicker.utils.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./DateRangePicker.const.cjs"),l=(t,e)=>!t||!e?!1:t.getFullYear()===e.getFullYear()&&t.getMonth()===e.getMonth()&&t.getDate()===e.getDate(),i=(t,e,n)=>{if(!e||!n)return!1;const s=t.getTime();return s>e.getTime()&&s<n.getTime()},u=t=>{if(!t)return"";const e=(t.getMonth()+1).toString().padStart(2,"0"),n=t.getDate().toString().padStart(2,"0");return`${e}/${n}/${t.getFullYear()}`},D=(t,e)=>{const n=new Date(t,e,1).getDay(),s=new Date(t,e+1,0).getDate(),g=o.CALENDAR_ROWS*o.DAYS_IN_WEEK,r=[];for(let a=0;a<n;a++)r.push(null);for(let a=1;a<=s;a++)r.push(new Date(t,e,a));for(;r.length<g;)r.push(null);return r};exports.formatDate=u;exports.getCalendarDays=D;exports.isInRange=i;exports.isSameDay=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../constants/numbers.const.cjs"),a=require("../../constants/generals.const.cjs"),l=(e,n)=>!e||!n?!1:e.getFullYear()===n.getFullYear()&&e.getMonth()===n.getMonth()&&e.getDate()===n.getDate(),T=(e,n,r)=>{if(!n||!r)return!1;const E=e.getTime();return E>n.getTime()&&E<r.getTime()},_=e=>{if(!e)return a.EMPTY_STRING;const n=(e.getMonth()+t.ONE).toString().padStart(t.DATE_PAD_LENGTH,a.DATE_PAD_CHAR),r=e.getDate().toString().padStart(t.DATE_PAD_LENGTH,a.DATE_PAD_CHAR);return`${n}${a.DATE_PART_SEPARATOR}${r}${a.DATE_PART_SEPARATOR}${e.getFullYear()}`},g=(e,n)=>{const r=new Date(e,n,t.ONE).getDay(),E=new Date(e,n+t.ONE,t.ZERO).getDate(),o=t.CALENDAR_ROWS*t.DAYS_IN_WEEK,D=[];for(let s=t.ZERO;s<r;s+=t.ONE)D.push(null);for(let s=t.ONE;s<=E;s+=t.ONE)D.push(new Date(e,n,s));for(;D.length<o;)D.push(null);return D},A=()=>{const e=new Date;return e.setHours(t.HOURS_MIDNIGHT,t.HOURS_MIDNIGHT,t.HOURS_MIDNIGHT,t.HOURS_MIDNIGHT),e},S=()=>{const e=A();return[{label:a.PRESET_LABEL_TODAY,range:()=>({start:new Date(e),end:new Date(e)})},{label:a.PRESET_LABEL_LAST_SEVEN,range:()=>{const n=new Date(e);return n.setDate(n.getDate()-t.LAST_SEVEN_DAYS_OFFSET),{start:n,end:new Date(e)}}},{label:a.PRESET_LABEL_LAST_THIRTY,range:()=>{const n=new Date(e);return n.setDate(n.getDate()-t.LAST_THIRTY_DAYS_OFFSET),{start:n,end:new Date(e)}}},{label:a.PRESET_LABEL_THIS_MONTH,range:()=>({start:new Date(e.getFullYear(),e.getMonth(),t.ONE),end:new Date(e)})},{label:a.PRESET_LABEL_LAST_MONTH,range:()=>{const n=new Date(e.getFullYear(),e.getMonth()-t.ONE,t.ONE),r=new Date(e.getFullYear(),e.getMonth(),t.ZERO);return{start:n,end:r}}}]},u=e=>e===t.LAST_MONTH_INDEX?{month:t.ZERO,yearDelta:t.ONE}:{month:e+t.ONE,yearDelta:t.ZERO};exports.formatDate=_;exports.getCalendarDays=g;exports.getDefaultPresets=S;exports.isInRange=T;exports.isSameDay=l;exports.resolveRightMonth=u;

package/dist/components/DateRangePicker/DateRangePicker.utils.d.ts

@@ -1,4 +1,10 @@
+import { DateRangePreset } from './DateRangePicker.types';
 export declare const isSameDay: (a: Date | null, b: Date | null) => boolean;
 export declare const isInRange: (day: Date, start: Date | null, end: Date | null) => boolean;
 export declare const formatDate: (d: Date | null) => string;
 export declare const getCalendarDays: (year: number, month: number) => (Date | null)[];
+export declare const getDefaultPresets: () => DateRangePreset[];
+export declare const resolveRightMonth: (leftMonth: number) => {
+    month: number;
+    yearDelta: number;
+};

package/dist/components/DateRangePicker/DateRangePicker.utils.js

@@ -1,22 +1,66 @@
-import { CALENDAR_ROWS as l, DAYS_IN_WEEK as g } from "./DateRangePicker.const.js";
-const i = (t, e) => !t || !e ? !1 : t.getFullYear() === e.getFullYear() && t.getMonth() === e.getMonth() && t.getDate() === e.getDate(), D = (t, e, n) => {
-  if (!e || !n) return !1;
-  const o = t.getTime();
-  return o > e.getTime() && o < n.getTime();
-}, c = (t) => {
-  if (!t) return "";
-  const e = (t.getMonth() + 1).toString().padStart(2, "0"), n = t.getDate().toString().padStart(2, "0");
-  return `${e}/${n}/${t.getFullYear()}`;
-}, f = (t, e) => {
-  const n = new Date(t, e, 1).getDay(), o = new Date(t, e + 1, 0).getDate(), s = l * g, a = [];
-  for (let r = 0; r < n; r++) a.push(null);
-  for (let r = 1; r <= o; r++) a.push(new Date(t, e, r));
-  for (; a.length < s; ) a.push(null);
-  return a;
-};
+import { LAST_SEVEN_DAYS_OFFSET as S, LAST_THIRTY_DAYS_OFFSET as u, ONE as n, ZERO as o, DATE_PAD_LENGTH as T, LAST_MONTH_INDEX as A, HOURS_MIDNIGHT as l, CALENDAR_ROWS as c, DAYS_IN_WEEK as L } from "../../constants/numbers.const.js";
+import { PRESET_LABEL_TODAY as R, PRESET_LABEL_LAST_SEVEN as i, PRESET_LABEL_LAST_THIRTY as w, PRESET_LABEL_THIS_MONTH as f, PRESET_LABEL_LAST_MONTH as h, EMPTY_STRING as Y, DATE_PAD_CHAR as g, DATE_PART_SEPARATOR as E } from "../../constants/generals.const.js";
+const O = (t, e) => !t || !e ? !1 : t.getFullYear() === e.getFullYear() && t.getMonth() === e.getMonth() && t.getDate() === e.getDate(), m = (t, e, a) => {
+  if (!e || !a)
+    return !1;
+  const D = t.getTime();
+  return D > e.getTime() && D < a.getTime();
+}, H = (t) => {
+  if (!t)
+    return Y;
+  const e = (t.getMonth() + n).toString().padStart(T, g), a = t.getDate().toString().padStart(T, g);
+  return `${e}${E}${a}${E}${t.getFullYear()}`;
+}, P = (t, e) => {
+  const a = new Date(t, e, n).getDay(), D = new Date(t, e + n, o).getDate(), _ = c * L, s = [];
+  for (let r = o; r < a; r += n)
+    s.push(null);
+  for (let r = n; r <= D; r += n)
+    s.push(new Date(t, e, r));
+  for (; s.length < _; )
+    s.push(null);
+  return s;
+}, d = () => {
+  const t = /* @__PURE__ */ new Date();
+  return t.setHours(l, l, l, l), t;
+}, F = () => {
+  const t = d();
+  return [
+    {
+      label: R,
+      range: () => ({ start: new Date(t), end: new Date(t) })
+    },
+    {
+      label: i,
+      range: () => {
+        const e = new Date(t);
+        return e.setDate(e.getDate() - S), { start: e, end: new Date(t) };
+      }
+    },
+    {
+      label: w,
+      range: () => {
+        const e = new Date(t);
+        return e.setDate(e.getDate() - u), { start: e, end: new Date(t) };
+      }
+    },
+    {
+      label: f,
+      range: () => ({ start: new Date(t.getFullYear(), t.getMonth(), n), end: new Date(t) })
+    },
+    {
+      label: h,
+      range: () => {
+        const e = new Date(t.getFullYear(), t.getMonth() - n, n), a = new Date(t.getFullYear(), t.getMonth(), o);
+        return { start: e, end: a };
+      }
+    }
+  ];
+}, I = (t) => t === A ? { month: o, yearDelta: n } : { month: t + n, yearDelta: o };
 export {
-  c as formatDate,
-  f as getCalendarDays,
-  D as isInRange,
-  i as isSameDay
+  H as formatDate,
+  P as getCalendarDays,
+  F as getDefaultPresets,
+  m as isInRange,
+  O as isSameDay,
+  I as resolveRightMonth
 };

package/dist/components/Dropdown/Dropdown.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),t=require("react"),E=require("../../utils/cn.cjs"),J=require("../../hooks/useClickOutside.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");require("../FormControl/FormControl.context.cjs");const Q=require("../Portal/Portal.cjs"),X=require("./Dropdown.const.cjs"),Y=({trigger:x,items:c,open:j,defaultOpen:m=!1,placement:i="bottom-start",offset:v=4,matchWidth:C=!1,minWidth:h=150,maxHeight:M=300,size:S="md",closeOnSelect:I=!0,closeOnClickOutside:g=!0,disabled:R=!1,onOpenChange:f,className:P,testId:W,...z})=>{const[A,U]=t.useState(m),[b,u]=t.useState(-1),[k,B]=t.useState({top:0,left:0,minWidth:h}),q=t.useRef(null),D=t.useRef(null),L=t.useRef(null),w=j!==void 0,n=w?j:A,p=t.useCallback(e=>{w||U(e),f==null||f(e)},[w,f]),F=t.useCallback(()=>{R||p(!n)},[R,n,p]),d=t.useCallback(()=>{p(!1),u(-1)},[p]),y=t.useCallback(e=>{var r;e.disabled||e.divider||e.header||((r=e.onClick)==null||r.call(e),I&&!e.items&&d())},[I,d]),T=t.useCallback(()=>{n&&g&&d()},[n,g,d]);J.useClickOutsideMultiple([q,D],T,{enabled:n&&g}),t.useEffect(()=>{if(!n)return;const e=c.filter(a=>!a.disabled&&!a.divider&&!a.header),r=a=>{switch(a.key){case"Escape":a.preventDefault(),d();break;case"ArrowDown":a.preventDefault(),u(o=>{const l=o+1;return l>=e.length?0:l});break;case"ArrowUp":a.preventDefault(),u(o=>{const l=o-1;return l<0?e.length-1:l});break;case"Enter":case" ":a.preventDefault(),b>=0&&b<e.length&&y(e[b]);break}};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[n,c,b,d,y]),t.useEffect(()=>{if(!n)return;const e=()=>{var N;const r=(N=L.current)==null?void 0:N.getBoundingClientRect();if(!r)return;const a=window.innerWidth,o=C?r.width:h,Z=i.endsWith("end")?r.right-o:i==="top"||i==="bottom"?r.left+r.width/2-o/2:r.left,G=Math.min(Math.max(8,Z),Math.max(8,a-o-8)),H=i.startsWith("top")?r.top-v:r.bottom+v;B({top:H,left:G,minWidth:o})};return e(),window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[n,C,h,i,v]),t.useEffect(()=>{n||u(-1)},[n]);const _=t.useMemo(()=>c.map((e,r)=>({item:e,index:r})).filter(({item:e})=>!e.disabled&&!e.divider&&!e.header),[c]),K=(e,r)=>{if(e.divider)return s.jsx("div",{className:"bear-my-1 bear-mx-2 bear-h-px",style:{backgroundColor:"var(--bear-border-default)"},role:"separator"},e.key);if(e.header)return s.jsx("div",{className:"bear-px-3 bear-py-1.5 bear-text-xs bear-font-semibold bear-uppercase bear-tracking-wider",style:{color:"var(--bear-text-muted)"},children:e.label},e.key);const a=_.findIndex(l=>l.index===r),o=b===a;return s.jsxs("button",{type:"button",role:"menuitem",disabled:e.disabled,onClick:()=>y(e),onMouseEnter:()=>u(a),className:E.cn("bear-w-full bear-flex bear-items-center bear-gap-2 bear-text-left bear-border-none bear-bg-transparent",X.SIZE_CLASSES[S],"bear-transition-colors bear-cursor-pointer",e.selected&&!e.danger&&"bear-bg-[var(--bear-bg-tertiary)] bear-text-[var(--bear-text-primary)]",o&&!e.danger&&"bear-bg-[var(--bear-bg-tertiary)]",e.danger&&"bear-text-red-600 dark:bear-text-red-400 hover:bear-bg-red-50 dark:hover:bear-bg-red-900/20",!e.danger&&!e.disabled&&"hover:bear-bg-[var(--bear-bg-tertiary)]",e.disabled&&"bear-opacity-50 bear-cursor-not-allowed bear-pointer-events-none"),style:e.disabled?{color:"var(--bear-text-muted)"}:e.danger?void 0:{color:"var(--bear-text-secondary)"},children:[e.icon&&s.jsx("span",{className:"bear-flex-shrink-0 bear-w-5 bear-h-5 bear-flex bear-items-center bear-justify-center",children:e.icon}),s.jsx("span",{className:"bear-flex-1",children:e.label}),e.trailing&&s.jsx("span",{className:"bear-flex-shrink-0",style:{color:"var(--bear-text-muted)"},children:e.trailing}),e.items&&s.jsx("svg",{className:"bear-w-4 bear-h-4 bear-flex-shrink-0",style:{color:"var(--bear-text-muted)"},viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:s.jsx("polyline",{points:"9 18 15 12 9 6"})})]},e.key)},V=t.isValidElement(x)?t.cloneElement(x,{onClick:F,ref:L,"aria-expanded":n,"aria-haspopup":!0}):x;return s.jsxs("div",{ref:q,className:E.cn("bear-relative bear-inline-block",P),"data-testid":W,...z,children:[V,n&&s.jsx(Q.Portal,{children:s.jsx("div",{ref:D,role:"menu",className:E.cn("bear-fixed","bear-border bear-rounded-lg bear-shadow-lg","bear-py-1 bear-overflow-y-auto","bear-duration-100"),style:{backgroundColor:"var(--bear-bg-primary)",borderColor:"var(--bear-border-default)",minWidth:k.minWidth,maxHeight:M,top:k.top,left:k.left,zIndex:11e3},children:c.map((e,r)=>K(e,r))})})]})};exports.Dropdown=Y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("react"),C=require("../../utils/cn.cjs"),V=require("../../hooks/useClickOutside.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const J=require("../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.cjs"),Q=require("../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.utils.cjs");require("../FormControl/FormControl.context.cjs");const Y=require("../OverlayPortal/OverlayPortal.cjs"),u=require("./Dropdown.const.cjs"),$=k=>{const{trigger:x,items:c,open:E,defaultOpen:I=!1,placement:v="bottom-start",offset:N=u.DROPDOWN_DEFAULT_OFFSET_PX,matchWidth:P=!1,minWidth:R=u.DROPDOWN_DEFAULT_MIN_WIDTH_PX,maxHeight:j=u.DROPDOWN_DEFAULT_MAX_HEIGHT_PX,size:q="md",closeOnSelect:O=!0,closeOnClickOutside:h=!0,disabled:D=!1,onOpenChange:f,className:S,testId:A,openEffect:ee,closeEffect:re,effect:ae,...F}=k,{openEffect:W,closeEffect:T}=Q.resolveOverlayEffects(k),[L,M]=r.useState(I),[d,i]=r.useState(-1),_=r.useRef(null),m=r.useRef(null),w=r.useRef(null),g=E!==void 0,a=g?E:L,X=v==="left"||v==="right"?"bottom-start":v,{style:H,ready:U}=J.useFixedAnchorPosition({anchorRef:w,open:a,offsetPx:N,placement:X,matchWidth:P,minWidthPx:R}),p=r.useCallback(e=>{g||M(e),f==null||f(e)},[g,f]),z=r.useCallback(()=>{D||p(!a)},[D,a,p]),l=r.useCallback(()=>{p(!1),i(-1)},[p]),y=r.useCallback(e=>{var n;e.disabled||e.divider||e.header||((n=e.onClick)==null||n.call(e),O&&!e.items&&l())},[O,l]),Z=r.useCallback(()=>{a&&h&&l()},[a,h,l]);V.useClickOutsideMultiple([_,m],Z,{enabled:a&&h}),r.useEffect(()=>{if(!a)return;const e=c.filter(t=>!t.disabled&&!t.divider&&!t.header),n=t=>{switch(t.key){case"Escape":t.preventDefault(),l();break;case"ArrowDown":t.preventDefault(),i(b=>{const o=b+1;return o>=e.length?0:o});break;case"ArrowUp":t.preventDefault(),i(b=>{const o=b-1;return o<0?e.length-1:o});break;case"Enter":case" ":t.preventDefault(),d>=0&&d<e.length&&y(e[d]);break}};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[a,c,d,l,y]),r.useEffect(()=>{a||i(-1)},[a]);const B=r.useMemo(()=>c.map((e,n)=>({item:e,index:n})).filter(({item:e})=>!e.disabled&&!e.divider&&!e.header),[c]),G=(e,n)=>{if(e.divider)return s.jsx("div",{className:"bear-my-1 bear-mx-2 bear-h-px",style:{backgroundColor:"var(--bear-border-default)"},role:"separator"},e.key);if(e.header)return s.jsx("div",{className:"bear-px-3 bear-py-1.5 bear-text-xs bear-font-semibold bear-uppercase bear-tracking-wider",style:{color:"var(--bear-text-muted)"},children:e.label},e.key);const t=B.findIndex(o=>o.index===n),b=d===t;return s.jsxs("button",{type:"button",role:"menuitem",disabled:e.disabled,onClick:()=>y(e),onMouseEnter:()=>i(t),className:C.cn("bear-w-full bear-flex bear-items-center bear-gap-2 bear-text-left bear-border-none bear-bg-transparent",u.SIZE_CLASSES[q],"bear-transition-colors bear-cursor-pointer",e.selected&&!e.danger&&"bear-bg-[var(--bear-bg-tertiary)] bear-text-[var(--bear-text-primary)]",b&&!e.danger&&"bear-bg-[var(--bear-bg-tertiary)]",e.danger&&"bear-text-red-600 dark:bear-text-red-400 hover:bear-bg-red-50 dark:hover:bear-bg-red-900/20",!e.danger&&!e.disabled&&"hover:bear-bg-[var(--bear-bg-tertiary)]",e.disabled&&"bear-opacity-50 bear-cursor-not-allowed bear-pointer-events-none"),style:e.disabled?{color:"var(--bear-text-muted)"}:e.danger?void 0:{color:"var(--bear-text-secondary)"},children:[e.icon&&s.jsx("span",{className:"bear-flex-shrink-0 bear-w-5 bear-h-5 bear-flex bear-items-center bear-justify-center",children:e.icon}),s.jsx("span",{className:"bear-flex-1",children:e.label}),e.trailing&&s.jsx("span",{className:"bear-flex-shrink-0",style:{color:"var(--bear-text-muted)"},children:e.trailing}),e.items&&s.jsx("svg",{className:"bear-w-4 bear-h-4 bear-flex-shrink-0",style:{color:"var(--bear-text-muted)"},viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:s.jsx("polyline",{points:"9 18 15 12 9 6"})})]},e.key)},K=r.isValidElement(x)?r.cloneElement(x,{onClick:z,ref:w,"aria-expanded":a,"aria-haspopup":!0}):x;return s.jsxs("div",{ref:_,className:C.cn("bear-relative bear-inline-block",S),"data-testid":A,...F,children:[K,s.jsx(Y.OverlayPortal,{open:a,ready:U,style:{...H,backgroundColor:"var(--bear-bg-primary)",borderColor:"var(--bear-border-default)",maxHeight:j},zIndex:u.DROPDOWN_Z_INDEX,openEffect:W,closeEffect:T,panelRef:m,className:"bear-border bear-rounded-lg bear-shadow-lg bear-py-1 bear-overflow-y-auto",attributes:{role:"menu"},children:c.map((e,n)=>G(e,n))})]})};exports.Dropdown=$;

package/dist/components/Dropdown/Dropdown.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={xs:"bear-text-xs bear-py-1 bear-px-2",sm:"bear-text-sm bear-py-1.5 bear-px-3",md:"bear-text-sm bear-py-2 bear-px-3",lg:"bear-text-base bear-py-2.5 bear-px-4",xl:"bear-text-lg bear-py-3 bear-px-5"};exports.SIZE_CLASSES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=11e3,_=150,D=300,t=4,r={xs:"bear-text-xs bear-py-1 bear-px-2",sm:"bear-text-sm bear-py-1.5 bear-px-3",md:"bear-text-sm bear-py-2 bear-px-3",lg:"bear-text-base bear-py-2.5 bear-px-4",xl:"bear-text-lg bear-py-3 bear-px-5"};exports.DROPDOWN_DEFAULT_MAX_HEIGHT_PX=D;exports.DROPDOWN_DEFAULT_MIN_WIDTH_PX=_;exports.DROPDOWN_DEFAULT_OFFSET_PX=t;exports.DROPDOWN_Z_INDEX=e;exports.SIZE_CLASSES=r;

package/dist/components/Dropdown/Dropdown.const.d.ts

@@ -1,3 +1,7 @@
+export declare const DROPDOWN_Z_INDEX = 11000;
+export declare const DROPDOWN_DEFAULT_MIN_WIDTH_PX = 150;
+export declare const DROPDOWN_DEFAULT_MAX_HEIGHT_PX = 300;
+export declare const DROPDOWN_DEFAULT_OFFSET_PX = 4;
 export declare const SIZE_CLASSES: {
     readonly xs: "bear-text-xs bear-py-1 bear-px-2";
     readonly sm: "bear-text-sm bear-py-1.5 bear-px-3";

package/dist/components/Dropdown/Dropdown.const.js

@@ -1,4 +1,4 @@
-const e = {
+const e = 11e3, a = 150, b = 300, r = 4, t = {
   xs: "bear-text-xs bear-py-1 bear-px-2",
   sm: "bear-text-sm bear-py-1.5 bear-px-3",
   md: "bear-text-sm bear-py-2 bear-px-3",
@@ -6,5 +6,9 @@ const e = {
   xl: "bear-text-lg bear-py-3 bear-px-5"
 };
 export {
-  e as SIZE_CLASSES
+  b as DROPDOWN_DEFAULT_MAX_HEIGHT_PX,
+  a as DROPDOWN_DEFAULT_MIN_WIDTH_PX,
+  r as DROPDOWN_DEFAULT_OFFSET_PX,
+  e as DROPDOWN_Z_INDEX,
+  t as SIZE_CLASSES
 };