@pibit.ai/cure-design-system 0.6.3 → 0.6.5

package/dist/applications/date-picker/date-time-calendar.js

@@ -1,128 +1,138 @@
-import { jsx as r, jsxs as d } from "react/jsx-runtime";
-import { useState as y, useMemo as k, useRef as j, useEffect as I, useContext as L } from "react";
-import { Time as w, toCalendarDateTime as M } from "@internationalized/date";
-import { CalendarCheck01 as P } from "@untitledui/icons";
-import { CalendarContext as q, Calendar as E, TimeField as G, CalendarStateContext as H, DateField as X } from "react-aria-components";
-import { cx as m } from "../../utils/cn.js";
-import { CalendarMonthYearHeader as Y, CalendarDayGrid as z } from "./calendar.js";
+import { jsx as r, jsxs as m } from "react/jsx-runtime";
+import { useState as y, useMemo as I, useRef as j, useEffect as L, useContext as M } from "react";
+import { Time as w, toCalendarDateTime as P } from "@internationalized/date";
+import { CalendarCheck01 as q } from "@untitledui/icons";
+import { CalendarContext as E, Calendar as G, TimeField as H, CalendarStateContext as X, DateField as Y } from "react-aria-components";
+import { cx as a } from "../../utils/cn.js";
+import { CalendarMonthYearHeader as A, CalendarDayGrid as B } from "./calendar.js";
 import { DateInput as N } from "./date-input.js";
 import { toSingleDate as R } from "./calendar-value.js";
