@choco-vanille/ui 1.1.1 → 1.2.0

package/dist/components/forms/calendar/Calendar.d.ts

@@ -0,0 +1,28 @@
+import { FC } from 'react';
+import { CalendarProps } from './types/Calendar.props.ts';
+/**
+ * A date-picker calendar built on top of `react-day-picker`.
+ *
+ * Supports `single`, `multiple`, and `range` selection modes.
+ *
+ * The header shows **[← Month Year →]** in day view. Clicking **Month** opens
+ * a 3×4 month picker; clicking **Year** opens a 3×4 year picker with decade
+ * pagination — no scrolling required.
+ *
+ * Use `startYear` / `endYear` to bound the year picker range
+ * (defaults: 100 years back → 10 years ahead).
+ *
+ * @example
+ * ```tsx
+ * // Single date
+ * <Calendar mode="single" selected={date} onSelect={setDate} />
+ *
+ * // Date of birth — show last 120 years, no future dates
+ * <Calendar mode="single" startYear={1900} endYear={currentYear} disabled={{ after: new Date() }} selected={dob} onSelect={setDob} />
+ *
+ * // Date range
+ * <Calendar mode="range" selected={range} onSelect={setRange} />
+ * ```
+ */
+declare const Calendar: FC<CalendarProps>;
+export default Calendar;

package/dist/components/forms/calendar/Calendar.js

@@ -0,0 +1,116 @@
+import { jsx as r, jsxs as m } from "react/jsx-runtime";
+import { memo as k } from "react";
+import { DayPicker as x } from "react-day-picker";
+import i from "../../layout/box/Box.js";
+import A from "../../layout/flex/Flex.js";
+import { cn as D } from "../../../utils/cn.js";
+import { CalendarContext as L } from "./context/calendarContext.js";
+import T from "./components/calendar-caption/CalendarCaption.js";
+/* empty css                                         */
+/* empty css                                                                      */
+import b from "./components/calendar-month-view/CalendarMonthView.js";
+/* empty css                                                                           */
+import R from "./components/calendar-year-view/CalendarYearView.js";
+/* empty css                                                                         */
+import { CALENDAR_ROOT_STYLES as t } from "./styles/calendarRoot.css.js";
+import { CALENDAR_GRID_STYLES as o } from "./styles/calendarGrid.css.js";
+import { CALENDAR_DAY_BUTTON_STYLES as e } from "./styles/calendarDayButton.css.js";
+import { useCalendar as O } from "./hooks/useCalendar.hook.js";
+const V = k(({
+  className: s,
+  classNames: l,
+  month: h,
+  defaultMonth: p,
+  onMonthChange: c,
+  startMonth: _,
+  endMonth: f,
+  startYear: C,
+  endYear: y,
+  weekStartsOn: u = 1,
+  showOutsideDays: g = !0,
+  captionLabels: w,
+  ...N
+}) => {
+  const {
+    view: a,
+    setView: Y,
+    currentMonth: n,
+    setCurrentMonth: d,
+    resolvedStartYear: v,
+    resolvedEndYear: E,
+    resolvedStartMonth: M,
+    resolvedEndMonth: S
+  } = O({
+    month: h,
+    defaultMonth: p,
+    onMonthChange: c,
+    startMonth: _,
+    endMonth: f,
+    startYear: C,
+    endYear: y
+  });
+  return /* @__PURE__ */ r(
+    L.Provider,
+    {
+      value: {
+        view: a,
+        setView: Y,
+        currentMonth: n,
+        setCurrentMonth: d,
+        startYear: v,
+        endYear: E
+      },
+      children: /* @__PURE__ */ r(i, { className: D(t.root, s), children: /* @__PURE__ */ m(
+        A,
+        {
+          flexDirection: "column",
+          gap: "md",
+          children: [
+            /* @__PURE__ */ r(T, { labels: w }),
+            /* @__PURE__ */ m(i, { className: t.calendarContent, children: [
+              a === "day" && /* @__PURE__ */ r(
+                x,
+                {
+                  ...N,
+                  weekStartsOn: u,
+                  showOutsideDays: g,
+                  month: n,
+                  onMonthChange: d,
+                  startMonth: M,
+                  endMonth: S,
+                  hideNavigation: !0,
+                  classNames: {
+                    months: t.months,
+                    month: t.month,
+                    month_caption: t.hiddenCaption,
+                    month_grid: o.month_grid,
+                    weekdays: o.weekdays,
+                    weekday: o.weekday,
+                    week: o.week,
+                    day: o.day,
+                    day_button: e.day_button,
+                    selected: e.selected,
+                    today: e.today,
+                    outside: e.outside,
+                    disabled: e.disabled,
+                    range_start: e.range_start,
+                    range_end: e.range_end,
+                    range_middle: e.range_middle,
+                    ...l
+                  }
+                }
+              ),
+              a === "month" && /* @__PURE__ */ r(b, {}),
+              a === "year" && /* @__PURE__ */ r(R, {})
+            ] })
+          ]
+        }
+      ) })
+    }
+  );
+});
+V.displayName = "Calendar";
+export {
+  V as default
+};
+//# sourceMappingURL=Calendar.js.map

