@dev-dga/react 0.12.1 → 0.12.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/README.md +14 -8
  3. package/dist/{chunk-GCOBDP4W.js → chunk-AR7K3D3Z.js} +9 -1
  4. package/dist/chunk-AR7K3D3Z.js.map +1 -0
  5. package/dist/{chunk-7GWM7F5C.js → chunk-BC2DJQ3Y.js} +23 -14
  6. package/dist/chunk-BC2DJQ3Y.js.map +1 -0
  7. package/dist/{chunk-A4HS7CYD.cjs → chunk-NQGMWK5C.cjs} +10 -2
  8. package/dist/chunk-NQGMWK5C.cjs.map +1 -0
  9. package/dist/{chunk-3JHIEAJG.cjs → chunk-SZ2AUE62.cjs} +33 -24
  10. package/dist/chunk-SZ2AUE62.cjs.map +1 -0
  11. package/dist/{chunk-SJN37JUC.cjs → chunk-TQLZL5MI.cjs} +29 -20
  12. package/dist/chunk-TQLZL5MI.cjs.map +1 -0
  13. package/dist/{chunk-P7XKSXHH.js → chunk-XIJKAUCN.js} +20 -11
  14. package/dist/chunk-XIJKAUCN.js.map +1 -0
  15. package/dist/components/DatePicker/DatePicker.cjs +3 -3
  16. package/dist/components/DatePicker/DatePicker.js +2 -2
  17. package/dist/components/DatePicker/index.cjs +3 -3
  18. package/dist/components/DatePicker/index.js +2 -2
  19. package/dist/components/DateRangePicker/DateRangePicker.cjs +3 -3
  20. package/dist/components/DateRangePicker/DateRangePicker.js +2 -2
  21. package/dist/components/DateRangePicker/index.cjs +3 -3
  22. package/dist/components/DateRangePicker/index.js +2 -2
  23. package/dist/index.cjs +25 -25
  24. package/dist/index.cjs.map +1 -1
  25. package/dist/index.js +24 -24
  26. package/dist/internal/calendar/calendar-core.cjs +6 -2
  27. package/dist/internal/calendar/calendar-core.cjs.map +1 -1
  28. package/dist/internal/calendar/calendar-core.js +7 -3
  29. package/dist/internal/calendar/index.cjs +6 -2
  30. package/dist/internal/calendar/index.cjs.map +1 -1
  31. package/dist/internal/calendar/index.js +7 -3
  32. package/package.json +3 -3
  33. package/dist/chunk-3JHIEAJG.cjs.map +0 -1
  34. package/dist/chunk-7GWM7F5C.js.map +0 -1
  35. package/dist/chunk-A4HS7CYD.cjs.map +0 -1
  36. package/dist/chunk-GCOBDP4W.js.map +0 -1
  37. package/dist/chunk-P7XKSXHH.js.map +0 -1
  38. package/dist/chunk-SJN37JUC.cjs.map +0 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @dev-dga/react
2
2
 
3
+ ## 0.12.2
4
+
5
+ ### Patch Changes
6
+
7
+ - **DatePicker / DateRangePicker: locale-aware weekday header.** The calendar weekday row now renders the SDGA 2-letter form (`Su Mo Tu We Th Fr Sa`) in Latin locales, and distinct single letters (`ح ن ث ر خ ج س`) in Arabic, instead of collapsing every Arabic day to the shared article "ال". No API change.
8
+ - **Docs.** Refreshed the README component list for the 0.12.0 renames (`Input`→`TextInput`, `Combobox`→`Dropdown`, `Stat`→`Metric`, `Steps`→`ProgressIndicator`, `Alert`→`InlineAlert`, `Toast`→`NotificationToast`, `Badge`→`Tag`) and added the newer components; added an Accessibility section linking the new WCAG 2.2 AA conformance statement.
9
+
3
10
  ## 0.12.1
4
11
 
5
12
  ### Patch Changes
package/README.md CHANGED
@@ -17,13 +17,13 @@ Requires `react@^19` and `react-dom@^19` (peer dependencies).
17
17
  ## Usage
18
18
 
