@dev-dga/react 0.8.0 → 0.8.2

package/dist/chunk-TO7F4EHC.js

@@ -0,0 +1,131 @@
+import {
+  CaretDown,
+  CaretUp,
+  Minus
+} from "./chunk-CDS4SYEQ.js";
+import {
+  cn
+} from "./chunk-7NTT2UXP.js";
+
+// src/components/Stat/Stat.tsx
+import "react";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+var statVariants = cva("ddga-stat", {
+  variants: {
+    variant: {
+      flat: "ddga-stat--flat",
+      elevated: "ddga-stat--elevated",
+      accent: "ddga-stat--accent",
+      // Soft sentiment-tinted gradient surface (reuses the accent tint vars).
+      gradient: "ddga-stat--gradient"
+    },
+    size: {
+      sm: "ddga-stat--sm",
+      md: "ddga-stat--md",
+      lg: "ddga-stat--lg",
+      // Hero/display size for headline KPIs (display-scale value).
+      xl: "ddga-stat--xl"
+    }
+  },
+  defaultVariants: {
+    variant: "flat",
+    size: "md"
+  }
+});
+var TREND_ICONS = {
+  up: /* @__PURE__ */ jsx(CaretUp, { "aria-hidden": "true" }),
+  down: /* @__PURE__ */ jsx(CaretDown, { "aria-hidden": "true" }),
+  flat: /* @__PURE__ */ jsx(Minus, { "aria-hidden": "true" })
+};
+var TREND_SENTIMENT = {
+  up: "positive",
+  down: "negative",
+  flat: "neutral"
+};
+function resolveSentiment(trend, sentiment) {
+  if (sentiment) return sentiment;
+  if (trend) return TREND_SENTIMENT[trend];
+  return void 0;
+}
+function Stat({
+  variant,
+  size,
+  label,
+  value,
+  change,
+  changeLabel,
+  trend,
+  sentiment,
+  changeVariant,
+  icon,
+  className,
+  children,
+  ...props
+}) {
+  const resolvedSentiment = resolveSentiment(trend, sentiment);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "stat",
+      "data-variant": variant ?? "flat",
+      "data-trend": trend,
+      "data-sentiment": resolvedSentiment,
+      className: cn(statVariants({ variant, size }), className),
+      ...props,
+      children: [
+        label || icon ? /* @__PURE__ */ jsxs("div", { className: "ddga-stat__label-row", children: [
+          label ? /* @__PURE__ */ jsx(StatLabel, { children: label }) : null,
+          icon ? /* @__PURE__ */ jsx("span", { className: "ddga-stat__icon", "aria-hidden": "true", children: icon }) : null
+        ] }) : null,
+        value ? /* @__PURE__ */ jsx(StatValue, { children: value }) : null,
+        change || changeLabel ? /* @__PURE__ */ jsxs("div", { className: "ddga-stat__change-row", children: [
+          change ? /* @__PURE__ */ jsx(StatChange, { trend, sentiment, variant: changeVariant, children: change }) : null,
+          changeLabel ? /* @__PURE__ */ jsx("span", { className: "ddga-stat__change-label", children: changeLabel }) : null
+        ] }) : null,
+        children
+      ]
+    }
+  );
+}
+function StatLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "stat-label", className: cn("ddga-stat__label", className), ...props });
+}
+function StatValue({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "stat-value", className: cn("ddga-stat__value", className), ...props });
+}
+function StatChart({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "stat-chart", className: cn("ddga-stat__chart", className), ...props });
+}
+function StatChange({ trend, sentiment, variant, className, children, ...props }) {
+  const resolvedSentiment = resolveSentiment(trend, sentiment);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "stat-change",
+      "data-trend": trend,
+      "data-sentiment": resolvedSentiment,
+      className: cn(
+        "ddga-stat__change",
+        resolvedSentiment ? `ddga-stat__change--${resolvedSentiment}` : null,
+        variant === "chip" && "ddga-stat__change--chip",
+        className
+      ),
+      ...props,
+      children: [
+        trend ? /* @__PURE__ */ jsx("span", { className: "ddga-stat__change-icon", children: TREND_ICONS[trend] }) : null,
+        children
+      ]
+    }
+  );
+}
+
+export {
+  statVariants,
+  Stat,
+  StatLabel,
+  StatValue,
+  StatChart,
+  StatChange
+};
+//# sourceMappingURL=chunk-TO7F4EHC.js.map

