@skdx/react 0.26.0

package/dist/calendar/Calendar.js

@@ -0,0 +1 @@
+import*as u from"react";import{createSafeContext as Oe}from"../utils/createContext.js";import{announce as Be}from"../utils/liveAnnouncer.js";import{skdxPart as Ae}from"../utils/part.js";import{Primitive as Ee}from"../utils/primitive.js";import{useControllableState as te}from"../utils/useControllableState.js";var E=new Date(2024,0,7),V=new Map;function ee(e,t){let r=V.get(e);if(r)return r;let a=t();return V.set(e,a),a}function y(e){return e??new Intl.DateTimeFormat().resolvedOptions().locale}function We(e,t="long"){let r=y(e);return ee(`m|${r}|${t}`,()=>{let a=new Intl.DateTimeFormat(r,{month:t,timeZone:"UTC"});return Array.from({length:12},(n,o)=>a.format(Date.UTC(2024,o,15)))})}function H(e,t=0,r="short"){let a=y(e),n=ee(`w|${a}|${r}`,()=>{let s=new Intl.DateTimeFormat(a,{weekday:r});return Array.from({length:7},(d,l)=>s.format(new Date(E.getFullYear(),E.getMonth(),E.getDate()+l)))}),o=(t%7+7)%7;return n.slice(o).concat(n.slice(0,o))}function Y(e){try{let t=new Intl.Locale(y(e)),r=(t.getWeekInfo?.()??t.weekInfo)?.firstDay;if(typeof r=="number")return r%7}catch{}return 0}function $(e,t){return e.toLocaleDateString(y(t),{month:"long",year:"numeric"})}function M(e,t){return e.toLocaleDateString(y(t),{weekday:"long",year:"numeric",month:"long",day:"numeric"})}function Ie(){V.clear()}import{jsx as ne}from"react/jsx-runtime";function oe(e,t){return new Date(e,t+1,0).getDate()}function R(e){return new Date(e.getFullYear(),e.getMonth(),1)}function f(e,t){let r=e.getDate(),a=new Date(e.getFullYear(),e.getMonth(),1);a.setMonth(a.getMonth()+t);let n=oe(a.getFullYear(),a.getMonth());return a.setDate(Math.min(r,n)),a}function K(e,t){return f(e,t*12)}function D(e,t){let r=new Date(e);return r.setDate(r.getDate()+t),r}function h(e,t){return!e||!t?!1:e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate()}function x(e,t){return e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()}function T(e,t){let r=new Date(e.getFullYear(),e.getMonth(),e.getDate()),a=(r.getDay()-t+7)%7;return r.setDate(r.getDate()-a),r}function ie(e,t){return D(T(e,t),6)}function C(e){return new Date(e.getFullYear(),e.getMonth(),e.getDate())}function se(e,t,r,a){let n=C(e).getTime();return!!(t&&n<C(t).getTime()||r&&n>C(r).getTime()||a?.(e))}function L(e){let t=e.getFullYear(),r=String(e.getMonth()+1).padStart(2,"0"),a=String(e.getDate()).padStart(2,"0");return`${t}-${r}-${a}`}function G(e,t){if(x(e,t))return e;let r=oe(t.getFullYear(),t.getMonth());return new Date(t.getFullYear(),t.getMonth(),Math.min(e.getDate(),r))}function de(e,t=0){let r=T(R(e),t),a=[],n=r;for(let o=0;o<6;o++){let s=[];for(let d=0;d<7;d++)s.push({date:n,outsideMonth:!x(n,e)}),n=D(n,1);a.push(s)}return a}function P(e){return e!==null&&!Array.isArray(e)&&!(e instanceof Date)}function ae(e){return e==="multiple"?[]:null}function le(e,t){return e===null?!1:Array.isArray(e)?e.some(r=>h(r,t)):P(e)?U(e,t)!==void 0:h(e,t)}function U(e,t){let r=C(t).getTime(),a=C(e.start).getTime();if(e.end===null)return r===a?"start":void 0;let n=C(e.end).getTime();if(!(r<a||r>n))return r===a?"start":r===n?"end":"middle"}function Ve(e,t,r){if(e==="single")return r;if(e==="multiple"){let n=Array.isArray(t)?t:[],o=n.filter(s=>!h(s,r));return o.length!==n.length?o:[...n,r].sort((s,d)=>s.getTime()-d.getTime())}let a=P(t)&&t.end===null?t:void 0;return a?C(r).getTime()<C(a.start).getTime()?{start:r,end:a.start}:{start:a.start,end:r}:{start:r,end:null}}function Ye(e,t){return P(e)?e.end===null?`${M(e.start,t)} selected as the range start. Select an end date.`:`Range selected, ${M(e.start,t)} to ${M(e.end,t)}.`:Array.isArray(e)?`${e.length} ${e.length===1?"date":"dates"} selected.`:""}var[$e,c]=Oe("Calendar");function Tt(){return c("useCalendarContext")}var _=u.createContext(null);function F(e){return u.useContext(_)?.gridMonth??e}function re(e){return e===null?null:Array.isArray(e)?e[0]??null:P(e)?e.start:e}var Ke=u.forwardRef(({selectionMode:e="single",value:t,defaultValue:r,onValueChange:a,month:n,defaultMonth:o,onMonthChange:s,numberOfMonths:d=1,locale:l,minDate:m,maxDate:i,weekStartsOn:b,disabled:A,isDateUnavailable:be,getSelectionAnnouncement:z,...J},ve)=>{let[w=null,Q]=te({prop:t,defaultProp:r??ae(e),onChange:p=>a?.(p??ae(e))}),X=R(o??re(w)??new Date),[v=X,j]=te({prop:n,defaultProp:X,onChange:s}),[Ne,Se]=u.useState(()=>re(w)??v),N=b??Y(l),He=u.useMemo(()=>{let p=H(l,N,"short"),g=H(l,N,"long");return p.map((S,Fe)=>({short:S,long:g[Fe]}))},[l,N]),Te=u.useMemo(()=>Array.from({length:Math.max(1,d)},(p,g)=>f(v,g)),[v,d]),Le=u.useCallback(p=>{let g=Ve(e,w,p);Q(g);let S=(z??Ye)(g,l);S&&Be(S)},[e,w,Q,l,z]),Ge=u.useCallback(p=>j(R(p)),[j]);return ne($e,{value:w,selectionMode:e,month:v,months:Te,focusedDate:Ne,weekStartsOn:N,locale:l,weekDayNames:He,minDate:m,maxDate:i,disabled:A,isDateUnavailable:be,onValueChange:Le,onMonthChange:Ge,setFocusedDate:Se,children:ne(Ee.div,{...J,...Ae("calendar","root",J.className),ref:ve})})});Ke.displayName="Calendar";import*as me from"react";import{skdxPart as Ue}from"../utils/part.js";import{Primitive as _e}from"../utils/primitive.js";import{jsx as qe}from"react/jsx-runtime";var ce=me.forwardRef((e,t)=>qe(_e.div,{...e,...Ue("calendar","header",e.className),ref:t}));ce.displayName="CalendarHeader";import*as ue from"react";import{skdxPart as Ze}from"../utils/part.js";import{Primitive as ze}from"../utils/primitive.js";import{jsx as Je}from"react/jsx-runtime";var fe=ue.forwardRef(({monthOffset:e=0,children:t,...r},a)=>{let n=c("CalendarHeading"),o=n.months[e]??n.month;return Je(ze.div,{...r,...Ze("calendar","heading",r.className),ref:a,children:t??$(o,n.locale)})});fe.displayName="CalendarHeading";import*as pe from"react";import{skdxPart as Qe}from"../utils/part.js";import{composeEventHandlers as Xe,Primitive as je}from"../utils/primitive.js";import{jsx as et}from"react/jsx-runtime";var Ce=pe.forwardRef((e,t)=>{let r=c("CalendarPreviousButton");return et(je.button,{type:"button","aria-label":"Previous month",...e,...Qe("calendar","previous-button",e.className),ref:t,onClick:Xe(e.onClick,()=>{let a=f(r.month,-1);r.onMonthChange(a),r.setFocusedDate(G(r.focusedDate,a))})})});Ce.displayName="CalendarPreviousButton";import*as De from"react";import{skdxPart as tt}from"../utils/part.js";import{composeEventHandlers as at,Primitive as rt}from"../utils/primitive.js";import{jsx as nt}from"react/jsx-runtime";var ge=De.forwardRef((e,t)=>{let r=c("CalendarNextButton");return nt(rt.button,{type:"button","aria-label":"Next month",...e,...tt("calendar","next-button",e.className),ref:t,onClick:at(e.onClick,()=>{let a=f(r.month,1);r.onMonthChange(a),r.setFocusedDate(G(r.focusedDate,a))})})});ge.displayName="CalendarNextButton";import*as W from"react";import{directionalKey as ot,useDirection as it}from"../utils/direction.js";import{skdxPart as st}from"../utils/part.js";import{composeEventHandlers as dt,Primitive as lt}from"../utils/primitive.js";import{jsx as ye}from"react/jsx-runtime";var he=W.forwardRef(({monthOffset:e=0,...t},r)=>{let a=c("CalendarGrid"),n=it(),o=a.months[e]??a.month,s=W.useMemo(()=>({gridMonth:o}),[o]),d=m=>{a.months.some(i=>x(m,i))||a.onMonthChange(R(m)),a.setFocusedDate(m),requestAnimationFrame(()=>{let i=L(m);document.querySelector(`[data-skdx-calendar-cell="${i}"]`)?.focus()})},l=m=>{let i;switch(ot(m.key,m.currentTarget,n)){case"ArrowLeft":i=D(a.focusedDate,-1);break;case"ArrowRight":i=D(a.focusedDate,1);break;case"ArrowUp":i=D(a.focusedDate,-7);break;case"ArrowDown":i=D(a.focusedDate,7);break;case"Home":i=T(a.focusedDate,a.weekStartsOn);break;case"End":i=ie(a.focusedDate,a.weekStartsOn);break;case"PageUp":i=m.shiftKey?K(a.focusedDate,-1):f(a.focusedDate,-1);break;case"PageDown":i=m.shiftKey?K(a.focusedDate,1):f(a.focusedDate,1);break;default:return}m.preventDefault(),d(i)};return ye(_.Provider,{value:s,children:ye(lt.div,{role:"grid","aria-multiselectable":a.selectionMode!=="single",...t,...st("calendar","grid",t.className),ref:r,onKeyDown:dt(t.onKeyDown,l)})})});he.displayName="CalendarGrid";import*as ke from"react";import{skdxPart as Dt}from"../utils/part.js";import{Primitive as gt}from"../utils/primitive.js";import*as xe from"react";import{skdxPart as mt}from"../utils/part.js";import{Primitive as ct}from"../utils/primitive.js";import{jsx as ut}from"react/jsx-runtime";var k=xe.forwardRef((e,t)=>ut(ct.div,{role:"row",...e,...mt("calendar","row",e.className),ref:t}));k.displayName="CalendarRow";import*as Pe from"react";import{skdxPart as ft}from"../utils/part.js";import{Primitive as pt}from"../utils/primitive.js";import{jsx as Ct}from"react/jsx-runtime";var I=Pe.forwardRef((e,t)=>Ct(pt.div,{role:"columnheader",...e,...ft("calendar","week-day",e.className),ref:t}));I.displayName="CalendarWeekDay";import{jsx as q}from"react/jsx-runtime";var we=ke.forwardRef(({children:e,...t},r)=>{let a=c("CalendarGridHead");return q(gt.div,{role:"rowgroup",...t,...Dt("calendar","grid-head",t.className),ref:r,children:e??q(k,{children:a.weekDayNames.map(n=>q(I,{"aria-label":n.long,children:n.short},n.long))})})});we.displayName="CalendarGridHead";import*as B from"react";import{skdxPart as kt}from"../utils/part.js";import{Primitive as wt}from"../utils/primitive.js";import*as Me from"react";import{skdxPart as yt}from"../utils/part.js";import{composeEventHandlers as ht,Primitive as xt}from"../utils/primitive.js";import{jsx as Pt}from"react/jsx-runtime";var O=Me.forwardRef(({date:e,...t},r)=>{let a=c("CalendarCell"),n=F(a.month),o=L(e),s=!x(e,n),d=s||se(e,a.minDate,a.maxDate,a.disabled),l=!d&&(a.isDateUnavailable?.(o)??!1),m=le(a.value,e),i=P(a.value)?U(a.value,e):void 0,b=h(e,new Date),A=h(e,a.focusedDate);return Pt(xt.button,{type:"button",role:"gridcell","aria-selected":m,"aria-disabled":l||void 0,"data-skdx-calendar-cell":o,"data-state":m?"selected":void 0,"data-today":b?"":void 0,"data-outside-month":s?"":void 0,"data-disabled":d?"":void 0,"data-unavailable":l?"":void 0,"data-range-start":i==="start"?"":void 0,"data-range-middle":i==="middle"?"":void 0,"data-range-end":i==="end"?"":void 0,tabIndex:A?0:-1,disabled:d,...t,...yt("calendar","cell",t.className),ref:r,onClick:ht(t.onClick,()=>{if(!d){if(l){a.setFocusedDate(e);return}a.onValueChange(e),a.setFocusedDate(e)}}),children:t.children??e.getDate()})});O.displayName="CalendarCell";import{jsx as Z}from"react/jsx-runtime";var Re=B.forwardRef(({children:e,...t},r)=>{let a=c("CalendarGridBody"),n=F(a.month),o=B.useMemo(()=>de(n,a.weekStartsOn),[n,a.weekStartsOn]);return Z(wt.div,{role:"rowgroup",...t,...kt("calendar","grid-body",t.className),ref:r,children:e??o.map(s=>Z(k,{children:s.map(({date:d})=>Z(O,{date:d},d.toISOString()))},s[0].date.toISOString()))})});Re.displayName="CalendarGridBody";export{Ke as Calendar,O as CalendarCell,he as CalendarGrid,Re as CalendarGridBody,_ as CalendarGridContext,we as CalendarGridHead,ce as CalendarHeader,fe as CalendarHeading,ge as CalendarNextButton,Ce as CalendarPreviousButton,$e as CalendarProvider,k as CalendarRow,I as CalendarWeekDay,D as addDays,f as addMonths,K as addYears,re as anchorOf,G as clampToMonth,Ie as clearLocaleNameCache,ae as emptySelection,ie as endOfWeek,M as formatDateLabel,$ as formatMonthLabel,oe as getDaysInMonth,Y as getLocaleWeekStartsOn,We as getMonthNames,de as getVisibleWeeks,H as getWeekDayNames,se as isDateDisabled,P as isDateRange,le as isDateSelected,h as isSameDay,x as isSameMonth,Ve as nextSelection,U as rangePositionOf,y as resolveLocale,Ye as selectionAnnouncement,R as startOfMonth,T as startOfWeek,C as stripTime,L as toISODateString,Tt as useCalendarContext,c as useCalendarContextInternal,F as useCalendarGridMonth};