package/dist/components/forms/calendar/Calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.js","sources":["../../../../src/components/forms/calendar/Calendar.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\nimport { DayPicker } from 'react-day-picker'\r\n\r\nimport Box from '@components/layout/box/Box.tsx'\r\nimport Flex from '@components/layout/flex/Flex.tsx'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { CalendarContext } from '@components/forms/calendar/context/calendarContext.ts'\r\nimport { CalendarCaption } from '@components/forms/calendar/components/calendar-caption/index.ts'\r\nimport { CalendarMonthView } from '@components/forms/calendar/components/calendar-month-view'\r\nimport { CalendarYearView } from '@components/forms/calendar/components/calendar-year-view'\r\nimport { CALENDAR_ROOT_STYLES } from '@components/forms/calendar/styles/calendarRoot.css.ts'\r\nimport { CALENDAR_GRID_STYLES } from '@components/forms/calendar/styles/calendarGrid.css.ts'\r\nimport { CALENDAR_DAY_BUTTON_STYLES } from '@components/forms/calendar/styles/calendarDayButton.css.ts'\r\nimport { useCalendar } from '@components/forms/calendar/hooks/useCalendar.hook.ts'\r\nimport type { CalendarProps } from '@components/forms/calendar/types/Calendar.props.ts'\r\n\r\n/**\r\n * A date-picker calendar built on top of `react-day-picker`.\r\n *\r\n * Supports `single`, `multiple`, and `range` selection modes.\r\n *\r\n * The header shows **[← Month Year →]** in day view. Clicking **Month** opens\r\n * a 3×4 month picker; clicking **Year** opens a 3×4 year picker with decade\r\n * pagination — no scrolling required.\r\n *\r\n * Use `startYear` / `endYear` to bound the year picker range\r\n * (defaults: 100 years back → 10 years ahead).\r\n *\r\n * @example\r\n * ```tsx\r\n * // Single date\r\n * <Calendar mode=\"single\" selected={date} onSelect={setDate} />\r\n *\r\n * // Date of birth — show last 120 years, no future dates\r\n * <Calendar mode=\"single\" startYear={1900} endYear={currentYear} disabled={{ after: new Date() }} selected={dob} onSelect={setDob} />\r\n *\r\n * // Date range\r\n * <Calendar mode=\"range\" selected={range} onSelect={setRange} />\r\n * ```\r\n */\r\nconst Calendar: FC<CalendarProps> = memo(({\r\n    className,\r\n    classNames,\r\n    month: controlledMonth,\r\n    defaultMonth,\r\n    onMonthChange,\r\n    startMonth,\r\n    endMonth,\r\n    startYear,\r\n    endYear,\r\n    weekStartsOn = 1,\r\n    showOutsideDays = true,\r\n    captionLabels,\r\n    ...props\r\n}) => {\r\n    const {\r\n        view,\r\n        setView,\r\n        currentMonth,\r\n        setCurrentMonth,\r\n        resolvedStartYear,\r\n        resolvedEndYear,\r\n        resolvedStartMonth,\r\n        resolvedEndMonth,\r\n    } = useCalendar({\r\n        month: controlledMonth,\r\n        defaultMonth,\r\n        onMonthChange,\r\n        startMonth,\r\n        endMonth,\r\n        startYear,\r\n        endYear,\r\n    })\r\n\r\n    return (\r\n        <CalendarContext.Provider\r\n            value={{\r\n                view,\r\n                setView,\r\n                currentMonth,\r\n                setCurrentMonth,\r\n                startYear: resolvedStartYear,\r\n                endYear: resolvedEndYear,            }}\r\n        >\r\n            <Box className={cn(CALENDAR_ROOT_STYLES.root, className)}>\r\n                <Flex\r\n                    flexDirection={'column'}\r\n                    gap={'md'}\r\n                >\r\n                    <CalendarCaption labels={captionLabels} />\r\n\r\n                    <Box className={CALENDAR_ROOT_STYLES.calendarContent}>\r\n                        {view === 'day' && (\r\n                            <DayPicker\r\n                                {...props}\r\n                                weekStartsOn={weekStartsOn}\r\n                                showOutsideDays={showOutsideDays}\r\n                                month={currentMonth}\r\n                                onMonthChange={setCurrentMonth}\r\n                                startMonth={resolvedStartMonth}\r\n                                endMonth={resolvedEndMonth}\r\n                                hideNavigation\r\n                                classNames={{\r\n                                    months: CALENDAR_ROOT_STYLES.months,\r\n                                    month: CALENDAR_ROOT_STYLES.month,\r\n                                    month_caption: CALENDAR_ROOT_STYLES.hiddenCaption,\r\n                                    month_grid: CALENDAR_GRID_STYLES.month_grid,\r\n                                    weekdays: CALENDAR_GRID_STYLES.weekdays,\r\n                                    weekday: CALENDAR_GRID_STYLES.weekday,\r\n                                    week: CALENDAR_GRID_STYLES.week,\r\n                                    day: CALENDAR_GRID_STYLES.day,\r\n                                    day_button: CALENDAR_DAY_BUTTON_STYLES.day_button,\r\n                                    selected: CALENDAR_DAY_BUTTON_STYLES.selected,\r\n                                    today: CALENDAR_DAY_BUTTON_STYLES.today,\r\n                                    outside: CALENDAR_DAY_BUTTON_STYLES.outside,\r\n                                    disabled: CALENDAR_DAY_BUTTON_STYLES.disabled,\r\n                                    range_start: CALENDAR_DAY_BUTTON_STYLES.range_start,\r\n                                    range_end: CALENDAR_DAY_BUTTON_STYLES.range_end,\r\n                                    range_middle: CALENDAR_DAY_BUTTON_STYLES.range_middle,\r\n                                    ...classNames,\r\n                                }}\r\n                            />\r\n                        )}\r\n\r\n                        {view === 'month' && <CalendarMonthView />}\r\n                        {view === 'year' && <CalendarYearView />}\r\n                    </Box>\r\n                </Flex>\r\n            </Box>\r\n        </CalendarContext.Provider>\r\n    )\r\n})\r\n\r\nCalendar.displayName = 'Calendar'\r\n\r\nexport default Calendar\r\n"],"names":["Calendar","memo","className","classNames","controlledMonth","defaultMonth","onMonthChange","startMonth","endMonth","startYear","endYear","weekStartsOn","showOutsideDays","captionLabels","props","view","setView","currentMonth","setCurrentMonth","resolvedStartYear","resolvedEndYear","resolvedStartMonth","resolvedEndMonth","useCalendar","jsx","CalendarContext","Box","cn","CALENDAR_ROOT_STYLES","jsxs","Flex","CalendarCaption","DayPicker","CALENDAR_GRID_STYLES","CALENDAR_DAY_BUTTON_STYLES","CalendarMonthView","CalendarYearView"],"mappings":";;;;;;;;;;;;;;;;;;AAwCA,MAAMA,IAA8BC,EAAK,CAAC;AAAA,EACtC,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,OAAOC;AAAA,EACP,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,iBAAAC,IAAkB;AAAA,EAClB,eAAAC;AAAA,EACA,GAAGC;AACP,MAAM;AACF,QAAM;AAAA,IACF,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,EAAA,IACAC,EAAY;AAAA,IACZ,OAAOnB;AAAA,IACP,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,SAAAC;AAAA,EAAA,CACH;AAED,SACI,gBAAAc;AAAA,IAACC,EAAgB;AAAA,IAAhB;AAAA,MACG,OAAO;AAAA,QACH,MAAAV;AAAA,QACA,SAAAC;AAAA,QACA,cAAAC;AAAA,QACA,iBAAAC;AAAA,QACA,WAAWC;AAAA,QACX,SAASC;AAAA,MAAA;AAAA,MAEb,4BAACM,GAAA,EAAI,WAAWC,EAAGC,EAAqB,MAAM1B,CAAS,GACnD,UAAA,gBAAA2B;AAAA,QAACC;AAAA,QAAA;AAAA,UACG,eAAe;AAAA,UACf,KAAK;AAAA,UAEL,UAAA;AAAA,YAAA,gBAAAN,EAACO,GAAA,EAAgB,QAAQlB,EAAA,CAAe;AAAA,YAExC,gBAAAgB,EAACH,GAAA,EAAI,WAAWE,EAAqB,iBAChC,UAAA;AAAA,cAAAb,MAAS,SACN,gBAAAS;AAAA,gBAACQ;AAAA,gBAAA;AAAA,kBACI,GAAGlB;AAAA,kBACJ,cAAAH;AAAA,kBACA,iBAAAC;AAAA,kBACA,OAAOK;AAAA,kBACP,eAAeC;AAAA,kBACf,YAAYG;AAAA,kBACZ,UAAUC;AAAA,kBACV,gBAAc;AAAA,kBACd,YAAY;AAAA,oBACR,QAAQM,EAAqB;AAAA,oBAC7B,OAAOA,EAAqB;AAAA,oBAC5B,eAAeA,EAAqB;AAAA,oBACpC,YAAYK,EAAqB;AAAA,oBACjC,UAAUA,EAAqB;AAAA,oBAC/B,SAASA,EAAqB;AAAA,oBAC9B,MAAMA,EAAqB;AAAA,oBAC3B,KAAKA,EAAqB;AAAA,oBAC1B,YAAYC,EAA2B;AAAA,oBACvC,UAAUA,EAA2B;AAAA,oBACrC,OAAOA,EAA2B;AAAA,oBAClC,SAASA,EAA2B;AAAA,oBACpC,UAAUA,EAA2B;AAAA,oBACrC,aAAaA,EAA2B;AAAA,oBACxC,WAAWA,EAA2B;AAAA,oBACtC,cAAcA,EAA2B;AAAA,oBACzC,GAAG/B;AAAA,kBAAA;AAAA,gBACP;AAAA,cAAA;AAAA,cAIPY,MAAS,WAAW,gBAAAS,EAACW,GAAA,CAAA,CAAkB;AAAA,cACvCpB,MAAS,UAAU,gBAAAS,EAACY,GAAA,CAAA,CAAiB;AAAA,YAAA,EAAA,CAC1C;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,EACJ,CACJ;AAAA,IAAA;AAAA,EAAA;AAGZ,CAAC;AAEDpC,EAAS,cAAc;"}

package/dist/components/forms/calendar/components/calendar-caption/CalendarCaption.cjs

@@ -0,0 +1,2 @@
+"use strict";const n=require("react/jsx-runtime"),s=require("react"),v=require("../../../../actions/button/Button.cjs");require("../../../../actions/button/styles/Button.css.cjs");const i=require("../../../../actions/icon-button/IconButton.cjs");require("../../../../actions/icon-button/styles/IconButton.css.cjs");const o=require("../../../../foundation/typography/Typography.cjs");require("../../../../foundation/typography/styles/Typography.css.cjs");const a=require("./styles/CalendarCaption.css.cjs"),q=require("./hooks/useCalendarCaption.hook.cjs"),c=require("../../../../layout/flex/Flex.cjs"),l=require("../../../../../constants/icons.cjs"),_=require("./constants/index.cjs"),d=s.memo(({labels:C={}})=>{const{view:e,setView:r,year:u,decadeStart:h,decadeEnd:m,label:p,handlePrev:x,handleNext:L,isPrevDisabled:A,isNextDisabled:N}=q.useCalendarCaption(),b=s.useCallback(()=>r("year"),[r]),t={..._.DEFAULT_CALENDAR_CAPTION_LABELS,...C},y=e==="day"?t.previousMonth:e==="month"?t.previousYear:t.previousYears,g=e==="day"?t.nextMonth:e==="month"?t.nextYear:t.nextYears;return n.jsxs(c,{alignItems:"center",justifyContent:"between",gap:"xs",className:a.CALENDAR_CAPTION_STYLES.monthCaption,children:[n.jsx(i,{icon:l.IconRegistry.chevronLeft,"aria-label":y,variant:"ghost",color:"tertiary",size:"sm",disabled:A,onClick:x}),n.jsxs(c,{alignItems:"center",justifyContent:"center",gap:"xxs",className:a.CALENDAR_CAPTION_STYLES.captionCenter,children:[e==="day"&&n.jsx(v,{variant:"ghost",color:"tertiary",size:"sm",label:p,onClick:b}),e==="month"&&n.jsx(o,{variant:"span",fontSize:"sm",fontWeight:"semibold",className:a.CALENDAR_CAPTION_STYLES.captionLabel,children:u}),e==="year"&&n.jsx(o,{variant:"span",fontSize:"sm",fontWeight:"semibold",className:a.CALENDAR_CAPTION_STYLES.captionLabel,children:`${h} -${m}`})]}),n.jsx(i,{icon:l.IconRegistry.chevronRight,"aria-label":g,variant:"ghost",color:"tertiary",size:"sm",disabled:N,onClick:L})]})});d.displayName="CalendarCaption";module.exports=d;
+//# sourceMappingURL=CalendarCaption.cjs.map

