@forgedevstack/bear 1.3.0 → 1.3.2

package/dist/components/DatePicker/DatePicker.js

@@ -1,130 +1,133 @@
-import { jsxs as y, jsx as t } from "react/jsx-runtime";
-import { useState as p, useRef as z, useEffect as h, useCallback as f } from "react";
-import { createPortal as X } from "react-dom";
-import { Calendar as Z } from "../Calendar/Calendar.js";
-import { cn as B } from "../../utils/cn.js";
-import { useBearStyles as $ } from "../../hooks/useBearStyles.js";
+import { jsxs as D, jsx as t } from "react/jsx-runtime";
+import { useState as A, useRef as b, useCallback as n } from "react";
+import { Calendar as G } from "../Calendar/Calendar.js";
+import { CalendarIcon as Y } from "@forgedevstack/bear-icons";
+import { OverlayPortal as q } from "../OverlayPortal/OverlayPortal.js";
+import { cn as R } from "../../utils/cn.js";
+import { useClickOutsideMultiple as J } from "../../hooks/useClickOutside.js";
+import { useBearStyles as Q } from "../../hooks/useBearStyles.js";
 import "../../hooks/useBearComponent/useBearComponent.js";
 import "../../context/BearProvider.js";
+import { useFixedAnchorPosition as ee } from "../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.js";
+import { resolveOverlayEffects as te } from "../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.utils.js";
 import "../FormControl/FormControl.context.js";