package/dist/calendar/CalendarCell.d.cts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import type { CalendarCellProps } from './types.cjs';
+/**
+ * Single selectable `role="gridcell"` date within a {@link Calendar}. Renders
+ * a `<button type="button">` with `aria-selected`, `data-state="selected"`
+ * when chosen, `data-today`, `data-outside-month`, `data-disabled`, and a
+ * roving `tabIndex` (`0` only for the currently focused date, `-1` otherwise,
+ * per the WAI-ARIA grid pattern). Clicking selects the date. Defaults to the
+ * day-of-month number as its content.
+ *
+ * In `range` selection mode, every cell from the range's start to its end is
+ * `aria-selected`, and carries exactly one of `data-range-start`,
+ * `data-range-middle` or `data-range-end` for styling the band.
+ *
+ * Two distinct ways to refuse a date:
+ * - **disabled** — outside `minDate`/`maxDate`, outside the displayed month,
+ *   or matching the `disabled` predicate. Natively `disabled`, so it is not
+ *   focusable and does not fire clicks.
+ * - **unavailable** — matching `isDateUnavailable`. Focusable and announced as
+ *   `aria-disabled="true"` with a `data-unavailable` hook, so a screen-reader
+ *   user can land on it and hear that it is taken; clicks are ignored.
+ *
+ * @example
+ * ```tsx
+ * <CalendarRow>
+ *   {week.map(({ date }) => (
+ *     <CalendarCell date={date} key={date.toISOString()} />
+ *   ))}
+ * </CalendarRow>
+ * ```
+ */
+export declare const CalendarCell: React.ForwardRefExoticComponent<Omit<CalendarCellProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/calendar/CalendarCell.d.ts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import type { CalendarCellProps } from './types.js';
+/**
+ * Single selectable `role="gridcell"` date within a {@link Calendar}. Renders
+ * a `<button type="button">` with `aria-selected`, `data-state="selected"`
+ * when chosen, `data-today`, `data-outside-month`, `data-disabled`, and a
+ * roving `tabIndex` (`0` only for the currently focused date, `-1` otherwise,
+ * per the WAI-ARIA grid pattern). Clicking selects the date. Defaults to the
+ * day-of-month number as its content.
+ *
+ * In `range` selection mode, every cell from the range's start to its end is
+ * `aria-selected`, and carries exactly one of `data-range-start`,
+ * `data-range-middle` or `data-range-end` for styling the band.
+ *
+ * Two distinct ways to refuse a date:
+ * - **disabled** — outside `minDate`/`maxDate`, outside the displayed month,
+ *   or matching the `disabled` predicate. Natively `disabled`, so it is not
+ *   focusable and does not fire clicks.
+ * - **unavailable** — matching `isDateUnavailable`. Focusable and announced as
+ *   `aria-disabled="true"` with a `data-unavailable` hook, so a screen-reader
+ *   user can land on it and hear that it is taken; clicks are ignored.
+ *
+ * @example
+ * ```tsx
+ * <CalendarRow>
+ *   {week.map(({ date }) => (
+ *     <CalendarCell date={date} key={date.toISOString()} />
+ *   ))}
+ * </CalendarRow>
+ * ```
+ */
+export declare const CalendarCell: React.ForwardRefExoticComponent<Omit<CalendarCellProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/calendar/CalendarGrid.d.cts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import type { CalendarGridProps } from './types.cjs';
+/**
+ * `role="grid"` container for a {@link Calendar}'s date cells, owning
+ * arrow-key navigation of the roving-focus date: Arrow Left/Right/Up/Down
+ * move by day/week, Home/End jump to the start/end of the focused week,
+ * PageUp/PageDown move by month (Shift+PageUp/PageDown move by year).
+ * Navigating into a different month calls `onMonthChange` automatically.
+ *
+ * With a multi-month `Calendar` (`numberOfMonths`), render one grid per month
+ * and give each its `monthOffset` — that is what tells the grid's cells which
+ * month counts as "outside".
+ *
+ * @example
+ * ```tsx
+ * <CalendarGrid>
+ *   <CalendarGridHead />
+ *   <CalendarGridBody>
+ *     <CalendarRow>
+ *       <CalendarCell date={new Date()} />
+ *     </CalendarRow>
+ *   </CalendarGridBody>
+ * </CalendarGrid>
+ * ```
+ */
+export declare const CalendarGrid: React.ForwardRefExoticComponent<Omit<CalendarGridProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarGrid.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import type { CalendarGridProps } from './types.js';
+/**
+ * `role="grid"` container for a {@link Calendar}'s date cells, owning
+ * arrow-key navigation of the roving-focus date: Arrow Left/Right/Up/Down
+ * move by day/week, Home/End jump to the start/end of the focused week,
+ * PageUp/PageDown move by month (Shift+PageUp/PageDown move by year).
+ * Navigating into a different month calls `onMonthChange` automatically.
+ *
+ * With a multi-month `Calendar` (`numberOfMonths`), render one grid per month
+ * and give each its `monthOffset` — that is what tells the grid's cells which
+ * month counts as "outside".
+ *
+ * @example
+ * ```tsx
+ * <CalendarGrid>
+ *   <CalendarGridHead />
+ *   <CalendarGridBody>
+ *     <CalendarRow>
+ *       <CalendarCell date={new Date()} />
+ *     </CalendarRow>
+ *   </CalendarGridBody>
+ * </CalendarGrid>
+ * ```
+ */
+export declare const CalendarGrid: React.ForwardRefExoticComponent<Omit<CalendarGridProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarGridBody.d.cts

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import type { CalendarGridBodyProps } from './types.cjs';
+/**
+ * `role="rowgroup"` wrapper for a {@link Calendar}'s week rows.
+ *
+ * **Given no children it renders the displayed month itself** — one
+ * `CalendarRow` per visible week, one `CalendarCell` per day, taken from the
+ * live `month` in context. That is the composition a consumer writes first, and
+ * it is now the correct one.
+ *
+ * It did not used to be. An empty body rendered an empty rowgroup, so the
+ * calendar showed a heading and weekday names above no days at all; and the
+ * example that worked around it mapped `getVisibleWeeks(new Date())` — a month
+ * captured once at render — so the days it did draw never moved when the month
+ * changed. Both roads ended at "the days do not change", with the heading
+ * updating over a static grid, because `Previous`/`Next` change `month` and
+ * nothing was reading it.
+ *
+ * Pass children to take over completely — to decorate a day, group by week
+ * number, or render anything other than a plain cell. Children always win; this
+ * only fills an empty body.
+ *
+ * `rowgroup` rather than a bare `<div>` so `role="grid"` sees only
+ * `row`/`rowgroup` children — a plain `div` between the grid and its rows is
+ * what axe reports as `aria-required-children`.
+ *
+ * @example
+ * ```tsx
+ * // The whole grid, driven by the Calendar's own month.
+ * <CalendarGrid>
+ *   <CalendarGridHead />
+ *   <CalendarGridBody />
+ * </CalendarGrid>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Taking over the rows. Read `month` from context — never `new Date()`, or
+ * // the grid stops following the Previous/Next buttons.
+ * const { month, weekStartsOn } = useCalendarContext();
+ * <CalendarGridBody>
+ *   {getVisibleWeeks(month, weekStartsOn).map((week) => (
+ *     <CalendarRow key={week[0].date.toISOString()}>
+ *       {week.map(({ date }) => (
+ *         <CalendarCell date={date} key={date.toISOString()}>
+ *           {date.getDate()}
+ *           {hasEvent(date) ? <Dot /> : null}
+ *         </CalendarCell>
+ *       ))}
+ *     </CalendarRow>
+ *   ))}
+ * </CalendarGridBody>
+ * ```
+ */
+export declare const CalendarGridBody: React.ForwardRefExoticComponent<Omit<CalendarGridBodyProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarGridBody.d.ts

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import type { CalendarGridBodyProps } from './types.js';
+/**
+ * `role="rowgroup"` wrapper for a {@link Calendar}'s week rows.
+ *
+ * **Given no children it renders the displayed month itself** — one
+ * `CalendarRow` per visible week, one `CalendarCell` per day, taken from the
+ * live `month` in context. That is the composition a consumer writes first, and
+ * it is now the correct one.
+ *
+ * It did not used to be. An empty body rendered an empty rowgroup, so the
+ * calendar showed a heading and weekday names above no days at all; and the
+ * example that worked around it mapped `getVisibleWeeks(new Date())` — a month
+ * captured once at render — so the days it did draw never moved when the month
+ * changed. Both roads ended at "the days do not change", with the heading
+ * updating over a static grid, because `Previous`/`Next` change `month` and
+ * nothing was reading it.
+ *
+ * Pass children to take over completely — to decorate a day, group by week
+ * number, or render anything other than a plain cell. Children always win; this
+ * only fills an empty body.
+ *
+ * `rowgroup` rather than a bare `<div>` so `role="grid"` sees only
+ * `row`/`rowgroup` children — a plain `div` between the grid and its rows is
+ * what axe reports as `aria-required-children`.
+ *
+ * @example
+ * ```tsx
+ * // The whole grid, driven by the Calendar's own month.
+ * <CalendarGrid>
+ *   <CalendarGridHead />
+ *   <CalendarGridBody />
+ * </CalendarGrid>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Taking over the rows. Read `month` from context — never `new Date()`, or
+ * // the grid stops following the Previous/Next buttons.
+ * const { month, weekStartsOn } = useCalendarContext();
+ * <CalendarGridBody>
+ *   {getVisibleWeeks(month, weekStartsOn).map((week) => (
+ *     <CalendarRow key={week[0].date.toISOString()}>
+ *       {week.map(({ date }) => (
+ *         <CalendarCell date={date} key={date.toISOString()}>
+ *           {date.getDate()}
+ *           {hasEvent(date) ? <Dot /> : null}
+ *         </CalendarCell>
+ *       ))}
+ *     </CalendarRow>
+ *   ))}
+ * </CalendarGridBody>
+ * ```
+ */
+export declare const CalendarGridBody: React.ForwardRefExoticComponent<Omit<CalendarGridBodyProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarGridHead.d.cts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import type { CalendarGridHeadProps } from './types.cjs';
+/**
+ * `role="rowgroup"` wrapper for a {@link Calendar}'s weekday header.
+ *
+ * Left childless it renders the weekday row itself, from the `Calendar`'s
+ * `locale` and `weekStartsOn` — the visible label is the short name, with the
+ * full name as `aria-label` so screen readers say "Monday", not "Mon". That is
+ * why no framework ships a hardcoded `['Su', 'Mo', …]` table any more.
+ *
+ * `rowgroup`, not `row`: `role="grid"` requires `row`/`rowgroup` children and
+ * `role="columnheader"` requires a `row` parent, so the old `row`-inside-`row`
+ * nesting is exactly what axe flagged as
+ * `aria-required-children`/`aria-required-parent`.
+ *
+ * @example
+ * ```tsx
+ * <CalendarGridHead />
+ * ```
+ */
+export declare const CalendarGridHead: React.ForwardRefExoticComponent<Omit<CalendarGridHeadProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarGridHead.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import type { CalendarGridHeadProps } from './types.js';
+/**
+ * `role="rowgroup"` wrapper for a {@link Calendar}'s weekday header.
+ *
+ * Left childless it renders the weekday row itself, from the `Calendar`'s
+ * `locale` and `weekStartsOn` — the visible label is the short name, with the
+ * full name as `aria-label` so screen readers say "Monday", not "Mon". That is
+ * why no framework ships a hardcoded `['Su', 'Mo', …]` table any more.
+ *
+ * `rowgroup`, not `row`: `role="grid"` requires `row`/`rowgroup` children and
+ * `role="columnheader"` requires a `row` parent, so the old `row`-inside-`row`
+ * nesting is exactly what axe flagged as
+ * `aria-required-children`/`aria-required-parent`.
+ *
+ * @example
+ * ```tsx
+ * <CalendarGridHead />
+ * ```
+ */
+export declare const CalendarGridHead: React.ForwardRefExoticComponent<Omit<CalendarGridHeadProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarHeader.d.cts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { CalendarHeaderProps } from './types.cjs';
+/**
+ * Purely presentational wrapper for a {@link Calendar}'s month navigation
+ * row. Renders a plain `<div>`; typically holds `CalendarPreviousButton`,
+ * `CalendarHeading` and `CalendarNextButton`.
+ *
+ * @example
+ * ```tsx
+ * <CalendarHeader>
+ *   <CalendarPreviousButton>‹</CalendarPreviousButton>
+ *   <CalendarHeading />
+ *   <CalendarNextButton>›</CalendarNextButton>
+ * </CalendarHeader>
+ * ```
+ */
+export declare const CalendarHeader: React.ForwardRefExoticComponent<Omit<CalendarHeaderProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarHeader.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { CalendarHeaderProps } from './types.js';
+/**
+ * Purely presentational wrapper for a {@link Calendar}'s month navigation
+ * row. Renders a plain `<div>`; typically holds `CalendarPreviousButton`,
+ * `CalendarHeading` and `CalendarNextButton`.
+ *
+ * @example
+ * ```tsx
+ * <CalendarHeader>
+ *   <CalendarPreviousButton>‹</CalendarPreviousButton>
+ *   <CalendarHeading />
+ *   <CalendarNextButton>›</CalendarNextButton>
+ * </CalendarHeader>
+ * ```
+ */
+export declare const CalendarHeader: React.ForwardRefExoticComponent<Omit<CalendarHeaderProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarHeading.d.cts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { CalendarHeadingProps } from './types.cjs';
+/**
+ * Label for a {@link Calendar}'s displayed month. Left childless it renders
+ * the month and year formatted for the `Calendar`'s `locale` via `Intl`, so
+ * no consumer hardcodes an English month name; pass children to override.
+ *
+ * With a multi-month `Calendar` (`numberOfMonths`), `monthOffset` selects
+ * which of the displayed months to label.
+ *
+ * @example
+ * ```tsx
+ * <CalendarHeading />
+ * <CalendarHeading monthOffset={1} />
+ * ```
+ */
+export declare const CalendarHeading: React.ForwardRefExoticComponent<Omit<CalendarHeadingProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarHeading.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { CalendarHeadingProps } from './types.js';
+/**
+ * Label for a {@link Calendar}'s displayed month. Left childless it renders
+ * the month and year formatted for the `Calendar`'s `locale` via `Intl`, so
+ * no consumer hardcodes an English month name; pass children to override.
+ *
+ * With a multi-month `Calendar` (`numberOfMonths`), `monthOffset` selects
+ * which of the displayed months to label.
+ *
+ * @example
+ * ```tsx
+ * <CalendarHeading />
+ * <CalendarHeading monthOffset={1} />
+ * ```
+ */
+export declare const CalendarHeading: React.ForwardRefExoticComponent<Omit<CalendarHeadingProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarNextButton.d.cts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { CalendarNextButtonProps } from './types.cjs';
+/**
+ * Navigates the {@link Calendar} to the next month on click. Renders a
+ * `<button type="button">` with a default `aria-label="Next month"`, and
+ * moves the roving-focus date to the same day (clamped) in the new month.
+ *
+ * @example
+ * ```tsx
+ * <CalendarHeader>
+ *   <CalendarPreviousButton>‹</CalendarPreviousButton>
+ *   <CalendarHeading />
+ *   <CalendarNextButton>›</CalendarNextButton>
+ * </CalendarHeader>
+ * ```
+ */
+export declare const CalendarNextButton: React.ForwardRefExoticComponent<Omit<CalendarNextButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/calendar/CalendarNextButton.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { CalendarNextButtonProps } from './types.js';
+/**
+ * Navigates the {@link Calendar} to the next month on click. Renders a
+ * `<button type="button">` with a default `aria-label="Next month"`, and
+ * moves the roving-focus date to the same day (clamped) in the new month.
+ *
+ * @example
+ * ```tsx
+ * <CalendarHeader>
+ *   <CalendarPreviousButton>‹</CalendarPreviousButton>
+ *   <CalendarHeading />
+ *   <CalendarNextButton>›</CalendarNextButton>
+ * </CalendarHeader>
+ * ```
+ */
+export declare const CalendarNextButton: React.ForwardRefExoticComponent<Omit<CalendarNextButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/calendar/CalendarPreviousButton.d.cts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { CalendarPreviousButtonProps } from './types.cjs';
+/**
+ * Navigates the {@link Calendar} to the previous month on click. Renders a
+ * `<button type="button">` with a default `aria-label="Previous month"`,
+ * and moves the roving-focus date to the same day (clamped) in the new month.
+ *
+ * @example
+ * ```tsx
+ * <CalendarHeader>
+ *   <CalendarPreviousButton>‹</CalendarPreviousButton>
+ *   <CalendarHeading />
+ *   <CalendarNextButton>›</CalendarNextButton>
+ * </CalendarHeader>
+ * ```
+ */
+export declare const CalendarPreviousButton: React.ForwardRefExoticComponent<Omit<CalendarPreviousButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/calendar/CalendarPreviousButton.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import type { CalendarPreviousButtonProps } from './types.js';
+/**
+ * Navigates the {@link Calendar} to the previous month on click. Renders a
+ * `<button type="button">` with a default `aria-label="Previous month"`,
+ * and moves the roving-focus date to the same day (clamped) in the new month.
+ *
+ * @example
+ * ```tsx
+ * <CalendarHeader>
+ *   <CalendarPreviousButton>‹</CalendarPreviousButton>
+ *   <CalendarHeading />
+ *   <CalendarNextButton>›</CalendarNextButton>
+ * </CalendarHeader>
+ * ```
+ */
+export declare const CalendarPreviousButton: React.ForwardRefExoticComponent<Omit<CalendarPreviousButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/calendar/CalendarRow.d.cts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { CalendarRowProps } from './types.cjs';
+/**
+ * `role="row"` wrapper for one week of `CalendarWeekDay` or `CalendarCell`
+ * children within a {@link Calendar}. Renders a plain `<div>`.
+ *
+ * @example
+ * ```tsx
+ * <CalendarRow>
+ *   {week.map(({ date }) => (
+ *     <CalendarCell date={date} key={date.toISOString()} />
+ *   ))}
+ * </CalendarRow>
+ * ```
+ */
+export declare const CalendarRow: React.ForwardRefExoticComponent<Omit<CalendarRowProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarRow.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { CalendarRowProps } from './types.js';
+/**
+ * `role="row"` wrapper for one week of `CalendarWeekDay` or `CalendarCell`
+ * children within a {@link Calendar}. Renders a plain `<div>`.
+ *
+ * @example
+ * ```tsx
+ * <CalendarRow>
+ *   {week.map(({ date }) => (
+ *     <CalendarCell date={date} key={date.toISOString()} />
+ *   ))}
+ * </CalendarRow>
+ * ```
+ */
+export declare const CalendarRow: React.ForwardRefExoticComponent<Omit<CalendarRowProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarWeekDay.d.cts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { CalendarWeekDayProps } from './types.cjs';
+/**
+ * Single `role="columnheader"` cell labeling a weekday in a {@link Calendar}'s
+ * grid header. Renders a plain `<div>`.
+ *
+ * @example
+ * ```tsx
+ * <CalendarGridHead>
+ *   <CalendarRow>
+ *     <CalendarWeekDay>Su</CalendarWeekDay>
+ *   </CalendarRow>
+ * </CalendarGridHead>
+ * ```
+ */
+export declare const CalendarWeekDay: React.ForwardRefExoticComponent<Omit<CalendarWeekDayProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/CalendarWeekDay.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { CalendarWeekDayProps } from './types.js';
+/**
+ * Single `role="columnheader"` cell labeling a weekday in a {@link Calendar}'s
+ * grid header. Renders a plain `<div>`.
+ *
+ * @example
+ * ```tsx
+ * <CalendarGridHead>
+ *   <CalendarRow>
+ *     <CalendarWeekDay>Su</CalendarWeekDay>
+ *   </CalendarRow>
+ * </CalendarGridHead>
+ * ```
+ */
+export declare const CalendarWeekDay: React.ForwardRefExoticComponent<Omit<CalendarWeekDayProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/calendar/index.d.cts