package/dist/chunk-TO7F4EHC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Stat/Stat.tsx"],"sourcesContent":["'use client';\n\nimport { type ReactNode } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { CaretUp, CaretDown, Minus } from '../../internal/icons';\n\n// ─── 1. Variants (cva) ─── //\n\nconst statVariants = cva('ddga-stat', {\n  variants: {\n    variant: {\n      flat: 'ddga-stat--flat',\n      elevated: 'ddga-stat--elevated',\n      accent: 'ddga-stat--accent',\n      // Soft sentiment-tinted gradient surface (reuses the accent tint vars).\n      gradient: 'ddga-stat--gradient',\n    },\n    size: {\n      sm: 'ddga-stat--sm',\n      md: 'ddga-stat--md',\n      lg: 'ddga-stat--lg',\n      // Hero/display size for headline KPIs (display-scale value).\n      xl: 'ddga-stat--xl',\n    },\n  },\n  defaultVariants: {\n    variant: 'flat',\n    size: 'md',\n  },\n});\n\ntype ChangeVariant = 'text' | 'chip';\n\ntype Trend = 'up' | 'down' | 'flat';\ntype Sentiment = 'positive' | 'negative' | 'neutral';\n\n// trend → caret icon (carried aria-hidden; carets are RTL-neutral).\nconst TREND_ICONS: Record<Trend, ReactNode> = {\n  up: <CaretUp aria-hidden=\"true\" />,\n  down: <CaretDown aria-hidden=\"true\" />,\n  flat: <Minus aria-hidden=\"true\" />,\n};\n\n// Default sentiment when none is given explicitly.\nconst TREND_SENTIMENT: Record<Trend, Sentiment> = {\n  up: 'positive',\n  down: 'negative',\n  flat: 'neutral',\n};\n\n// Explicit sentiment wins; else derive from trend; else undefined (no color).\nfunction resolveSentiment(trend?: Trend, sentiment?: Sentiment): Sentiment | undefined {\n  if (sentiment) return sentiment;\n  if (trend) return TREND_SENTIMENT[trend];\n  return undefined;\n}\n\n// ─── 2. Types ─── //\n\ninterface StatProps extends React.ComponentProps<'div'>, VariantProps<typeof statVariants> {\n  /** Small, muted label above the value. */\n  label?: ReactNode;\n  /** The metric, pre-formatted by the consumer (e.g. \"3,204\", \"SAR 1.2M\"). */\n  value?: ReactNode;\n  /** Change text — include the sign (e.g. \"+12.5%\") so AT conveys direction. */\n  change?: ReactNode;\n  /** Muted context beside the change (e.g. \"vs last month\"). */\n  changeLabel?: ReactNode;\n  /** Arrow direction: up → CaretUp, down → CaretDown, flat → Minus. */\n  trend?: Trend;\n  /** Change color. Omitted → derived from `trend`. Explicit always wins. */\n  sentiment?: Sentiment;\n  /**\n   * How the change renders: `'text'` (default — colored text + caret) or\n   * `'chip'` (the same, wrapped in a sentiment-tinted pill). Threaded to the\n   * inner `StatChange`.\n   */\n  changeVariant?: ChangeVariant;\n  /** Optional icon at the inline-end of the label row (decorative). */\n  icon?: ReactNode;\n}\n\ntype StatLabelProps = React.ComponentProps<'div'>;\ntype StatValueProps = React.ComponentProps<'div'>;\ntype StatChartProps = React.ComponentProps<'div'>;\ninterface StatChangeProps extends React.ComponentProps<'div'> {\n  trend?: Trend;\n  sentiment?: Sentiment;\n  /** `'chip'` wraps the change in a sentiment-tinted pill. Defaults to `'text'`. */\n  variant?: ChangeVariant;\n}\n\n// ─── 3. Components ─── //\n\nfunction Stat({\n  variant,\n  size,\n  label,\n  value,\n  change,\n  changeLabel,\n  trend,\n  sentiment,\n  changeVariant,\n  icon,\n  className,\n  children,\n  ...props\n}: StatProps) {\n  const resolvedSentiment = resolveSentiment(trend, sentiment);\n  return (\n    <div\n      data-slot=\"stat\"\n      data-variant={variant ?? 'flat'}\n      data-trend={trend}\n      data-sentiment={resolvedSentiment}\n      className={cn(statVariants({ variant, size }), className)}\n      {...props}\n    >\n      {label || icon ? (\n        <div className=\"ddga-stat__label-row\">\n          {label ? <StatLabel>{label}</StatLabel> : null}\n          {icon ? (\n            <span className=\"ddga-stat__icon\" aria-hidden=\"true\">\n              {icon}\n            </span>\n          ) : null}\n        </div>\n      ) : null}\n      {value ? <StatValue>{value}</StatValue> : null}\n      {change || changeLabel ? (\n        <div className=\"ddga-stat__change-row\">\n          {change ? (\n            <StatChange trend={trend} sentiment={sentiment} variant={changeVariant}>\n              {change}\n            </StatChange>\n          ) : null}\n          {changeLabel ? <span className=\"ddga-stat__change-label\">{changeLabel}</span> : null}\n        </div>\n      ) : null}\n      {children}\n    </div>\n  );\n}\n\nfunction StatLabel({ className, ...props }: StatLabelProps) {\n  return <div data-slot=\"stat-label\" className={cn('ddga-stat__label', className)} {...props} />;\n}\n\nfunction StatValue({ className, ...props }: StatValueProps) {\n  return <div data-slot=\"stat-value\" className={cn('ddga-stat__value', className)} {...props} />;\n}\n\n/**\n * Styled slot for a consumer-supplied sparkline / mini-chart. The library ships\n * no charting dependency — drop your own `<svg>`/chart in here and it gets a\n * consistent height + spacing, stretched to the tile width.\n */\nfunction StatChart({ className, ...props }: StatChartProps) {\n  return <div data-slot=\"stat-chart\" className={cn('ddga-stat__chart', className)} {...props} />;\n}\n\nfunction StatChange({ trend, sentiment, variant, className, children, ...props }: StatChangeProps) {\n  const resolvedSentiment = resolveSentiment(trend, sentiment);\n  return (\n    <div\n      data-slot=\"stat-change\"\n      data-trend={trend}\n      data-sentiment={resolvedSentiment}\n      className={cn(\n        'ddga-stat__change',\n        resolvedSentiment ? `ddga-stat__change--${resolvedSentiment}` : null,\n        variant === 'chip' && 'ddga-stat__change--chip',\n        className,\n      )}\n      {...props}\n    >\n      {trend ? <span className=\"ddga-stat__change-icon\">{TREND_ICONS[trend]}</span> : null}\n      {children}\n    </div>\n  );\n}\n\n// ─── 4. Exports ─── //\n\nexport { Stat, StatLabel, StatValue, StatChart, StatChange, statVariants };\nexport type { StatProps, StatLabelProps, StatValueProps, StatChartProps, StatChangeProps };\n"],"mappings":"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","names":[]}