-import { formatDate as C } from "./DatePicker.utils.js";
-const be = ({
-  value: o,
-  onChange: r,
-  minDate: _,
-  maxDate: v,
-  disabled: l = !1,
-  placeholder: P = "Select date",
-  label: u,
-  error: i,
-  helperText: k,
-  format: N = "MM/DD/YYYY",
-  clearable: g = !0,
-  className: S,
-  style: V,
-  bis: j,
-  showWeekNumbers: H = !1,
-  disabledDates: L = [],
-  highlightedDates: M = [],
-  slots: O,
-  weekdayLabels: R,
-  firstDayOfWeek: Y = 0,
-  size: E = "md",
-  variant: A = "default",
-  icon: I
-}) => {
-  const [n, s] = p(!1), [T, W] = p(o ?? /* @__PURE__ */ new Date()), [w, q] = p({ top: 0, left: 0 }), x = z(null), b = z(null), D = $(j, V);
-  h(() => {
-    if (n && b.current) {
-      const e = b.current.getBoundingClientRect(), c = 8, a = 360, U = window.innerHeight - e.bottom < a && e.top > a;
-      q({
-        top: U ? e.top - a - c : e.bottom + c,
-        left: e.left
-      });
-    }
-  }, [n]), h(() => {
-    const e = (c) => {
-      var d, m;
-      const a = c.target;
-      (d = x.current) != null && d.contains(a) || (m = a.closest) != null && m.call(a, "[data-bear-datepicker-calendar]") || s(!1);
-    };
-    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, []);
-  const F = f(
-    (e) => {
-      r == null || r(e), s(!1);
+import { formatDate as re } from "./DatePicker.utils.js";
+import { DATEPICKER_DEFAULT_PLACEHOLDER as ae, DATEPICKER_DEFAULT_FORMAT as le, DATEPICKER_DEFAULT_FIRST_DAY as se, DATEPICKER_DROPDOWN_HEIGHT_PX as oe, D_A_T_E_P_I_C_K_E_R_ROOT_CLASS as r, DATEPICKER_VARIANT_CLASSES as ne, DATEPICKER_SIZE_CLASSES as ie, DATEPICKER_DROPDOWN_Z_INDEX as ce, DATEPICKER_CALENDAR_ATTR as be } from "./DatePicker.const.js";
+const Ie = (m) => {
+  const {
+    value: a,
+    onChange: e,
+    minDate: h,
+    maxDate: x,
+    disabled: i = !1,
+    placeholder: T = ae,
+    label: d,
+    error: s,
+    helperText: f,
+    format: y = le,
+    clearable: C = !0,
+    className: I,
+    style: P,
+    bis: w,
+    showWeekNumbers: N = !1,
+    disabledDates: S = [],
+    highlightedDates: O = [],
+    slots: k,
+    weekdayLabels: v,
+    firstDayOfWeek: L = se,
+    size: K = "md",
+    variant: z = "default",
+    icon: $,
+    testId: F
+  } = m, { openEffect: g, closeEffect: j } = te(m), [o, l] = A(!1), [H, V] = A(a ?? /* @__PURE__ */ new Date()), _ = b(null), p = b(null), u = b(null), E = Q(w, P), { style: W, ready: U } = ee({
+    anchorRef: p,
+    open: o,
+    estimatedHeightPx: oe
+  }), B = n(() => l(!1), []);
+  J([_, u], B, { enabled: o });
+  const M = n(
+    (c) => {
+      e == null || e(c), l(!1);
     },
-    [r]
-  ), G = f(() => {
-    r == null || r(null), s(!1);
-  }, [r]), J = f((e) => {
-    W(e);
-  }, []), K = { sm: "bear-py-1.5 bear-px-3 bear-text-sm", md: "bear-py-2 bear-px-4", lg: "bear-py-2.5 bear-px-5 bear-text-lg" }, Q = {
-    default: "bear-bg-white dark:bear-bg-zinc-800 bear-border-zinc-300 dark:bear-border-zinc-600",
-    filled: "bear-bg-zinc-100 dark:bear-bg-zinc-700 bear-border-transparent",
-    outline: "bear-bg-transparent bear-border-zinc-400 dark:bear-border-zinc-500"
-  };
-  return /* @__PURE__ */ y("div", { ref: x, className: B("Bear-DatePicker bear-relative", S), style: Object.keys(D).length ? D : void 0, children: [
-    u && /* @__PURE__ */ t("label", { className: "Bear-DatePicker__label bear-block bear-text-sm bear-font-medium bear-text-zinc-700 dark:bear-text-zinc-300 bear-mb-1.5", children: u }),
-    /* @__PURE__ */ y(
-      "button",
-      {
-        ref: b,
-        type: "button",
-        onClick: () => !l && s(!n),
-        disabled: l,
-        className: B(
-          "Bear-DatePicker__trigger bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-text-left bear-transition-colors",
-          K[E],
-          Q[A],
-          i ? "bear-border-red-500" : "focus:bear-border-primary-500",
-          l && "bear-opacity-50 bear-cursor-not-allowed",
-          o ? "bear-text-zinc-900 dark:bear-text-white" : "bear-text-zinc-500"
+    [e]
+  ), X = n(() => {
+    e == null || e(null), l(!1);
+  }, [e]), Z = n((c) => {
+    V(c);
+  }, []);
+  return /* @__PURE__ */ D(
+    "div",
+    {
+      ref: _,
+      className: R(r, "bear-relative", I),
+      style: Object.keys(E).length ? E : void 0,
+      "data-testid": F,
+      children: [
+        d && /* @__PURE__ */ t("label", { className: `${r}__label bear-block bear-text-sm bear-font-medium bear-text-zinc-700 dark:bear-text-zinc-300 bear-mb-1.5`, children: d }),
+        /* @__PURE__ */ D(
+          "button",
+          {
+            ref: p,
+            type: "button",
+            onClick: () => !i && l(!o),
+            disabled: i,
+            className: R(
+              `${r}__trigger bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-text-left bear-transition-colors`,
+              ie[K],
+              ne[z],
+              s ? "bear-border-red-500" : "focus:bear-border-primary-500",
+              i && "bear-opacity-50 bear-cursor-not-allowed",
+              a ? "bear-text-zinc-900 dark:bear-text-white" : "bear-text-zinc-500"
+            ),
+            children: [
+              /* @__PURE__ */ t("span", { className: `${r}__value`, children: a ? re(a, y) : T }),
+              /* @__PURE__ */ t("span", { className: `${r}__icon`, children: $ ?? /* @__PURE__ */ t(Y, { className: "bear-w-5 bear-h-5 bear-text-zinc-400 bear-shrink-0" }) })
+            ]
+          }
         ),
-        children: [
-          /* @__PURE__ */ t("span", { className: "Bear-DatePicker__value", children: o ? C(o, N) : P }),
-          /* @__PURE__ */ t("span", { className: "Bear-DatePicker__icon", children: I ?? /* @__PURE__ */ t("svg", { className: "bear-w-5 bear-h-5 bear-text-zinc-400 bear-shrink-0", 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" }) }) })
-        ]
-      }
-    ),
-    i && /* @__PURE__ */ t("p", { className: "Bear-DatePicker__error bear-mt-1 bear-text-xs bear-text-red-400", children: i }),
-    k && !i && /* @__PURE__ */ t("p", { className: "Bear-DatePicker__helper bear-mt-1 bear-text-xs bear-text-zinc-500", children: k }),
-    n && typeof document < "u" && X(
-      /* @__PURE__ */ t(
-        "div",
-        {
-          "data-bear-datepicker-calendar": !0,
-          className: "Bear-DatePicker__dropdown bear-fixed bear-z-[9999]",
-          style: { top: w.top, left: w.left },
-          children: /* @__PURE__ */ t(
-            Z,
-            {
-              viewDate: T,
-              onViewChange: J,
-              value: o ?? null,
-              onSelect: F,
-              minDate: _,
-              maxDate: v,
-              disabledDates: L,
-              highlightedDates: M,
-              slots: O,
-              weekdayLabels: R,
-              firstDayOfWeek: Y,
-              showWeekNumbers: H,
-              clearable: g,
-              onClear: G,
-              showTodayButton: !0,
-              onToday: () => {
-                r == null || r(/* @__PURE__ */ new Date()), s(!1);
+        s && /* @__PURE__ */ t("p", { className: `${r}__error bear-mt-1 bear-text-xs bear-text-red-400`, children: s }),
+        f && !s && /* @__PURE__ */ t("p", { className: `${r}__helper bear-mt-1 bear-text-xs bear-text-zinc-500`, children: f }),
+        /* @__PURE__ */ t(
+          q,
+          {
+            open: o,
+            ready: U,
+            style: W,
+            zIndex: ce,
+            openEffect: g,
+            closeEffect: j,
+            className: `${r}__dropdown`,
+            panelRef: u,
+            attributes: { [be]: "" },
+            children: /* @__PURE__ */ t(
+              G,
+              {
+                viewDate: H,
+                onViewChange: Z,
+                value: a ?? null,
+                onSelect: M,
+                minDate: h,
+                maxDate: x,
+                disabledDates: S,
+                highlightedDates: O,
+                slots: k,
+                weekdayLabels: v,
+                firstDayOfWeek: L,
+                showWeekNumbers: N,
+                clearable: C,
+                onClear: X,
+                showTodayButton: !0,
+                onToday: () => {
+                  e == null || e(/* @__PURE__ */ new Date()), l(!1);
+                }
               }
-            }
-          )
-        }
-      ),
-      document.body
-    )
-  ] });
+            )
+          }
+        )
+      ]
+    }
+  );
 };
 export {
-  be as DatePicker
+  Ie as DatePicker
 };

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

@@ -1,7 +1,8 @@
 import { ReactNode } from 'react';
 import { CalendarSlots } from '../Calendar/Calendar.types';
-import { BisProp } from '../../types/bis.types';
-export interface DatePickerProps {
+import { BisProp } from '../../types';
+import { OverlayEffectProps } from '../../hooks/useFixedAnchorPosition';
+export interface DatePickerProps extends OverlayEffectProps {
     testId?: string;
     id?: string;
     value?: Date | null;
@@ -32,6 +33,5 @@ export interface DatePickerProps {
     firstDayOfWeek?: number;
     size?: 'sm' | 'md' | 'lg';
     variant?: 'default' | 'filled' | 'outline';
-    /** Custom icon to replace the default calendar icon (ReactNode). */
     icon?: ReactNode;
 }

package/dist/components/DateRangePicker/DateRangePicker.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),te=require("react-dom"),x=require("../../utils/cn.cjs"),r=require("./DateRangePicker.const.cjs"),u=require("./DateRangePicker.utils.cjs"),I=({year:L,month:b,range:a,onDayClick:k,onNav:A,minDate:S,maxDate:v})=>{const C=u.getCalendarDays(L,b),p=new Date;return p.setHours(0,0,0,0),e.jsxs("div",{className:"bear-w-64",children:[e.jsxs("div",{className:r.CALENDAR_HEADER_CLASSES,children:[e.jsx("button",{type:"button",onClick:()=>A(-1),className:r.NAV_BTN_CLASSES,"aria-label":"Previous month",children:e.jsx("svg",{className:"bear-w-4 bear-h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 19l-7-7 7-7"})})}),e.jsxs("span",{className:"bear-text-sm bear-font-semibold bear-text-gray-900 dark:bear-text-white",children:[r.MONTH_LABELS[b]," ",L]}),e.jsx("button",{type:"button",onClick:()=>A(1),className:r.NAV_BTN_CLASSES,"aria-label":"Next month",children:e.jsx("svg",{className:"bear-w-4 bear-h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})})})]}),e.jsx("div",{className:"bear-grid bear-grid-cols-7 bear-gap-0.5 bear-mb-1",children:r.DAY_LABELS.map(n=>e.jsx("div",{className:"bear-text-xs bear-text-center bear-font-medium bear-text-gray-400 dark:bear-text-zinc-500 bear-py-1",children:n},n))}),e.jsx("div",{className:"bear-grid bear-grid-cols-7 bear-gap-0.5",children:C.map((n,_)=>{if(!n)return e.jsx("div",{},`e-${_}`);const f=S&&n<S||v&&n>v,i=u.isSameDay(n,a.start)||u.isSameDay(n,a.end),m=u.isInRange(n,a.start,a.end),D=u.isSameDay(n,p);return e.jsx("button",{type:"button",disabled:!!f,onClick:()=>k(n),className:x.cn(r.DAY_BASE_CLASSES,f?r.DAY_DISABLED_CLASSES:r.DAY_HOVER_CLASSES,i&&r.DAY_SELECTED_CLASSES,!i&&m&&r.DAY_IN_RANGE_CLASSES,!i&&!m&&D&&r.DAY_TODAY_CLASSES,!i&&!m&&!f&&"bear-text-gray-700 dark:bear-text-zinc-300"),children:n.getDate()},n.getTime())})})]})},re=L=>{const{value:b,onChange:a,label:k,placeholder:A="Select date range",disabled:S=!1,clearable:v=!0,minDate:C,maxDate:p,presets:n,showPresets:_=!0,size:f="md",error:i,helperText:m,className:D,testId:q,...V}=L,[N,R]=s.useState(!1),[M,W]=s.useState({top:0,left:0}),[c,E]=s.useState(b??{start:null,end:null}),[T,j]=s.useState("start"),B=s.useRef(null),y=s.useRef(null),Y=s.useRef(null),z=new Date,[h,$]=s.useState(z.getMonth()),[g,G]=s.useState(z.getFullYear()),F=h===11?0:h+1,Z=h===11?g+1:g;s.useEffect(()=>{b&&E(b)},[b]),s.useEffect(()=>{if(!N||!y.current)return;const t=8,o=420,l=()=>{const d=y.current.getBoundingClientRect(),w=window.innerHeight;let P=w-d.bottom<o&&d.top>o?d.top-o-t:d.bottom+t;P=Math.max(8,Math.min(P,w-o-8));const X=Math.min(640,window.innerWidth-16);let ee=Math.max(8,Math.min(d.left,window.innerWidth-X-8));W({top:P,left:ee})};return l(),window.addEventListener("resize",l),window.addEventListener("scroll",l,!0),()=>{window.removeEventListener("resize",l),window.removeEventListener("scroll",l,!0)}},[N]),s.useEffect(()=>{const t=o=>{var d,w;const l=o.target;(d=B.current)!=null&&d.contains(l)||(w=Y.current)!=null&&w.contains(l)||R(!1)};return document.addEventListener("mousedown",t),()=>document.removeEventListener("mousedown",t)},[]);const H=s.useCallback(t=>{if(T==="start")E({start:t,end:null}),j("end");else{const o=t>=(c.start??t)?{start:c.start,end:t}:{start:t,end:c.start};E(o),j("start"),a==null||a(o)}},[T,c.start,a]),J=s.useCallback(t=>{E(t),a==null||a(t),R(!1),j("start")},[a]),K=s.useCallback(()=>{const t={start:null,end:null};E(t),a==null||a(t),j("start")},[a]),Q=s.useCallback(t=>{let o=h+t,l=g;o<0&&(o=11,l--),o>11&&(o=0,l++),$(o),G(l)},[h,g]),O=n??(_?r.getDefaultPresets():[]),U=c.start?`${u.formatDate(c.start)}${c.end?` – ${u.formatDate(c.end)}`:""}`:A;return e.jsxs("div",{ref:B,className:x.cn(r.ROOT_CLASSES,D),"data-testid":q,...V,children:[k&&e.jsx("label",{className:r.LABEL_CLASSES,children:k}),e.jsxs("button",{ref:y,type:"button",disabled:S,onClick:()=>!S&&R(!N),className:x.cn(r.TRIGGER_CLASSES,r.SIZE_CLASSES[f],S&&"bear-opacity-50 bear-cursor-not-allowed"),children:[e.jsx("span",{className:x.cn(!c.start&&"bear-text-gray-400 dark:bear-text-zinc-500"),children:U}),e.jsx("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:e.jsx("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"})})]}),N&&typeof document<"u"&&te.createPortal(e.jsx("div",{ref:Y,"data-bear-daterangepicker-dropdown":!0,className:x.cn("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"),style:{top:M.top,left:M.left},children:e.jsxs("div",{className:"bear-flex bear-gap-4",children:[O.length>0&&e.jsxs("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:[O.map(t=>e.jsx("button",{type:"button",onClick:()=>J(t.range()),className:r.PRESET_BTN_CLASSES,children:t.label},t.label)),v&&c.start&&e.jsx("button",{type:"button",onClick:K,className:x.cn(r.PRESET_BTN_CLASSES,"bear-text-red-500"),children:"Clear"})]}),e.jsx(I,{year:g,month:h,range:c,onDayClick:H,onNav:Q,minDate:C,maxDate:p}),e.jsx(I,{year:Z,month:F,range:c,onDayClick:H,onNav:()=>{},minDate:C,maxDate:p})]})}),document.body),i&&e.jsx("p",{className:r.ERROR_CLASSES,children:i}),!i&&m&&e.jsx("p",{className:r.HELPER_CLASSES,children:m})]})};exports.DateRangePicker=re;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),O=require("../../utils/cn.cjs"),ae=require("../../hooks/useClickOutside.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const n=require("../../constants/numbers.const.cjs"),c=require("../../constants/generals.const.cjs"),te=require("../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.cjs"),se=require("../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.utils.cjs");require("../FormControl/FormControl.context.cjs");const ne=require("@forgedevstack/bear-icons"),be=require("../OverlayPortal/OverlayPortal.cjs"),m=require("./DateRangePicker.const.cjs"),o=require("./DateRangePicker.utils.cjs"),q=({year:g,month:d,range:r,onDayClick:p,onNav:y,minDate:u,maxDate:N})=>{const E=o.getCalendarDays(g,d),h=new Date;return h.setHours(n.HOURS_MIDNIGHT,n.HOURS_MIDNIGHT,n.HOURS_MIDNIGHT,n.HOURS_MIDNIGHT),e.jsxs("div",{className:"bear-w-64",children:[e.jsxs("div",{className:"bear-flex bear-items-center bear-justify-between bear-mb-2",children:[e.jsx("button",{type:"button",onClick:()=>y(n.NEGATIVE_ONE),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:e.jsx("svg",{className:"bear-w-4 bear-h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 19l-7-7 7-7"})})}),e.jsxs("span",{className:"bear-text-sm bear-font-semibold bear-text-gray-900 dark:bear-text-white",children:[m.MONTH_LABELS[d]," ",g]}),e.jsx("button",{type:"button",onClick:()=>y(n.ONE),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:e.jsx("svg",{className:"bear-w-4 bear-h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})})})]}),e.jsx("div",{className:"bear-grid bear-grid-cols-7 bear-gap-0.5 bear-mb-1",children:m.DAY_LABELS.map(t=>e.jsx("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))}),e.jsx("div",{className:"bear-grid bear-grid-cols-7 bear-gap-0.5",children:E.map((t,j)=>{if(!t)return e.jsx("div",{},`e-${j}`);const f=u&&t<u||N&&t>N,l=o.isSameDay(t,r.start)||o.isSameDay(t,r.end),x=o.isInRange(t,r.start,r.end),T=o.isSameDay(t,h);return e.jsx("button",{type:"button",disabled:!!f,onClick:()=>p(t),className:O.cn("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",l&&"bear-bg-primary-500 bear-text-white",!l&&x&&"bear-bg-primary-100 dark:bear-bg-primary-900/30 bear-text-primary-800 dark:bear-text-primary-200",!l&&!x&&T&&"bear-ring-1 bear-ring-primary-400",!l&&!x&&!f&&"bear-text-gray-700 dark:bear-text-zinc-300"),children:t.getDate()},t.getTime())})})]})},oe=g=>{const{value:d,onChange:r,label:p,placeholder:y=c.PLACEHOLDER_SELECT_DATE_RANGE,disabled:u=c.BOOLEAN_FALSE,clearable:N=c.BOOLEAN_TRUE,minDate:E,maxDate:h,presets:t,showPresets:j=c.BOOLEAN_TRUE,size:f=c.SIZE_MD,error:l,helperText:x,className:T,testId:G,openEffect:le,closeEffect:ie,effect:ce,...B}=g,{openEffect:W,closeEffect:U}=se.resolveOverlayEffects(g),[R,w]=s.useState(!1),[b,k]=s.useState(d??{start:null,end:null}),[A,_]=s.useState(c.PICKING_START),P=s.useRef(null),I=s.useRef(null),L=s.useRef(null),{style:Y,ready:Z}=te.useFixedAnchorPosition({anchorRef:I,open:R,estimatedHeightPx:m.DATERANGE_DROPDOWN_HEIGHT_PX}),C=new Date,[D,F]=s.useState(C.getMonth()),[v,X]=s.useState(C.getFullYear()),M=o.resolveRightMonth(D),$=M.month,V=v+M.yearDelta;s.useEffect(()=>{d&&k(d)},[d]);const K=s.useCallback(()=>w(!1),[]);ae.useClickOutsideMultiple([P,L],K,{enabled:R});const z=s.useCallback(a=>{if(A==="start")k({start:a,end:null}),_("end");else{const i=a>=(b.start??a)?{start:b.start,end:a}:{start:a,end:b.start};k(i),_("start"),r==null||r(i)}},[A,b.start,r]),J=s.useCallback(a=>{k(a),r==null||r(a),w(!1),_("start")},[r]),Q=s.useCallback(()=>{const a={start:null,end:null};k(a),r==null||r(a),_("start")},[r]),ee=s.useCallback(a=>{let i=D+a,S=v;i<n.ZERO&&(i=n.LAST_MONTH_INDEX,S-=n.ONE),i>n.LAST_MONTH_INDEX&&(i=n.ZERO,S+=n.ONE),F(i),X(S)},[D,v]),H=t??(j?o.getDefaultPresets():[]),re=b.start?`${o.formatDate(b.start)}${b.end?` – ${o.formatDate(b.end)}`:""}`:y;return e.jsxs("div",{ref:P,className:O.cn("Bear-DateRangePicker bear-relative bear-inline-block",T),"data-testid":G,...B,children:[p&&e.jsx("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:p}),e.jsxs("button",{ref:I,type:"button",disabled:u,onClick:()=>!u&&w(!R),className:O.cn("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",m.SIZE_CLASSES[f],u&&"bear-opacity-50 bear-cursor-not-allowed"),children:[e.jsx("span",{className:O.cn(!b.start&&"bear-text-gray-400 dark:bear-text-zinc-500"),children:re}),e.jsx(ne.CalendarIcon,{className:"bear-w-4 bear-h-4 bear-ml-2 bear-text-gray-400"})]}),e.jsx(be.OverlayPortal,{open:R,ready:Z,style:Y,zIndex:m.DATERANGE_DROPDOWN_Z_INDEX,openEffect:W,closeEffect:U,panelRef:L,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:{[m.DATERANGE_DROPDOWN_ATTR]:c.EMPTY_STRING},children:e.jsxs("div",{className:"bear-flex bear-gap-4",children:[H.length>n.ZERO&&e.jsxs("div",{className:"bear-border-r bear-border-gray-200 dark:bear-border-zinc-700 bear-pr-3 bear-space-y-1",style:{minWidth:n.PRESET_SIDEBAR_MIN_WIDTH_PX},children:[H.map(a=>e.jsx("button",{type:"button",onClick:()=>J(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)),N&&b.start&&e.jsx("button",{type:"button",onClick:Q,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:c.LABEL_CLEAR})]}),e.jsx(q,{year:v,month:D,range:b,onDayClick:z,onNav:ee,minDate:E,maxDate:h}),e.jsx(q,{year:V,month:$,range:b,onDayClick:z,onNav:()=>{},minDate:E,maxDate:h})]})}),l&&e.jsx("p",{className:"bear-mt-1 bear-text-xs bear-text-red-500",children:l}),!l&&x&&e.jsx("p",{className:"bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500",children:x})]})};exports.DateRangePicker=oe;

package/dist/components/DateRangePicker/DateRangePicker.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=7,b=6,S=["Su","Mo","Tu","We","Th","Fr","Sa"],n=["January","February","March","April","May","June","July","August","September","October","November","December"],E={sm:"bear-py-1.5 bear-px-3 bear-text-sm",md:"bear-py-2 bear-px-4 bear-text-base",lg:"bear-py-2.5 bear-px-5 bear-text-lg"},o="Bear-DateRangePicker bear-relative bear-inline-block",A="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",s="bear-flex bear-items-center bear-justify-between bear-mb-2",_="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",L="bear-w-8 bear-h-8 bear-text-sm bear-rounded-full bear-transition-colors bear-cursor-pointer",c="bear-bg-primary-500 bear-text-white",D="bear-bg-primary-100 dark:bear-bg-primary-900/30 bear-text-primary-800 dark:bear-text-primary-200",i="hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700",g="bear-text-gray-300 dark:bear-text-zinc-600 bear-cursor-not-allowed",l="bear-ring-1 bear-ring-primary-400",d="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",u="Bear-DateRangePicker__label bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-zinc-300 bear-mb-1.5",C="bear-mt-1 bear-text-xs bear-text-red-500",y="bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500",x=()=>{const e=new Date;return e.setHours(0,0,0,0),[{label:"Today",range:()=>({start:new Date(e),end:new Date(e)})},{label:"Last 7 days",range:()=>{const r=new Date(e);return r.setDate(r.getDate()-6),{start:r,end:new Date(e)}}},{label:"Last 30 days",range:()=>{const r=new Date(e);return r.setDate(r.getDate()-29),{start:r,end:new Date(e)}}},{label:"This month",range:()=>({start:new Date(e.getFullYear(),e.getMonth(),1),end:new Date(e)})},{label:"Last month",range:()=>{const r=new Date(e.getFullYear(),e.getMonth()-1,1),a=new Date(e.getFullYear(),e.getMonth(),0);return{start:r,end:a}}}]};exports.CALENDAR_HEADER_CLASSES=s;exports.CALENDAR_ROWS=b;exports.DAYS_IN_WEEK=t;exports.DAY_BASE_CLASSES=L;exports.DAY_DISABLED_CLASSES=g;exports.DAY_HOVER_CLASSES=i;exports.DAY_IN_RANGE_CLASSES=D;exports.DAY_LABELS=S;exports.DAY_SELECTED_CLASSES=c;exports.DAY_TODAY_CLASSES=l;exports.ERROR_CLASSES=C;exports.HELPER_CLASSES=y;exports.LABEL_CLASSES=u;exports.MONTH_LABELS=n;exports.NAV_BTN_CLASSES=_;exports.PRESET_BTN_CLASSES=d;exports.ROOT_CLASSES=o;exports.SIZE_CLASSES=E;exports.TRIGGER_CLASSES=A;exports.getDefaultPresets=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../constants/numbers.const.cjs"),r=e.FOUR_HUNDRED_TWENTY,E=e.ELEVEN_THOUSAND,D="data-bear-daterangepicker-dropdown",_=["Su","Mo","Tu","We","Th","Fr","Sa"],t=["January","February","March","April","May","June","July","August","September","October","November","December"],A={sm:"bear-py-1.5 bear-px-3 bear-text-sm",md:"bear-py-2 bear-px-4 bear-text-base",lg:"bear-py-2.5 bear-px-5 bear-text-lg"};exports.DATERANGE_DROPDOWN_ATTR=D;exports.DATERANGE_DROPDOWN_HEIGHT_PX=r;exports.DATERANGE_DROPDOWN_Z_INDEX=E;exports.DAY_LABELS=_;exports.MONTH_LABELS=t;exports.SIZE_CLASSES=A;

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

@@ -1,7 +1,6 @@
-import { DateRangePreset } from './DateRangePicker.types';
-export declare const DAYS_IN_WEEK = 7;
-export declare const MONTHS_IN_YEAR = 12;
-export declare const CALENDAR_ROWS = 6;
+export declare const DATERANGE_DROPDOWN_HEIGHT_PX = 420;
+export declare const DATERANGE_DROPDOWN_Z_INDEX = 11000;
+export declare const DATERANGE_DROPDOWN_ATTR = "data-bear-daterangepicker-dropdown";
 export declare const DAY_LABELS: readonly ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
 export declare const MONTH_LABELS: readonly ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
 export declare const SIZE_CLASSES: {
@@ -9,19 +8,3 @@ export declare const SIZE_CLASSES: {
     readonly md: "bear-py-2 bear-px-4 bear-text-base";
     readonly lg: "bear-py-2.5 bear-px-5 bear-text-lg";
 };
-export declare const ROOT_CLASSES = "Bear-DateRangePicker bear-relative bear-inline-block";
-export declare const TRIGGER_CLASSES = "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";
-export declare const DROPDOWN_CLASSES = "bear-absolute bear-z-[9999] bear-mt-1 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";
-export declare const CALENDAR_HEADER_CLASSES = "bear-flex bear-items-center bear-justify-between bear-mb-2";
-export declare const NAV_BTN_CLASSES = "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";
-export declare const DAY_BASE_CLASSES = "bear-w-8 bear-h-8 bear-text-sm bear-rounded-full bear-transition-colors bear-cursor-pointer";
-export declare const DAY_SELECTED_CLASSES = "bear-bg-primary-500 bear-text-white";
-export declare const DAY_IN_RANGE_CLASSES = "bear-bg-primary-100 dark:bear-bg-primary-900/30 bear-text-primary-800 dark:bear-text-primary-200";
-export declare const DAY_HOVER_CLASSES = "hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700";
-export declare const DAY_DISABLED_CLASSES = "bear-text-gray-300 dark:bear-text-zinc-600 bear-cursor-not-allowed";
-export declare const DAY_TODAY_CLASSES = "bear-ring-1 bear-ring-primary-400";
-export declare const PRESET_BTN_CLASSES = "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";
-export declare const LABEL_CLASSES = "Bear-DateRangePicker__label bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-zinc-300 bear-mb-1.5";
-export declare const ERROR_CLASSES = "bear-mt-1 bear-text-xs bear-text-red-500";
-export declare const HELPER_CLASSES = "bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500";
-export declare const getDefaultPresets: () => DateRangePreset[];

package/dist/components/DateRangePicker/DateRangePicker.const.js

@@ -1,4 +1,5 @@
-const t = 7, b = 6, n = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], o = [
+import { FOUR_HUNDRED_TWENTY as e, ELEVEN_THOUSAND as r } from "../../constants/numbers.const.js";
+const t = e, E = r, b = "data-bear-daterangepicker-dropdown", D = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], o = [
   "January",
   "February",
   "March",
@@ -11,63 +12,16 @@ const t = 7, b = 6, n = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], o = [
   "October",
   "November",
   "December"
-], s = {
+], A = {
   sm: "bear-py-1.5 bear-px-3 bear-text-sm",
   md: "bear-py-2 bear-px-4 bear-text-base",
   lg: "bear-py-2.5 bear-px-5 bear-text-lg"
-}, S = "Bear-DateRangePicker bear-relative bear-inline-block", c = "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", i = "bear-flex bear-items-center bear-justify-between bear-mb-2", g = "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", l = "bear-w-8 bear-h-8 bear-text-sm bear-rounded-full bear-transition-colors bear-cursor-pointer", A = "bear-bg-primary-500 bear-text-white", E = "bear-bg-primary-100 dark:bear-bg-primary-900/30 bear-text-primary-800 dark:bear-text-primary-200", d = "hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700", x = "bear-text-gray-300 dark:bear-text-zinc-600 bear-cursor-not-allowed", D = "bear-ring-1 bear-ring-primary-400", u = "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", y = "Bear-DateRangePicker__label bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-zinc-300 bear-mb-1.5", _ = "bear-mt-1 bear-text-xs bear-text-red-500", L = "bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500", m = () => {
-  const e = /* @__PURE__ */ new Date();
-  return e.setHours(0, 0, 0, 0), [
-    {
-      label: "Today",
-      range: () => ({ start: new Date(e), end: new Date(e) })
-    },
-    {
-      label: "Last 7 days",
-      range: () => {
-        const r = new Date(e);
-        return r.setDate(r.getDate() - 6), { start: r, end: new Date(e) };
-      }
-    },
-    {
-      label: "Last 30 days",
-      range: () => {
-        const r = new Date(e);
-        return r.setDate(r.getDate() - 29), { start: r, end: new Date(e) };
-      }
-    },
-    {
-      label: "This month",
-      range: () => ({ start: new Date(e.getFullYear(), e.getMonth(), 1), end: new Date(e) })
-    },
-    {
-      label: "Last month",
-      range: () => {
-        const r = new Date(e.getFullYear(), e.getMonth() - 1, 1), a = new Date(e.getFullYear(), e.getMonth(), 0);
-        return { start: r, end: a };
-      }
-    }
-  ];
 };
 export {
-  i as CALENDAR_HEADER_CLASSES,
-  b as CALENDAR_ROWS,
-  t as DAYS_IN_WEEK,
-  l as DAY_BASE_CLASSES,
-  x as DAY_DISABLED_CLASSES,
-  d as DAY_HOVER_CLASSES,
-  E as DAY_IN_RANGE_CLASSES,
-  n as DAY_LABELS,
-  A as DAY_SELECTED_CLASSES,
-  D as DAY_TODAY_CLASSES,
-  _ as ERROR_CLASSES,
-  L as HELPER_CLASSES,
-  y as LABEL_CLASSES,
+  b as DATERANGE_DROPDOWN_ATTR,
+  t as DATERANGE_DROPDOWN_HEIGHT_PX,
+  E as DATERANGE_DROPDOWN_Z_INDEX,
+  D as DAY_LABELS,
   o as MONTH_LABELS,
-  g as NAV_BTN_CLASSES,
-  u as PRESET_BTN_CLASSES,
-  S as ROOT_CLASSES,
-  s as SIZE_CLASSES,
-  c as TRIGGER_CLASSES,
-  m as getDefaultPresets
+  A as SIZE_CLASSES
 };