@@ -0,0 +1,13 @@
+export * from './Calendar.cjs';
+export { clearLocaleNameCache, formatDateLabel, formatMonthLabel, getLocaleWeekStartsOn, getMonthNames, getWeekDayNames, resolveLocale, type NameWidth, } from './locale.cjs';
+export { CalendarHeader } from './CalendarHeader.cjs';
+export { CalendarHeading } from './CalendarHeading.cjs';
+export { CalendarPreviousButton } from './CalendarPreviousButton.cjs';
+export { CalendarNextButton } from './CalendarNextButton.cjs';
+export { CalendarGrid } from './CalendarGrid.cjs';
+export { CalendarGridHead } from './CalendarGridHead.cjs';
+export { CalendarWeekDay } from './CalendarWeekDay.cjs';
+export { CalendarGridBody } from './CalendarGridBody.cjs';
+export { CalendarRow } from './CalendarRow.cjs';
+export { CalendarCell } from './CalendarCell.cjs';
+export type { CalendarProps, CalendarHeaderProps, CalendarHeadingProps, CalendarPreviousButtonProps, CalendarNextButtonProps, CalendarGridProps, CalendarGridHeadProps, CalendarWeekDayProps, CalendarGridBodyProps, CalendarRowProps, CalendarCellProps, CalendarDay, CalendarSelectionMode, CalendarValue, DateRange, RangePosition, } from './types.cjs';