package/dist/chunk-TQYLAWHW.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-TQYLAWHW.js.map

package/dist/chunk-TQYLAWHW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-TT2DEREM.js

@@ -0,0 +1,193 @@
+import {
+  ChevronLeft,
+  ChevronRight
+} from "./chunk-CDS4SYEQ.js";
+import {
+  DgaContext
+} from "./chunk-TMXABSFE.js";
+
+// src/internal/calendar/calendar-core.tsx
+import { useContext, useMemo } from "react";
+import {
+  CalendarStateContext as AriaCalendarStateContext,
+  RangeCalendarStateContext as AriaRangeCalendarStateContext
+} from "react-aria-components";
+import {
+  CalendarDate,
+  GregorianCalendar,
+  IslamicUmalquraCalendar,
+  toCalendar
+} from "@internationalized/date";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var GREGORIAN = new GregorianCalendar();
+var ISLAMIC_UMALQURA = new IslamicUmalquraCalendar();
+function dateToCalendarDate(date) {
+  if (!date) return null;
+  return new CalendarDate(date.getFullYear(), date.getMonth() + 1, date.getDate());
+}
+function calendarDateToDate(value) {
+  if (!value) return null;
+  const greg = value.calendar.identifier === "gregory" ? value : toCalendar(value, new GregorianCalendar());
+  return new Date(greg.year, greg.month - 1, greg.day);
+}
+function composeLocale(dgaLocale, calendar) {
+  const base = dgaLocale === "ar" ? "ar-SA" : dgaLocale === "en" ? "en-US" : dgaLocale;
+  const isArabic = base.startsWith("ar");
+  if (calendar === "hijri") {
+    return isArabic ? `${base}-u-ca-islamic-umalqura-nu-latn` : `${base}-u-ca-islamic-umalqura`;
+  }
+  return isArabic ? `${base}-u-nu-latn` : base;
+}
+function secondaryDayNumber(date, mainCalendar) {
+  const other = mainCalendar === "hijri" ? GREGORIAN : ISLAMIC_UMALQURA;
+  return toCalendar(date, other).day;
+}
+function useCalendarChrome(calendarSystem, calendarLabels) {
+  const dgaCtx = useContext(DgaContext);
+  const dgaLocale = dgaCtx?.locale ?? "en";
+  const dir = dgaCtx?.dir ?? "ltr";
+  const locale = useMemo(
+    () => composeLocale(dgaLocale, calendarSystem),
+    [dgaLocale, calendarSystem]
+  );
+  const portalContainer = dgaCtx?.portalEl ?? dgaCtx?.rootEl ?? void 0;
+  const PrevChevron = dir === "rtl" ? ChevronRight : ChevronLeft;
+  const NextChevron = dir === "rtl" ? ChevronLeft : ChevronRight;
+  const resolvedLabels = useMemo(() => {
+    if (calendarLabels) return calendarLabels;
+    return dgaLocale.startsWith("ar") ? { gregorian: "\u0645\u064A\u0644\u0627\u062F\u064A", hijri: "\u0647\u062C\u0631\u064A" } : { gregorian: "Gregorian", hijri: "Hijri" };
+  }, [calendarLabels, dgaLocale]);
+  const navLabels = useMemo(
+    () => dgaLocale.startsWith("ar") ? { month: "\u0627\u0644\u0634\u0647\u0631", year: "\u0627\u0644\u0633\u0646\u0629" } : { month: "Month", year: "Year" },
+    [dgaLocale]
+  );
+  const a11yLabels = useMemo(
+    () => dgaLocale.startsWith("ar") ? { openCalendar: "\u0641\u062A\u062D \u0627\u0644\u062A\u0642\u0648\u064A\u0645", calendarSystem: "\u0646\u0638\u0627\u0645 \u0627\u0644\u062A\u0642\u0648\u064A\u0645" } : { openCalendar: "Open calendar", calendarSystem: "Calendar system" },
+    [dgaLocale]
+  );
+  return {
+    dgaLocale,
+    dir,
+    locale,
+    portalContainer,
+    PrevChevron,
+    NextChevron,
+    resolvedLabels,
+    navLabels,
+    a11yLabels
+  };
+}
+function CalendarSystemToggle({
+  value,
+  onChange,
+  labels,
+  groupLabel
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "tablist",
+      "aria-label": groupLabel,
+      className: "ddga-calendar-toggle",
+      "data-slot": "calendar-toggle",
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            role: "tab",
+            "aria-selected": value === "gregorian",
+            className: "ddga-calendar-toggle__button",
+            "data-active": value === "gregorian" ? "" : void 0,
+            onClick: () => onChange("gregorian"),
+            children: labels.gregorian
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            role: "tab",
+            "aria-selected": value === "hijri",
+            className: "ddga-calendar-toggle__button",
+            "data-active": value === "hijri" ? "" : void 0,
+            onClick: () => onChange("hijri"),
+            children: labels.hijri
+          }
+        )
+      ]
+    }
+  );
+}
+function CalendarNavHeader({ locale, monthLabel, yearLabel }) {
+  const rangeState = useContext(AriaRangeCalendarStateContext);
+  const singleState = useContext(AriaCalendarStateContext);
+  const state = rangeState ?? singleState;
+  const focusedDate = state?.focusedDate ?? null;
+  const focusedYear = focusedDate?.year ?? 0;
+  const focusedCalendar = focusedDate?.calendar ?? GREGORIAN;
+  const minValue = state?.minValue ?? null;
+  const maxValue = state?.maxValue ?? null;
+  const monthNames = useMemo(() => {
+    if (!focusedDate) return [];
+    const fmt = new Intl.DateTimeFormat(locale, { month: "long" });
+    return Array.from({ length: 12 }, (_, i) => {
+      const cd = new CalendarDate(focusedCalendar, focusedYear, i + 1, 1);
+      const greg = toCalendar(cd, GREGORIAN);
+      const js = new Date(greg.year, greg.month - 1, greg.day);
+      return fmt.format(js);
+    });
+  }, [locale, focusedDate, focusedCalendar, focusedYear]);
+  const yearOptions = useMemo(() => {
+    if (!focusedDate) return [];
+    const minY = minValue ? toCalendar(minValue, focusedCalendar).year : focusedYear - 100;
+    const maxY = maxValue ? toCalendar(maxValue, focusedCalendar).year : focusedYear + 30;
+    const start = Math.min(minY, focusedYear);
+    const end = Math.max(maxY, focusedYear);
+    return Array.from({ length: end - start + 1 }, (_, i) => start + i);
+  }, [focusedDate, focusedCalendar, focusedYear, minValue, maxValue]);
+  if (!state || !focusedDate) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "ddga-calendar__nav-selects", "data-slot": "calendar-nav", children: [
+    /* @__PURE__ */ jsx(
+      "select",
+      {
+        "aria-label": monthLabel,
+        className: "ddga-calendar__select ddga-calendar__month-select",
+        "data-slot": "calendar-month-select",
+        value: focusedDate.month,
+        onChange: (e) => state.setFocusedDate(focusedDate.set({ month: Number(e.target.value) })),
+        children: monthNames.map((name, i) => /* @__PURE__ */ jsx("option", { value: i + 1, children: name }, i + 1))
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "select",
+      {
+        "aria-label": yearLabel,
+        className: "ddga-calendar__select ddga-calendar__year-select",
+        "data-slot": "calendar-year-select",
+        value: focusedDate.year,
+        onChange: (e) => state.setFocusedDate(focusedDate.set({ year: Number(e.target.value) })),
+        children: yearOptions.map((y) => /* @__PURE__ */ jsx("option", { value: y, children: y }, y))
+      }
+    )
+  ] });
+}
+function renderDayContent(primary, opts) {
+  if (!opts.showSecondary) return primary;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("span", { className: "ddga-calendar__cell-primary", children: primary }),
+    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "ddga-calendar__cell-secondary", children: secondaryDayNumber(opts.date, opts.calendarSystem) })
+  ] });
+}
+
+export {
+  dateToCalendarDate,
+  calendarDateToDate,
+  composeLocale,
+  secondaryDayNumber,
+  useCalendarChrome,
+  CalendarSystemToggle,
+  CalendarNavHeader,
+  renderDayContent
+};
+//# sourceMappingURL=chunk-TT2DEREM.js.map