-import { TimeList as A } from "./time-list.js";
+import { TimeList as J } from "./time-list.js";
+import { dateInputSizeFor as b } from "./sizes.js";
 const h = (e) => new w(e.hour, e.minute, e.second), T = (e, n) => {
-  const s = {
+  const t = {
     hour: n.hour,
     minute: n.minute,
     second: n.second,
     millisecond: 0
   };
-  return "hour" in e ? e.set(s) : M(e, h(n));
-}, B = (e, n) => e === n || !!e && !!n && e.year === n.year && e.month === n.month && e.day === n.day && e.era === n.era, J = ({ size: e }) => {
-  const n = L(H);
-  return /* @__PURE__ */ d(
-    X,
+  return "hour" in e ? e.set(t) : P(e, h(n));
+}, K = (e, n) => e === n || !!e && !!n && e.year === n.year && e.month === n.month && e.day === n.day && e.era === n.era, Q = ({ size: e }) => {
+  const n = M(X);
+  return /* @__PURE__ */ m(
+    Y,
     {
       "aria-label": "Date",
       granularity: "day",
       isDisabled: n == null ? void 0 : n.isDisabled,
       isReadOnly: n == null ? void 0 : n.isReadOnly,
       value: R(n == null ? void 0 : n.value),
-      onChange: (s) => n == null ? void 0 : n.setValue(s),
+      onChange: (t) => n == null ? void 0 : n.setValue(t),
       className: "relative min-w-0 flex-1",
       children: [
-        /* @__PURE__ */ r(N, { className: "w-full pr-9", size: e === "xs" ? "sm" : "md" }),
         /* @__PURE__ */ r(
-          P,
+          N,
+          {
+            className: a("w-full", e === "xs" ? "pr-8" : "pr-9"),
+            size: b(e)
+          }
+        ),
+        /* @__PURE__ */ r(
+          q,
           {
             "aria-hidden": "true",
-            className: "pointer-events-none absolute top-1/2 right-3 size-4 -translate-y-1/2 text-fg-quaternary"
+            className: a(
+              "pointer-events-none absolute top-1/2 -translate-y-1/2 text-fg-quaternary",
+              e === "xs" ? "right-2.5 size-3.5" : "right-3 size-4"
+            )
           }
         )
       ]
     }
   );
-}, ie = ({
+}, ae = ({
   value: e,
   onChange: n,
-  highlightedDates: s,
-  timeStep: b = 30,
+  highlightedDates: t,
+  timeStep: F = 30,
   hourCycle: p,
   timeGranularity: O = "minute",
-  defaultTime: V,
-  size: o = "sm",
+  defaultTime: S,
+  size: s = "xs",
   className: c,
-  ...t
+  ...o
 }) => {
-  const a = o === "xs", u = !!t.isDisabled || !!t.isReadOnly, [F, f] = y(
+  const l = s === "xs", u = !!o.isDisabled || !!o.isReadOnly, [V, f] = y(
     e ?? void 0
-  ), [g, C] = y(null), l = k(
+  ), [g, x] = y(null), d = I(
     () => e && "hour" in e ? h(e) : g,
     [g, e]
-  ), D = j(e);
-  I(() => {
-    !B(D.current, e) && e && f(e), D.current = e;
+  ), C = j(e);
+  L(() => {
+    !K(C.current, e) && e && f(e), C.current = e;
   }, [e]);
-  const S = (i) => {
+  const k = (i) => {
     if (!u) {
       if (!i) {
-        C(l), n(null);
+        x(d), n(null);
         return;
       }
-      f(i), n(T(i, l ?? V ?? new w()));
+      f(i), n(T(i, d ?? S ?? new w()));
     }
-  }, x = (i) => {
+  }, D = (i) => {
     if (!(u || !i)) {
       if (!e) {
-        C(h(i));
+        x(h(i));
         return;
       }
       n(T(e, i));
     }
   };
   return /* @__PURE__ */ r(
-    q.Provider,
+    E.Provider,
     {
       value: {
         value: e,
-        onChange: (i) => S(R(i)),
-        focusedValue: F,
+        onChange: (i) => k(R(i)),
+        focusedValue: V,
         onFocusChange: f
       },
-      children: /* @__PURE__ */ d(
-        E,
+      children: /* @__PURE__ */ m(
+        G,
         {
-          ...t,
-          className: (i) => m(
+          ...o,
+          className: (i) => a(
             "flex w-max flex-col",
-            a ? "gap-2" : "gap-3",
+            l ? "gap-2" : "gap-3",
             typeof c == "function" ? c(i) : c
           ),
           children: [
-            /* @__PURE__ */ r(Y, { size: o }),
-            /* @__PURE__ */ d("div", { className: m("flex", a ? "gap-2" : "gap-3"), children: [
-              /* @__PURE__ */ r(J, { size: o }),
+            /* @__PURE__ */ r(A, { size: s }),
+            /* @__PURE__ */ m("div", { className: a("flex", l ? "gap-2" : "gap-3"), children: [
+              /* @__PURE__ */ r(Q, { size: s }),
               /* @__PURE__ */ r(
-                G,
+                H,
                 {
                   "aria-label": "Time",
-                  value: l,
-                  onChange: x,
+                  value: d,
+                  onChange: D,
                   hourCycle: p,
                   granularity: O,
-                  isDisabled: t.isDisabled,
-                  isReadOnly: t.isReadOnly,
-                  className: a ? "w-24" : "w-30",
-                  children: /* @__PURE__ */ r(N, { className: "w-full", size: a ? "sm" : "md" })
+                  isDisabled: o.isDisabled,
+                  isReadOnly: o.isReadOnly,
+                  className: l ? "w-24" : "w-30",
+                  children: /* @__PURE__ */ r(N, { className: "w-full", size: b(s) })
                 }
               )
             ] }),
-            /* @__PURE__ */ d("div", { className: m("flex", a ? "gap-2" : "gap-3"), children: [
-              /* @__PURE__ */ r(z, { highlightedDates: s, size: o }),
-              /* @__PURE__ */ r("div", { className: m("relative shrink-0", a ? "w-24" : "w-30"), children: /* @__PURE__ */ r(
-                A,
+            /* @__PURE__ */ m("div", { className: a("flex", l ? "gap-2" : "gap-3"), children: [
+              /* @__PURE__ */ r(B, { highlightedDates: t, size: s }),
+              /* @__PURE__ */ r("div", { className: a("relative shrink-0", l ? "w-24" : "w-30"), children: /* @__PURE__ */ r(
+                J,
                 {
-                  value: l,
-                  onChange: x,
-                  step: b,
+                  value: d,
+                  onChange: D,
+                  step: F,
                   hourCycle: p,
                   isDisabled: u,
                   className: "absolute inset-0 pr-1"
@@ -136,6 +146,6 @@ const h = (e) => new w(e.hour, e.minute, e.second), T = (e, n) => {
   );
 };
 export {
-  ie as DateTimeCalendar,
+  ae as DateTimeCalendar,
   T as withTime
 };

package/dist/applications/date-picker/range-calendar.d.ts

@@ -14,7 +14,7 @@ export interface RangeCalendarProps extends AriaRangeCalendarProps<DateValue> {
         };
     }>;
     containerClassName?: string;
-    /** Visual size: "xs" (compact) or "sm" (default). */
+    /** Visual size: "xs" (compact, default) or "sm". */
     size?: CalendarSize;
     /** Drops the horizontal padding on the calendars' outer edges, for containers that supply their own padding. */
     flushEdges?: boolean;

package/dist/applications/date-picker/range-calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"range-calendar.d.ts","sourceRoot":"","sources":["../../../src/applications/date-picker/range-calendar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAkB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAK/D,OAAO,KAAK,EACV,kBAAkB,IAAI,sBAAsB,EAC5C,SAAS,EACV,MAAM,uBAAuB,CAAC;AAY/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAM/C,eAAO,MAAM,4BAA4B,GAAI,eAE1C,iBAAiB,4CAcnB,CAAC;AAgDF,MAAM,WAAW,kBAAmB,SAAQ,sBAAsB,CAAC,SAAS,CAAC;IAC3E,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,SAAS,EAAE,CAAC;IAC/B,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,CACd,MAAM,EACN;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE;YAAE,KAAK,EAAE,SAAS,CAAC;YAAC,GAAG,EAAE,SAAS,CAAA;SAAE,CAAA;KAAE,CAC/D,CAAC;IACF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qDAAqD;IACrD,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,gHAAgH;IAChH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,GAAI,6DAM3B,kBAAkB,4CAiKpB,CAAC"}
+{"version":3,"file":"range-calendar.d.ts","sourceRoot":"","sources":["../../../src/applications/date-picker/range-calendar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAkB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAK/D,OAAO,KAAK,EACV,kBAAkB,IAAI,sBAAsB,EAC5C,SAAS,EACV,MAAM,uBAAuB,CAAC;AAY/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAO/C,eAAO,MAAM,4BAA4B,GAAI,eAE1C,iBAAiB,4CAcnB,CAAC;AAgDF,MAAM,WAAW,kBAAmB,SAAQ,sBAAsB,CAAC,SAAS,CAAC;IAC3E,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,SAAS,EAAE,CAAC;IAC/B,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,CACd,MAAM,EACN;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE;YAAE,KAAK,EAAE,SAAS,CAAC;YAAC,GAAG,EAAE,SAAS,CAAA;SAAE,CAAA;KAAE,CAC/D,CAAC;IACF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oDAAoD;IACpD,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,gHAAgH;IAChH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,GAAI,6DAM3B,kBAAkB,4CAuKpB,CAAC"}

package/dist/applications/date-picker/range-calendar.js

@@ -1,89 +1,90 @@
-import { jsx as e, jsxs as o } from "react/jsx-runtime";
-import { Fragment as w, useState as p, useContext as v } from "react";
-import { ChevronLeft as _, ChevronRight as f } from "@untitledui/icons";
-import { useDateFormatter as D } from "react-aria";
-import { useSlottedContext as k, RangeCalendarContext as z, RangeCalendar as S, CalendarGrid as h, CalendarGridHeader as u, CalendarHeaderCell as b, CalendarGridBody as g, RangeCalendarStateContext as R } from "react-aria-components";
-import { useBreakpoint as B } from "../../hooks/use-breakpoint.js";
-import { CalendarCell as C } from "./cell.js";
-import { DateInput as y } from "./date-input.js";
-import { cx as i } from "../../utils/cn.js";
-import { Button as m } from "../../primitives/button/button.js";
-const F = ({
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { Fragment as D, useState as f, useContext as j } from "react";
+import { ChevronLeft as S, ChevronRight as p } from "@untitledui/icons";
+import { useDateFormatter as k } from "react-aria";
+import { useSlottedContext as B, RangeCalendarContext as w, RangeCalendar as F, CalendarGrid as h, CalendarGridHeader as u, CalendarHeaderCell as b, CalendarGridBody as g, RangeCalendarStateContext as _ } from "react-aria-components";
+import { useBreakpoint as G } from "../../hooks/use-breakpoint.js";
+import { dateInputSizeFor as y, rangeGridMinHeights as H, dayBoxSizes as C } from "./sizes.js";
+import { CalendarCell as N } from "./cell.js";
+import { DateInput as v } from "./date-input.js";
+import { cx as o } from "../../utils/cn.js";
+import { Button as c } from "../../primitives/button/button.js";
+const L = ({
   children: l
 }) => {
-  const [t, n] = p(null), [r, c] = p();
+  const [r, t] = f(null), [s, m] = f();
   return /* @__PURE__ */ e(
-    z.Provider,
+    w.Provider,
     {
-      value: { value: t, onChange: n, focusedValue: r, onFocusChange: c },
+      value: { value: r, onChange: t, focusedValue: s, onFocusChange: m },
       children: l
     }
   );
-}, N = ({ part: l }) => {
-  const t = v(R);
-  if (!t)
+}, R = ({ part: l }) => {
+  const r = j(_);
+  if (!r)
     throw new Error(
       "<RangeCalendarTitle /> must be used within a <RangeCalendar /> component."
     );
-  const n = D({
+  const t = k({
     month: "long",
     year: "numeric",
-    calendar: t.visibleRange.start.calendar.identifier,
-    timeZone: t.timeZone
+    calendar: r.visibleRange.start.calendar.identifier,
+    timeZone: r.timeZone
   });
-  return l === "start" ? n.format(t.visibleRange.start.toDate(t.timeZone)) : n.format(t.visibleRange.end.toDate(t.timeZone));
-}, L = ({
+  return l === "start" ? t.format(r.visibleRange.start.toDate(r.timeZone)) : t.format(r.visibleRange.end.toDate(r.timeZone));
+}, Z = ({
   value: l,
-  children: t,
-  ...n
+  children: r,
+  ...t
 }) => {
-  const r = v(R);
+  const s = j(_);
   return /* @__PURE__ */ e(
-    m,
+    c,
     {
-      ...n,
+      ...t,
       slot: null,
-      size: "sm",
+      size: "xs",
       color: "link-color",
       onClick: () => {
-        r == null || r.setValue(l), r == null || r.setFocusedDate(l.start);
+        s == null || s.setValue(l), s == null || s.setFocusedDate(l.start);
       },
-      children: t
+      children: r
     }
   );
-}, X = ({
+}, J = ({
   presets: l,
-  containerClassName: t,
-  size: n = "sm",
-  flushEdges: r = !1,
-  ...c
+  containerClassName: r,
+  size: t = "xs",
+  flushEdges: s = !1,
+  ...m
 }) => {
-  const d = B("md"), j = k(z), a = n === "xs", x = a ? "min-h-[220px]" : "min-h-[310px]";
-  return /* @__PURE__ */ e(j ? w : F, { children: /* @__PURE__ */ o(
-    S,
+  const d = G("md"), z = B(w), a = t === "xs", x = H[t];
+  return /* @__PURE__ */ e(z ? D : L, { children: /* @__PURE__ */ i(
+    F,
     {
-      className: i("flex items-start", t),
+      className: o("flex items-start", r),
       visibleDuration: {
         months: d ? 2 : 1
       },
-      ...c,
+      ...m,
       children: [
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ i(
           "div",
           {
-            className: i(
-              "flex flex-col py-1",
-              a ? "gap-2 px-4" : "gap-3 px-6",
-              r && (d ? "pl-0" : "px-0")
+            className: o(
+              "flex flex-1 flex-col py-1",
+              a ? "gap-2 px-3" : "gap-3 px-4",
+              s && (d ? "pl-0" : "px-0")
             ),
             children: [
-              /* @__PURE__ */ o("header", { className: "relative flex items-center justify-between md:justify-start", children: [
+              /* @__PURE__ */ i("header", { className: "relative flex items-center justify-between md:justify-start", children: [
                 /* @__PURE__ */ e(
-                  m,
+                  c,
                   {
                     slot: "previous",
-                    iconLeading: _,
-                    size: "sm",
+                    iconLeading: S,
+                    size: a ? "xs" : "sm",
                     color: "tertiary",
                     className: a ? "size-6" : "size-8"
                   }
@@ -91,109 +92,117 @@ const F = ({
                 /* @__PURE__ */ e(
                   "h2",
                   {
-                    className: i(
+                    className: o(
                       "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 font-semibold text-fg-secondary",
                       a ? "text-xs" : "text-sm"
                     ),
-                    children: /* @__PURE__ */ e(N, { part: "start" })
+                    children: /* @__PURE__ */ e(R, { part: "start" })
                   }
                 ),
                 /* @__PURE__ */ e(
-                  m,
+                  c,
                   {
                     slot: "next",
-                    iconLeading: f,
-                    size: "sm",
+                    iconLeading: p,
+                    size: a ? "xs" : "sm",
                     color: "tertiary",
-                    className: i(a ? "size-6" : "size-8", "md:hidden")
+                    className: o(a ? "size-6" : "size-8", "md:hidden")
                   }
                 )
               ] }),
-              !d && /* @__PURE__ */ o("div", { className: "flex items-center gap-2 md:hidden", children: [
+              !d && /* @__PURE__ */ i("div", { className: "flex items-center gap-2 md:hidden", children: [
                 /* @__PURE__ */ e(
-                  y,
+                  v,
                   {
                     slot: "start",
-                    size: a ? "sm" : "md",
+                    size: y(t),
                     className: "flex-1"
                   }
                 ),
-                /* @__PURE__ */ e("div", { className: "text-md text-quaternary", children: "–" }),
                 /* @__PURE__ */ e(
-                  y,
+                  "div",
+                  {
+                    className: o("text-quaternary", a ? "text-xs" : "text-md"),
+                    children: "–"
+                  }
+                ),
+                /* @__PURE__ */ e(
+                  v,
                   {
                     slot: "end",
-                    size: a ? "sm" : "md",
+                    size: y(t),
                     className: "flex-1"
                   }
                 )
               ] }),
-              !d && l && /* @__PURE__ */ e("div", { className: "mt-1 flex justify-between gap-3 px-2 md:hidden", children: Object.values(l).map((s) => /* @__PURE__ */ e(L, { value: s.value, children: s.label }, s.label)) }),
-              /* @__PURE__ */ e("div", { className: x, children: /* @__PURE__ */ o(h, { weekdayStyle: "short", className: "w-max", children: [
-                /* @__PURE__ */ e(u, { children: (s) => /* @__PURE__ */ e(b, { className: "border-b-4 border-transparent p-0", children: /* @__PURE__ */ e(
+              !d && l && /* @__PURE__ */ e("div", { className: "mt-1 flex justify-between gap-3 px-2 md:hidden", children: Object.values(l).map((n) => /* @__PURE__ */ e(Z, { value: n.value, children: n.label }, n.label)) }),
+              /* @__PURE__ */ e("div", { className: x, children: /* @__PURE__ */ i(h, { weekdayStyle: "short", className: "w-full", children: [
+                /* @__PURE__ */ e(u, { children: (n) => /* @__PURE__ */ e(b, { className: "border-b-2 border-transparent p-0", children: /* @__PURE__ */ e(
                   "div",
                   {
-                    className: i(
-                      "flex items-center justify-center font-medium text-secondary",
-                      a ? "size-7 text-xs" : "size-10 text-sm"
+                    className: o(
+                      "mx-auto flex items-center justify-center font-medium text-secondary",
+                      C[t],
+                      a ? "text-xs" : "text-sm"
                     ),
-                    children: s.slice(0, 2)
+                    children: n.slice(0, 2)
                   }
                 ) }) }),
-                /* @__PURE__ */ e(g, { className: "[&_td]:p-0 [&_tr]:border-b-4 [&_tr]:border-transparent [&_tr:last-of-type]:border-none", children: (s) => /* @__PURE__ */ e(C, { date: s, size: n }) })
+                /* @__PURE__ */ e(g, { className: "[&_td]:p-0 [&_tr]:border-b-2 [&_tr]:border-transparent [&_tr:last-of-type]:border-none", children: (n) => /* @__PURE__ */ e(N, { date: n, size: t }) })
               ] }) })
             ]
           }
         ),
-        d && /* @__PURE__ */ o(
+        d && /* @__PURE__ */ i(
           "div",
           {
-            className: i(
-              "flex flex-col border-l border-secondary py-1",
-              a ? "gap-2 px-4" : "gap-3 px-6",
-              r && "pr-0"
+            className: o(
+              "flex flex-1 flex-col border-l border-secondary py-1",
+              a ? "gap-2 px-3" : "gap-3 px-4",
+              s && "pr-0"
             ),
             children: [
-              /* @__PURE__ */ o("header", { className: "relative flex items-center justify-end", children: [
+              /* @__PURE__ */ i("header", { className: "relative flex items-center justify-end", children: [
                 /* @__PURE__ */ e(
                   "h2",
                   {
-                    className: i(
+                    className: o(
                       "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 font-semibold text-fg-secondary",
                       a ? "text-xs" : "text-sm"
                     ),
-                    children: /* @__PURE__ */ e(N, { part: "end" })
+                    children: /* @__PURE__ */ e(R, { part: "end" })
                   }
                 ),
                 /* @__PURE__ */ e(
-                  m,
+                  c,
                   {
                     slot: "next",
-                    iconLeading: f,
-                    size: "sm",
+                    iconLeading: p,
+                    size: a ? "xs" : "sm",
                     color: "tertiary",
                     className: a ? "size-6" : "size-8"
                   }
                 )
               ] }),
-              /* @__PURE__ */ e("div", { className: x, children: /* @__PURE__ */ o(
+              /* @__PURE__ */ e("div", { className: x, children: /* @__PURE__ */ i(
                 h,
                 {
                   weekdayStyle: "short",
                   offset: { months: 1 },
-                  className: "w-max",
+                  className: "w-full",
                   children: [
-                    /* @__PURE__ */ e(u, { children: (s) => /* @__PURE__ */ e(b, { className: "border-b-4 border-transparent p-0", children: /* @__PURE__ */ e(
+                    /* @__PURE__ */ e(u, { children: (n) => /* @__PURE__ */ e(b, { className: "border-b-2 border-transparent p-0", children: /* @__PURE__ */ e(
                       "div",
                       {
-                        className: i(
-                          "flex items-center justify-center font-medium text-secondary",
-                          a ? "size-7 text-xs" : "size-10 text-sm"
+                        className: o(
+                          "mx-auto flex items-center justify-center font-medium text-secondary",
+                          C[t],
+                          a ? "text-xs" : "text-sm"
                         ),
-                        children: s.slice(0, 2)
+                        children: n.slice(0, 2)
                       }
                     ) }) }),
-                    /* @__PURE__ */ e(g, { className: "[&_td]:p-0 [&_tr]:border-b-4 [&_tr]:border-transparent [&_tr:last-of-type]:border-none", children: (s) => /* @__PURE__ */ e(C, { date: s, size: n }) })
+                    /* @__PURE__ */ e(g, { className: "[&_td]:p-0 [&_tr]:border-b-2 [&_tr]:border-transparent [&_tr:last-of-type]:border-none", children: (n) => /* @__PURE__ */ e(N, { date: n, size: t }) })
                   ]
                 }
               ) })
@@ -205,6 +214,6 @@ const F = ({
   ) });
 };
 export {
-  X as RangeCalendar,
-  F as RangeCalendarContextProvider
+  J as RangeCalendar,
+  L as RangeCalendarContextProvider
 };

package/dist/applications/date-picker/range-preset.d.ts

@@ -1,10 +1,13 @@
 import { HTMLAttributes } from 'react';
 import { DateValue } from 'react-aria-components';
+import { PopoverSize } from './sizes';
 export interface RangePresetButtonProps extends HTMLAttributes<HTMLButtonElement> {
     value: {
         start: DateValue;
         end: DateValue;
     };
+    /** Matches the picker's popover size. Defaults to "xs". */
+    size?: PopoverSize;
 }
-export declare const RangePresetButton: ({ value, className, children, ...props }: RangePresetButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RangePresetButton: ({ value, size, className, children, ...props }: RangePresetButtonProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=range-preset.d.ts.map

package/dist/applications/date-picker/range-preset.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"range-preset.d.ts","sourceRoot":"","sources":["../../../src/applications/date-picker/range-preset.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EACL,KAAK,SAAS,EAGf,MAAM,uBAAuB,CAAC;AAG/B,MAAM,WAAW,sBAAuB,SAAQ,cAAc,CAAC,iBAAiB,CAAC;IAC/E,KAAK,EAAE;QAAE,KAAK,EAAE,SAAS,CAAC;QAAC,GAAG,EAAE,SAAS,CAAA;KAAE,CAAC;CAC7C;AAED,eAAO,MAAM,iBAAiB,GAAI,0CAK/B,sBAAsB,4CAqBxB,CAAC"}
+{"version":3,"file":"range-preset.d.ts","sourceRoot":"","sources":["../../../src/applications/date-picker/range-preset.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EACL,KAAK,SAAS,EAGf,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAQ3C,MAAM,WAAW,sBAAuB,SAAQ,cAAc,CAAC,iBAAiB,CAAC;IAC/E,KAAK,EAAE;QAAE,KAAK,EAAE,SAAS,CAAC;QAAC,GAAG,EAAE,SAAS,CAAA;KAAE,CAAC;IAC5C,2DAA2D;IAC3D,IAAI,CAAC,EAAE,WAAW,CAAC;CACpB;AAED,eAAO,MAAM,iBAAiB,GAAI,gDAM/B,sBAAsB,4CAsBxB,CAAC"}

package/dist/applications/date-picker/range-preset.js

@@ -1,27 +1,33 @@
-import { jsx as d } from "react/jsx-runtime";
-import { useSlottedContext as m, RangeCalendarContext as l } from "react-aria-components";
-import { cx as v } from "../../utils/cn.js";
-const h = ({
+import { jsx as u } from "react/jsx-runtime";
+import { useSlottedContext as x, RangeCalendarContext as p } from "react-aria-components";
+import { cx as l } from "../../utils/cn.js";
+const v = {
+  xs: "px-2.5 py-1 text-xs",
+  sm: "px-3 py-1.5 text-sm",
+  md: "px-3 py-2 text-sm"
+}, b = ({
   value: t,
-  className: a,
-  children: i,
-  ...u
+  size: a = "xs",
+  className: i,
+  children: m,
+  ...c
 }) => {
-  var o, r, n, s;
-  const e = m(l), c = ((r = (o = e == null ? void 0 : e.value) == null ? void 0 : o.start) == null ? void 0 : r.compare(t.start)) === 0 && ((s = (n = e == null ? void 0 : e.value) == null ? void 0 : n.end) == null ? void 0 : s.compare(t.end)) === 0;
-  return /* @__PURE__ */ d(
+  var o, r, s, n;
+  const e = x(p), d = ((r = (o = e == null ? void 0 : e.value) == null ? void 0 : o.start) == null ? void 0 : r.compare(t.start)) === 0 && ((n = (s = e == null ? void 0 : e.value) == null ? void 0 : s.end) == null ? void 0 : n.compare(t.end)) === 0;
+  return /* @__PURE__ */ u(
     "button",
     {
-      ...u,
-      className: v(
-        "cursor-pointer rounded-md px-3 py-2 text-left text-sm font-medium outline-focus-ring transition duration-100 ease-linear focus-visible:outline-2 focus-visible:outline-offset-2",
-        c ? "bg-active text-secondary_hover hover:bg-secondary_hover" : "text-secondary hover:bg-primary_hover hover:text-secondary_hover",
-        a
+      ...c,
+      className: l(
+        "cursor-pointer rounded-md text-left font-medium outline-focus-ring transition duration-100 ease-linear focus-visible:outline-2 focus-visible:outline-offset-2",
+        v[a],
+        d ? "bg-active text-secondary_hover hover:bg-secondary_hover" : "text-secondary hover:bg-primary_hover hover:text-secondary_hover",
+        i
       ),
-      children: i
+      children: m
     }
   );
 };
 export {
-  h as RangePresetButton
+  b as RangePresetButton
 };

package/dist/applications/date-picker/sizes.d.ts

@@ -0,0 +1,12 @@
+import { CalendarSize } from './calendar';
+/** Size of the boxes in the popovers: "xs" (28px days, 12px text), "sm" (36px days) or "md" (40px days). */
+export type PopoverSize = "xs" | "sm" | "md";
+/** The weekday header box and the round day marker. */
+export declare const dayBoxSizes: Record<CalendarSize, string>;
+/** A day cell: as tall as its marker and at least as wide, growing to fill its column. */
+export declare const dayCellSizes: Record<CalendarSize, string>;
+/** Six weeks of cells plus the weekday row, so paging a range calendar never changes its height. */
+export declare const rangeGridMinHeights: Record<CalendarSize, string>;
+/** The DateInput size that sits beside a calendar of the given size. */
+export declare const dateInputSizeFor: (size: CalendarSize) => "xs" | "sm" | "md";
+//# sourceMappingURL=sizes.d.ts.map

package/dist/applications/date-picker/sizes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizes.d.ts","sourceRoot":"","sources":["../../../src/applications/date-picker/sizes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,4GAA4G;AAC5G,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE7C,uDAAuD;AACvD,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAKpD,CAAC;AAEF,0FAA0F;AAC1F,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAKrD,CAAC;AAEF,oGAAoG;AACpG,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAK5D,CAAC;AAEF,wEAAwE;AACxE,eAAO,MAAM,gBAAgB,GAAI,MAAM,YAAY,uBACtB,CAAC"}