package/dist/calendar/index.d.ts

@@ -0,0 +1,13 @@
+export * from './Calendar.js';
+export { clearLocaleNameCache, formatDateLabel, formatMonthLabel, getLocaleWeekStartsOn, getMonthNames, getWeekDayNames, resolveLocale, type NameWidth, } from './locale.js';
+export { CalendarHeader } from './CalendarHeader.js';
+export { CalendarHeading } from './CalendarHeading.js';
+export { CalendarPreviousButton } from './CalendarPreviousButton.js';
+export { CalendarNextButton } from './CalendarNextButton.js';
+export { CalendarGrid } from './CalendarGrid.js';
+export { CalendarGridHead } from './CalendarGridHead.js';
+export { CalendarWeekDay } from './CalendarWeekDay.js';
+export { CalendarGridBody } from './CalendarGridBody.js';
+export { CalendarRow } from './CalendarRow.js';
+export { CalendarCell } from './CalendarCell.js';
+export type { CalendarProps, CalendarHeaderProps, CalendarHeadingProps, CalendarPreviousButtonProps, CalendarNextButtonProps, CalendarGridProps, CalendarGridHeadProps, CalendarWeekDayProps, CalendarGridBodyProps, CalendarRowProps, CalendarCellProps, CalendarDay, CalendarSelectionMode, CalendarValue, DateRange, RangePosition, } from './types.js';