package/dist/chunk-TT2DEREM.js.map

@@ -0,0 +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, 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 { ChevronLeft, ChevronRight } 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// ─── 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 should point right; \"next\"\n  // sits 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 PrevChevron = dir === 'rtl' ? ChevronRight : ChevronLeft;\n  const NextChevron = dir === 'rtl' ? ChevronLeft : ChevronRight;\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    PrevChevron,\n    NextChevron,\n    resolvedLabels,\n    navLabels,\n    a11yLabels,\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      <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    </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":[]}

package/dist/chunk-TTHWYBQB.cjs

@@ -0,0 +1,60 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkV6MXOJQ4cjs = require('./chunk-V6MXOJQ4.cjs');
+
+// src/components/Divider/Divider.tsx
+var _classvarianceauthority = require('class-variance-authority');
+var _jsxruntime = require('react/jsx-runtime');
+var dividerVariants = _classvarianceauthority.cva.call(void 0, "ddga-divider", {
+  variants: {
+    orientation: {
+      horizontal: "ddga-divider--horizontal",
+      vertical: "ddga-divider--vertical"
+    },
+    variant: {
+      solid: "ddga-divider--solid",
+      dashed: "ddga-divider--dashed"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    variant: "solid"
+  }
+});
+function Divider({
+  orientation = "horizontal",
+  variant = "solid",
+  labelPosition = "center",
+  decorative = false,
+  className,
+  children,
+  ...props
+}) {
+  const isLabeled = orientation === "horizontal" && children !== void 0 && children !== null && children !== "";
+  const a11yProps = decorative ? { role: "none" } : {
+    role: "separator",
+    ...orientation === "vertical" ? { "aria-orientation": "vertical" } : {}
+  };
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "div",
+    {
+      "data-slot": "divider",
+      "data-orientation": orientation,
+      className: _chunkV6MXOJQ4cjs.cn.call(void 0, 
+        dividerVariants({ orientation, variant }),
+        isLabeled && "ddga-divider--labeled",
+        isLabeled && `ddga-divider--label-${labelPosition}`,
+        className
+      ),
+      ...a11yProps,
+      ...props,
+      children: isLabeled ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ddga-divider__label", children }) : null
+    }
+  );
+}
+
+
+
+
+exports.dividerVariants = dividerVariants; exports.Divider = Divider;
+//# sourceMappingURL=chunk-TTHWYBQB.cjs.map