package/dist/components/forms/calendar/components/calendar-caption/CalendarCaption.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarCaption.cjs","sources":["../../../../../../src/components/forms/calendar/components/calendar-caption/CalendarCaption.tsx"],"sourcesContent":["import { memo, type FC, type ReactElement, useCallback } from 'react'\r\n\r\nimport { Button } from '@components/actions/button'\r\nimport { IconButton } from '@components/actions/icon-button'\r\nimport { Typography } from '@components/foundation/typography'\r\nimport { CALENDAR_CAPTION_STYLES } from '@components/forms/calendar/components/calendar-caption/styles/CalendarCaption.css.ts'\r\nimport { useCalendarCaption } from '@components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.ts'\r\nimport type { CalendarCaptionProps } from '@components/forms/calendar/components/calendar-caption/types/CalendarCaption.props.ts'\r\nimport Flex from '@components/layout/flex/Flex.tsx'\r\nimport { IconRegistry } from '@constants/icons'\r\nimport { DEFAULT_CALENDAR_CAPTION_LABELS } from '@components/forms/calendar/components/calendar-caption/constants'\r\n\r\n/**\r\n  * Calendar header row: [← IconButton] [caption center] [→ IconButton]\r\n  *\r\n  * - **Day view**  — `[← ] [January] [2025] [→]`  (month & year are clickable chips)\r\n  * - **Month view** — `[← ] [2025 ▸] [→]`  (year chip opens year picker)\r\n  * - **Year view** — `[← ] [2024 — 2035] [→]`  (plain decade range label)\r\n  *\r\n  * Arrow semantics:\r\n  * - Day view: navigate by month\r\n  * - Month view: navigate by year\r\n  * - Year view: navigate by page (12 years)\r\n  */\r\nconst CalendarCaption: FC<CalendarCaptionProps> = memo(({\r\n    labels = {},\r\n}): ReactElement => {\r\n    const {\r\n        view,\r\n        setView,\r\n        year,\r\n        decadeStart,\r\n        decadeEnd,\r\n        label,\r\n        handlePrev,\r\n        handleNext,\r\n        isPrevDisabled,\r\n        isNextDisabled,\r\n    } = useCalendarCaption()\r\n\r\n    const handleOpenYearView = useCallback(\r\n        () => setView('year'),\r\n        [setView],\r\n    )\r\n\r\n    const mergedLabels = { ...DEFAULT_CALENDAR_CAPTION_LABELS, ...labels }\r\n\r\n    const prevLabel =\r\n        view === 'day'\r\n            ? mergedLabels.previousMonth\r\n            : view === 'month'\r\n                ? mergedLabels.previousYear\r\n                : mergedLabels.previousYears\r\n\r\n    const nextLabel =\r\n        view === 'day'\r\n            ? mergedLabels.nextMonth\r\n            : view === 'month'\r\n                ? mergedLabels.nextYear\r\n                : mergedLabels.nextYears\r\n\r\n    return (\r\n        <Flex\r\n            alignItems={'center'}\r\n            justifyContent={'between'}\r\n            gap={'xs'}\r\n            className={CALENDAR_CAPTION_STYLES.monthCaption}\r\n        >\r\n            <IconButton\r\n                icon={IconRegistry.chevronLeft}\r\n                aria-label={prevLabel}\r\n                variant={'ghost'}\r\n                color={'tertiary'}\r\n                size={'sm'}\r\n                disabled={isPrevDisabled}\r\n                onClick={handlePrev}\r\n            />\r\n\r\n            <Flex\r\n                alignItems={'center'}\r\n                justifyContent={'center'}\r\n                gap={'xxs'}\r\n                className={CALENDAR_CAPTION_STYLES.captionCenter}\r\n            >\r\n                {view === 'day' && (\r\n                    <Button\r\n                        variant={'ghost'}\r\n                        color={'tertiary'}\r\n                        size={'sm'}\r\n                        label={label}\r\n                        onClick={handleOpenYearView}\r\n                    />\r\n                )}\r\n\r\n                {view === 'month' && (\r\n                    <Typography\r\n                        variant={'span'}\r\n                        fontSize={'sm'}\r\n                        fontWeight={'semibold'}\r\n                        className={CALENDAR_CAPTION_STYLES.captionLabel}\r\n                    >\r\n                        {year}\r\n                    </Typography>\r\n                )}\r\n\r\n                {view === 'year' && (\r\n                    <Typography\r\n                        variant={'span'}\r\n                        fontSize={'sm'}\r\n                        fontWeight={'semibold'}\r\n                        className={CALENDAR_CAPTION_STYLES.captionLabel}\r\n                    >\r\n                        {`${decadeStart} -${decadeEnd}`}\r\n                    </Typography>\r\n                )}\r\n            </Flex>\r\n\r\n            <IconButton\r\n                icon={IconRegistry.chevronRight}\r\n                aria-label={nextLabel}\r\n                variant={'ghost'}\r\n                color={'tertiary'}\r\n                size={'sm'}\r\n                disabled={isNextDisabled}\r\n                onClick={handleNext}\r\n            />\r\n        </Flex>\r\n    )\r\n})\r\n\r\nCalendarCaption.displayName = 'CalendarCaption'\r\n\r\nexport default CalendarCaption\r\n"],"names":["CalendarCaption","memo","labels","view","setView","year","decadeStart","decadeEnd","label","handlePrev","handleNext","isPrevDisabled","isNextDisabled","useCalendarCaption","handleOpenYearView","useCallback","mergedLabels","DEFAULT_CALENDAR_CAPTION_LABELS","prevLabel","nextLabel","jsxs","Flex","CALENDAR_CAPTION_STYLES","jsx","IconButton","IconRegistry","Button","Typography"],"mappings":"4qBAwBMA,EAA4CC,EAAAA,KAAK,CAAC,CACpD,OAAAC,EAAS,CAAA,CACb,IAAoB,CAChB,KAAM,CACF,KAAAC,EACA,QAAAC,EACA,KAAAC,EACA,YAAAC,EACA,UAAAC,EACA,MAAAC,EACA,WAAAC,EACA,WAAAC,EACA,eAAAC,EACA,eAAAC,CAAA,EACAC,qBAAA,EAEEC,EAAqBC,EAAAA,YACvB,IAAMX,EAAQ,MAAM,EACpB,CAACA,CAAO,CAAA,EAGNY,EAAe,CAAE,GAAGC,EAAAA,gCAAiC,GAAGf,CAAA,EAExDgB,EACFf,IAAS,MACHa,EAAa,cACbb,IAAS,QACLa,EAAa,aACbA,EAAa,cAErBG,EACFhB,IAAS,MACHa,EAAa,UACbb,IAAS,QACLa,EAAa,SACbA,EAAa,UAE3B,OACII,EAAAA,KAACC,EAAA,CACG,WAAY,SACZ,eAAgB,UAChB,IAAK,KACL,UAAWC,EAAAA,wBAAwB,aAEnC,SAAA,CAAAC,EAAAA,IAACC,EAAA,CACG,KAAMC,EAAAA,aAAa,YACnB,aAAYP,EACZ,QAAS,QACT,MAAO,WACP,KAAM,KACN,SAAUP,EACV,QAASF,CAAA,CAAA,EAGbW,EAAAA,KAACC,EAAA,CACG,WAAY,SACZ,eAAgB,SAChB,IAAK,MACL,UAAWC,EAAAA,wBAAwB,cAElC,SAAA,CAAAnB,IAAS,OACNoB,EAAAA,IAACG,EAAA,CACG,QAAS,QACT,MAAO,WACP,KAAM,KACN,MAAAlB,EACA,QAASM,CAAA,CAAA,EAIhBX,IAAS,SACNoB,EAAAA,IAACI,EAAA,CACG,QAAS,OACT,SAAU,KACV,WAAY,WACZ,UAAWL,EAAAA,wBAAwB,aAElC,SAAAjB,CAAA,CAAA,EAIRF,IAAS,QACNoB,EAAAA,IAACI,EAAA,CACG,QAAS,OACT,SAAU,KACV,WAAY,WACZ,UAAWL,EAAAA,wBAAwB,aAElC,SAAA,GAAGhB,CAAW,KAAKC,CAAS,EAAA,CAAA,CACjC,CAAA,CAAA,EAIRgB,EAAAA,IAACC,EAAA,CACG,KAAMC,EAAAA,aAAa,aACnB,aAAYN,EACZ,QAAS,QACT,MAAO,WACP,KAAM,KACN,SAAUP,EACV,QAASF,CAAA,CAAA,CACb,CAAA,CAAA,CAGZ,CAAC,EAEDV,EAAgB,YAAc"}