package/dist/calendar/locale.d.cts

@@ -0,0 +1,45 @@
+/**
+ * Locale-derived month and weekday names for {@link Calendar}, built entirely
+ * on `Intl` — no bundled name tables, no date library, no new dependency.
+ *
+ * Every framework package carries its own copy of these helpers (the same way
+ * each carries its own `dateMath`), so a consumer never pays for a shared
+ * runtime package just to render a month heading.
+ */
+/** How much of a name to render — the `Intl.DateTimeFormat` `month`/`weekday` widths. */
+export type NameWidth = 'narrow' | 'short' | 'long';
+/** The runtime's own locale, used whenever `locale` is omitted — matches what `toLocaleDateString()` would pick. */
+export declare function resolveLocale(locale?: string): string;
+/**
+ * The twelve month names of `locale`, January first, at the requested width.
+ *
+ * @example
+ * ```ts
+ * getMonthNames('fr-FR')[0]; // 'janvier'
+ * ```
+ */
+export declare function getMonthNames(locale?: string, width?: NameWidth): string[];
+/**
+ * The seven weekday names of `locale` at the requested width, rotated so index
+ * `0` is `weekStartsOn` (`0` = Sunday … `6` = Saturday).
+ *
+ * @example
+ * ```ts
+ * getWeekDayNames('en-GB', 1, 'short'); // ['Mon', 'Tue', … 'Sun']
+ * ```
+ */
+export declare function getWeekDayNames(locale?: string, weekStartsOn?: number, width?: NameWidth): string[];
+/**
+ * The first day of the week `locale` uses (`0` = Sunday … `6` = Saturday),
+ * read from `Intl.Locale`'s week info where the engine exposes it.
+ *
+ * Falls back to `0` (Sunday) on engines without `getWeekInfo`/`weekInfo`
+ * — Firefox still lacks it as of 2026.
+ */
+export declare function getLocaleWeekStartsOn(locale?: string): 0 | 1 | 2 | 3 | 4 | 5 | 6;
+/** The month heading label for `month` (e.g. `'janvier 2026'`), formatted for `locale`. */
+export declare function formatMonthLabel(month: Date, locale?: string): string;
+/** A full, spoken-friendly date label (e.g. `'Monday, January 5, 2026'`) for live-region announcements. */
+export declare function formatDateLabel(date: Date, locale?: string): string;
+/** @internal Drops every memoized name list. Only needed by tests that switch locales in one process. */
+export declare function clearLocaleNameCache(): void;