package/dist/chunk-TTHWYBQB.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-TTHWYBQB.cjs","../src/components/Divider/Divider.tsx"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACFA,kEAAuC;AAoFpB,+CAAA;AA/EnB,IAAM,gBAAA,EAAkB,yCAAA,cAAI,EAAgB;AAAA,EAC1C,QAAA,EAAU;AAAA,IACR,WAAA,EAAa;AAAA,MACX,UAAA,EAAY,0BAAA;AAAA,MACZ,QAAA,EAAU;AAAA,IACZ,CAAA;AAAA,IACA,OAAA,EAAS;AAAA,MACP,KAAA,EAAO,qBAAA;AAAA,MACP,MAAA,EAAQ;AAAA,IACV;AAAA,EACF,CAAA;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,WAAA,EAAa,YAAA;AAAA,IACb,OAAA,EAAS;AAAA,EACX;AACF,CAAC,CAAA;AA8BD,SAAS,OAAA,CAAQ;AAAA,EACf,YAAA,EAAc,YAAA;AAAA,EACd,QAAA,EAAU,OAAA;AAAA,EACV,cAAA,EAAgB,QAAA;AAAA,EAChB,WAAA,EAAa,KAAA;AAAA,EACb,SAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAiB;AACf,EAAA,MAAM,UAAA,EACJ,YAAA,IAAgB,aAAA,GAAgB,SAAA,IAAa,KAAA,EAAA,GAAa,SAAA,IAAa,KAAA,GAAQ,SAAA,IAAa,EAAA;AAI9F,EAAA,MAAM,UAAA,EAAY,WAAA,EACd,EAAE,IAAA,EAAM,OAAgB,EAAA,EACxB;AAAA,IACE,IAAA,EAAM,WAAA;AAAA,IACN,GAAI,YAAA,IAAgB,WAAA,EAAa,EAAE,kBAAA,EAAoB,WAAoB,EAAA,EAAI,CAAC;AAAA,EAClF,CAAA;AAEJ,EAAA,uBACE,6BAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,SAAA;AAAA,MACV,kBAAA,EAAkB,WAAA;AAAA,MAClB,SAAA,EAAW,kCAAA;AAAA,QACT,eAAA,CAAgB,EAAE,WAAA,EAAa,QAAQ,CAAC,CAAA;AAAA,QACxC,UAAA,GAAa,uBAAA;AAAA,QACb,UAAA,GAAa,CAAA,oBAAA,EAAuB,aAAa,CAAA,CAAA;AACjD,QAAA;AACF,MAAA;AACI,MAAA;AACA,MAAA;AAEe,MAAA;AAAoD,IAAA;AACzE,EAAA;AAEJ;ADnC0D;AACA;AACA;AACA;AACA","file":"/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-TTHWYBQB.cjs","sourcesContent":[null,"'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\n// ─── 1. Variants (cva) ─── //\n\nconst dividerVariants = cva('ddga-divider', {\n  variants: {\n    orientation: {\n      horizontal: 'ddga-divider--horizontal',\n      vertical: 'ddga-divider--vertical',\n    },\n    variant: {\n      solid: 'ddga-divider--solid',\n      dashed: 'ddga-divider--dashed',\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n    variant: 'solid',\n  },\n});\n\n// ─── 2. Types ─── //\n\ninterface DividerProps\n  extends Omit<React.ComponentProps<'div'>, 'role'>, VariantProps<typeof dividerVariants> {\n  /**\n   * Optional label rendered inside a horizontal divider. Ignored when\n   * `orientation=\"vertical\"`. When set, the divider renders as a three-part\n   * flex (line — label — line) instead of a single bar.\n   */\n  children?: React.ReactNode;\n  /**\n   * Where to place the label along the divider. Defaults to `center`. Ignored\n   * when no label is provided. `start` and `end` are logical (LTR/RTL aware).\n   */\n  labelPosition?: 'start' | 'center' | 'end';\n  /**\n   * If `true`, the divider is treated as purely decorative and removed from\n   * the accessibility tree (`role=\"none\"`). Defaults to `false`.\n   */\n  decorative?: boolean;\n}\n\n// ─── 3. Component ─── //\n//\n// Note: no `asChild`. A separator is either a plain bar (no children, nothing\n// to slot into) or a labeled bar (the label is its own slotted child, not the\n// root). The `asChild` escape hatch doesn't carry meaning for either shape.\n\nfunction Divider({\n  orientation = 'horizontal',\n  variant = 'solid',\n  labelPosition = 'center',\n  decorative = false,\n  className,\n  children,\n  ...props\n}: DividerProps) {\n  const isLabeled =\n    orientation === 'horizontal' && children !== undefined && children !== null && children !== '';\n\n  // WAI-ARIA: `separator` default orientation is horizontal, so only emit\n  // `aria-orientation` when vertical. Decorative dividers drop role + aria entirely.\n  const a11yProps = decorative\n    ? { role: 'none' as const }\n    : {\n        role: 'separator' as const,\n        ...(orientation === 'vertical' ? { 'aria-orientation': 'vertical' as const } : {}),\n      };\n\n  return (\n    <div\n      data-slot=\"divider\"\n      data-orientation={orientation}\n      className={cn(\n        dividerVariants({ orientation, variant }),\n        isLabeled && 'ddga-divider--labeled',\n        isLabeled && `ddga-divider--label-${labelPosition}`,\n        className,\n      )}\n      {...a11yProps}\n      {...props}\n    >\n      {isLabeled ? <span className=\"ddga-divider__label\">{children}</span> : null}\n    </div>\n  );\n}\n\n// ─── 4. Exports ─── //\n\nexport { Divider, dividerVariants };\nexport type { DividerProps };\n"]}