package/dist/components/forms/calendar/components/calendar-caption/CalendarCaption.d.ts

@@ -0,0 +1,16 @@
+import { FC } from 'react';
+import { CalendarCaptionProps } from './types/CalendarCaption.props.ts';
+/**
+  * Calendar header row: [← IconButton] [caption center] [→ IconButton]
+  *
+  * - **Day view**  — `[← ] [January] [2025] [→]`  (month & year are clickable chips)
+  * - **Month view** — `[← ] [2025 ▸] [→]`  (year chip opens year picker)
+  * - **Year view** — `[← ] [2024 — 2035] [→]`  (plain decade range label)
+  *
+  * Arrow semantics:
+  * - Day view: navigate by month
+  * - Month view: navigate by year
+  * - Year view: navigate by page (12 years)
+  */
+declare const CalendarCaption: FC<CalendarCaptionProps>;
+export default CalendarCaption;

package/dist/components/forms/calendar/components/calendar-caption/CalendarCaption.js

@@ -0,0 +1,113 @@
+import { jsxs as n, jsx as a } from "react/jsx-runtime";
+import { memo as u, useCallback as N } from "react";
+import A from "../../../../actions/button/Button.js";
+import "../../../../actions/button/styles/Button.css.js";
+import i from "../../../../actions/icon-button/IconButton.js";
+import "../../../../actions/icon-button/styles/IconButton.css.js";
+import s from "../../../../foundation/typography/Typography.js";
+import "../../../../foundation/typography/styles/Typography.css.js";
+import { CALENDAR_CAPTION_STYLES as o } from "./styles/CalendarCaption.css.js";
+import { useCalendarCaption as E } from "./hooks/useCalendarCaption.hook.js";
+import l from "../../../../layout/flex/Flex.js";
+import { IconRegistry as m } from "../../../../../constants/icons.js";
+import { DEFAULT_CALENDAR_CAPTION_LABELS as I } from "./constants/index.js";
+const S = u(({
+  labels: c = {}
+}) => {
+  const {
+    view: e,
+    setView: r,
+    year: p,
+    decadeStart: d,
+    decadeEnd: h,
+    label: f,
+    handlePrev: C,
+    handleNext: b,
+    isPrevDisabled: y,
+    isNextDisabled: v
+  } = E(), g = N(
+    () => r("year"),
+    [r]
+  ), t = { ...I, ...c }, x = e === "day" ? t.previousMonth : e === "month" ? t.previousYear : t.previousYears, L = e === "day" ? t.nextMonth : e === "month" ? t.nextYear : t.nextYears;
+  return /* @__PURE__ */ n(
+    l,
+    {
+      alignItems: "center",
+      justifyContent: "between",
+      gap: "xs",
+      className: o.monthCaption,
+      children: [
+        /* @__PURE__ */ a(
+          i,
+          {
+            icon: m.chevronLeft,
+            "aria-label": x,
+            variant: "ghost",
+            color: "tertiary",
+            size: "sm",
+            disabled: y,
+            onClick: C
+          }
+        ),
+        /* @__PURE__ */ n(
+          l,
+          {
+            alignItems: "center",
+            justifyContent: "center",
+            gap: "xxs",
+            className: o.captionCenter,
+            children: [
+              e === "day" && /* @__PURE__ */ a(
+                A,
+                {
+                  variant: "ghost",
+                  color: "tertiary",
+                  size: "sm",
+                  label: f,
+                  onClick: g
+                }
+              ),
+              e === "month" && /* @__PURE__ */ a(
+                s,
+                {
+                  variant: "span",
+                  fontSize: "sm",
+                  fontWeight: "semibold",
+                  className: o.captionLabel,
+                  children: p
+                }
+              ),
+              e === "year" && /* @__PURE__ */ a(
+                s,
+                {
+                  variant: "span",
+                  fontSize: "sm",
+                  fontWeight: "semibold",
+                  className: o.captionLabel,
+                  children: `${d} -${h}`
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ a(
+          i,
+          {
+            icon: m.chevronRight,
+            "aria-label": L,
+            variant: "ghost",
+            color: "tertiary",
+            size: "sm",
+            disabled: v,
+            onClick: b
+          }
+        )
+      ]
+    }
+  );
+});
+S.displayName = "CalendarCaption";
+export {
+  S as default
+};
+//# sourceMappingURL=CalendarCaption.js.map

package/dist/components/forms/calendar/components/calendar-caption/CalendarCaption.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarCaption.js","sources":["../../../../../../src/components/forms/calendar/components/calendar-caption/CalendarCaption.tsx"],"sourcesContent":["import { memo, type FC, type ReactElement, useCallback } from 'react'\r\n\r\nimport { Button } from '@components/actions/button'\r\nimport { IconButton } from '@components/actions/icon-button'\r\nimport { Typography } from '@components/foundation/typography'\r\nimport { CALENDAR_CAPTION_STYLES } from '@components/forms/calendar/components/calendar-caption/styles/CalendarCaption.css.ts'\r\nimport { useCalendarCaption } from '@components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.ts'\r\nimport type { CalendarCaptionProps } from '@components/forms/calendar/components/calendar-caption/types/CalendarCaption.props.ts'\r\nimport Flex from '@components/layout/flex/Flex.tsx'\r\nimport { IconRegistry } from '@constants/icons'\r\nimport { DEFAULT_CALENDAR_CAPTION_LABELS } from '@components/forms/calendar/components/calendar-caption/constants'\r\n\r\n/**\r\n  * Calendar header row: [← IconButton] [caption center] [→ IconButton]\r\n  *\r\n  * - **Day view**  — `[← ] [January] [2025] [→]`  (month & year are clickable chips)\r\n  * - **Month view** — `[← ] [2025 ▸] [→]`  (year chip opens year picker)\r\n  * - **Year view** — `[← ] [2024 — 2035] [→]`  (plain decade range label)\r\n  *\r\n  * Arrow semantics:\r\n  * - Day view: navigate by month\r\n  * - Month view: navigate by year\r\n  * - Year view: navigate by page (12 years)\r\n  */\r\nconst CalendarCaption: FC<CalendarCaptionProps> = memo(({\r\n    labels = {},\r\n}): ReactElement => {\r\n    const {\r\n        view,\r\n        setView,\r\n        year,\r\n        decadeStart,\r\n        decadeEnd,\r\n        label,\r\n        handlePrev,\r\n        handleNext,\r\n        isPrevDisabled,\r\n        isNextDisabled,\r\n    } = useCalendarCaption()\r\n\r\n    const handleOpenYearView = useCallback(\r\n        () => setView('year'),\r\n        [setView],\r\n    )\r\n\r\n    const mergedLabels = { ...DEFAULT_CALENDAR_CAPTION_LABELS, ...labels }\r\n\r\n    const prevLabel =\r\n        view === 'day'\r\n            ? mergedLabels.previousMonth\r\n            : view === 'month'\r\n                ? mergedLabels.previousYear\r\n                : mergedLabels.previousYears\r\n\r\n    const nextLabel =\r\n        view === 'day'\r\n            ? mergedLabels.nextMonth\r\n            : view === 'month'\r\n                ? mergedLabels.nextYear\r\n                : mergedLabels.nextYears\r\n\r\n    return (\r\n        <Flex\r\n            alignItems={'center'}\r\n            justifyContent={'between'}\r\n            gap={'xs'}\r\n            className={CALENDAR_CAPTION_STYLES.monthCaption}\r\n        >\r\n            <IconButton\r\n                icon={IconRegistry.chevronLeft}\r\n                aria-label={prevLabel}\r\n                variant={'ghost'}\r\n                color={'tertiary'}\r\n                size={'sm'}\r\n                disabled={isPrevDisabled}\r\n                onClick={handlePrev}\r\n            />\r\n\r\n            <Flex\r\n                alignItems={'center'}\r\n                justifyContent={'center'}\r\n                gap={'xxs'}\r\n                className={CALENDAR_CAPTION_STYLES.captionCenter}\r\n            >\r\n                {view === 'day' && (\r\n                    <Button\r\n                        variant={'ghost'}\r\n                        color={'tertiary'}\r\n                        size={'sm'}\r\n                        label={label}\r\n                        onClick={handleOpenYearView}\r\n                    />\r\n                )}\r\n\r\n                {view === 'month' && (\r\n                    <Typography\r\n                        variant={'span'}\r\n                        fontSize={'sm'}\r\n                        fontWeight={'semibold'}\r\n                        className={CALENDAR_CAPTION_STYLES.captionLabel}\r\n                    >\r\n                        {year}\r\n                    </Typography>\r\n                )}\r\n\r\n                {view === 'year' && (\r\n                    <Typography\r\n                        variant={'span'}\r\n                        fontSize={'sm'}\r\n                        fontWeight={'semibold'}\r\n                        className={CALENDAR_CAPTION_STYLES.captionLabel}\r\n                    >\r\n                        {`${decadeStart} -${decadeEnd}`}\r\n                    </Typography>\r\n                )}\r\n            </Flex>\r\n\r\n            <IconButton\r\n                icon={IconRegistry.chevronRight}\r\n                aria-label={nextLabel}\r\n                variant={'ghost'}\r\n                color={'tertiary'}\r\n                size={'sm'}\r\n                disabled={isNextDisabled}\r\n                onClick={handleNext}\r\n            />\r\n        </Flex>\r\n    )\r\n})\r\n\r\nCalendarCaption.displayName = 'CalendarCaption'\r\n\r\nexport default CalendarCaption\r\n"],"names":["CalendarCaption","memo","labels","view","setView","year","decadeStart","decadeEnd","label","handlePrev","handleNext","isPrevDisabled","isNextDisabled","useCalendarCaption","handleOpenYearView","useCallback","mergedLabels","DEFAULT_CALENDAR_CAPTION_LABELS","prevLabel","nextLabel","jsxs","Flex","CALENDAR_CAPTION_STYLES","jsx","IconButton","IconRegistry","Button","Typography"],"mappings":";;;;;;;;;;;;;AAwBA,MAAMA,IAA4CC,EAAK,CAAC;AAAA,EACpD,QAAAC,IAAS,CAAA;AACb,MAAoB;AAChB,QAAM;AAAA,IACF,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,YAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,EAAA,IACAC,EAAA,GAEEC,IAAqBC;AAAA,IACvB,MAAMX,EAAQ,MAAM;AAAA,IACpB,CAACA,CAAO;AAAA,EAAA,GAGNY,IAAe,EAAE,GAAGC,GAAiC,GAAGf,EAAA,GAExDgB,IACFf,MAAS,QACHa,EAAa,gBACbb,MAAS,UACLa,EAAa,eACbA,EAAa,eAErBG,IACFhB,MAAS,QACHa,EAAa,YACbb,MAAS,UACLa,EAAa,WACbA,EAAa;AAE3B,SACI,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,KAAK;AAAA,MACL,WAAWC,EAAwB;AAAA,MAEnC,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,MAAMC,EAAa;AAAA,YACnB,cAAYP;AAAA,YACZ,SAAS;AAAA,YACT,OAAO;AAAA,YACP,MAAM;AAAA,YACN,UAAUP;AAAA,YACV,SAASF;AAAA,UAAA;AAAA,QAAA;AAAA,QAGb,gBAAAW;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,YAAY;AAAA,YACZ,gBAAgB;AAAA,YAChB,KAAK;AAAA,YACL,WAAWC,EAAwB;AAAA,YAElC,UAAA;AAAA,cAAAnB,MAAS,SACN,gBAAAoB;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACG,SAAS;AAAA,kBACT,OAAO;AAAA,kBACP,MAAM;AAAA,kBACN,OAAAlB;AAAA,kBACA,SAASM;AAAA,gBAAA;AAAA,cAAA;AAAA,cAIhBX,MAAS,WACN,gBAAAoB;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBACG,SAAS;AAAA,kBACT,UAAU;AAAA,kBACV,YAAY;AAAA,kBACZ,WAAWL,EAAwB;AAAA,kBAElC,UAAAjB;AAAA,gBAAA;AAAA,cAAA;AAAA,cAIRF,MAAS,UACN,gBAAAoB;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBACG,SAAS;AAAA,kBACT,UAAU;AAAA,kBACV,YAAY;AAAA,kBACZ,WAAWL,EAAwB;AAAA,kBAElC,UAAA,GAAGhB,CAAW,KAAKC,CAAS;AAAA,gBAAA;AAAA,cAAA;AAAA,YACjC;AAAA,UAAA;AAAA,QAAA;AAAA,QAIR,gBAAAgB;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,MAAMC,EAAa;AAAA,YACnB,cAAYN;AAAA,YACZ,SAAS;AAAA,YACT,OAAO;AAAA,YACP,MAAM;AAAA,YACN,UAAUP;AAAA,YACV,SAASF;AAAA,UAAA;AAAA,QAAA;AAAA,MACb;AAAA,IAAA;AAAA,EAAA;AAGZ,CAAC;AAEDV,EAAgB,cAAc;"}

package/dist/components/forms/calendar/components/calendar-caption/constants/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={previousMonth:"Previous month",nextMonth:"Next month",previousYear:"Previous year",nextYear:"Next year",previousYears:"Previous years",nextYears:"Next years"};exports.DEFAULT_CALENDAR_CAPTION_LABELS=e;
+//# sourceMappingURL=index.cjs.map

package/dist/components/forms/calendar/components/calendar-caption/constants/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../../../../src/components/forms/calendar/components/calendar-caption/constants/index.ts"],"sourcesContent":["export const DEFAULT_CALENDAR_CAPTION_LABELS = {\r\n    previousMonth: 'Previous month',\r\n    nextMonth: 'Next month',\r\n    previousYear: 'Previous year',\r\n    nextYear: 'Next year',\r\n    previousYears: 'Previous years',\r\n    nextYears: 'Next years',\r\n} as const\r\n"],"names":["DEFAULT_CALENDAR_CAPTION_LABELS"],"mappings":"gFAAO,MAAMA,EAAkC,CAC3C,cAAe,iBACf,UAAW,aACX,aAAc,gBACd,SAAU,YACV,cAAe,iBACf,UAAW,YACf"}

package/dist/components/forms/calendar/components/calendar-caption/constants/index.d.ts

@@ -0,0 +1,8 @@
+export declare const DEFAULT_CALENDAR_CAPTION_LABELS: {
+    readonly previousMonth: "Previous month";
+    readonly nextMonth: "Next month";
+    readonly previousYear: "Previous year";
+    readonly nextYear: "Next year";
+    readonly previousYears: "Previous years";
+    readonly nextYears: "Next years";
+};

package/dist/components/forms/calendar/components/calendar-caption/constants/index.js

@@ -0,0 +1,12 @@
+const e = {
+  previousMonth: "Previous month",
+  nextMonth: "Next month",
+  previousYear: "Previous year",
+  nextYear: "Next year",
+  previousYears: "Previous years",
+  nextYears: "Next years"
+};
+export {
+  e as DEFAULT_CALENDAR_CAPTION_LABELS
+};
+//# sourceMappingURL=index.js.map

package/dist/components/forms/calendar/components/calendar-caption/constants/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../src/components/forms/calendar/components/calendar-caption/constants/index.ts"],"sourcesContent":["export const DEFAULT_CALENDAR_CAPTION_LABELS = {\r\n    previousMonth: 'Previous month',\r\n    nextMonth: 'Next month',\r\n    previousYear: 'Previous year',\r\n    nextYear: 'Next year',\r\n    previousYears: 'Previous years',\r\n    nextYears: 'Next years',\r\n} as const\r\n"],"names":["DEFAULT_CALENDAR_CAPTION_LABELS"],"mappings":"AAAO,MAAMA,IAAkC;AAAA,EAC3C,eAAe;AAAA,EACf,WAAW;AAAA,EACX,cAAc;AAAA,EACd,UAAU;AAAA,EACV,eAAe;AAAA,EACf,WAAW;AACf;"}

package/dist/components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),E=require("../../../context/calendarContext.cjs"),i=require("../../../constants/index.cjs"),P=require("../../../utils/decadeStart.utils.cjs"),S=require("../utils/capitalizeMonth.utils.cjs"),_=()=>{const{view:t,setView:u,currentMonth:r,setCurrentMonth:a,startYear:o,endYear:s}=E.useCalendarContext(),e=r.getFullYear(),n=r.getMonth(),c=P.getDecadeStart(e),d=c+i.YEARS_PER_PAGE-1,D=`${S.capitalizeMonth(new Intl.DateTimeFormat(void 0,{month:"long"}).format(r))} ${e}`,h=l.useCallback(()=>{if(t==="day"){a(new Date(e,n-1,1));return}if(t==="month"){a(new Date(e-1,n,1));return}a(new Date(e-i.YEARS_PER_PAGE,n,1))},[t,e,n,a]),w=l.useCallback(()=>{if(t==="day"){a(new Date(e,n+1,1));return}if(t==="month"){a(new Date(e+1,n,1));return}a(new Date(e+i.YEARS_PER_PAGE,n,1))},[t,e,n,a]),m=t==="day"?new Date(e,n-1,1)<new Date(o,0,1):t==="month"?e-1<o:c<=o,C=t==="day"?new Date(e,n+1,1)>new Date(s,11,1):t==="month"?e+1>s:d>=s;return{view:t,setView:u,year:e,decadeStart:c,decadeEnd:d,label:D,handlePrev:h,handleNext:w,isPrevDisabled:m,isNextDisabled:C}};exports.useCalendarCaption=_;
+//# sourceMappingURL=useCalendarCaption.hook.cjs.map

package/dist/components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCalendarCaption.hook.cjs","sources":["../../../../../../../src/components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.ts"],"sourcesContent":["import { useCallback } from 'react'\r\n\r\nimport { useCalendarContext } from '@components/forms/calendar/context/calendarContext.ts'\r\nimport { YEARS_PER_PAGE } from '@components/forms/calendar/constants'\r\nimport { getDecadeStart } from '@components/forms/calendar/utils/decadeStart.utils.ts'\r\nimport { capitalizeMonth } from '@components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.ts'\r\n\r\nexport const useCalendarCaption = () => {\r\n    const { view, setView, currentMonth, setCurrentMonth, startYear, endYear } = useCalendarContext()\r\n\r\n    const year = currentMonth.getFullYear()\r\n    const month = currentMonth.getMonth()\r\n    const decadeStart = getDecadeStart(year)\r\n    const decadeEnd = decadeStart + YEARS_PER_PAGE - 1\r\n    const label = `${capitalizeMonth(new Intl.DateTimeFormat(undefined, { month: 'long' }).format(currentMonth))} ${year}`\r\n\r\n    const handlePrev = useCallback(() => {\r\n        if (view === 'day') {\r\n            setCurrentMonth(new Date(year, month - 1, 1))\r\n            return\r\n        }\r\n\r\n        if (view === 'month') {\r\n            setCurrentMonth(new Date(year - 1, month, 1))\r\n            return\r\n        }\r\n\r\n        setCurrentMonth(new Date(year - YEARS_PER_PAGE, month, 1))\r\n    }, [view, year, month, setCurrentMonth])\r\n\r\n    const handleNext = useCallback(() => {\r\n        if (view === 'day') {\r\n            setCurrentMonth(new Date(year, month + 1, 1))\r\n            return\r\n        }\r\n\r\n        if (view === 'month') {\r\n            setCurrentMonth(new Date(year + 1, month, 1))\r\n            return\r\n        }\r\n\r\n        setCurrentMonth(new Date(year + YEARS_PER_PAGE, month, 1))\r\n    }, [view, year, month, setCurrentMonth])\r\n\r\n    const isPrevDisabled =\r\n        view === 'day' ? new Date(year, month - 1, 1) < new Date(startYear, 0, 1)\r\n            : view === 'month' ? year - 1 < startYear\r\n                : decadeStart <= startYear\r\n\r\n    const isNextDisabled =\r\n        view === 'day' ? new Date(year, month + 1, 1) > new Date(endYear, 11, 1)\r\n            : view === 'month' ? year + 1 > endYear\r\n                : decadeEnd >= endYear\r\n\r\n    return {\r\n        view,\r\n        setView,\r\n        year,\r\n        decadeStart,\r\n        decadeEnd,\r\n        label,\r\n        handlePrev,\r\n        handleNext,\r\n        isPrevDisabled,\r\n        isNextDisabled,\r\n    }\r\n}\r\n"],"names":["useCalendarCaption","view","setView","currentMonth","setCurrentMonth","startYear","endYear","useCalendarContext","year","month","decadeStart","getDecadeStart","decadeEnd","YEARS_PER_PAGE","label","capitalizeMonth","handlePrev","useCallback","handleNext","isPrevDisabled","isNextDisabled"],"mappings":"uSAOaA,EAAqB,IAAM,CACpC,KAAM,CAAE,KAAAC,EAAM,QAAAC,EAAS,aAAAC,EAAc,gBAAAC,EAAiB,UAAAC,EAAW,QAAAC,CAAA,EAAYC,qBAAA,EAEvEC,EAAOL,EAAa,YAAA,EACpBM,EAAQN,EAAa,SAAA,EACrBO,EAAcC,EAAAA,eAAeH,CAAI,EACjCI,EAAYF,EAAcG,EAAAA,eAAiB,EAC3CC,EAAQ,GAAGC,EAAAA,gBAAgB,IAAI,KAAK,eAAe,OAAW,CAAE,MAAO,MAAA,CAAQ,EAAE,OAAOZ,CAAY,CAAC,CAAC,IAAIK,CAAI,GAE9GQ,EAAaC,EAAAA,YAAY,IAAM,CACjC,GAAIhB,IAAS,MAAO,CAChBG,EAAgB,IAAI,KAAKI,EAAMC,EAAQ,EAAG,CAAC,CAAC,EAC5C,MACJ,CAEA,GAAIR,IAAS,QAAS,CAClBG,EAAgB,IAAI,KAAKI,EAAO,EAAGC,EAAO,CAAC,CAAC,EAC5C,MACJ,CAEAL,EAAgB,IAAI,KAAKI,EAAOK,EAAAA,eAAgBJ,EAAO,CAAC,CAAC,CAC7D,EAAG,CAACR,EAAMO,EAAMC,EAAOL,CAAe,CAAC,EAEjCc,EAAaD,EAAAA,YAAY,IAAM,CACjC,GAAIhB,IAAS,MAAO,CAChBG,EAAgB,IAAI,KAAKI,EAAMC,EAAQ,EAAG,CAAC,CAAC,EAC5C,MACJ,CAEA,GAAIR,IAAS,QAAS,CAClBG,EAAgB,IAAI,KAAKI,EAAO,EAAGC,EAAO,CAAC,CAAC,EAC5C,MACJ,CAEAL,EAAgB,IAAI,KAAKI,EAAOK,EAAAA,eAAgBJ,EAAO,CAAC,CAAC,CAC7D,EAAG,CAACR,EAAMO,EAAMC,EAAOL,CAAe,CAAC,EAEjCe,EACFlB,IAAS,MAAQ,IAAI,KAAKO,EAAMC,EAAQ,EAAG,CAAC,EAAI,IAAI,KAAKJ,EAAW,EAAG,CAAC,EAClEJ,IAAS,QAAUO,EAAO,EAAIH,EAC1BK,GAAeL,EAEvBe,EACFnB,IAAS,MAAQ,IAAI,KAAKO,EAAMC,EAAQ,EAAG,CAAC,EAAI,IAAI,KAAKH,EAAS,GAAI,CAAC,EACjEL,IAAS,QAAUO,EAAO,EAAIF,EAC1BM,GAAaN,EAE3B,MAAO,CACH,KAAAL,EACA,QAAAC,EACA,KAAAM,EACA,YAAAE,EACA,UAAAE,EACA,MAAAE,EACA,WAAAE,EACA,WAAAE,EACA,eAAAC,EACA,eAAAC,CAAA,CAER"}

package/dist/components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.d.ts

@@ -0,0 +1,13 @@
+import { CalendarView } from '../../../context/calendarContext.ts';
+export declare const useCalendarCaption: () => {
+    view: CalendarView;
+    setView: (v: CalendarView) => void;
+    year: number;
+    decadeStart: number;
+    decadeEnd: number;
+    label: string;
+    handlePrev: () => void;
+    handleNext: () => void;
+    isPrevDisabled: boolean;
+    isNextDisabled: boolean;
+};

package/dist/components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.js

@@ -0,0 +1,44 @@
+import { useCallback as c } from "react";
+import { useCalendarContext as p } from "../../../context/calendarContext.js";
+import { YEARS_PER_PAGE as m } from "../../../constants/index.js";
+import { getDecadeStart as C } from "../../../utils/decadeStart.utils.js";
+import { capitalizeMonth as y } from "../utils/capitalizeMonth.utils.js";
+const M = () => {
+  const { view: t, setView: l, currentMonth: o, setCurrentMonth: a, startYear: r, endYear: s } = p(), e = o.getFullYear(), n = o.getMonth(), i = C(e), d = i + m - 1, D = `${y(new Intl.DateTimeFormat(void 0, { month: "long" }).format(o))} ${e}`, w = c(() => {
+    if (t === "day") {
+      a(new Date(e, n - 1, 1));
+      return;
+    }
+    if (t === "month") {
+      a(new Date(e - 1, n, 1));
+      return;
+    }
+    a(new Date(e - m, n, 1));
+  }, [t, e, n, a]), h = c(() => {
+    if (t === "day") {
+      a(new Date(e, n + 1, 1));
+      return;
+    }
+    if (t === "month") {
+      a(new Date(e + 1, n, 1));
+      return;
+    }
+    a(new Date(e + m, n, 1));
+  }, [t, e, n, a]), u = t === "day" ? new Date(e, n - 1, 1) < new Date(r, 0, 1) : t === "month" ? e - 1 < r : i <= r, f = t === "day" ? new Date(e, n + 1, 1) > new Date(s, 11, 1) : t === "month" ? e + 1 > s : d >= s;
+  return {
+    view: t,
+    setView: l,
+    year: e,
+    decadeStart: i,
+    decadeEnd: d,
+    label: D,
+    handlePrev: w,
+    handleNext: h,
+    isPrevDisabled: u,
+    isNextDisabled: f
+  };
+};
+export {
+  M as useCalendarCaption
+};
+//# sourceMappingURL=useCalendarCaption.hook.js.map

package/dist/components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCalendarCaption.hook.js","sources":["../../../../../../../src/components/forms/calendar/components/calendar-caption/hooks/useCalendarCaption.hook.ts"],"sourcesContent":["import { useCallback } from 'react'\r\n\r\nimport { useCalendarContext } from '@components/forms/calendar/context/calendarContext.ts'\r\nimport { YEARS_PER_PAGE } from '@components/forms/calendar/constants'\r\nimport { getDecadeStart } from '@components/forms/calendar/utils/decadeStart.utils.ts'\r\nimport { capitalizeMonth } from '@components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.ts'\r\n\r\nexport const useCalendarCaption = () => {\r\n    const { view, setView, currentMonth, setCurrentMonth, startYear, endYear } = useCalendarContext()\r\n\r\n    const year = currentMonth.getFullYear()\r\n    const month = currentMonth.getMonth()\r\n    const decadeStart = getDecadeStart(year)\r\n    const decadeEnd = decadeStart + YEARS_PER_PAGE - 1\r\n    const label = `${capitalizeMonth(new Intl.DateTimeFormat(undefined, { month: 'long' }).format(currentMonth))} ${year}`\r\n\r\n    const handlePrev = useCallback(() => {\r\n        if (view === 'day') {\r\n            setCurrentMonth(new Date(year, month - 1, 1))\r\n            return\r\n        }\r\n\r\n        if (view === 'month') {\r\n            setCurrentMonth(new Date(year - 1, month, 1))\r\n            return\r\n        }\r\n\r\n        setCurrentMonth(new Date(year - YEARS_PER_PAGE, month, 1))\r\n    }, [view, year, month, setCurrentMonth])\r\n\r\n    const handleNext = useCallback(() => {\r\n        if (view === 'day') {\r\n            setCurrentMonth(new Date(year, month + 1, 1))\r\n            return\r\n        }\r\n\r\n        if (view === 'month') {\r\n            setCurrentMonth(new Date(year + 1, month, 1))\r\n            return\r\n        }\r\n\r\n        setCurrentMonth(new Date(year + YEARS_PER_PAGE, month, 1))\r\n    }, [view, year, month, setCurrentMonth])\r\n\r\n    const isPrevDisabled =\r\n        view === 'day' ? new Date(year, month - 1, 1) < new Date(startYear, 0, 1)\r\n            : view === 'month' ? year - 1 < startYear\r\n                : decadeStart <= startYear\r\n\r\n    const isNextDisabled =\r\n        view === 'day' ? new Date(year, month + 1, 1) > new Date(endYear, 11, 1)\r\n            : view === 'month' ? year + 1 > endYear\r\n                : decadeEnd >= endYear\r\n\r\n    return {\r\n        view,\r\n        setView,\r\n        year,\r\n        decadeStart,\r\n        decadeEnd,\r\n        label,\r\n        handlePrev,\r\n        handleNext,\r\n        isPrevDisabled,\r\n        isNextDisabled,\r\n    }\r\n}\r\n"],"names":["useCalendarCaption","view","setView","currentMonth","setCurrentMonth","startYear","endYear","useCalendarContext","year","month","decadeStart","getDecadeStart","decadeEnd","YEARS_PER_PAGE","label","capitalizeMonth","handlePrev","useCallback","handleNext","isPrevDisabled","isNextDisabled"],"mappings":";;;;;AAOO,MAAMA,IAAqB,MAAM;AACpC,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,iBAAAC,GAAiB,WAAAC,GAAW,SAAAC,EAAA,IAAYC,EAAA,GAEvEC,IAAOL,EAAa,YAAA,GACpBM,IAAQN,EAAa,SAAA,GACrBO,IAAcC,EAAeH,CAAI,GACjCI,IAAYF,IAAcG,IAAiB,GAC3CC,IAAQ,GAAGC,EAAgB,IAAI,KAAK,eAAe,QAAW,EAAE,OAAO,OAAA,CAAQ,EAAE,OAAOZ,CAAY,CAAC,CAAC,IAAIK,CAAI,IAE9GQ,IAAaC,EAAY,MAAM;AACjC,QAAIhB,MAAS,OAAO;AAChB,MAAAG,EAAgB,IAAI,KAAKI,GAAMC,IAAQ,GAAG,CAAC,CAAC;AAC5C;AAAA,IACJ;AAEA,QAAIR,MAAS,SAAS;AAClB,MAAAG,EAAgB,IAAI,KAAKI,IAAO,GAAGC,GAAO,CAAC,CAAC;AAC5C;AAAA,IACJ;AAEA,IAAAL,EAAgB,IAAI,KAAKI,IAAOK,GAAgBJ,GAAO,CAAC,CAAC;AAAA,EAC7D,GAAG,CAACR,GAAMO,GAAMC,GAAOL,CAAe,CAAC,GAEjCc,IAAaD,EAAY,MAAM;AACjC,QAAIhB,MAAS,OAAO;AAChB,MAAAG,EAAgB,IAAI,KAAKI,GAAMC,IAAQ,GAAG,CAAC,CAAC;AAC5C;AAAA,IACJ;AAEA,QAAIR,MAAS,SAAS;AAClB,MAAAG,EAAgB,IAAI,KAAKI,IAAO,GAAGC,GAAO,CAAC,CAAC;AAC5C;AAAA,IACJ;AAEA,IAAAL,EAAgB,IAAI,KAAKI,IAAOK,GAAgBJ,GAAO,CAAC,CAAC;AAAA,EAC7D,GAAG,CAACR,GAAMO,GAAMC,GAAOL,CAAe,CAAC,GAEjCe,IACFlB,MAAS,QAAQ,IAAI,KAAKO,GAAMC,IAAQ,GAAG,CAAC,IAAI,IAAI,KAAKJ,GAAW,GAAG,CAAC,IAClEJ,MAAS,UAAUO,IAAO,IAAIH,IAC1BK,KAAeL,GAEvBe,IACFnB,MAAS,QAAQ,IAAI,KAAKO,GAAMC,IAAQ,GAAG,CAAC,IAAI,IAAI,KAAKH,GAAS,IAAI,CAAC,IACjEL,MAAS,UAAUO,IAAO,IAAIF,IAC1BM,KAAaN;AAE3B,SAAO;AAAA,IACH,MAAAL;AAAA,IACA,SAAAC;AAAA,IACA,MAAAM;AAAA,IACA,aAAAE;AAAA,IACA,WAAAE;AAAA,IACA,OAAAE;AAAA,IACA,YAAAE;AAAA,IACA,YAAAE;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,EAAA;AAER;"}

package/dist/components/forms/calendar/components/calendar-caption/index.d.ts

@@ -0,0 +1,4 @@
+export { default as CalendarCaption } from './CalendarCaption.tsx';
+export { CALENDAR_CAPTION_STYLES } from './styles/CalendarCaption.css.ts';
+export { DEFAULT_CALENDAR_CAPTION_LABELS } from './constants';
+export type { CalendarCaptionProps, CalendarCaptionLabels } from './types/CalendarCaption.props.ts';

package/dist/components/forms/calendar/components/calendar-caption/styles/CalendarCaption.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                                    */;/* empty css                                     */var e={monthCaption:"iemyq10",captionCenter:"iemyq11",captionLabel:"iemyq12"};exports.CALENDAR_CAPTION_STYLES=e;
+//# sourceMappingURL=CalendarCaption.css.cjs.map

package/dist/components/forms/calendar/components/calendar-caption/styles/CalendarCaption.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarCaption.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/calendar/components/calendar-caption/styles/CalendarCaption.css.d.ts

@@ -0,0 +1,5 @@
+export declare const CALENDAR_CAPTION_STYLES: {
+    monthCaption: string;
+    captionCenter: string;
+    captionLabel: string;
+};

package/dist/components/forms/calendar/components/calendar-caption/styles/CalendarCaption.css.js

@@ -0,0 +1,7 @@
+/* empty css                                                  */
+/* empty css                                   */
+var e = { monthCaption: "iemyq10", captionCenter: "iemyq11", captionLabel: "iemyq12" };
+export {
+  e as CALENDAR_CAPTION_STYLES
+};
+//# sourceMappingURL=CalendarCaption.css.js.map

package/dist/components/forms/calendar/components/calendar-caption/styles/CalendarCaption.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarCaption.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/components/forms/calendar/components/calendar-caption/types/CalendarCaption.props.d.ts

@@ -0,0 +1,18 @@
+export type CalendarCaptionLabels = {
+    /** Accessible label for the previous-month button in day view. @default 'Previous month' */
+    previousMonth?: string;
+    /** Accessible label for the next-month button in day view. @default 'Next month' */
+    nextMonth?: string;
+    /** Accessible label for the previous-year button in month view. @default 'Previous year' */
+    previousYear?: string;
+    /** Accessible label for the next-year button in month view. @default 'Next year' */
+    nextYear?: string;
+    /** Accessible label for the previous-page button in year view. @default 'Previous years' */
+    previousYears?: string;
+    /** Accessible label for the next-page button in year view. @default 'Next years' */
+    nextYears?: string;
+};
+export type CalendarCaptionProps = {
+    /** Localized labels for the caption navigation buttons. */
+    labels?: CalendarCaptionLabels;
+};

package/dist/components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=t=>t.charAt(0).toUpperCase()+t.slice(1);exports.capitalizeMonth=e;
+//# sourceMappingURL=capitalizeMonth.utils.cjs.map

package/dist/components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"capitalizeMonth.utils.cjs","sources":["../../../../../../../src/components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.ts"],"sourcesContent":["export const capitalizeMonth = (monthName: string): string =>\r\n    monthName.charAt(0).toUpperCase() + monthName.slice(1)\r\n"],"names":["capitalizeMonth","monthName"],"mappings":"gFAAO,MAAMA,EAAmBC,GAC5BA,EAAU,OAAO,CAAC,EAAE,YAAA,EAAgBA,EAAU,MAAM,CAAC"}

package/dist/components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.d.ts

@@ -0,0 +1 @@
+export declare const capitalizeMonth: (monthName: string) => string;

package/dist/components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.js

@@ -0,0 +1,5 @@
+const c = (t) => t.charAt(0).toUpperCase() + t.slice(1);
+export {
+  c as capitalizeMonth
+};
+//# sourceMappingURL=capitalizeMonth.utils.js.map

package/dist/components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"capitalizeMonth.utils.js","sources":["../../../../../../../src/components/forms/calendar/components/calendar-caption/utils/capitalizeMonth.utils.ts"],"sourcesContent":["export const capitalizeMonth = (monthName: string): string =>\r\n    monthName.charAt(0).toUpperCase() + monthName.slice(1)\r\n"],"names":["capitalizeMonth","monthName"],"mappings":"AAAO,MAAMA,IAAkB,CAACC,MAC5BA,EAAU,OAAO,CAAC,EAAE,YAAA,IAAgBA,EAAU,MAAM,CAAC;"}

package/dist/components/forms/calendar/components/calendar-month-view/CalendarMonthView.cjs

@@ -0,0 +1,2 @@
+"use strict";const n=require("react/jsx-runtime"),l=require("react"),h=require("./constants/index.cjs"),x=require("./hooks/useCalendarMonthView.hook.cjs"),M=require("../../../../layout/grid/Grid.cjs"),m=require("./components/calendar-month-button/CalendarMonthButton.cjs"),s=l.memo(()=>{const{selectedMonth:t,focusedIndex:o,buttonRefs:r,handleKeyDown:a,handleSelect:d,isDisabled:i,isToday:c}=x.useCalendarMonthView();return n.jsx(M,{columns:3,gap:"xs",children:h.MONTH_LABELS.map((u,e)=>n.jsx(m,{index:e,label:u,isSelected:t===e,isFocused:e===o,buttonRefs:r,isDisabled:i,isToday:c,handleSelect:d,handleKeyDown:a},e))})});s.displayName="CalendarMonthView";module.exports=s;
+//# sourceMappingURL=CalendarMonthView.cjs.map

package/dist/components/forms/calendar/components/calendar-month-view/CalendarMonthView.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarMonthView.cjs","sources":["../../../../../../src/components/forms/calendar/components/calendar-month-view/CalendarMonthView.tsx"],"sourcesContent":["import { memo, type ReactElement } from 'react'\r\n\r\nimport { MONTH_LABELS } from '@components/forms/calendar/components/calendar-month-view/constants'\r\nimport { useCalendarMonthView } from '@components/forms/calendar/components/calendar-month-view/hooks/useCalendarMonthView.hook.ts'\r\nimport Grid from '@components/layout/grid/Grid.tsx'\r\nimport CalendarMonthButton\r\n    from '@components/forms/calendar/components/calendar-month-view/components/calendar-month-button/CalendarMonthButton.tsx'\r\n\r\n/**\r\n * Month picker: 3×4 grid of months for the currently viewed year.\r\n * Clicking a month switches the calendar to that month and closes the picker.\r\n * Supports keyboard arrow navigation (roving tabindex).\r\n */\r\nconst CalendarMonthView = memo((): ReactElement => {\r\n    const {\r\n        selectedMonth,\r\n        focusedIndex,\r\n        buttonRefs,\r\n        handleKeyDown,\r\n        handleSelect,\r\n        isDisabled,\r\n        isToday,\r\n    } = useCalendarMonthView()\r\n\r\n    return (\r\n        <Grid\r\n            columns={3}\r\n            gap={'xs'}\r\n        >\r\n            {MONTH_LABELS.map((label, i) => (\r\n                <CalendarMonthButton\r\n                    key={i}\r\n                    index={i}\r\n                    label={label}\r\n                    isSelected={selectedMonth === i}\r\n                    isFocused={i === focusedIndex}\r\n                    buttonRefs={buttonRefs}\r\n                    isDisabled={isDisabled}\r\n                    isToday={isToday}\r\n                    handleSelect={handleSelect}\r\n                    handleKeyDown={handleKeyDown}\r\n                />\r\n            ))}\r\n        </Grid>\r\n    )\r\n})\r\n\r\nCalendarMonthView.displayName = 'CalendarMonthView'\r\n\r\nexport default CalendarMonthView\r\n"],"names":["CalendarMonthView","memo","selectedMonth","focusedIndex","buttonRefs","handleKeyDown","handleSelect","isDisabled","isToday","useCalendarMonthView","jsx","Grid","MONTH_LABELS","label","i","CalendarMonthButton"],"mappings":"iRAaMA,EAAoBC,EAAAA,KAAK,IAAoB,CAC/C,KAAM,CACF,cAAAC,EACA,aAAAC,EACA,WAAAC,EACA,cAAAC,EACA,aAAAC,EACA,WAAAC,EACA,QAAAC,CAAA,EACAC,uBAAA,EAEJ,OACIC,EAAAA,IAACC,EAAA,CACG,QAAS,EACT,IAAK,KAEJ,SAAAC,EAAAA,aAAa,IAAI,CAACC,EAAOC,IACtBJ,EAAAA,IAACK,EAAA,CAEG,MAAOD,EACP,MAAAD,EACA,WAAYX,IAAkBY,EAC9B,UAAWA,IAAMX,EACjB,WAAAC,EACA,WAAAG,EACA,QAAAC,EACA,aAAAF,EACA,cAAAD,CAAA,EATKS,CAAA,CAWZ,CAAA,CAAA,CAGb,CAAC,EAEDd,EAAkB,YAAc"}

package/dist/components/forms/calendar/components/calendar-month-view/CalendarMonthView.d.ts

@@ -0,0 +1,8 @@
+import { ReactElement, MemoExoticComponent } from 'react';
+/**
+ * Month picker: 3×4 grid of months for the currently viewed year.
+ * Clicking a month switches the calendar to that month and closes the picker.
+ * Supports keyboard arrow navigation (roving tabindex).
+ */
+declare const CalendarMonthView: MemoExoticComponent<() => ReactElement>;
+export default CalendarMonthView;

package/dist/components/forms/calendar/components/calendar-month-view/CalendarMonthView.js

@@ -0,0 +1,44 @@
+import { jsx as o } from "react/jsx-runtime";
+import { memo as l } from "react";
+import { MONTH_LABELS as p } from "./constants/index.js";
+import { useCalendarMonthView as c } from "./hooks/useCalendarMonthView.hook.js";
+import f from "../../../../layout/grid/Grid.js";
+import h from "./components/calendar-month-button/CalendarMonthButton.js";
+const u = l(() => {
+  const {
+    selectedMonth: t,
+    focusedIndex: n,
+    buttonRefs: r,
+    handleKeyDown: a,
+    handleSelect: d,
+    isDisabled: m,
+    isToday: s
+  } = c();
+  return /* @__PURE__ */ o(
+    f,
+    {
+      columns: 3,
+      gap: "xs",
+      children: p.map((i, e) => /* @__PURE__ */ o(
+        h,
+        {
+          index: e,
+          label: i,
+          isSelected: t === e,
+          isFocused: e === n,
+          buttonRefs: r,
+          isDisabled: m,
+          isToday: s,
+          handleSelect: d,
+          handleKeyDown: a
+        },
+        e
+      ))
+    }
+  );
+});
+u.displayName = "CalendarMonthView";
+export {
+  u as default
+};
+//# sourceMappingURL=CalendarMonthView.js.map