19
19
  ```tsx
20
- import '@dev-dga/css'; // required , components ship no styles
21
- import { DgaProvider, Button, Input, Select, SelectItem, Switch } from '@dev-dga/react';
20
+ import '@dev-dga/css'; // required: components ship no styles
21
+ import { DgaProvider, Button, TextInput, Select, SelectItem, Switch } from '@dev-dga/react';
22
22
 
23
23
  export default function App() {
24
24
  return (
25
25
  <DgaProvider>
26
- <Input label="Email" type="email" helperText="We'll never share it." />
26
+ <TextInput label="Email" type="email" helperText="We'll never share it." />
27
27
  <Select label="Country" placeholder="Choose…">
28
28
  <SelectItem value="sa">Saudi Arabia</SelectItem>
29
29
  <SelectItem value="ae">United Arab Emirates</SelectItem>
@@ -93,15 +93,15 @@ function MyField({ label, helperText, error, errorMessage, ...rest }) {
93
93
 
94
94
  ## Components
95
95
 
96
- **Form:** `Button` · `Input` · `Textarea` · `NumberInput` · `InputOTP` (OTP/PIN) · `SearchBox` · `TagInput` (token/chip) · `Checkbox` · `RadioGroup` + `Radio` · `Switch` · `Select` + `SelectItem` · `Combobox` + `ComboboxItem` (+ `ComboboxGroup` · `ComboboxSeparator`) · `DatePicker` (Hijri toggle) · `Slider` (single/range) · `Rating` (half-star) · `FileUpload` · `Toggle` + `ToggleGroup` (+ `ToggleGroupItem`)
96
+ **Form:** `Button` · `FloatingButton` (FAB) · `TextInput` · `Textarea` · `NumberInput` · `InputOTP` (OTP/PIN) · `SearchBox` · `TagInput` (token/chip) · `Checkbox` · `RadioGroup` + `Radio` · `Switch` · `Select` + `SelectItem` · `Dropdown` + `DropdownItem` (+ `DropdownGroup` · `DropdownSeparator`) · `DatePicker` + `DateRangePicker` (Hijri toggle) · `Slider` (single/range) · `Rating` (half-star) · `FileUpload` · `Toggle` · `ContentSwitcher` (segmented) · `Filtration` (faceted filter panel)
97
97
 
98
- **Display:** `Card` (+ `CardImage`/`CardHeader`/`CardTitle`/`CardDescription`/`CardContent`/`CardFooter`) · `Table` (+ `TableHeader`/`TableBody`/`TableFooter`/`TableRow`/`TableHead`/`TableCell`/`TableCaption`) · `List` (+ `ListItem`/`ListItemIcon`/`ListItemContent`/`ListItemAction`) · `Quote` (+ `QuoteContent`/`QuoteCaption`/`QuoteAuthor`/`QuoteSource`) · `Badge` · `Divider` · `Avatar` (+ `AvatarImage`/`AvatarFallback`/`AvatarGroup`) · `DescriptionList` (+ `DescriptionItem`/`DescriptionTerm`/`DescriptionDetails`) · `Stat` + `StatGroup` (KPI tiles) · `Timeline` (+ `TimelineItem`/`TimelineMarker`/`TimelineContent`/`TimelineTitle`/`TimelineDescription`/`TimelineTime`) · `EmptyState` (+ `EmptyStateMedia`/`EmptyStateTitle`/`EmptyStateDescription`/`EmptyStateActions`)
98
+ **Display:** `Card` (+ `CardImage`/`CardHeader`/`CardIcon`/`CardTitle`/`CardDescription`/`CardContent`/`CardFooter`) · `Table` (+ `TableHeader`/`TableBody`/`TableFooter`/`TableRow`/`TableHead`/`TableCell`/`TableCaption`) · `List` (+ `ListItem`) · `StructuredList` (+ `StructuredListHeader`/`StructuredListBody`/`StructuredListRow`/`StructuredListCell`) · `Quote` · `Chip` · `Tag` · `StatusTag` · `Divider` · `Avatar` (+ `AvatarImage`/`AvatarFallback`/`AvatarGroup`) · `DescriptionList` (+ `DescriptionItem`/`DescriptionTerm`/`DescriptionDetails`) · `Metric` + `MetricGroup` (KPI tiles) · `PieChart`/`LineChart`/`BarChart` · `Timeline` (+ `TimelineItem`/`TimelineMarker`/`TimelineContent`/`TimelineTitle`/`TimelineDescription`/`TimelineTime`) · `EmptyState` (+ `EmptyStateMedia`/`EmptyStateTitle`/`EmptyStateDescription`/`EmptyStateActions`) · `CodeSnippet` + `CodeSnippetInline` · `DigitalStamp` (gov verification bar) · `SaudiRiyal` + `SaudiRiyalSymbol` · `Carousel` (+ `CarouselViewport`/`CarouselSlide`/`CarouselPrevious`/`CarouselNext`/`CarouselDots`)
99
99
 
100
- **Feedback / overlay:** `Tooltip` · `Alert` · `Modal` · `Toast` (imperative API) · `Drawer` (off-canvas, 4 sides) · `DropdownMenu` (compound w/ CheckboxItem, RadioGroup, Sub) · `Popover` (generic floating panel) · `Command` + `CommandDialog` (⌘K palette)
100
+ **Feedback / overlay:** `Tooltip` + `HelpIcon` · `InlineAlert` · `Notification` · `Modal` · `NotificationToast` + `toast()` (imperative API) · `Drawer` (off-canvas, 4 sides) · `SlideoutMenu` (slide-in nav panel) · `DropdownMenu` (compound w/ CheckboxItem, RadioGroup, Sub) · `Popover` (generic floating panel) · `Command` + `CommandDialog` (⌘K palette)
101
101
 
102
- **Navigation:** `Tabs` · `Breadcrumb` · `Pagination` · `Accordion` · `Steps` · `Sidebar` (app-shell, collapsible) · `Menubar` (File/Edit/View app-bar) · `Link` (styled `<a>`, `external`)
102
+ **Navigation:** `Tabs` · `Breadcrumb` · `Pagination` · `Accordion` · `ProgressIndicator` · `Sidebar` (app-shell, collapsible) · `Menubar` (File/Edit/View app-bar) · `Link` (styled `<a>`, `external`)
103
103
 
104
- **Layout:** `ScrollArea` · `Collapsible` (+ `CollapsibleTrigger`/`CollapsibleContent`)
104
+ **Layout:** `ScrollArea` · `AspectRatio` · `Collapsible` (+ `CollapsibleTrigger`/`CollapsibleContent`)
105
105
 
106
106
  **Status:** `Spinner` · `Skeleton` · `Progress` + `CircularProgress`
107
107
 
@@ -109,6 +109,12 @@ function MyField({ label, helperText, error, errorMessage, ...rest }) {
109
109
 
110
110
  **Theming types:** `DgaTheme` · `PaletteName` · `ThemeColor`
111
111
 
112
+ ## Accessibility
113
+
114
+ Built to **WCAG 2.2 Level AA**, following the WAI-ARIA Authoring Practices. Interactive widgets stand on Radix Primitives and React Aria for keyboard interaction, focus management, and ARIA semantics; automated axe-core checks run against every component (in LTR and RTL/Arabic), and Playwright specs verify keyboard navigation, focus traps, and RTL key inversion. Visible `:focus-visible` focus rings, Windows High Contrast Mode (`forced-colors`), `prefers-reduced-motion`, and direction-native RTL are supported library-wide.
115
+
116
+ Conformance is self-assessed, not independently audited. See the full [Accessibility Conformance Statement](https://dev-dga.vercel.app/?path=/docs/foundations-accessibility--docs) for per-criterion support, known limitations, and consumer responsibilities.
117
+
112
118
  ## Docs
113
119
 
114
120
  [Live Storybook](https://dev-dga.vercel.app/) · [Source](https://github.com/DevDhaif/dev-dga)
@@ -39,6 +39,12 @@ function composeLocale(dgaLocale, calendar) {
39
39
  }
40
40
  return isArabic ? `${base}-u-nu-latn` : base;
41
41
  }
42
+ function weekdayStyleForLocale(locale) {
43
+ return locale.startsWith("ar") ? "narrow" : "short";
44
+ }
45
+ function formatWeekdayLabel(day, locale) {
46
+ return locale.startsWith("ar") ? day : day.slice(0, 2);
47
+ }
42
48
  function secondaryDayNumber(date, mainCalendar) {
43
49
  const other = mainCalendar === "hijri" ? GREGORIAN : ISLAMIC_UMALQURA;
44
50
  return toCalendar(date, other).day;
@@ -200,6 +206,8 @@ export {
200
206
  dateToCalendarDate,
201
207
  calendarDateToDate,
202
208
  composeLocale,
209
+ weekdayStyleForLocale,
210
+ formatWeekdayLabel,
203
211
  secondaryDayNumber,
204
212
  useCalendarChrome,
205
213
  usePressedState,
@@ -207,4 +215,4 @@ export {
207
215
  CalendarNavHeader,
208
216
  renderDayContent
209
217
  };
210
- //# sourceMappingURL=chunk-GCOBDP4W.js.map
218
+ //# sourceMappingURL=chunk-AR7K3D3Z.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/internal/calendar/calendar-core.tsx"],"sourcesContent":["'use client';\n\n// Shared Calendar core consumed by both DatePicker (single date) and\n// DateRangePicker (date range). Everything here is calendar-system /\n// month-year-navigation / day-rendering logic that is identical regardless of\n// whether one date or a range is being selected — extracted so the two pickers\n// stay in lockstep on Hijri handling, Latin digits, and locale composition.\n//\n// NOT exported from the public barrel. Pickers import from here directly.\n\nimport { useContext, useMemo, useState, type ReactNode } from 'react';\nimport {\n CalendarStateContext as AriaCalendarStateContext,\n RangeCalendarStateContext as AriaRangeCalendarStateContext,\n} from 'react-aria-components';\nimport {\n CalendarDate,\n GregorianCalendar,\n IslamicUmalquraCalendar,\n toCalendar,\n type DateValue,\n} from '@internationalized/date';\nimport { ArrowLeft, ArrowRight, ChevronDown } from '../icons';\nimport { DgaContext } from '../../providers/DgaContext';\n\n// ─── Types ─── //\n\nexport type CalendarSystem = 'gregorian' | 'hijri';\n\nexport interface CalendarLabels {\n gregorian: string;\n hijri: string;\n}\n\n// Locale-aware accessible names for the calendar chrome's controls. Defaulted\n// in `useCalendarChrome` (Arabic when the DGA locale is `ar`) so a screen reader\n// in an Arabic UI doesn't announce these controls in English.\nexport interface CalendarA11yLabels {\n /** Accessible name for the popover trigger button. */\n openCalendar: string;\n /** Accessible name for the Gregorian↔Hijri tablist. */\n calendarSystem: string;\n}\n\n// ─── Date ↔ CalendarDate (Gregorian) normalization ─── //\n\n// Public APIs are `Date`-based so consumers don't take a dep on\n// `@internationalized/date`. Internally everything round-trips through a\n// Gregorian `CalendarDate` so the Hijri toggle is purely a *display* concern —\n// the stored value is always the same absolute day, regardless of which\n// calendar the user was looking at when they picked it.\n\nconst GREGORIAN = new GregorianCalendar();\nconst ISLAMIC_UMALQURA = new IslamicUmalquraCalendar();\n\nexport function dateToCalendarDate(date: Date | null | undefined): CalendarDate | null {\n if (!date) return null;\n // Extract LOCAL Y/M/D, not UTC. The contract is date-only; converting\n // through UTC would shift the day across timezone boundaries.\n return new CalendarDate(date.getFullYear(), date.getMonth() + 1, date.getDate());\n}\n\nexport function calendarDateToDate(value: DateValue | null | undefined): Date | null {\n if (!value) return null;\n // Defensive: if a non-Gregorian CalendarDate ever reaches here, convert.\n // Today the contract is Gregorian-only.\n const greg =\n value.calendar.identifier === 'gregory' ? value : toCalendar(value, new GregorianCalendar());\n return new Date(greg.year, greg.month - 1, greg.day);\n}\n\n// ─── Locale composition (DGA locale + optional calendar override) ─── //\n\nexport function composeLocale(dgaLocale: string, calendar: CalendarSystem): string {\n // Promote a bare 'ar'/'en' from DgaProvider to a regional tag so react-aria\n // picks the right defaults (week start, weekday names). 'ar-SA' matches the\n // DGA target audience; 'en-US' is the conventional English default.\n const base = dgaLocale === 'ar' ? 'ar-SA' : dgaLocale === 'en' ? 'en-US' : dgaLocale;\n // DGA convention: Latin digits (0–9) at all times, regardless of calendar or\n // UI language. Without this, `ar-*` locales default to Arabic-Indic numerals\n // (٠–٩) on segments + calendar cells, which makes month/year dropdowns and\n // cross-calendar comparisons harder to read. The Unicode `-u-` extension\n // carries both calendar and numbering-system keys when both apply.\n const isArabic = base.startsWith('ar');\n if (calendar === 'hijri') {\n return isArabic ? `${base}-u-ca-islamic-umalqura-nu-latn` : `${base}-u-ca-islamic-umalqura`;\n }\n return isArabic ? `${base}-u-nu-latn` : base;\n}\n\n// ─── Weekday header labels (SDGA 2-letter row) ─── //\n\n// SDGA 2-letter weekday row: Latin `short` (Sun/Mon…) slices to 2; Arabic `short` all share the \"ال\" article prefix (a blind slice collapses them to identical), so Arabic uses `narrow` (distinct single letters ح ن ث…) untouched. Keep the two fns coupled.\nexport function weekdayStyleForLocale(locale: string): 'narrow' | 'short' {\n return locale.startsWith('ar') ? 'narrow' : 'short';\n}\n\nexport function formatWeekdayLabel(day: string, locale: string): string {\n return locale.startsWith('ar') ? day : day.slice(0, 2);\n}\n\n// ─── Secondary-calendar helper ─── //\n\nexport function secondaryDayNumber(date: DateValue, mainCalendar: CalendarSystem): number {\n const other = mainCalendar === 'hijri' ? GREGORIAN : ISLAMIC_UMALQURA;\n return toCalendar(date, other).day;\n}\n\n// ─── Shared chrome hook (locale, portal, chevrons, labels) ─── //\n\n// Consolidates the DgaContext-derived bits both pickers need: the composed\n// react-aria locale, the body-portal container (theme inheritance), the\n// direction-swapped prev/next chevrons, and locale-aware default labels.\nexport function useCalendarChrome(calendarSystem: CalendarSystem, calendarLabels?: CalendarLabels) {\n const dgaCtx = useContext(DgaContext);\n const dgaLocale = dgaCtx?.locale ?? 'en';\n const dir = dgaCtx?.dir ?? 'ltr';\n\n const locale = useMemo(\n () => composeLocale(dgaLocale, calendarSystem),\n [dgaLocale, calendarSystem],\n );\n\n // react-aria's Popover renders to a portal under <body> by default. Re-anchor\n // it under DgaProvider's body-mounted portal so data-theme, theme vars, and\n // .ddga-theme-* classes inherit into the dropdown. Falls back to <body> when\n // used standalone (no provider).\n const portalContainer = (dgaCtx?.portalEl ?? dgaCtx?.rootEl ?? undefined) as Element | undefined;\n\n // In RTL, \"previous\" sits visually on the right and points right; \"next\" sits\n // on the left and points left. Swapping the icon components (rather than\n // CSS-flipping) is robust because it doesn't rely on the portal inheriting dir.\n const PrevArrow = dir === 'rtl' ? ArrowRight : ArrowLeft;\n const NextArrow = dir === 'rtl' ? ArrowLeft : ArrowRight;\n\n const resolvedLabels = useMemo<CalendarLabels>(() => {\n if (calendarLabels) return calendarLabels;\n return dgaLocale.startsWith('ar')\n ? { gregorian: 'ميلادي', hijri: 'هجري' }\n : { gregorian: 'Gregorian', hijri: 'Hijri' };\n }, [calendarLabels, dgaLocale]);\n\n const navLabels = useMemo(\n () =>\n dgaLocale.startsWith('ar')\n ? { month: 'الشهر', year: 'السنة' }\n : { month: 'Month', year: 'Year' },\n [dgaLocale],\n );\n\n const a11yLabels = useMemo<CalendarA11yLabels>(\n () =>\n dgaLocale.startsWith('ar')\n ? { openCalendar: 'فتح التقويم', calendarSystem: 'نظام التقويم' }\n : { openCalendar: 'Open calendar', calendarSystem: 'Calendar system' },\n [dgaLocale],\n );\n\n return {\n dgaLocale,\n dir,\n locale,\n portalContainer,\n PrevArrow,\n NextArrow,\n resolvedLabels,\n navLabels,\n a11yLabels,\n };\n}\n\n// ─── Pressed state (reliable on a react-aria Group) ─── //\n\n// CSS `:active` is unreliable on the picker trigger: it's a react-aria Group of\n// DateSegments + a Button whose usePress handling (preventDefault / pointer\n// capture) makes `:active` fire inconsistently depending on where you press.\n// Track pressed in JS via CAPTURE-phase pointer events (which fire on the Group\n// before any child can swallow them) and expose it as `data-pressed`. Spread\n// `pressHandlers` onto the trigger Group; gate the CSS with `[data-pressed]`.\nexport function usePressedState() {\n const [pressed, setPressed] = useState(false);\n return {\n pressed,\n pressHandlers: {\n onPointerDownCapture: () => setPressed(true),\n onPointerUpCapture: () => setPressed(false),\n onPointerCancelCapture: () => setPressed(false),\n onPointerLeave: () => setPressed(false),\n },\n };\n}\n\n// ─── Calendar-system toggle (Gregorian ↔ Hijri) ─── //\n\ninterface CalendarSystemToggleProps {\n value: CalendarSystem;\n onChange: (next: CalendarSystem) => void;\n labels: CalendarLabels;\n /** Localized accessible name for the tablist (from `useCalendarChrome`). */\n groupLabel: string;\n}\n\nexport function CalendarSystemToggle({\n value,\n onChange,\n labels,\n groupLabel,\n}: CalendarSystemToggleProps) {\n return (\n <div\n role=\"tablist\"\n aria-label={groupLabel}\n className=\"ddga-calendar-toggle\"\n data-slot=\"calendar-toggle\"\n >\n <button\n type=\"button\"\n role=\"tab\"\n aria-selected={value === 'gregorian'}\n className=\"ddga-calendar-toggle__button\"\n data-active={value === 'gregorian' ? '' : undefined}\n onClick={() => onChange('gregorian')}\n >\n {labels.gregorian}\n </button>\n <button\n type=\"button\"\n role=\"tab\"\n aria-selected={value === 'hijri'}\n className=\"ddga-calendar-toggle__button\"\n data-active={value === 'hijri' ? '' : undefined}\n onClick={() => onChange('hijri')}\n >\n {labels.hijri}\n </button>\n </div>\n );\n}\n\n// ─── Calendar nav header (month + year dropdowns) ─── //\n\n// Rendered inside <Calendar>/<RangeCalendar> so it can consume the calendar\n// state context. Both single and range calendars expose the same\n// `focusedDate`/`setFocusedDate`/`minValue`/`maxValue` surface (CalendarStateBase),\n// so we read whichever context is populated — the component is calendar-kind\n// agnostic. Hooking the state directly keeps the dropdowns in sync with the\n// prev/next buttons and keyboard navigation automatically.\ninterface CalendarNavHeaderProps {\n locale: string;\n monthLabel: string;\n yearLabel: string;\n}\n\nexport function CalendarNavHeader({ locale, monthLabel, yearLabel }: CalendarNavHeaderProps) {\n // A given subtree lives inside exactly one of these; the other is null.\n const rangeState = useContext(AriaRangeCalendarStateContext);\n const singleState = useContext(AriaCalendarStateContext);\n const state = rangeState ?? singleState;\n\n // Pull state fields with safe fallbacks so the hooks below stay unconditional\n // (rules-of-hooks). Rendering still bails when state is null.\n const focusedDate = state?.focusedDate ?? null;\n const focusedYear = focusedDate?.year ?? 0;\n const focusedCalendar = focusedDate?.calendar ?? GREGORIAN;\n const minValue = state?.minValue ?? null;\n const maxValue = state?.maxValue ?? null;\n\n // Localized month names in the active calendar. Hijri months translate\n // correctly because the locale string carries `-u-ca-islamic-umalqura`.\n const monthNames = useMemo(() => {\n if (!focusedDate) return [];\n const fmt = new Intl.DateTimeFormat(locale, { month: 'long' });\n return Array.from({ length: 12 }, (_, i) => {\n const cd = new CalendarDate(focusedCalendar, focusedYear, i + 1, 1);\n const greg = toCalendar(cd, GREGORIAN);\n const js = new Date(greg.year, greg.month - 1, greg.day);\n return fmt.format(js);\n });\n }, [locale, focusedDate, focusedCalendar, focusedYear]);\n\n // Year range. min/maxValue are in the consumer's calendar (Gregorian); convert\n // to the focused calendar's year. Defaults span 100 years back to 30 forward.\n const yearOptions = useMemo(() => {\n if (!focusedDate) return [];\n const minY = minValue ? toCalendar(minValue, focusedCalendar).year : focusedYear - 100;\n const maxY = maxValue ? toCalendar(maxValue, focusedCalendar).year : focusedYear + 30;\n const start = Math.min(minY, focusedYear);\n const end = Math.max(maxY, focusedYear);\n return Array.from({ length: end - start + 1 }, (_, i) => start + i);\n }, [focusedDate, focusedCalendar, focusedYear, minValue, maxValue]);\n\n if (!state || !focusedDate) return null;\n\n return (\n <div className=\"ddga-calendar__nav-selects\" data-slot=\"calendar-nav\">\n <select\n aria-label={monthLabel}\n className=\"ddga-calendar__select ddga-calendar__month-select\"\n data-slot=\"calendar-month-select\"\n value={focusedDate.month}\n onChange={(e) => state.setFocusedDate(focusedDate.set({ month: Number(e.target.value) }))}\n >\n {monthNames.map((name, i) => (\n <option key={i + 1} value={i + 1}>\n {name}\n </option>\n ))}\n </select>\n <span className=\"ddga-calendar__year-chip\">\n <select\n aria-label={yearLabel}\n className=\"ddga-calendar__select ddga-calendar__year-select\"\n data-slot=\"calendar-year-select\"\n value={focusedDate.year}\n onChange={(e) => state.setFocusedDate(focusedDate.set({ year: Number(e.target.value) }))}\n >\n {yearOptions.map((y) => (\n <option key={y} value={y}>\n {y}\n </option>\n ))}\n </select>\n <ChevronDown aria-hidden=\"true\" className=\"ddga-calendar__year-chevron\" />\n </span>\n </div>\n );\n}\n\n// ─── Day-cell content (primary number + optional secondary calendar number) ─── //\n\n// The visual content rendered inside a day cell, shared by both pickers. Takes\n// the already-formatted primary text (react-aria's `formattedDate`, or a bare\n// day number for the single picker's outside-month button) and stacks the other\n// calendar's day number beneath it when `showSecondary` is on.\nexport function renderDayContent(\n primary: ReactNode,\n opts: { showSecondary: boolean; date: DateValue; calendarSystem: CalendarSystem },\n): ReactNode {\n if (!opts.showSecondary) return primary;\n return (\n <>\n <span className=\"ddga-calendar__cell-primary\">{primary}</span>\n <span aria-hidden=\"true\" className=\"ddga-calendar__cell-secondary\">\n {secondaryDayNumber(opts.date, opts.calendarSystem)}\n </span>\n </>\n );\n}\n"],"mappings":"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","names":[]}
@@ -3,10 +3,12 @@ import {
3
3
  CalendarSystemToggle,
4
4
  calendarDateToDate,
5
5
  dateToCalendarDate,
6
+ formatWeekdayLabel,
6
7
  renderDayContent,
7
8
  useCalendarChrome,
8
- usePressedState
9
- } from "./chunk-GCOBDP4W.js";
9
+ usePressedState,
10
+ weekdayStyleForLocale
11
+ } from "./chunk-AR7K3D3Z.js";
10
12
  import {
11
13
  cn
12
14
  } from "./chunk-7NTT2UXP.js";
@@ -275,17 +277,24 @@ function DatePicker({
275
277
  )
276
278
  ] })
277
279
  ] }),
278
- /* @__PURE__ */ jsxs(AriaCalendarGrid, { className: "ddga-calendar__grid", weekdayStyle: "short", children: [
279
- /* @__PURE__ */ jsx(AriaCalendarGridHeader, { children: (day) => /* @__PURE__ */ jsx(AriaCalendarHeaderCell, { className: "ddga-calendar__weekday", children: day }) }),
280
- /* @__PURE__ */ jsx(AriaCalendarGridBody, { children: (date) => /* @__PURE__ */ jsx(
281
- CalendarDayCell,
282
- {
283
- date,
284
- showSecondary: showSecondaryCalendar,
285
- calendarSystem
286
- }
287
- ) })
288
- ] })
280
+ /* @__PURE__ */ jsxs(
281
+ AriaCalendarGrid,
282
+ {
283
+ className: "ddga-calendar__grid",
284
+ weekdayStyle: weekdayStyleForLocale(dgaLocale),
285
+ children: [
286
+ /* @__PURE__ */ jsx(AriaCalendarGridHeader, { children: (day) => /* @__PURE__ */ jsx(AriaCalendarHeaderCell, { className: "ddga-calendar__weekday", children: formatWeekdayLabel(day, dgaLocale) }) }),
287
+ /* @__PURE__ */ jsx(AriaCalendarGridBody, { children: (date) => /* @__PURE__ */ jsx(
288
+ CalendarDayCell,
289
+ {
290
+ date,
291
+ showSecondary: showSecondaryCalendar,
292
+ calendarSystem
293
+ }
294
+ ) })
295
+ ]
296
+ }
297
+ )
289
298
  ] })
290
299
  ]
291
300
  }
@@ -302,4 +311,4 @@ export {
302
311
  datePickerVariants,
303
312
  DatePicker
304
313
  };
305
- //# sourceMappingURL=chunk-7GWM7F5C.js.map
314
+ //# sourceMappingURL=chunk-BC2DJQ3Y.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useContext, useMemo, useState, type ReactNode } from 'react';\nimport {\n Button as AriaButton,\n Calendar as AriaCalendar,\n CalendarCell as AriaCalendarCell,\n CalendarGrid as AriaCalendarGrid,\n CalendarGridBody as AriaCalendarGridBody,\n CalendarGridHeader as AriaCalendarGridHeader,\n CalendarHeaderCell as AriaCalendarHeaderCell,\n CalendarStateContext as AriaCalendarStateContext,\n DateInput as AriaDateInput,\n DatePicker as AriaDatePicker,\n DateSegment as AriaDateSegment,\n Dialog as AriaDialog,\n FieldError as AriaFieldError,\n Group as AriaGroup,\n I18nProvider,\n Label as AriaLabel,\n Popover as AriaPopover,\n Text as AriaText,\n} from 'react-aria-components';\nimport { CalendarDate, type DateValue } from '@internationalized/date';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport {\n CalendarNavHeader,\n CalendarSystemToggle,\n calendarDateToDate,\n dateToCalendarDate,\n formatWeekdayLabel,\n renderDayContent,\n useCalendarChrome,\n usePressedState,\n weekdayStyleForLocale,\n type CalendarLabels,\n type CalendarSystem,\n} from '../../internal/calendar';\n\n// ─── 1. Variants ─── //\n\n// Applied to the Group (the trigger row). Heights match Input/Select sm/md so\n// a DatePicker lines up with other fields in a form row.\nconst datePickerTriggerVariants = cva('ddga-date-picker-trigger', {\n variants: {\n size: {\n md: 'ddga-date-picker-trigger--md',\n lg: 'ddga-date-picker-trigger--lg',\n },\n variant: {\n default: 'ddga-date-picker-trigger--default',\n 'filled-lighter': 'ddga-date-picker-trigger--filled-lighter',\n 'filled-darker': 'ddga-date-picker-trigger--filled-darker',\n },\n error: {\n true: 'ddga-date-picker-trigger--error',\n },\n },\n defaultVariants: {\n size: 'lg',\n variant: 'default',\n },\n});\n\n// Passthrough alias so the barrel `*Variants` convention holds across\n// components. Same value, different name.\nconst datePickerVariants = datePickerTriggerVariants;\n\n// ─── 2. Types ─── //\n\ninterface DatePickerProps extends VariantProps<typeof datePickerTriggerVariants> {\n /** Currently selected date (controlled). Local Y/M/D. */\n value?: Date | null;\n /** Initial value when uncontrolled. */\n defaultValue?: Date | null;\n /** Fires whenever the user picks a day. `null` when cleared. */\n onChange?: (value: Date | null) => void;\n /** Earliest pickable date (inclusive). */\n minValue?: Date;\n /** Latest pickable date (inclusive). */\n maxValue?: Date;\n /** Visible label above the trigger. */\n label?: ReactNode;\n /** Hint shown below the trigger. Hidden while an error message is showing. */\n helperText?: ReactNode;\n /** Message shown below the trigger when `error` is true. */\n errorMessage?: ReactNode;\n /** Marks the field invalid — sets `aria-invalid` and error styling. */\n error?: boolean;\n /** Marks the field required — adds the asterisk + `aria-required`. */\n required?: boolean;\n /** Disables the trigger entirely. */\n disabled?: boolean;\n /** Read-only: value is shown but not editable (segments + calendar locked). */\n readOnly?: boolean;\n /** Caller-supplied id for the field. */\n id?: string;\n /** Forwarded to the Group (the trigger row), matching Input/Select. */\n className?: string;\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n /**\n * Calendar system (controlled). Omit to let the user toggle freely with\n * the in-popover switch.\n */\n calendar?: CalendarSystem;\n /** Initial calendar system when uncontrolled. Defaults to `'gregorian'`. */\n defaultCalendar?: CalendarSystem;\n /** Fires whenever the calendar system toggles. */\n onCalendarChange?: (calendar: CalendarSystem) => void;\n /**\n * Show the Gregorian↔Hijri toggle inside the popover. Defaults to `true`,\n * but is forced off when `calendar` is controlled — a toggle that ignores\n * its click is a worse footgun than no toggle.\n */\n showCalendarToggle?: boolean;\n /** Override the toggle labels. Defaults are locale-aware (English / Arabic). */\n calendarLabels?: CalendarLabels;\n /**\n * When `true`, each day cell also shows the *other* calendar's day number\n * as small secondary text (e.g., Hijri active → Gregorian day shown small\n * underneath). Helps users cross-reference dates between calendar systems\n * without round-tripping the toggle. Defaults to `false`.\n */\n showSecondaryCalendar?: boolean;\n}\n\n// ─── 3. Outside-month cell wrapper (single-date only) ─── //\n\n// react-aria marks outside-month cells as disabled by design — the standard\n// Calendar UX uses arrows / dropdowns / keyboard for cross-month navigation.\n// But many DGA flows want one-click selection of an adjacent month's day, so\n// we render a parallel <button> for those cells that bypasses the disabled\n// state, drives `setFocusedDate` + `selectDate` manually, and preserves the\n// rest of react-aria's a11y wiring for inside-month cells.\n//\n// This lives in DatePicker (not the shared core) because its `isSelected` check\n// reads `state.value` as a single CalendarDate — that doesn't generalize to a\n// range, where `state.value` is `{ start, end }`. DateRangePicker uses\n// react-aria's default outside-month behavior instead.\nfunction CalendarDayCell({ date, showSecondary, calendarSystem }: CalendarDayCellProps) {\n const state = useContext(AriaCalendarStateContext);\n\n // Visible range start tells us the \"current\" month being shown. Anything\n // with a different (year, month) pair is outside-month.\n const start = state?.visibleRange.start;\n const isOutside = !!start && (date.year !== start.year || date.month !== start.month);\n\n // For outside-month cells, also confirm they're inside min/max bounds —\n // otherwise they should genuinely render disabled. `state.isInvalid` is\n // bounds-only (min/max); `isCellDisabled` also marks outside-month as\n // disabled internally, which would block our wrapper from activating.\n const isOutOfBounds = state ? state.isInvalid(date) : false;\n\n if (state && isOutside && !isOutOfBounds) {\n const selected = state.value;\n const isSelected =\n !!selected &&\n selected.year === date.year &&\n selected.month === date.month &&\n selected.day === date.day;\n\n const handleSelect = () => {\n // Update focused-month first so the visible page jumps, then commit the\n // selection. React batches these into one re-render.\n state.setFocusedDate(date);\n state.selectDate(date);\n };\n\n return (\n <td role=\"gridcell\">\n <button\n type=\"button\"\n // Outside the keyboard nav chain (react-aria's inside-month cells own\n // that). Mouse users get the shortcut; keyboard users navigate via\n // arrows or the month/year dropdowns.\n tabIndex={-1}\n className=\"ddga-calendar__cell\"\n data-outside-month=\"\"\n data-selected={isSelected ? '' : undefined}\n data-slot=\"date-picker-day-cell\"\n onClick={handleSelect}\n >\n {renderDayContent(date.day, { showSecondary, date, calendarSystem })}\n </button>\n </td>\n );\n }\n\n return (\n <AriaCalendarCell date={date} className=\"ddga-calendar__cell\">\n {({ formattedDate }) =>\n renderDayContent(formattedDate, { showSecondary, date, calendarSystem })\n }\n </AriaCalendarCell>\n );\n}\n\ninterface CalendarDayCellProps {\n date: CalendarDate;\n showSecondary: boolean;\n calendarSystem: CalendarSystem;\n}\n\n// ─── 4. Component ─── //\n\nfunction DatePicker({\n value: controlledValue,\n defaultValue,\n onChange,\n minValue,\n maxValue,\n label,\n helperText,\n errorMessage,\n error,\n required,\n disabled,\n readOnly,\n size,\n variant,\n id,\n className,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n calendar: controlledCalendar,\n defaultCalendar = 'gregorian',\n onCalendarChange,\n showCalendarToggle = true,\n calendarLabels,\n showSecondaryCalendar = false,\n}: DatePickerProps) {\n // ─ value: controlled or uncontrolled, always Gregorian internally ─\n const isValueControlled = controlledValue !== undefined;\n const [internalValue, setInternalValue] = useState<CalendarDate | null>(() =>\n dateToCalendarDate(defaultValue),\n );\n const value = isValueControlled ? dateToCalendarDate(controlledValue) : internalValue;\n\n const handleAriaChange = useCallback(\n (next: DateValue | null) => {\n const nextCD = next ? new CalendarDate(next.year, next.month, next.day) : null;\n if (!isValueControlled) setInternalValue(nextCD);\n onChange?.(calendarDateToDate(nextCD));\n },\n [isValueControlled, onChange],\n );\n\n // ─ calendar system: controlled or uncontrolled ─\n const isCalendarControlled = controlledCalendar !== undefined;\n const [internalCalendar, setInternalCalendar] = useState<CalendarSystem>(defaultCalendar);\n const calendarSystem = isCalendarControlled ? controlledCalendar : internalCalendar;\n\n const setCalendar = useCallback(\n (next: CalendarSystem) => {\n if (!isCalendarControlled) setInternalCalendar(next);\n onCalendarChange?.(next);\n },\n [isCalendarControlled, onCalendarChange],\n );\n\n // ─ Shared chrome (locale, portal, chevrons, labels) ─\n const {\n dgaLocale,\n locale: ariaLocale,\n portalContainer,\n PrevArrow,\n NextArrow,\n resolvedLabels,\n navLabels,\n a11yLabels,\n } = useCalendarChrome(calendarSystem, calendarLabels);\n const { pressed, pressHandlers } = usePressedState();\n\n // ─ Bounds ─\n const ariaMinValue = useMemo(() => dateToCalendarDate(minValue) ?? undefined, [minValue]);\n const ariaMaxValue = useMemo(() => dateToCalendarDate(maxValue) ?? undefined, [maxValue]);\n\n // ─ Popover aria-label fallback ─\n // Dialog requires an accessible name; derive from the field label when\n // possible (string-only), else fall back to a generic so a11y stays valid\n // even when consumers compose a rich label node.\n const dialogAriaLabel =\n ariaLabel ??\n (typeof label === 'string'\n ? label\n : ariaLabelledBy\n ? undefined\n : dgaLocale.startsWith('ar')\n ? 'التاريخ'\n : 'Date');\n\n // ─ Toggle visibility ─\n const showToggle = showCalendarToggle && !isCalendarControlled;\n\n // ─ Derived field-message visibility (mirrors useFieldA11y rules) ─\n const hasError = !!error;\n const hasErrorMessage = hasError && errorMessage != null && errorMessage !== '';\n const hasHelper = !hasErrorMessage && helperText != null && helperText !== '';\n\n return (\n <I18nProvider locale={ariaLocale}>\n <AriaDatePicker\n value={value}\n onChange={handleAriaChange}\n minValue={ariaMinValue}\n maxValue={ariaMaxValue}\n isRequired={required}\n isDisabled={disabled}\n isReadOnly={readOnly}\n isInvalid={hasError}\n shouldCloseOnSelect\n id={id}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className=\"ddga-field\"\n data-slot=\"date-picker-field\"\n >\n {label && (\n <AriaLabel className=\"ddga-date-picker__label\">\n {label}\n {required && (\n <span aria-hidden=\"true\" className=\"ddga-date-picker__required\">\n *\n </span>\n )}\n </AriaLabel>\n )}\n <AriaGroup\n data-slot=\"date-picker-trigger\"\n data-readonly={readOnly ? '' : undefined}\n data-pressed={pressed ? '' : undefined}\n {...pressHandlers}\n className={cn(datePickerTriggerVariants({ size, variant, error: hasError }), className)}\n >\n <AriaDateInput className=\"ddga-date-picker__input\" data-slot=\"date-picker-input\">\n {(segment) => (\n <AriaDateSegment\n segment={segment}\n className=\"ddga-date-picker__segment\"\n data-slot=\"date-picker-segment\"\n />\n )}\n </AriaDateInput>\n {/* SDGA field has no calendar icon — the field itself opens the\n calendar. The button is the (iconless) click surface filling the\n field's trailing space; segments stay editable. */}\n <AriaButton\n className=\"ddga-date-picker__open\"\n aria-label={a11yLabels.openCalendar}\n data-slot=\"date-picker-trigger-button\"\n />\n </AriaGroup>\n {hasHelper && (\n <AriaText\n slot=\"description\"\n className=\"ddga-field__message ddga-field__message--helper\"\n data-slot=\"field-helper\"\n >\n {helperText}\n </AriaText>\n )}\n {hasErrorMessage && (\n <AriaFieldError\n className=\"ddga-field__message ddga-field__message--error\"\n data-slot=\"field-error\"\n >\n {errorMessage}\n </AriaFieldError>\n )}\n <AriaPopover\n UNSTABLE_portalContainer={portalContainer}\n className=\"ddga-calendar-popover\"\n data-slot=\"date-picker-popover\"\n offset={6}\n // Keep some breathing room from the viewport edge so the popover\n // doesn't butt up against the bottom of the iframe in short\n // containers (the Storybook canvas case). Combined with the inner\n // Dialog's overflow:auto, the calendar will scroll if it can't fit.\n containerPadding={12}\n >\n <AriaDialog\n className=\"ddga-calendar-dialog\"\n data-slot=\"date-picker-dialog\"\n aria-label={dialogAriaLabel}\n aria-labelledby={ariaLabelledBy}\n >\n {showToggle && (\n <CalendarSystemToggle\n value={calendarSystem}\n onChange={setCalendar}\n labels={resolvedLabels}\n groupLabel={a11yLabels.calendarSystem}\n />\n )}\n <AriaCalendar className=\"ddga-calendar\" data-slot=\"date-picker-calendar\">\n <header className=\"ddga-calendar__header\">\n <CalendarNavHeader\n locale={ariaLocale}\n monthLabel={navLabels.month}\n yearLabel={navLabels.year}\n />\n <div className=\"ddga-calendar__nav-group\">\n <AriaButton\n slot=\"previous\"\n className=\"ddga-calendar__nav\"\n data-slot=\"date-picker-calendar-prev\"\n >\n <PrevArrow aria-hidden=\"true\" />\n </AriaButton>\n <AriaButton\n slot=\"next\"\n className=\"ddga-calendar__nav\"\n data-slot=\"date-picker-calendar-next\"\n >\n <NextArrow aria-hidden=\"true\" />\n </AriaButton>\n </div>\n </header>\n <AriaCalendarGrid\n className=\"ddga-calendar__grid\"\n weekdayStyle={weekdayStyleForLocale(dgaLocale)}\n >\n <AriaCalendarGridHeader>\n {(day) => (\n <AriaCalendarHeaderCell className=\"ddga-calendar__weekday\">\n {formatWeekdayLabel(day, dgaLocale)}\n </AriaCalendarHeaderCell>\n )}\n </AriaCalendarGridHeader>\n <AriaCalendarGridBody>\n {(date) => (\n <CalendarDayCell\n date={date}\n showSecondary={showSecondaryCalendar}\n calendarSystem={calendarSystem}\n />\n )}\n </AriaCalendarGridBody>\n </AriaCalendarGrid>\n </AriaCalendar>\n </AriaDialog>\n </AriaPopover>\n </AriaDatePicker>\n </I18nProvider>\n );\n}\n\n// ─── 5. Exports ─── //\n\nexport { DatePicker, datePickerTriggerVariants, datePickerVariants };\nexport type { DatePickerProps, CalendarSystem, CalendarLabels };\n"],"mappings":"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","names":[]}
@@ -39,6 +39,12 @@ function composeLocale(dgaLocale, calendar) {
39
39
  }
40
40
  return isArabic ? `${base}-u-nu-latn` : base;
41
41
  }
42
+ function weekdayStyleForLocale(locale) {
43
+ return locale.startsWith("ar") ? "narrow" : "short";
44
+ }
45
+ function formatWeekdayLabel(day, locale) {
46
+ return locale.startsWith("ar") ? day : day.slice(0, 2);
47
+ }
42
48
  function secondaryDayNumber(date, mainCalendar) {
43
49
  const other = mainCalendar === "hijri" ? GREGORIAN : ISLAMIC_UMALQURA;
44
50
  return _date.toCalendar.call(void 0, date, other).day;
@@ -206,5 +212,7 @@ function renderDayContent(primary, opts) {
206
212
 
207
213
 
208
214
 
209
- exports.dateToCalendarDate = dateToCalendarDate; exports.calendarDateToDate = calendarDateToDate; exports.composeLocale = composeLocale; exports.secondaryDayNumber = secondaryDayNumber; exports.useCalendarChrome = useCalendarChrome; exports.usePressedState = usePressedState; exports.CalendarSystemToggle = CalendarSystemToggle; exports.CalendarNavHeader = CalendarNavHeader; exports.renderDayContent = renderDayContent;
210
- //# sourceMappingURL=chunk-A4HS7CYD.cjs.map
215
+
216
+
217
+ exports.dateToCalendarDate = dateToCalendarDate; exports.calendarDateToDate = calendarDateToDate; exports.composeLocale = composeLocale; exports.weekdayStyleForLocale = weekdayStyleForLocale; exports.formatWeekdayLabel = formatWeekdayLabel; exports.secondaryDayNumber = secondaryDayNumber; exports.useCalendarChrome = useCalendarChrome; exports.usePressedState = usePressedState; exports.CalendarSystemToggle = CalendarSystemToggle; exports.CalendarNavHeader = CalendarNavHeader; exports.renderDayContent = renderDayContent;
218
+ //# sourceMappingURL=chunk-NQGMWK5C.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-NQGMWK5C.cjs","../src/internal/calendar/calendar-core.tsx"],"names":[],"mappings":"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","file":"/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-NQGMWK5C.cjs","sourcesContent":[null,"'use client';\n\n// Shared Calendar core consumed by both DatePicker (single date) and\n// DateRangePicker (date range). Everything here is calendar-system /\n// month-year-navigation / day-rendering logic that is identical regardless of\n// whether one date or a range is being selected — extracted so the two pickers\n// stay in lockstep on Hijri handling, Latin digits, and locale composition.\n//\n// NOT exported from the public barrel. Pickers import from here directly.\n\nimport { useContext, useMemo, useState, type ReactNode } from 'react';\nimport {\n CalendarStateContext as AriaCalendarStateContext,\n RangeCalendarStateContext as AriaRangeCalendarStateContext,\n} from 'react-aria-components';\nimport {\n CalendarDate,\n GregorianCalendar,\n IslamicUmalquraCalendar,\n toCalendar,\n type DateValue,\n} from '@internationalized/date';\nimport { ArrowLeft, ArrowRight, ChevronDown } from '../icons';\nimport { DgaContext } from '../../providers/DgaContext';\n\n// ─── Types ─── //\n\nexport type CalendarSystem = 'gregorian' | 'hijri';\n\nexport interface CalendarLabels {\n gregorian: string;\n hijri: string;\n}\n\n// Locale-aware accessible names for the calendar chrome's controls. Defaulted\n// in `useCalendarChrome` (Arabic when the DGA locale is `ar`) so a screen reader\n// in an Arabic UI doesn't announce these controls in English.\nexport interface CalendarA11yLabels {\n /** Accessible name for the popover trigger button. */\n openCalendar: string;\n /** Accessible name for the Gregorian↔Hijri tablist. */\n calendarSystem: string;\n}\n\n// ─── Date ↔ CalendarDate (Gregorian) normalization ─── //\n\n// Public APIs are `Date`-based so consumers don't take a dep on\n// `@internationalized/date`. Internally everything round-trips through a\n// Gregorian `CalendarDate` so the Hijri toggle is purely a *display* concern —\n// the stored value is always the same absolute day, regardless of which\n// calendar the user was looking at when they picked it.\n\nconst GREGORIAN = new GregorianCalendar();\nconst ISLAMIC_UMALQURA = new IslamicUmalquraCalendar();\n\nexport function dateToCalendarDate(date: Date | null | undefined): CalendarDate | null {\n if (!date) return null;\n // Extract LOCAL Y/M/D, not UTC. The contract is date-only; converting\n // through UTC would shift the day across timezone boundaries.\n return new CalendarDate(date.getFullYear(), date.getMonth() + 1, date.getDate());\n}\n\nexport function calendarDateToDate(value: DateValue | null | undefined): Date | null {\n if (!value) return null;\n // Defensive: if a non-Gregorian CalendarDate ever reaches here, convert.\n // Today the contract is Gregorian-only.\n const greg =\n value.calendar.identifier === 'gregory' ? value : toCalendar(value, new GregorianCalendar());\n return new Date(greg.year, greg.month - 1, greg.day);\n}\n\n// ─── Locale composition (DGA locale + optional calendar override) ─── //\n\nexport function composeLocale(dgaLocale: string, calendar: CalendarSystem): string {\n // Promote a bare 'ar'/'en' from DgaProvider to a regional tag so react-aria\n // picks the right defaults (week start, weekday names). 'ar-SA' matches the\n // DGA target audience; 'en-US' is the conventional English default.\n const base = dgaLocale === 'ar' ? 'ar-SA' : dgaLocale === 'en' ? 'en-US' : dgaLocale;\n // DGA convention: Latin digits (0–9) at all times, regardless of calendar or\n // UI language. Without this, `ar-*` locales default to Arabic-Indic numerals\n // (٠–٩) on segments + calendar cells, which makes month/year dropdowns and\n // cross-calendar comparisons harder to read. The Unicode `-u-` extension\n // carries both calendar and numbering-system keys when both apply.\n const isArabic = base.startsWith('ar');\n if (calendar === 'hijri') {\n return isArabic ? `${base}-u-ca-islamic-umalqura-nu-latn` : `${base}-u-ca-islamic-umalqura`;\n }\n return isArabic ? `${base}-u-nu-latn` : base;\n}\n\n// ─── Weekday header labels (SDGA 2-letter row) ─── //\n\n// SDGA 2-letter weekday row: Latin `short` (Sun/Mon…) slices to 2; Arabic `short` all share the \"ال\" article prefix (a blind slice collapses them to identical), so Arabic uses `narrow` (distinct single letters ح ن ث…) untouched. Keep the two fns coupled.\nexport function weekdayStyleForLocale(locale: string): 'narrow' | 'short' {\n return locale.startsWith('ar') ? 'narrow' : 'short';\n}\n\nexport function formatWeekdayLabel(day: string, locale: string): string {\n return locale.startsWith('ar') ? day : day.slice(0, 2);\n}\n\n// ─── Secondary-calendar helper ─── //\n\nexport function secondaryDayNumber(date: DateValue, mainCalendar: CalendarSystem): number {\n const other = mainCalendar === 'hijri' ? GREGORIAN : ISLAMIC_UMALQURA;\n return toCalendar(date, other).day;\n}\n\n// ─── Shared chrome hook (locale, portal, chevrons, labels) ─── //\n\n// Consolidates the DgaContext-derived bits both pickers need: the composed\n// react-aria locale, the body-portal container (theme inheritance), the\n// direction-swapped prev/next chevrons, and locale-aware default labels.\nexport function useCalendarChrome(calendarSystem: CalendarSystem, calendarLabels?: CalendarLabels) {\n const dgaCtx = useContext(DgaContext);\n const dgaLocale = dgaCtx?.locale ?? 'en';\n const dir = dgaCtx?.dir ?? 'ltr';\n\n const locale = useMemo(\n () => composeLocale(dgaLocale, calendarSystem),\n [dgaLocale, calendarSystem],\n );\n\n // react-aria's Popover renders to a portal under <body> by default. Re-anchor\n // it under DgaProvider's body-mounted portal so data-theme, theme vars, and\n // .ddga-theme-* classes inherit into the dropdown. Falls back to <body> when\n // used standalone (no provider).\n const portalContainer = (dgaCtx?.portalEl ?? dgaCtx?.rootEl ?? undefined) as Element | undefined;\n\n // In RTL, \"previous\" sits visually on the right and points right; \"next\" sits\n // on the left and points left. Swapping the icon components (rather than\n // CSS-flipping) is robust because it doesn't rely on the portal inheriting dir.\n const PrevArrow = dir === 'rtl' ? ArrowRight : ArrowLeft;\n const NextArrow = dir === 'rtl' ? ArrowLeft : ArrowRight;\n\n const resolvedLabels = useMemo<CalendarLabels>(() => {\n if (calendarLabels) return calendarLabels;\n return dgaLocale.startsWith('ar')\n ? { gregorian: 'ميلادي', hijri: 'هجري' }\n : { gregorian: 'Gregorian', hijri: 'Hijri' };\n }, [calendarLabels, dgaLocale]);\n\n const navLabels = useMemo(\n () =>\n dgaLocale.startsWith('ar')\n ? { month: 'الشهر', year: 'السنة' }\n : { month: 'Month', year: 'Year' },\n [dgaLocale],\n );\n\n const a11yLabels = useMemo<CalendarA11yLabels>(\n () =>\n dgaLocale.startsWith('ar')\n ? { openCalendar: 'فتح التقويم', calendarSystem: 'نظام التقويم' }\n : { openCalendar: 'Open calendar', calendarSystem: 'Calendar system' },\n [dgaLocale],\n );\n\n return {\n dgaLocale,\n dir,\n locale,\n portalContainer,\n PrevArrow,\n NextArrow,\n resolvedLabels,\n navLabels,\n a11yLabels,\n };\n}\n\n// ─── Pressed state (reliable on a react-aria Group) ─── //\n\n// CSS `:active` is unreliable on the picker trigger: it's a react-aria Group of\n// DateSegments + a Button whose usePress handling (preventDefault / pointer\n// capture) makes `:active` fire inconsistently depending on where you press.\n// Track pressed in JS via CAPTURE-phase pointer events (which fire on the Group\n// before any child can swallow them) and expose it as `data-pressed`. Spread\n// `pressHandlers` onto the trigger Group; gate the CSS with `[data-pressed]`.\nexport function usePressedState() {\n const [pressed, setPressed] = useState(false);\n return {\n pressed,\n pressHandlers: {\n onPointerDownCapture: () => setPressed(true),\n onPointerUpCapture: () => setPressed(false),\n onPointerCancelCapture: () => setPressed(false),\n onPointerLeave: () => setPressed(false),\n },\n };\n}\n\n// ─── Calendar-system toggle (Gregorian ↔ Hijri) ─── //\n\ninterface CalendarSystemToggleProps {\n value: CalendarSystem;\n onChange: (next: CalendarSystem) => void;\n labels: CalendarLabels;\n /** Localized accessible name for the tablist (from `useCalendarChrome`). */\n groupLabel: string;\n}\n\nexport function CalendarSystemToggle({\n value,\n onChange,\n labels,\n groupLabel,\n}: CalendarSystemToggleProps) {\n return (\n <div\n role=\"tablist\"\n aria-label={groupLabel}\n className=\"ddga-calendar-toggle\"\n data-slot=\"calendar-toggle\"\n >\n <button\n type=\"button\"\n role=\"tab\"\n aria-selected={value === 'gregorian'}\n className=\"ddga-calendar-toggle__button\"\n data-active={value === 'gregorian' ? '' : undefined}\n onClick={() => onChange('gregorian')}\n >\n {labels.gregorian}\n </button>\n <button\n type=\"button\"\n role=\"tab\"\n aria-selected={value === 'hijri'}\n className=\"ddga-calendar-toggle__button\"\n data-active={value === 'hijri' ? '' : undefined}\n onClick={() => onChange('hijri')}\n >\n {labels.hijri}\n </button>\n </div>\n );\n}\n\n// ─── Calendar nav header (month + year dropdowns) ─── //\n\n// Rendered inside <Calendar>/<RangeCalendar> so it can consume the calendar\n// state context. Both single and range calendars expose the same\n// `focusedDate`/`setFocusedDate`/`minValue`/`maxValue` surface (CalendarStateBase),\n// so we read whichever context is populated — the component is calendar-kind\n// agnostic. Hooking the state directly keeps the dropdowns in sync with the\n// prev/next buttons and keyboard navigation automatically.\ninterface CalendarNavHeaderProps {\n locale: string;\n monthLabel: string;\n yearLabel: string;\n}\n\nexport function CalendarNavHeader({ locale, monthLabel, yearLabel }: CalendarNavHeaderProps) {\n // A given subtree lives inside exactly one of these; the other is null.\n const rangeState = useContext(AriaRangeCalendarStateContext);\n const singleState = useContext(AriaCalendarStateContext);\n const state = rangeState ?? singleState;\n\n // Pull state fields with safe fallbacks so the hooks below stay unconditional\n // (rules-of-hooks). Rendering still bails when state is null.\n const focusedDate = state?.focusedDate ?? null;\n const focusedYear = focusedDate?.year ?? 0;\n const focusedCalendar = focusedDate?.calendar ?? GREGORIAN;\n const minValue = state?.minValue ?? null;\n const maxValue = state?.maxValue ?? null;\n\n // Localized month names in the active calendar. Hijri months translate\n // correctly because the locale string carries `-u-ca-islamic-umalqura`.\n const monthNames = useMemo(() => {\n if (!focusedDate) return [];\n const fmt = new Intl.DateTimeFormat(locale, { month: 'long' });\n return Array.from({ length: 12 }, (_, i) => {\n const cd = new CalendarDate(focusedCalendar, focusedYear, i + 1, 1);\n const greg = toCalendar(cd, GREGORIAN);\n const js = new Date(greg.year, greg.month - 1, greg.day);\n return fmt.format(js);\n });\n }, [locale, focusedDate, focusedCalendar, focusedYear]);\n\n // Year range. min/maxValue are in the consumer's calendar (Gregorian); convert\n // to the focused calendar's year. Defaults span 100 years back to 30 forward.\n const yearOptions = useMemo(() => {\n if (!focusedDate) return [];\n const minY = minValue ? toCalendar(minValue, focusedCalendar).year : focusedYear - 100;\n const maxY = maxValue ? toCalendar(maxValue, focusedCalendar).year : focusedYear + 30;\n const start = Math.min(minY, focusedYear);\n const end = Math.max(maxY, focusedYear);\n return Array.from({ length: end - start + 1 }, (_, i) => start + i);\n }, [focusedDate, focusedCalendar, focusedYear, minValue, maxValue]);\n\n if (!state || !focusedDate) return null;\n\n return (\n <div className=\"ddga-calendar__nav-selects\" data-slot=\"calendar-nav\">\n <select\n aria-label={monthLabel}\n className=\"ddga-calendar__select ddga-calendar__month-select\"\n data-slot=\"calendar-month-select\"\n value={focusedDate.month}\n onChange={(e) => state.setFocusedDate(focusedDate.set({ month: Number(e.target.value) }))}\n >\n {monthNames.map((name, i) => (\n <option key={i + 1} value={i + 1}>\n {name}\n </option>\n ))}\n </select>\n <span className=\"ddga-calendar__year-chip\">\n <select\n aria-label={yearLabel}\n className=\"ddga-calendar__select ddga-calendar__year-select\"\n data-slot=\"calendar-year-select\"\n value={focusedDate.year}\n onChange={(e) => state.setFocusedDate(focusedDate.set({ year: Number(e.target.value) }))}\n >\n {yearOptions.map((y) => (\n <option key={y} value={y}>\n {y}\n </option>\n ))}\n </select>\n <ChevronDown aria-hidden=\"true\" className=\"ddga-calendar__year-chevron\" />\n </span>\n </div>\n );\n}\n\n// ─── Day-cell content (primary number + optional secondary calendar number) ─── //\n\n// The visual content rendered inside a day cell, shared by both pickers. Takes\n// the already-formatted primary text (react-aria's `formattedDate`, or a bare\n// day number for the single picker's outside-month button) and stacks the other\n// calendar's day number beneath it when `showSecondary` is on.\nexport function renderDayContent(\n primary: ReactNode,\n opts: { showSecondary: boolean; date: DateValue; calendarSystem: CalendarSystem },\n): ReactNode {\n if (!opts.showSecondary) return primary;\n return (\n <>\n <span className=\"ddga-calendar__cell-primary\">{primary}</span>\n <span aria-hidden=\"true\" className=\"ddga-calendar__cell-secondary\">\n {secondaryDayNumber(opts.date, opts.calendarSystem)}\n </span>\n </>\n );\n}\n"]}
@@ -6,7 +6,9 @@
6
6
 
7
7
 
8
8
 
9
- var _chunkA4HS7CYDcjs = require('./chunk-A4HS7CYD.cjs');
9
+
10
+
11
+ var _chunkNQGMWK5Ccjs = require('./chunk-NQGMWK5C.cjs');
10
12
 
11
13
 
12
14
  var _chunkV6MXOJQ4cjs = require('./chunk-V6MXOJQ4.cjs');
@@ -79,11 +81,11 @@ function CalendarDayCell({ date, showSecondary, calendarSystem }) {
79
81
  "data-selected": isSelected ? "" : void 0,
80
82
  "data-slot": "date-picker-day-cell",
81
83
  onClick: handleSelect,
82
- children: _chunkA4HS7CYDcjs.renderDayContent.call(void 0, date.day, { showSecondary, date, calendarSystem })
84
+ children: _chunkNQGMWK5Ccjs.renderDayContent.call(void 0, date.day, { showSecondary, date, calendarSystem })
83
85
  }
84
86
  ) });
85
87
  }
86
- return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.CalendarCell, { date, className: "ddga-calendar__cell", children: ({ formattedDate }) => _chunkA4HS7CYDcjs.renderDayContent.call(void 0, formattedDate, { showSecondary, date, calendarSystem }) });
88
+ return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.CalendarCell, { date, className: "ddga-calendar__cell", children: ({ formattedDate }) => _chunkNQGMWK5Ccjs.renderDayContent.call(void 0, formattedDate, { showSecondary, date, calendarSystem }) });
87
89
  }
88
90
  function DatePicker({
89
91
  value: controlledValue,
@@ -113,14 +115,14 @@ function DatePicker({
113
115
  }) {
114
116
  const isValueControlled = controlledValue !== void 0;
115
117
  const [internalValue, setInternalValue] = _react.useState.call(void 0,
116
- () => _chunkA4HS7CYDcjs.dateToCalendarDate.call(void 0, defaultValue)
118
+ () => _chunkNQGMWK5Ccjs.dateToCalendarDate.call(void 0, defaultValue)
117
119
  );
118
- const value = isValueControlled ? _chunkA4HS7CYDcjs.dateToCalendarDate.call(void 0, controlledValue) : internalValue;
120
+ const value = isValueControlled ? _chunkNQGMWK5Ccjs.dateToCalendarDate.call(void 0, controlledValue) : internalValue;
119
121
  const handleAriaChange = _react.useCallback.call(void 0,
120
122
  (next) => {
121
123
  const nextCD = next ? new (0, _date.CalendarDate)(next.year, next.month, next.day) : null;
122
124
  if (!isValueControlled) setInternalValue(nextCD);
123
- _optionalChain([onChange, 'optionalCall', _3 => _3(_chunkA4HS7CYDcjs.calendarDateToDate.call(void 0, nextCD))]);
125
+ _optionalChain([onChange, 'optionalCall', _3 => _3(_chunkNQGMWK5Ccjs.calendarDateToDate.call(void 0, nextCD))]);
124
126
  },
125
127
  [isValueControlled, onChange]
126
128
  );
@@ -143,10 +145,10 @@ function DatePicker({
143
145
  resolvedLabels,
144
146
  navLabels,
145
147
  a11yLabels
146
- } = _chunkA4HS7CYDcjs.useCalendarChrome.call(void 0, calendarSystem, calendarLabels);
147
- const { pressed, pressHandlers } = _chunkA4HS7CYDcjs.usePressedState.call(void 0, );
148
- const ariaMinValue = _react.useMemo.call(void 0, () => _nullishCoalesce(_chunkA4HS7CYDcjs.dateToCalendarDate.call(void 0, minValue), () => ( void 0)), [minValue]);
149
- const ariaMaxValue = _react.useMemo.call(void 0, () => _nullishCoalesce(_chunkA4HS7CYDcjs.dateToCalendarDate.call(void 0, maxValue), () => ( void 0)), [maxValue]);
148
+ } = _chunkNQGMWK5Ccjs.useCalendarChrome.call(void 0, calendarSystem, calendarLabels);
149
+ const { pressed, pressHandlers } = _chunkNQGMWK5Ccjs.usePressedState.call(void 0, );
150
+ const ariaMinValue = _react.useMemo.call(void 0, () => _nullishCoalesce(_chunkNQGMWK5Ccjs.dateToCalendarDate.call(void 0, minValue), () => ( void 0)), [minValue]);
151
+ const ariaMaxValue = _react.useMemo.call(void 0, () => _nullishCoalesce(_chunkNQGMWK5Ccjs.dateToCalendarDate.call(void 0, maxValue), () => ( void 0)), [maxValue]);
150
152
  const dialogAriaLabel = _nullishCoalesce(ariaLabel, () => ( (typeof label === "string" ? label : ariaLabelledBy ? void 0 : dgaLocale.startsWith("ar") ? "\u0627\u0644\u062A\u0627\u0631\u064A\u062E" : "Date")));
151
153
  const showToggle = showCalendarToggle && !isCalendarControlled;
152
154
  const hasError = !!error;
@@ -236,7 +238,7 @@ function DatePicker({
236
238
  "aria-labelledby": ariaLabelledBy,
237
239
  children: [
238
240
  showToggle && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
239
- _chunkA4HS7CYDcjs.CalendarSystemToggle,
241
+ _chunkNQGMWK5Ccjs.CalendarSystemToggle,
240
242
  {
241
243
  value: calendarSystem,
242
244
  onChange: setCalendar,
@@ -247,7 +249,7 @@ function DatePicker({
247
249
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _reactariacomponents.Calendar, { className: "ddga-calendar", "data-slot": "date-picker-calendar", children: [
248
250
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "header", { className: "ddga-calendar__header", children: [
249
251
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
250
- _chunkA4HS7CYDcjs.CalendarNavHeader,
252
+ _chunkNQGMWK5Ccjs.CalendarNavHeader,
251
253
  {
252
254
  locale: ariaLocale,
253
255
  monthLabel: navLabels.month,
@@ -275,17 +277,24 @@ function DatePicker({
275
277
  )
276
278
  ] })
277
279
  ] }),
278
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _reactariacomponents.CalendarGrid, { className: "ddga-calendar__grid", weekdayStyle: "short", children: [
279
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.CalendarGridHeader, { children: (day) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.CalendarHeaderCell, { className: "ddga-calendar__weekday", children: day }) }),
280
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.CalendarGridBody, { children: (date) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
281
- CalendarDayCell,
282
- {
283
- date,
284
- showSecondary: showSecondaryCalendar,
285
- calendarSystem
286
- }
287
- ) })
288
- ] })
280
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
281
+ _reactariacomponents.CalendarGrid,
282
+ {
283
+ className: "ddga-calendar__grid",
284
+ weekdayStyle: _chunkNQGMWK5Ccjs.weekdayStyleForLocale.call(void 0, dgaLocale),
285
+ children: [
286
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.CalendarGridHeader, { children: (day) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.CalendarHeaderCell, { className: "ddga-calendar__weekday", children: _chunkNQGMWK5Ccjs.formatWeekdayLabel.call(void 0, day, dgaLocale) }) }),
287
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.CalendarGridBody, { children: (date) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
288
+ CalendarDayCell,
289
+ {
290
+ date,
291
+ showSecondary: showSecondaryCalendar,
292
+ calendarSystem
293
+ }
294
+ ) })
295
+ ]
296
+ }
297
+ )
289
298
  ] })
290
299
  ]
291
300
  }
@@ -302,4 +311,4 @@ function DatePicker({
302
311
 
303
312
 
304
313
  exports.datePickerTriggerVariants = datePickerTriggerVariants; exports.datePickerVariants = datePickerVariants; exports.DatePicker = DatePicker;
305
- //# sourceMappingURL=chunk-3JHIEAJG.cjs.map
314
+ //# sourceMappingURL=chunk-SZ2AUE62.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-SZ2AUE62.cjs","../src/components/DatePicker/DatePicker.tsx"],"names":[],"mappings":"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","file":"/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-SZ2AUE62.cjs","sourcesContent":[null,"'use client';\n\nimport { useCallback, useContext, useMemo, useState, type ReactNode } from 'react';\nimport {\n Button as AriaButton,\n Calendar as AriaCalendar,\n CalendarCell as AriaCalendarCell,\n CalendarGrid as AriaCalendarGrid,\n CalendarGridBody as AriaCalendarGridBody,\n CalendarGridHeader as AriaCalendarGridHeader,\n CalendarHeaderCell as AriaCalendarHeaderCell,\n CalendarStateContext as AriaCalendarStateContext,\n DateInput as AriaDateInput,\n DatePicker as AriaDatePicker,\n DateSegment as AriaDateSegment,\n Dialog as AriaDialog,\n FieldError as AriaFieldError,\n Group as AriaGroup,\n I18nProvider,\n Label as AriaLabel,\n Popover as AriaPopover,\n Text as AriaText,\n} from 'react-aria-components';\nimport { CalendarDate, type DateValue } from '@internationalized/date';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport {\n CalendarNavHeader,\n CalendarSystemToggle,\n calendarDateToDate,\n dateToCalendarDate,\n formatWeekdayLabel,\n renderDayContent,\n useCalendarChrome,\n usePressedState,\n weekdayStyleForLocale,\n type CalendarLabels,\n type CalendarSystem,\n} from '../../internal/calendar';\n\n// ─── 1. Variants ─── //\n\n// Applied to the Group (the trigger row). Heights match Input/Select sm/md so\n// a DatePicker lines up with other fields in a form row.\nconst datePickerTriggerVariants = cva('ddga-date-picker-trigger', {\n variants: {\n size: {\n md: 'ddga-date-picker-trigger--md',\n lg: 'ddga-date-picker-trigger--lg',\n },\n variant: {\n default: 'ddga-date-picker-trigger--default',\n 'filled-lighter': 'ddga-date-picker-trigger--filled-lighter',\n 'filled-darker': 'ddga-date-picker-trigger--filled-darker',\n },\n error: {\n true: 'ddga-date-picker-trigger--error',\n },\n },\n defaultVariants: {\n size: 'lg',\n variant: 'default',\n },\n});\n\n// Passthrough alias so the barrel `*Variants` convention holds across\n// components. Same value, different name.\nconst datePickerVariants = datePickerTriggerVariants;\n\n// ─── 2. Types ─── //\n\ninterface DatePickerProps extends VariantProps<typeof datePickerTriggerVariants> {\n /** Currently selected date (controlled). Local Y/M/D. */\n value?: Date | null;\n /** Initial value when uncontrolled. */\n defaultValue?: Date | null;\n /** Fires whenever the user picks a day. `null` when cleared. */\n onChange?: (value: Date | null) => void;\n /** Earliest pickable date (inclusive). */\n minValue?: Date;\n /** Latest pickable date (inclusive). */\n maxValue?: Date;\n /** Visible label above the trigger. */\n label?: ReactNode;\n /** Hint shown below the trigger. Hidden while an error message is showing. */\n helperText?: ReactNode;\n /** Message shown below the trigger when `error` is true. */\n errorMessage?: ReactNode;\n /** Marks the field invalid — sets `aria-invalid` and error styling. */\n error?: boolean;\n /** Marks the field required — adds the asterisk + `aria-required`. */\n required?: boolean;\n /** Disables the trigger entirely. */\n disabled?: boolean;\n /** Read-only: value is shown but not editable (segments + calendar locked). */\n readOnly?: boolean;\n /** Caller-supplied id for the field. */\n id?: string;\n /** Forwarded to the Group (the trigger row), matching Input/Select. */\n className?: string;\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n /**\n * Calendar system (controlled). Omit to let the user toggle freely with\n * the in-popover switch.\n */\n calendar?: CalendarSystem;\n /** Initial calendar system when uncontrolled. Defaults to `'gregorian'`. */\n defaultCalendar?: CalendarSystem;\n /** Fires whenever the calendar system toggles. */\n onCalendarChange?: (calendar: CalendarSystem) => void;\n /**\n * Show the Gregorian↔Hijri toggle inside the popover. Defaults to `true`,\n * but is forced off when `calendar` is controlled — a toggle that ignores\n * its click is a worse footgun than no toggle.\n */\n showCalendarToggle?: boolean;\n /** Override the toggle labels. Defaults are locale-aware (English / Arabic). */\n calendarLabels?: CalendarLabels;\n /**\n * When `true`, each day cell also shows the *other* calendar's day number\n * as small secondary text (e.g., Hijri active → Gregorian day shown small\n * underneath). Helps users cross-reference dates between calendar systems\n * without round-tripping the toggle. Defaults to `false`.\n */\n showSecondaryCalendar?: boolean;\n}\n\n// ─── 3. Outside-month cell wrapper (single-date only) ─── //\n\n// react-aria marks outside-month cells as disabled by design — the standard\n// Calendar UX uses arrows / dropdowns / keyboard for cross-month navigation.\n// But many DGA flows want one-click selection of an adjacent month's day, so\n// we render a parallel <button> for those cells that bypasses the disabled\n// state, drives `setFocusedDate` + `selectDate` manually, and preserves the\n// rest of react-aria's a11y wiring for inside-month cells.\n//\n// This lives in DatePicker (not the shared core) because its `isSelected` check\n// reads `state.value` as a single CalendarDate — that doesn't generalize to a\n// range, where `state.value` is `{ start, end }`. DateRangePicker uses\n// react-aria's default outside-month behavior instead.\nfunction CalendarDayCell({ date, showSecondary, calendarSystem }: CalendarDayCellProps) {\n const state = useContext(AriaCalendarStateContext);\n\n // Visible range start tells us the \"current\" month being shown. Anything\n // with a different (year, month) pair is outside-month.\n const start = state?.visibleRange.start;\n const isOutside = !!start && (date.year !== start.year || date.month !== start.month);\n\n // For outside-month cells, also confirm they're inside min/max bounds —\n // otherwise they should genuinely render disabled. `state.isInvalid` is\n // bounds-only (min/max); `isCellDisabled` also marks outside-month as\n // disabled internally, which would block our wrapper from activating.\n const isOutOfBounds = state ? state.isInvalid(date) : false;\n\n if (state && isOutside && !isOutOfBounds) {\n const selected = state.value;\n const isSelected =\n !!selected &&\n selected.year === date.year &&\n selected.month === date.month &&\n selected.day === date.day;\n\n const handleSelect = () => {\n // Update focused-month first so the visible page jumps, then commit the\n // selection. React batches these into one re-render.\n state.setFocusedDate(date);\n state.selectDate(date);\n };\n\n return (\n <td role=\"gridcell\">\n <button\n type=\"button\"\n // Outside the keyboard nav chain (react-aria's inside-month cells own\n // that). Mouse users get the shortcut; keyboard users navigate via\n // arrows or the month/year dropdowns.\n tabIndex={-1}\n className=\"ddga-calendar__cell\"\n data-outside-month=\"\"\n data-selected={isSelected ? '' : undefined}\n data-slot=\"date-picker-day-cell\"\n onClick={handleSelect}\n >\n {renderDayContent(date.day, { showSecondary, date, calendarSystem })}\n </button>\n </td>\n );\n }\n\n return (\n <AriaCalendarCell date={date} className=\"ddga-calendar__cell\">\n {({ formattedDate }) =>\n renderDayContent(formattedDate, { showSecondary, date, calendarSystem })\n }\n </AriaCalendarCell>\n );\n}\n\ninterface CalendarDayCellProps {\n date: CalendarDate;\n showSecondary: boolean;\n calendarSystem: CalendarSystem;\n}\n\n// ─── 4. Component ─── //\n\nfunction DatePicker({\n value: controlledValue,\n defaultValue,\n onChange,\n minValue,\n maxValue,\n label,\n helperText,\n errorMessage,\n error,\n required,\n disabled,\n readOnly,\n size,\n variant,\n id,\n className,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n calendar: controlledCalendar,\n defaultCalendar = 'gregorian',\n onCalendarChange,\n showCalendarToggle = true,\n calendarLabels,\n showSecondaryCalendar = false,\n}: DatePickerProps) {\n // ─ value: controlled or uncontrolled, always Gregorian internally ─\n const isValueControlled = controlledValue !== undefined;\n const [internalValue, setInternalValue] = useState<CalendarDate | null>(() =>\n dateToCalendarDate(defaultValue),\n );\n const value = isValueControlled ? dateToCalendarDate(controlledValue) : internalValue;\n\n const handleAriaChange = useCallback(\n (next: DateValue | null) => {\n const nextCD = next ? new CalendarDate(next.year, next.month, next.day) : null;\n if (!isValueControlled) setInternalValue(nextCD);\n onChange?.(calendarDateToDate(nextCD));\n },\n [isValueControlled, onChange],\n );\n\n // ─ calendar system: controlled or uncontrolled ─\n const isCalendarControlled = controlledCalendar !== undefined;\n const [internalCalendar, setInternalCalendar] = useState<CalendarSystem>(defaultCalendar);\n const calendarSystem = isCalendarControlled ? controlledCalendar : internalCalendar;\n\n const setCalendar = useCallback(\n (next: CalendarSystem) => {\n if (!isCalendarControlled) setInternalCalendar(next);\n onCalendarChange?.(next);\n },\n [isCalendarControlled, onCalendarChange],\n );\n\n // ─ Shared chrome (locale, portal, chevrons, labels) ─\n const {\n dgaLocale,\n locale: ariaLocale,\n portalContainer,\n PrevArrow,\n NextArrow,\n resolvedLabels,\n navLabels,\n a11yLabels,\n } = useCalendarChrome(calendarSystem, calendarLabels);\n const { pressed, pressHandlers } = usePressedState();\n\n // ─ Bounds ─\n const ariaMinValue = useMemo(() => dateToCalendarDate(minValue) ?? undefined, [minValue]);\n const ariaMaxValue = useMemo(() => dateToCalendarDate(maxValue) ?? undefined, [maxValue]);\n\n // ─ Popover aria-label fallback ─\n // Dialog requires an accessible name; derive from the field label when\n // possible (string-only), else fall back to a generic so a11y stays valid\n // even when consumers compose a rich label node.\n const dialogAriaLabel =\n ariaLabel ??\n (typeof label === 'string'\n ? label\n : ariaLabelledBy\n ? undefined\n : dgaLocale.startsWith('ar')\n ? 'التاريخ'\n : 'Date');\n\n // ─ Toggle visibility ─\n const showToggle = showCalendarToggle && !isCalendarControlled;\n\n // ─ Derived field-message visibility (mirrors useFieldA11y rules) ─\n const hasError = !!error;\n const hasErrorMessage = hasError && errorMessage != null && errorMessage !== '';\n const hasHelper = !hasErrorMessage && helperText != null && helperText !== '';\n\n return (\n <I18nProvider locale={ariaLocale}>\n <AriaDatePicker\n value={value}\n onChange={handleAriaChange}\n minValue={ariaMinValue}\n maxValue={ariaMaxValue}\n isRequired={required}\n isDisabled={disabled}\n isReadOnly={readOnly}\n isInvalid={hasError}\n shouldCloseOnSelect\n id={id}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className=\"ddga-field\"\n data-slot=\"date-picker-field\"\n >\n {label && (\n <AriaLabel className=\"ddga-date-picker__label\">\n {label}\n {required && (\n <span aria-hidden=\"true\" className=\"ddga-date-picker__required\">\n *\n </span>\n )}\n </AriaLabel>\n )}\n <AriaGroup\n data-slot=\"date-picker-trigger\"\n data-readonly={readOnly ? '' : undefined}\n data-pressed={pressed ? '' : undefined}\n {...pressHandlers}\n className={cn(datePickerTriggerVariants({ size, variant, error: hasError }), className)}\n >\n <AriaDateInput className=\"ddga-date-picker__input\" data-slot=\"date-picker-input\">\n {(segment) => (\n <AriaDateSegment\n segment={segment}\n className=\"ddga-date-picker__segment\"\n data-slot=\"date-picker-segment\"\n />\n )}\n </AriaDateInput>\n {/* SDGA field has no calendar icon — the field itself opens the\n calendar. The button is the (iconless) click surface filling the\n field's trailing space; segments stay editable. */}\n <AriaButton\n className=\"ddga-date-picker__open\"\n aria-label={a11yLabels.openCalendar}\n data-slot=\"date-picker-trigger-button\"\n />\n </AriaGroup>\n {hasHelper && (\n <AriaText\n slot=\"description\"\n className=\"ddga-field__message ddga-field__message--helper\"\n data-slot=\"field-helper\"\n >\n {helperText}\n </AriaText>\n )}\n {hasErrorMessage && (\n <AriaFieldError\n className=\"ddga-field__message ddga-field__message--error\"\n data-slot=\"field-error\"\n >\n {errorMessage}\n </AriaFieldError>\n )}\n <AriaPopover\n UNSTABLE_portalContainer={portalContainer}\n className=\"ddga-calendar-popover\"\n data-slot=\"date-picker-popover\"\n offset={6}\n // Keep some breathing room from the viewport edge so the popover\n // doesn't butt up against the bottom of the iframe in short\n // containers (the Storybook canvas case). Combined with the inner\n // Dialog's overflow:auto, the calendar will scroll if it can't fit.\n containerPadding={12}\n >\n <AriaDialog\n className=\"ddga-calendar-dialog\"\n data-slot=\"date-picker-dialog\"\n aria-label={dialogAriaLabel}\n aria-labelledby={ariaLabelledBy}\n >\n {showToggle && (\n <CalendarSystemToggle\n value={calendarSystem}\n onChange={setCalendar}\n labels={resolvedLabels}\n groupLabel={a11yLabels.calendarSystem}\n />\n )}\n <AriaCalendar className=\"ddga-calendar\" data-slot=\"date-picker-calendar\">\n <header className=\"ddga-calendar__header\">\n <CalendarNavHeader\n locale={ariaLocale}\n monthLabel={navLabels.month}\n yearLabel={navLabels.year}\n />\n <div className=\"ddga-calendar__nav-group\">\n <AriaButton\n slot=\"previous\"\n className=\"ddga-calendar__nav\"\n data-slot=\"date-picker-calendar-prev\"\n >\n <PrevArrow aria-hidden=\"true\" />\n </AriaButton>\n <AriaButton\n slot=\"next\"\n className=\"ddga-calendar__nav\"\n data-slot=\"date-picker-calendar-next\"\n >\n <NextArrow aria-hidden=\"true\" />\n </AriaButton>\n </div>\n </header>\n <AriaCalendarGrid\n className=\"ddga-calendar__grid\"\n weekdayStyle={weekdayStyleForLocale(dgaLocale)}\n >\n <AriaCalendarGridHeader>\n {(day) => (\n <AriaCalendarHeaderCell className=\"ddga-calendar__weekday\">\n {formatWeekdayLabel(day, dgaLocale)}\n </AriaCalendarHeaderCell>\n )}\n </AriaCalendarGridHeader>\n <AriaCalendarGridBody>\n {(date) => (\n <CalendarDayCell\n date={date}\n showSecondary={showSecondaryCalendar}\n calendarSystem={calendarSystem}\n />\n )}\n </AriaCalendarGridBody>\n </AriaCalendarGrid>\n </AriaCalendar>\n </AriaDialog>\n </AriaPopover>\n </AriaDatePicker>\n </I18nProvider>\n );\n}\n\n// ─── 5. Exports ─── //\n\nexport { DatePicker, datePickerTriggerVariants, datePickerVariants };\nexport type { DatePickerProps, CalendarSystem, CalendarLabels };\n"]}