package/dist/chunk-TWCX4EZR.js

@@ -0,0 +1,115 @@
+import {
+  Close
+} from "./chunk-CDS4SYEQ.js";
+import {
+  DgaContext
+} from "./chunk-TMXABSFE.js";
+import {
+  cn
+} from "./chunk-7NTT2UXP.js";
+
+// src/components/Modal/Modal.tsx
+import { useContext } from "react";
+import { Dialog as DialogPrimitive, Slot as SlotPrimitive } from "radix-ui";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+var modalContentVariants = cva("ddga-modal", {
+  variants: {
+    size: {
+      sm: "ddga-modal--sm",
+      md: "ddga-modal--md",
+      lg: "ddga-modal--lg",
+      xl: "ddga-modal--xl",
+      full: "ddga-modal--full"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+function Modal(props) {
+  return /* @__PURE__ */ jsx(DialogPrimitive.Root, { ...props });
+}
+function ModalTrigger({ className, ...props }) {
+  return /* @__PURE__ */ jsx(DialogPrimitive.Trigger, { "data-slot": "modal-trigger", className, ...props });
+}
+function ModalContent({
+  size,
+  showCloseButton = true,
+  closeLabel = "Close",
+  className,
+  children,
+  ...props
+}) {
+  const ctx = useContext(DgaContext);
+  const portalContainer = ctx?.portalEl ?? ctx?.rootEl ?? void 0;
+  return /* @__PURE__ */ jsxs(DialogPrimitive.Portal, { container: portalContainer, children: [
+    /* @__PURE__ */ jsx(DialogPrimitive.Overlay, { className: "ddga-modal__overlay", "data-slot": "modal-overlay" }),
+    /* @__PURE__ */ jsxs(
+      DialogPrimitive.Content,
+      {
+        "data-slot": "modal-content",
+        className: cn(modalContentVariants({ size }), className),
+        ...props,
+        children: [
+          children,
+          showCloseButton ? /* @__PURE__ */ jsx(
+            DialogPrimitive.Close,
+            {
+              className: "ddga-modal__close",
+              "aria-label": closeLabel,
+              "data-slot": "modal-close-x",
+              children: /* @__PURE__ */ jsx(Close, { "aria-hidden": "true" })
+            }
+          ) : null
+        ]
+      }
+    )
+  ] });
+}
+function ModalHeader({ asChild, className, ...props }) {
+  const Comp = asChild ? SlotPrimitive.Slot : "div";
+  return /* @__PURE__ */ jsx(Comp, { "data-slot": "modal-header", className: cn("ddga-modal__header", className), ...props });
+}
+function ModalTitle({ asChild, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    DialogPrimitive.Title,
+    {
+      asChild,
+      "data-slot": "modal-title",
+      className: cn("ddga-modal__title", className),
+      ...props
+    }
+  );
+}
+function ModalDescription({ asChild, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    DialogPrimitive.Description,
+    {
+      asChild,
+      "data-slot": "modal-description",
+      className: cn("ddga-modal__description", className),
+      ...props
+    }
+  );
+}
+function ModalFooter({ asChild, className, ...props }) {
+  const Comp = asChild ? SlotPrimitive.Slot : "div";
+  return /* @__PURE__ */ jsx(Comp, { "data-slot": "modal-footer", className: cn("ddga-modal__footer", className), ...props });
+}
+function ModalClose({ className, ...props }) {
+  return /* @__PURE__ */ jsx(DialogPrimitive.Close, { "data-slot": "modal-close", className, ...props });
+}
+
+export {
+  modalContentVariants,
+  Modal,
+  ModalTrigger,
+  ModalContent,
+  ModalHeader,
+  ModalTitle,
+  ModalDescription,
+  ModalFooter,
+  ModalClose
+};
+//# sourceMappingURL=chunk-TWCX4EZR.js.map

package/dist/chunk-TWCX4EZR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { useContext } from 'react';\nimport { Dialog as DialogPrimitive, Slot as SlotPrimitive } from 'radix-ui';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { DgaContext } from '../../providers/DgaContext';\nimport { Close } from '../../internal/icons';\n\n// ─── 1. Variants (cva) ─── //\n\nconst modalContentVariants = cva('ddga-modal', {\n  variants: {\n    size: {\n      sm: 'ddga-modal--sm',\n      md: 'ddga-modal--md',\n      lg: 'ddga-modal--lg',\n      xl: 'ddga-modal--xl',\n      full: 'ddga-modal--full',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\n// ─── 2. Types ─── //\n//\n// Closed compound shape that hides Radix's Portal/Overlay plumbing. The Portal\n// is anchored to `DgaContext.rootEl` so `data-theme` + custom theme classes\n// set on the provider inherit into the modal — without it, the modal would\n// silently mount under <body> and miss dark mode / palette switches.\n\ntype ModalProps = React.ComponentProps<typeof DialogPrimitive.Root>;\ntype ModalTriggerProps = React.ComponentProps<typeof DialogPrimitive.Trigger>;\ntype ModalCloseProps = React.ComponentProps<typeof DialogPrimitive.Close>;\n\ninterface ModalContentProps\n  extends\n    React.ComponentProps<typeof DialogPrimitive.Content>,\n    VariantProps<typeof modalContentVariants> {\n  /**\n   * Render a corner X close button. Defaults to `true`. Set `false` for\n   * action-forcing dialogs (e.g. \"Are you sure?\") where the user must pick\n   * one of the explicit footer buttons.\n   */\n  showCloseButton?: boolean;\n  /** Localized label for the close button. Defaults to `\"Close\"`. */\n  closeLabel?: string;\n}\n\ntype ModalSectionProps = React.ComponentProps<'div'> & { asChild?: boolean };\n\ninterface ModalTitleProps extends React.ComponentProps<typeof DialogPrimitive.Title> {\n  /** Override the heading element (e.g. render an `<h3>` instead of the default `<h2>`). */\n  asChild?: boolean;\n}\n\ninterface ModalDescriptionProps extends React.ComponentProps<typeof DialogPrimitive.Description> {\n  /** Override the element (e.g. render a `<div>` for richer markup). */\n  asChild?: boolean;\n}\n\n// ─── 3. Components ─── //\n\nfunction Modal(props: ModalProps) {\n  return <DialogPrimitive.Root {...props} />;\n}\n\nfunction ModalTrigger({ className, ...props }: ModalTriggerProps) {\n  // Radix Trigger supports asChild natively — pass through.\n  return <DialogPrimitive.Trigger data-slot=\"modal-trigger\" className={className} {...props} />;\n}\n\nfunction ModalContent({\n  size,\n  showCloseButton = true,\n  closeLabel = 'Close',\n  className,\n  children,\n  ...props\n}: ModalContentProps) {\n  // Anchor the Portal to the DgaProvider's body-level portal container.\n  // Pattern documented in DgaContext.ts; regression test in Modal.test.tsx\n  // mirrors Select/Tooltip. The portal container mirrors data-theme + dir +\n  // CSS vars from the provider so theming still flows; using it (rather\n  // than the in-tree `rootEl`) keeps the modal's `position: fixed` overlay\n  // from being trapped by an ancestor `transform` or `overflow: hidden`\n  // (Storybook autodocs is the motivating case).\n  const ctx = useContext(DgaContext);\n  const portalContainer = ctx?.portalEl ?? ctx?.rootEl ?? undefined;\n\n  return (\n    <DialogPrimitive.Portal container={portalContainer}>\n      <DialogPrimitive.Overlay className=\"ddga-modal__overlay\" data-slot=\"modal-overlay\" />\n      <DialogPrimitive.Content\n        data-slot=\"modal-content\"\n        className={cn(modalContentVariants({ size }), className)}\n        {...props}\n      >\n        {children}\n        {showCloseButton ? (\n          <DialogPrimitive.Close\n            className=\"ddga-modal__close\"\n            aria-label={closeLabel}\n            data-slot=\"modal-close-x\"\n          >\n            <Close aria-hidden=\"true\" />\n          </DialogPrimitive.Close>\n        ) : null}\n      </DialogPrimitive.Content>\n    </DialogPrimitive.Portal>\n  );\n}\n\nfunction ModalHeader({ asChild, className, ...props }: ModalSectionProps) {\n  const Comp = asChild ? SlotPrimitive.Slot : 'div';\n  return (\n    <Comp data-slot=\"modal-header\" className={cn('ddga-modal__header', className)} {...props} />\n  );\n}\n\nfunction ModalTitle({ asChild, className, ...props }: ModalTitleProps) {\n  // Dialog.Title wires aria-labelledby on the parent Content. We pass asChild\n  // through so consumers can swap heading level (h2 → h1/h3) without losing\n  // the labelling link.\n  return (\n    <DialogPrimitive.Title\n      asChild={asChild}\n      data-slot=\"modal-title\"\n      className={cn('ddga-modal__title', className)}\n      {...props}\n    />\n  );\n}\n\nfunction ModalDescription({ asChild, className, ...props }: ModalDescriptionProps) {\n  // Dialog.Description wires aria-describedby on the parent Content. asChild\n  // lets consumers swap the element if they need richer markup.\n  return (\n    <DialogPrimitive.Description\n      asChild={asChild}\n      data-slot=\"modal-description\"\n      className={cn('ddga-modal__description', className)}\n      {...props}\n    />\n  );\n}\n\nfunction ModalFooter({ asChild, className, ...props }: ModalSectionProps) {\n  const Comp = asChild ? SlotPrimitive.Slot : 'div';\n  return (\n    <Comp data-slot=\"modal-footer\" className={cn('ddga-modal__footer', className)} {...props} />\n  );\n}\n\nfunction ModalClose({ className, ...props }: ModalCloseProps) {\n  // Consumer-level close trigger for footer buttons etc. Radix Close supports\n  // asChild natively — pass through so consumers can wrap a <Button>.\n  return <DialogPrimitive.Close data-slot=\"modal-close\" className={className} {...props} />;\n}\n\n// ─── 4. Exports ─── //\n\nexport {\n  Modal,\n  ModalTrigger,\n  ModalContent,\n  ModalHeader,\n  ModalTitle,\n  ModalDescription,\n  ModalFooter,\n  ModalClose,\n  modalContentVariants,\n};\nexport type {\n  ModalProps,\n  ModalTriggerProps,\n  ModalContentProps,\n  ModalSectionProps,\n  ModalTitleProps,\n  ModalDescriptionProps,\n  ModalCloseProps,\n};\n"],"mappings":";;;;;;;;;;;AAEA,SAAS,kBAAkB;AAC3B,SAAS,UAAU,iBAAiB,QAAQ,qBAAqB;AACjE,SAAS,WAA8B;AA8D9B,cA6BH,YA7BG;AAvDT,IAAM,uBAAuB,IAAI,cAAc;AAAA,EAC7C,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,MAAM;AAAA,EACR;AACF,CAAC;AAyCD,SAAS,MAAM,OAAmB;AAChC,SAAO,oBAAC,gBAAgB,MAAhB,EAAsB,GAAG,OAAO;AAC1C;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,MAAM,GAAsB;AAEhE,SAAO,oBAAC,gBAAgB,SAAhB,EAAwB,aAAU,iBAAgB,WAAuB,GAAG,OAAO;AAC7F;AAEA,SAAS,aAAa;AAAA,EACpB;AAAA,EACA,kBAAkB;AAAA,EAClB,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAsB;AAQpB,QAAM,MAAM,WAAW,UAAU;AACjC,QAAM,kBAAkB,KAAK,YAAY,KAAK,UAAU;AAExD,SACE,qBAAC,gBAAgB,QAAhB,EAAuB,WAAW,iBACjC;AAAA,wBAAC,gBAAgB,SAAhB,EAAwB,WAAU,uBAAsB,aAAU,iBAAgB;AAAA,IACnF;AAAA,MAAC,gBAAgB;AAAA,MAAhB;AAAA,QACC,aAAU;AAAA,QACV,WAAW,GAAG,qBAAqB,EAAE,KAAK,CAAC,GAAG,SAAS;AAAA,QACtD,GAAG;AAAA,QAEH;AAAA;AAAA,UACA,kBACC;AAAA,YAAC,gBAAgB;AAAA,YAAhB;AAAA,cACC,WAAU;AAAA,cACV,cAAY;AAAA,cACZ,aAAU;AAAA,cAEV,8BAAC,SAAM,eAAY,QAAO;AAAA;AAAA,UAC5B,IACE;AAAA;AAAA;AAAA,IACN;AAAA,KACF;AAEJ;AAEA,SAAS,YAAY,EAAE,SAAS,WAAW,GAAG,MAAM,GAAsB;AACxE,QAAM,OAAO,UAAU,cAAc,OAAO;AAC5C,SACE,oBAAC,QAAK,aAAU,gBAAe,WAAW,GAAG,sBAAsB,SAAS,GAAI,GAAG,OAAO;AAE9F;AAEA,SAAS,WAAW,EAAE,SAAS,WAAW,GAAG,MAAM,GAAoB;AAIrE,SACE;AAAA,IAAC,gBAAgB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,WAAW,GAAG,qBAAqB,SAAS;AAAA,MAC3C,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,iBAAiB,EAAE,SAAS,WAAW,GAAG,MAAM,GAA0B;AAGjF,SACE;AAAA,IAAC,gBAAgB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,WAAW,GAAG,2BAA2B,SAAS;AAAA,MACjD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,EAAE,SAAS,WAAW,GAAG,MAAM,GAAsB;AACxE,QAAM,OAAO,UAAU,cAAc,OAAO;AAC5C,SACE,oBAAC,QAAK,aAAU,gBAAe,WAAW,GAAG,sBAAsB,SAAS,GAAI,GAAG,OAAO;AAE9F;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,MAAM,GAAoB;AAG5D,SAAO,oBAAC,gBAAgB,OAAhB,EAAsB,aAAU,eAAc,WAAuB,GAAG,OAAO;AACzF;","names":[]}

package/dist/chunk-TZWNX7FF.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-TZWNX7FF.js.map

package/dist/chunk-TZWNX7FF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}