@dev-dga/react 0.11.0 → 0.12.0

package/dist/chunk-NL4LM47X.cjs

@@ -0,0 +1,178 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+var _chunkNH7XLE7Ecjs = require('./chunk-NH7XLE7E.cjs');
+
+
+
+
+
+
+var _chunkYS2JJ73Mcjs = require('./chunk-YS2JJ73M.cjs');
+
+
+var _chunkV6MXOJQ4cjs = require('./chunk-V6MXOJQ4.cjs');
+
+// src/components/NotificationToast/NotificationToast.tsx
+var _react = require('react');
+var _radixui = require('radix-ui');
+var _classvarianceauthority = require('class-variance-authority');
+var _jsxruntime = require('react/jsx-runtime');
+var notificationToastVariants = _classvarianceauthority.cva.call(void 0, "ddga-notification-toast", {
+  variants: {
+    variant: {
+      default: "ddga-notification-toast--default",
+      info: "ddga-notification-toast--info",
+      success: "ddga-notification-toast--success",
+      warning: "ddga-notification-toast--warning",
+      destructive: "ddga-notification-toast--destructive"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+var notificationToastViewportVariants = _classvarianceauthority.cva.call(void 0, "ddga-notification-toast-viewport", {
+  variants: {
+    position: {
+      "top-start": "ddga-notification-toast-viewport--top-start",
+      "top-center": "ddga-notification-toast-viewport--top-center",
+      "top-end": "ddga-notification-toast-viewport--top-end",
+      "bottom-start": "ddga-notification-toast-viewport--bottom-start",
+      "bottom-center": "ddga-notification-toast-viewport--bottom-center",
+      "bottom-end": "ddga-notification-toast-viewport--bottom-end"
+    },
+    containerized: {
+      true: "ddga-notification-toast-viewport--containerized"
+    }
+  },
+  defaultVariants: {
+    position: "bottom-end"
+  }
+});
+var DEFAULT_ICONS = {
+  default: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.Info, { "aria-hidden": "true" }),
+  info: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.Info, { "aria-hidden": "true" }),
+  success: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.CheckCircle, { "aria-hidden": "true" }),
+  warning: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.AlertCircle, { "aria-hidden": "true" }),
+  destructive: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.AlertTriangle, { "aria-hidden": "true" })
+};
+function NotificationToast({
+  position = "bottom-end",
+  containerized = false,
+  duration = 4e3,
+  closeButton = true,
+  closeLabel = "Dismiss",
+  hideIcon = false,
+  className,
+  swipeDirection,
+  store = _chunkNH7XLE7Ecjs.toastStore
+}) {
+  const toasts = _react.useSyncExternalStore.call(void 0, store.subscribe, store.getSnapshot, store.getSnapshot);
+  const resolvedSwipe = _nullishCoalesce(swipeDirection, () => ( (position.startsWith("top") ? "up" : "down")));
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    _radixui.Toast.Provider,
+    {
+      duration: duration === 0 ? Infinity : duration,
+      swipeDirection: resolvedSwipe,
+      children: [
+        toasts.map((t) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          ToastItem,
+          {
+            toast: t,
+            store,
+            closeButton,
+            closeLabel,
+            hideIcon
+          },
+          t.id
+        )),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _radixui.Toast.Viewport,
+          {
+            "data-slot": "notification-toast-viewport",
+            "data-position": position,
+            className: _chunkV6MXOJQ4cjs.cn.call(void 0, notificationToastViewportVariants({ position, containerized }), className)
+          }
+        )
+      ]
+    }
+  );
+}
+var altTextFor = (a) => _nullishCoalesce(a.altText, () => ( (typeof a.label === "string" ? a.label : "Action")));
+function ToastItem({ toast: t, store, closeButton, closeLabel, hideIcon }) {
+  const radixType = t.variant === "destructive" ? "foreground" : "background";
+  const icon = hideIcon ? null : DEFAULT_ICONS[t.variant];
+  const radixDuration = t.duration === 0 ? Infinity : t.duration;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    _radixui.Toast.Root,
+    {
+      "data-slot": "notification-toast",
+      "data-variant": t.variant,
+      className: notificationToastVariants({ variant: t.variant }),
+      open: t.open,
+      type: radixType,
+      duration: radixDuration,
+      onOpenChange: (open) => {
+        if (!open) store.dismiss(t.id);
+      },
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ddga-notification-toast__stripe", "aria-hidden": "true" }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ddga-notification-toast__header", children: [
+          icon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ddga-notification-toast__icon", children: icon }) : null,
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ddga-notification-toast__text", children: [
+            t.title ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _radixui.Toast.Title,
+              {
+                "data-slot": "notification-toast-title",
+                className: "ddga-notification-toast__title",
+                children: t.title
+              }
+            ) : null,
+            t.description ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _radixui.Toast.Description,
+              {
+                "data-slot": "notification-toast-description",
+                className: "ddga-notification-toast__description",
+                children: t.description
+              }
+            ) : null
+          ] }),
+          closeButton ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _radixui.Toast.Close, { className: "ddga-notification-toast__close", "aria-label": closeLabel, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.Close, { "aria-hidden": "true" }) }) : null
+        ] }),
+        t.action || t.secondaryAction ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ddga-notification-toast__actions", "data-slot": "notification-toast-actions", children: [
+          t.action ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _radixui.Toast.Action,
+            {
+              className: "ddga-notification-toast__action",
+              altText: altTextFor(t.action),
+              onClick: () => {
+                _optionalChain([t, 'access', _ => _.action, 'optionalAccess', _2 => _2.onClick, 'call', _3 => _3()]);
+                store.dismiss(t.id);
+              },
+              children: t.action.label
+            }
+          ) : null,
+          t.secondaryAction ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _radixui.Toast.Action,
+            {
+              className: "ddga-notification-toast__action",
+              altText: altTextFor(t.secondaryAction),
+              onClick: () => {
+                _optionalChain([t, 'access', _4 => _4.secondaryAction, 'optionalAccess', _5 => _5.onClick, 'call', _6 => _6()]);
+                store.dismiss(t.id);
+              },
+              children: t.secondaryAction.label
+            }
+          ) : null
+        ] }) : null
+      ]
+    }
+  );
+}
+
+
+
+
+
+exports.notificationToastVariants = notificationToastVariants; exports.notificationToastViewportVariants = notificationToastViewportVariants; exports.NotificationToast = NotificationToast;
+//# sourceMappingURL=chunk-NL4LM47X.cjs.map

package/dist/chunk-NL4LM47X.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-NL4LM47X.cjs","../src/components/NotificationToast/NotificationToast.tsx"],"names":[],"mappings":"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","file":"/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-NL4LM47X.cjs","sourcesContent":[null,"'use client';\n\nimport { useSyncExternalStore, type ReactNode } from 'react';\nimport { Toast as ToastPrimitive } from 'radix-ui';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { Info, AlertTriangle, AlertCircle, CheckCircle, Close } from '../../internal/icons';\nimport {\n  toastStore as defaultStore,\n  type ToastAction,\n  type ToastData,\n  type ToastStore,\n  type ToastVariant,\n} from './toast-store';\n\nconst notificationToastVariants = cva('ddga-notification-toast', {\n  variants: {\n    variant: {\n      default: 'ddga-notification-toast--default',\n      info: 'ddga-notification-toast--info',\n      success: 'ddga-notification-toast--success',\n      warning: 'ddga-notification-toast--warning',\n      destructive: 'ddga-notification-toast--destructive',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst notificationToastViewportVariants = cva('ddga-notification-toast-viewport', {\n  variants: {\n    position: {\n      'top-start': 'ddga-notification-toast-viewport--top-start',\n      'top-center': 'ddga-notification-toast-viewport--top-center',\n      'top-end': 'ddga-notification-toast-viewport--top-end',\n      'bottom-start': 'ddga-notification-toast-viewport--bottom-start',\n      'bottom-center': 'ddga-notification-toast-viewport--bottom-center',\n      'bottom-end': 'ddga-notification-toast-viewport--bottom-end',\n    },\n    containerized: {\n      true: 'ddga-notification-toast-viewport--containerized',\n    },\n  },\n  defaultVariants: {\n    position: 'bottom-end',\n  },\n});\n\n// SDGA Notification Toast glyphs (stroke): info-circle for neutral+info,\n// alert-triangle for error, alert-circle for warning, check-circle for success.\nconst DEFAULT_ICONS: Record<ToastVariant, ReactNode> = {\n  default: <Info aria-hidden=\"true\" />,\n  info: <Info aria-hidden=\"true\" />,\n  success: <CheckCircle aria-hidden=\"true\" />,\n  warning: <AlertCircle aria-hidden=\"true\" />,\n  destructive: <AlertTriangle aria-hidden=\"true\" />,\n};\n\ntype ToastPosition = NonNullable<\n  VariantProps<typeof notificationToastViewportVariants>['position']\n>;\n\ninterface NotificationToastProps {\n  /** Where toasts stack. Logical: start/end flip in RTL. Default `bottom-end`. */\n  position?: ToastPosition;\n  /**\n   * Pin the viewport to a positioned ancestor (via `position: absolute`)\n   * instead of the browser viewport (`position: fixed`). Set this for\n   * Storybook stories, embedded widgets, and any layout where the NotificationToast\n   * should stay within a parent box. Caller is responsible for placing the\n   * NotificationToast inside an element with `position: relative` (or other positioned\n   * containing block).\n   */\n  containerized?: boolean;\n  /** ms; default 4000. Set 0 (or Infinity) to disable auto-dismiss globally. */\n  duration?: number;\n  /** Show a close (X) button on each toast. Defaults to true. */\n  closeButton?: boolean;\n  /** Localized label for the close button. Default `\"Dismiss\"`. */\n  closeLabel?: string;\n  /** Hide the default leading icon per variant. */\n  hideIcon?: boolean;\n  /** Extra class on the Radix Viewport. */\n  className?: string;\n  /** Override swipe direction. Defaults based on `position`. */\n  swipeDirection?: 'up' | 'down' | 'left' | 'right';\n  /**\n   * The toast store this NotificationToast subscribes to. Defaults to the module-level\n   * singleton so the bare `toast()` API works without setup. Pass an isolated\n   * store (created via `createToastStore()` + `createToast(store)`) when you\n   * need multiple independent NotificationToasts on the same page — common in\n   * Storybook, docs sites, and embedded widgets.\n   */\n  store?: ToastStore;\n}\n\nfunction NotificationToast({\n  position = 'bottom-end',\n  containerized = false,\n  duration = 4000,\n  closeButton = true,\n  closeLabel = 'Dismiss',\n  hideIcon = false,\n  className,\n  swipeDirection,\n  store = defaultStore,\n}: NotificationToastProps) {\n  const toasts = useSyncExternalStore(store.subscribe, store.getSnapshot, store.getSnapshot);\n\n  const resolvedSwipe: 'up' | 'down' | 'left' | 'right' =\n    swipeDirection ?? (position.startsWith('top') ? 'up' : 'down');\n\n  return (\n    <ToastPrimitive.Provider\n      duration={duration === 0 ? Infinity : duration}\n      swipeDirection={resolvedSwipe}\n    >\n      {toasts.map((t) => (\n        <ToastItem\n          key={t.id}\n          toast={t}\n          store={store}\n          closeButton={closeButton}\n          closeLabel={closeLabel}\n          hideIcon={hideIcon}\n        />\n      ))}\n      <ToastPrimitive.Viewport\n        data-slot=\"notification-toast-viewport\"\n        data-position={position}\n        className={cn(notificationToastViewportVariants({ position, containerized }), className)}\n      />\n    </ToastPrimitive.Provider>\n  );\n}\n\ninterface ToastItemProps {\n  toast: ToastData;\n  store: ToastStore;\n  closeButton: boolean;\n  closeLabel: string;\n  hideIcon: boolean;\n}\n\nconst altTextFor = (a: ToastAction) =>\n  a.altText ?? (typeof a.label === 'string' ? a.label : 'Action');\n\nfunction ToastItem({ toast: t, store, closeButton, closeLabel, hideIcon }: ToastItemProps) {\n  // Route destructive toasts through Radix's assertive live region; the rest stay polite.\n  const radixType: 'foreground' | 'background' =\n    t.variant === 'destructive' ? 'foreground' : 'background';\n\n  const icon = hideIcon ? null : DEFAULT_ICONS[t.variant];\n\n  // Radix treats `0` as falsy (→ falls back to the provider duration), so map\n  // our \"0 = no auto-dismiss\" contract to Infinity, which Radix honors.\n  const radixDuration = t.duration === 0 ? Infinity : t.duration;\n\n  return (\n    <ToastPrimitive.Root\n      data-slot=\"notification-toast\"\n      data-variant={t.variant}\n      className={notificationToastVariants({ variant: t.variant })}\n      open={t.open}\n      type={radixType}\n      duration={radixDuration}\n      onOpenChange={(open) => {\n        if (!open) store.dismiss(t.id);\n      }}\n    >\n      <span className=\"ddga-notification-toast__stripe\" aria-hidden=\"true\" />\n      <div className=\"ddga-notification-toast__header\">\n        {icon ? <span className=\"ddga-notification-toast__icon\">{icon}</span> : null}\n        <div className=\"ddga-notification-toast__text\">\n          {t.title ? (\n            <ToastPrimitive.Title\n              data-slot=\"notification-toast-title\"\n              className=\"ddga-notification-toast__title\"\n            >\n              {t.title}\n            </ToastPrimitive.Title>\n          ) : null}\n          {t.description ? (\n            <ToastPrimitive.Description\n              data-slot=\"notification-toast-description\"\n              className=\"ddga-notification-toast__description\"\n            >\n              {t.description}\n            </ToastPrimitive.Description>\n          ) : null}\n        </div>\n        {closeButton ? (\n          <ToastPrimitive.Close className=\"ddga-notification-toast__close\" aria-label={closeLabel}>\n            <Close aria-hidden=\"true\" />\n          </ToastPrimitive.Close>\n        ) : null}\n      </div>\n      {t.action || t.secondaryAction ? (\n        <div className=\"ddga-notification-toast__actions\" data-slot=\"notification-toast-actions\">\n          {t.action ? (\n            <ToastPrimitive.Action\n              className=\"ddga-notification-toast__action\"\n              altText={altTextFor(t.action)}\n              onClick={() => {\n                t.action?.onClick();\n                store.dismiss(t.id);\n              }}\n            >\n              {t.action.label}\n            </ToastPrimitive.Action>\n          ) : null}\n          {t.secondaryAction ? (\n            <ToastPrimitive.Action\n              className=\"ddga-notification-toast__action\"\n              altText={altTextFor(t.secondaryAction)}\n              onClick={() => {\n                t.secondaryAction?.onClick();\n                store.dismiss(t.id);\n              }}\n            >\n              {t.secondaryAction.label}\n            </ToastPrimitive.Action>\n          ) : null}\n        </div>\n      ) : null}\n    </ToastPrimitive.Root>\n  );\n}\n\nexport { NotificationToast, notificationToastVariants, notificationToastViewportVariants };\nexport { toast, toastStore, createToast, createToastStore } from './toast-store';\nexport type { NotificationToastProps, ToastPosition };\nexport type { ToastVariant, ToastData, ToastOptions, ToastAction, ToastStore } from './toast-store';\n"]}

package/dist/chunk-NOXQQACO.js

@@ -0,0 +1,173 @@
+import {
+  ArrowDown,
+  ArrowUp,
+  TrendDown,
+  TrendUp
+} from "./chunk-FFGALWM2.js";
+import {
+  cn
+} from "./chunk-7NTT2UXP.js";
+
+// src/components/Metric/Metric.tsx
+import { useId } from "react";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+var metricVariants = cva("ddga-metric", {
+  variants: {
+    // SDGA "Style" axis: large = chart below, small = chart beside.
+    layout: {
+      large: "ddga-metric--large",
+      small: "ddga-metric--small"
+    }
+  },
+  defaultVariants: {
+    layout: "large"
+  }
+});
+var CHANGE_ICONS = {
+  "01": { up: /* @__PURE__ */ jsx(ArrowUp, { "aria-hidden": "true" }), down: /* @__PURE__ */ jsx(ArrowDown, { "aria-hidden": "true" }) },
+  "02": { up: /* @__PURE__ */ jsx(TrendUp, { "aria-hidden": "true" }), down: /* @__PURE__ */ jsx(TrendDown, { "aria-hidden": "true" }) }
+};
+var CHART_H = 64;
+var CHART_PAD = 6;
+function Metric({
+  layout,
+  icon,
+  label,
+  action,
+  value,
+  change,
+  trend,
+  changeType,
+  changeLabel,
+  chart,
+  footer,
+  className,
+  children,
+  ...props
+}) {
+  const hasHeader = icon != null || label != null || action != null;
+  const hasInfo = change != null || changeLabel != null;
+  const hasFigures = value != null || hasInfo;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "metric",
+      "data-layout": layout ?? "large",
+      className: cn(metricVariants({ layout }), className),
+      ...props,
+      children: [
+        hasHeader ? /* @__PURE__ */ jsxs("div", { className: "ddga-metric__header", children: [
+          /* @__PURE__ */ jsxs("div", { className: "ddga-metric__heading", children: [
+            icon != null ? /* @__PURE__ */ jsx("span", { className: "ddga-metric__icon", "aria-hidden": "true", children: icon }) : null,
+            label != null ? /* @__PURE__ */ jsx(MetricLabel, { children: label }) : null
+          ] }),
+          action != null ? /* @__PURE__ */ jsx("div", { className: "ddga-metric__action", children: action }) : null
+        ] }) : null,
+        hasFigures || chart != null ? /* @__PURE__ */ jsxs("div", { className: "ddga-metric__body", children: [
+          hasFigures ? /* @__PURE__ */ jsxs("div", { className: "ddga-metric__figures", children: [
+            value != null ? /* @__PURE__ */ jsx(MetricValue, { children: value }) : null,
+            hasInfo ? /* @__PURE__ */ jsxs("div", { className: "ddga-metric__info", children: [
+              change != null ? /* @__PURE__ */ jsx(MetricChange, { trend, type: changeType, children: change }) : null,
+              changeLabel != null ? /* @__PURE__ */ jsx("span", { className: "ddga-metric__change-label", children: changeLabel }) : null
+            ] }) : null
+          ] }) : null,
+          chart
+        ] }) : null,
+        children,
+        footer != null ? /* @__PURE__ */ jsxs("div", { className: "ddga-metric__footer", children: [
+          /* @__PURE__ */ jsx("div", { className: "ddga-metric__divider", role: "separator", "aria-orientation": "horizontal" }),
+          /* @__PURE__ */ jsx("div", { className: "ddga-metric__actions", children: footer })
+        ] }) : null
+      ]
+    }
+  );
+}
+function MetricLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "metric-label", className: cn("ddga-metric__label", className), ...props });
+}
+function MetricValue({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "metric-value", className: cn("ddga-metric__value", className), ...props });
+}
+function MetricChange({ trend, type, className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "metric-change",
+      "data-trend": trend,
+      "data-type": type ?? "01",
+      className: cn(
+        "ddga-metric__change",
+        trend ? `ddga-metric__change--${trend}` : null,
+        className
+      ),
+      ...props,
+      children: [
+        trend ? /* @__PURE__ */ jsx("span", { className: "ddga-metric__change-icon", children: CHANGE_ICONS[type ?? "01"][trend] }) : null,
+        children
+      ]
+    }
+  );
+}
+function MetricChart({ data, trend, markers, className, ...props }) {
+  const gradientId = useId();
+  const n = data.length;
+  const max = Math.max(...data);
+  const min = Math.min(...data);
+  const span = max - min || 1;
+  const pts = data.map((v, i) => {
+    const x = n <= 1 ? 50 : i / (n - 1) * 100;
+    const y = CHART_H - CHART_PAD - (v - min) / span * (CHART_H - 2 * CHART_PAD);
+    return [x, y];
+  });
+  const line = pts.map(([x, y], i) => `${i === 0 ? "M" : "L"}${x.toFixed(2)},${y.toFixed(2)}`).join(" ");
+  const area = pts.length ? `${line} L100,${CHART_H} L0,${CHART_H} Z` : "";
+  const markerIdx = markers ?? (n ? [data.indexOf(max)] : []);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "metric-chart",
+      "data-trend": trend ?? "up",
+      className: cn("ddga-metric__chart", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            className: "ddga-metric__chart-svg",
+            viewBox: `0 0 100 ${CHART_H}`,
+            preserveAspectRatio: "none",
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: gradientId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+                /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "var(--ddga-metric-chart-area)", stopOpacity: "0.2" }),
+                /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "var(--ddga-metric-chart-area)", stopOpacity: "0" })
+              ] }) }),
+              /* @__PURE__ */ jsx("path", { className: "ddga-metric__chart-area", d: area, fill: `url(#${gradientId})` }),
+              /* @__PURE__ */ jsx("path", { className: "ddga-metric__chart-line", d: line, vectorEffect: "non-scaling-stroke" })
+            ]
+          }
+        ),
+        markerIdx.map((i) => {
+          const p = pts[i];
+          return p ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "ddga-metric__chart-marker",
+              style: { left: `${p[0]}%`, top: `${(p[1] / CHART_H * 100).toFixed(2)}%` }
+            },
+            i
+          ) : null;
+        })
+      ]
+    }
+  );
+}
+
+export {
+  metricVariants,
+  Metric,
+  MetricChange,
+  MetricChart
+};
+//# sourceMappingURL=chunk-NOXQQACO.js.map

package/dist/chunk-NOXQQACO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Metric/Metric.tsx"],"sourcesContent":["'use client';\n\nimport { useId, type ReactNode } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { ArrowUp, ArrowDown, TrendUp, TrendDown } from '../../internal/icons';\n\n// ─── 1. Variants (cva) ─── //\n\nconst metricVariants = cva('ddga-metric', {\n  variants: {\n    // SDGA \"Style\" axis: large = chart below, small = chart beside.\n    layout: {\n      large: 'ddga-metric--large',\n      small: 'ddga-metric--small',\n    },\n  },\n  defaultVariants: {\n    layout: 'large',\n  },\n});\n\ntype Trend = 'up' | 'down';\ntype ChangeType = '01' | '02';\n\n// trend → glyph, per SDGA change Type. 01 = directional arrow · 02 = trend glyph.\nconst CHANGE_ICONS: Record<ChangeType, Record<Trend, ReactNode>> = {\n  '01': { up: <ArrowUp aria-hidden=\"true\" />, down: <ArrowDown aria-hidden=\"true\" /> },\n  '02': { up: <TrendUp aria-hidden=\"true\" />, down: <TrendDown aria-hidden=\"true\" /> },\n};\n\n// Chart coords: 0..100 × 0..64; PAD keeps the line off the edges.\nconst CHART_H = 64;\nconst CHART_PAD = 6;\n\n// ─── 2. Types ─── //\n\ninterface MetricProps extends React.ComponentProps<'div'>, VariantProps<typeof metricVariants> {\n  /** Featured icon, shown in a 32px brand-tinted circle at the start of the header. */\n  icon?: ReactNode;\n  /** Short label beside the icon (e.g. \"24h Views\"). */\n  label?: ReactNode;\n  /** Header slot at the inline-end (e.g. a \"more\" menu trigger button). */\n  action?: ReactNode;\n  /** The metric, pre-formatted by the consumer (e.g. \"50%\", \"SAR 1.2M\"). */\n  value?: ReactNode;\n  /** Change text — include the sign (e.g. \"+100%\") so AT conveys direction; color comes from `trend`. */\n  change?: ReactNode;\n  /** Trend: `up` → success arrow, `down` → error arrow. Drives the glyph + color. */\n  trend?: Trend;\n  /** Change glyph style — `01` directional arrow (default) · `02` trend glyph. */\n  changeType?: ChangeType;\n  /** Muted comparison text beside the change (e.g. \"vs last month\"). */\n  changeLabel?: ReactNode;\n  /** Trend chart — pass a `<MetricChart>` (full-width in `large`, beside the value in `small`). */\n  chart?: ReactNode;\n  /** Footer actions; when present, a full-bleed divider sits above a space-between actions row. */\n  footer?: ReactNode;\n}\n\ninterface MetricChangeProps extends React.ComponentProps<'div'> {\n  trend?: Trend;\n  /** `01` directional arrow (default) · `02` trend glyph. */\n  type?: ChangeType;\n}\n\ninterface MetricChartProps extends Omit<React.ComponentProps<'div'>, 'children'> {\n  /** The series to plot (any numeric scale). */\n  data: number[];\n  /** Line + area + marker color: `up` → success, `down` → error. Default `up`. */\n  trend?: Trend;\n  /** Indices of `data` to mark with a dot. Defaults to the highest point. */\n  markers?: number[];\n}\n\n// ─── 3. Components ─── //\n\n/**\n * DGA Platforms Code \"Metric\" card: featured-icon + label header, a large value\n * with an inline trend change, an optional `chart` (a `<MetricChart>`), and an\n * optional actions `footer`. Lay several out with `<MetricGroup>`.\n */\nfunction Metric({\n  layout,\n  icon,\n  label,\n  action,\n  value,\n  change,\n  trend,\n  changeType,\n  changeLabel,\n  chart,\n  footer,\n  className,\n  children,\n  ...props\n}: MetricProps) {\n  const hasHeader = icon != null || label != null || action != null;\n  const hasInfo = change != null || changeLabel != null;\n  const hasFigures = value != null || hasInfo;\n  return (\n    <div\n      data-slot=\"metric\"\n      data-layout={layout ?? 'large'}\n      className={cn(metricVariants({ layout }), className)}\n      {...props}\n    >\n      {hasHeader ? (\n        <div className=\"ddga-metric__header\">\n          <div className=\"ddga-metric__heading\">\n            {icon != null ? (\n              <span className=\"ddga-metric__icon\" aria-hidden=\"true\">\n                {icon}\n              </span>\n            ) : null}\n            {label != null ? <MetricLabel>{label}</MetricLabel> : null}\n          </div>\n          {action != null ? <div className=\"ddga-metric__action\">{action}</div> : null}\n        </div>\n      ) : null}\n\n      {hasFigures || chart != null ? (\n        <div className=\"ddga-metric__body\">\n          {hasFigures ? (\n            <div className=\"ddga-metric__figures\">\n              {value != null ? <MetricValue>{value}</MetricValue> : null}\n              {hasInfo ? (\n                <div className=\"ddga-metric__info\">\n                  {change != null ? (\n                    <MetricChange trend={trend} type={changeType}>\n                      {change}\n                    </MetricChange>\n                  ) : null}\n                  {changeLabel != null ? (\n                    <span className=\"ddga-metric__change-label\">{changeLabel}</span>\n                  ) : null}\n                </div>\n              ) : null}\n            </div>\n          ) : null}\n          {chart}\n        </div>\n      ) : null}\n\n      {children}\n\n      {footer != null ? (\n        <div className=\"ddga-metric__footer\">\n          <div className=\"ddga-metric__divider\" role=\"separator\" aria-orientation=\"horizontal\" />\n          <div className=\"ddga-metric__actions\">{footer}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nfunction MetricLabel({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div data-slot=\"metric-label\" className={cn('ddga-metric__label', className)} {...props} />\n  );\n}\n\nfunction MetricValue({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div data-slot=\"metric-value\" className={cn('ddga-metric__value', className)} {...props} />\n  );\n}\n\nfunction MetricChange({ trend, type, className, children, ...props }: MetricChangeProps) {\n  return (\n    <div\n      data-slot=\"metric-change\"\n      data-trend={trend}\n      data-type={type ?? '01'}\n      className={cn(\n        'ddga-metric__change',\n        trend ? `ddga-metric__change--${trend}` : null,\n        className,\n      )}\n      {...props}\n    >\n      {trend ? (\n        <span className=\"ddga-metric__change-icon\">{CHANGE_ICONS[type ?? '01'][trend]}</span>\n      ) : null}\n      {children}\n    </div>\n  );\n}\n\n/**\n * The Metric trend chart: a line over a faded area with a marker, colored by\n * `trend` (up → success, down → error). Plots `data` as a small inline SVG — no\n * charting dependency.\n */\nfunction MetricChart({ data, trend, markers, className, ...props }: MetricChartProps) {\n  const gradientId = useId();\n  const n = data.length;\n  const max = Math.max(...data);\n  const min = Math.min(...data);\n  const span = max - min || 1;\n  const pts = data.map((v, i) => {\n    const x = n <= 1 ? 50 : (i / (n - 1)) * 100;\n    const y = CHART_H - CHART_PAD - ((v - min) / span) * (CHART_H - 2 * CHART_PAD);\n    return [x, y] as const;\n  });\n  const line = pts\n    .map(([x, y], i) => `${i === 0 ? 'M' : 'L'}${x.toFixed(2)},${y.toFixed(2)}`)\n    .join(' ');\n  const area = pts.length ? `${line} L100,${CHART_H} L0,${CHART_H} Z` : '';\n  const markerIdx = markers ?? (n ? [data.indexOf(max)] : []);\n  return (\n    <div\n      data-slot=\"metric-chart\"\n      data-trend={trend ?? 'up'}\n      className={cn('ddga-metric__chart', className)}\n      {...props}\n    >\n      <svg\n        className=\"ddga-metric__chart-svg\"\n        viewBox={`0 0 100 ${CHART_H}`}\n        preserveAspectRatio=\"none\"\n        aria-hidden=\"true\"\n      >\n        <defs>\n          <linearGradient id={gradientId} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n            <stop offset=\"0%\" stopColor=\"var(--ddga-metric-chart-area)\" stopOpacity=\"0.2\" />\n            <stop offset=\"100%\" stopColor=\"var(--ddga-metric-chart-area)\" stopOpacity=\"0\" />\n          </linearGradient>\n        </defs>\n        <path className=\"ddga-metric__chart-area\" d={area} fill={`url(#${gradientId})`} />\n        <path className=\"ddga-metric__chart-line\" d={line} vectorEffect=\"non-scaling-stroke\" />\n      </svg>\n      {markerIdx.map((i) => {\n        const p = pts[i];\n        return p ? (\n          <span\n            key={i}\n            className=\"ddga-metric__chart-marker\"\n            style={{ left: `${p[0]}%`, top: `${((p[1] / CHART_H) * 100).toFixed(2)}%` }}\n          />\n        ) : null;\n      })}\n    </div>\n  );\n}\n\n// ─── 4. Exports ─── //\n\nexport { Metric, MetricChange, MetricChart, metricVariants };\nexport type { MetricProps, MetricChangeProps, MetricChartProps };\n"],"mappings":"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","names":[]}

package/dist/{chunk-VNITXANA.js → chunk-NS4IRTKQ.js}

@@ -103,4 +103,4 @@ export {
   TimelineDescription,
   TimelineTime
 };
-//# sourceMappingURL=chunk-VNITXANA.js.map
+//# sourceMappingURL=chunk-NS4IRTKQ.js.map

package/dist/chunk-NS4IRTKQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Timeline/Timeline.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\n// ─── 1. Variants (cva) ─── //\n//\n// Visual-only chronological compound. Semantic `<ol>`/`<li>` so the event\n// count + order are assistive-tech-readable. The connector line is CSS-drawn\n// via a pseudo-element between siblings (the `ProgressIndicator` technique) — no separator\n// component for consumers to misuse. Markers carry a `status` that tints the\n// node via the semantic `--ddga-color-*` palette; the status is PURELY VISUAL,\n// so the meaning (\"Failed\") must live in the content text — never rely on the\n// dot colour alone. \"Activity feed\" is a composition of this primitive\n// (Timeline + Avatar + text in the content slot), not a separate component.\n\nconst timelineVariants = cva('ddga-timeline', {\n  variants: {\n    size: {\n      sm: 'ddga-timeline--sm',\n      md: 'ddga-timeline--md',\n    },\n    orientation: {\n      vertical: 'ddga-timeline--vertical',\n      horizontal: 'ddga-timeline--horizontal',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    orientation: 'vertical',\n  },\n});\n\ntype TimelineStatus = 'default' | 'success' | 'error' | 'warning' | 'info';\n\nconst timelineMarkerVariants = cva('ddga-timeline__marker', {\n  variants: {\n    status: {\n      default: 'ddga-timeline__marker--default',\n      success: 'ddga-timeline__marker--success',\n      error: 'ddga-timeline__marker--error',\n      warning: 'ddga-timeline__marker--warning',\n      info: 'ddga-timeline__marker--info',\n    },\n  },\n  defaultVariants: {\n    status: 'default',\n  },\n});\n\n// ─── 2. Types ─── //\n\ninterface TimelineProps extends React.ComponentProps<'ol'>, VariantProps<typeof timelineVariants> {}\n\ntype TimelineItemProps = React.ComponentProps<'li'>;\n\ninterface TimelineMarkerProps\n  extends React.ComponentProps<'span'>, VariantProps<typeof timelineMarkerVariants> {}\n\ntype TimelineContentProps = React.ComponentProps<'div'>;\ntype TimelineTitleProps = React.ComponentProps<'span'>;\ntype TimelineDescriptionProps = React.ComponentProps<'span'>;\ntype TimelineTimeProps = React.ComponentProps<'time'>;\n\n// ─── 3. Components ─── //\n\nfunction Timeline({ size, orientation, className, ...props }: TimelineProps) {\n  // `<ol>` is the right semantic for an ordered sequence of events; the\n  // implicit listitem role on children makes the count assistive-tech-readable.\n  return (\n    <ol\n      data-slot=\"timeline\"\n      data-orientation={orientation ?? 'vertical'}\n      className={cn(timelineVariants({ size, orientation }), className)}\n      {...props}\n    />\n  );\n}\n\nfunction TimelineItem({ className, ...props }: TimelineItemProps) {\n  // Always an `<li>` — the parent `<ol>` may only contain `<li>` children, so\n  // consumers needing a clickable event put an `<a>` (or router primitive)\n  // INSIDE the content, never as the item element itself. This is why no part\n  // ships `asChild` (mirrors `ProgressIndicator`). The item owns the CSS connector segment\n  // to the next sibling.\n  return (\n    <li data-slot=\"timeline-item\" className={cn('ddga-timeline__item', className)} {...props} />\n  );\n}\n\nfunction TimelineMarker({ status, className, children, ...props }: TimelineMarkerProps) {\n  // Decorative — assistive tech reads the content, not the node. When children\n  // are provided they render as a custom icon; otherwise a plain dot is drawn.\n  // The `data-status` carries the visual intent for CSS keying.\n  const resolved = status ?? 'default';\n  // `data-reached` marks a non-default (completed/active) node. The connector\n  // line uses it as a CSS sibling gate so a segment fills with the PREVIOUS\n  // node's colour ONLY when the NEXT node is also reached — a completed→pending\n  // transition stays neutral (the ProgressIndicator progress-fill semantics).\n  const reached = resolved !== 'default';\n  return (\n    <span\n      aria-hidden=\"true\"\n      data-slot=\"timeline-marker\"\n      data-status={resolved}\n      data-reached={reached ? '' : undefined}\n      className={cn(timelineMarkerVariants({ status }), className)}\n      {...props}\n    >\n      {children ?? <span className=\"ddga-timeline__dot\" />}\n    </span>\n  );\n}\n\nfunction TimelineContent({ className, ...props }: TimelineContentProps) {\n  return (\n    <div\n      data-slot=\"timeline-content\"\n      className={cn('ddga-timeline__content', className)}\n      {...props}\n    />\n  );\n}\n\nfunction TimelineTitle({ className, ...props }: TimelineTitleProps) {\n  return (\n    <span data-slot=\"timeline-title\" className={cn('ddga-timeline__title', className)} {...props} />\n  );\n}\n\nfunction TimelineDescription({ className, ...props }: TimelineDescriptionProps) {\n  return (\n    <span\n      data-slot=\"timeline-description\"\n      className={cn('ddga-timeline__description', className)}\n      {...props}\n    />\n  );\n}\n\nfunction TimelineTime({ className, ...props }: TimelineTimeProps) {\n  // Renders a real `<time>`; consumers pass `dateTime` for the machine-readable\n  // timestamp while the children carry the human-readable label (\"2h ago\").\n  return (\n    <time data-slot=\"timeline-time\" className={cn('ddga-timeline__time', className)} {...props} />\n  );\n}\n\n// ─── 4. Exports ─── //\n\nexport {\n  Timeline,\n  TimelineItem,\n  TimelineMarker,\n  TimelineContent,\n  TimelineTitle,\n  TimelineDescription,\n  TimelineTime,\n  timelineVariants,\n  timelineMarkerVariants,\n};\nexport type {\n  TimelineProps,\n  TimelineItemProps,\n  TimelineMarkerProps,\n  TimelineContentProps,\n  TimelineTitleProps,\n  TimelineDescriptionProps,\n  TimelineTimeProps,\n  TimelineStatus,\n};\n"],"mappings":";;;;;AAEA,SAAS,WAA8B;AAoEnC;AAtDJ,IAAM,mBAAmB,IAAI,iBAAiB;AAAA,EAC5C,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IACA,aAAa;AAAA,MACX,UAAU;AAAA,MACV,YAAY;AAAA,IACd;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,MAAM;AAAA,IACN,aAAa;AAAA,EACf;AACF,CAAC;AAID,IAAM,yBAAyB,IAAI,yBAAyB;AAAA,EAC1D,UAAU;AAAA,IACR,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,QAAQ;AAAA,EACV;AACF,CAAC;AAkBD,SAAS,SAAS,EAAE,MAAM,aAAa,WAAW,GAAG,MAAM,GAAkB;AAG3E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,oBAAkB,eAAe;AAAA,MACjC,WAAW,GAAG,iBAAiB,EAAE,MAAM,YAAY,CAAC,GAAG,SAAS;AAAA,MAC/D,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,MAAM,GAAsB;AAMhE,SACE,oBAAC,QAAG,aAAU,iBAAgB,WAAW,GAAG,uBAAuB,SAAS,GAAI,GAAG,OAAO;AAE9F;AAEA,SAAS,eAAe,EAAE,QAAQ,WAAW,UAAU,GAAG,MAAM,GAAwB;AAItF,QAAM,WAAW,UAAU;AAK3B,QAAM,UAAU,aAAa;AAC7B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAY;AAAA,MACZ,aAAU;AAAA,MACV,eAAa;AAAA,MACb,gBAAc,UAAU,KAAK;AAAA,MAC7B,WAAW,GAAG,uBAAuB,EAAE,OAAO,CAAC,GAAG,SAAS;AAAA,MAC1D,GAAG;AAAA,MAEH,sBAAY,oBAAC,UAAK,WAAU,sBAAqB;AAAA;AAAA,EACpD;AAEJ;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,MAAM,GAAyB;AACtE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,0BAA0B,SAAS;AAAA,MAChD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,MAAM,GAAuB;AAClE,SACE,oBAAC,UAAK,aAAU,kBAAiB,WAAW,GAAG,wBAAwB,SAAS,GAAI,GAAG,OAAO;AAElG;AAEA,SAAS,oBAAoB,EAAE,WAAW,GAAG,MAAM,GAA6B;AAC9E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,8BAA8B,SAAS;AAAA,MACpD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,MAAM,GAAsB;AAGhE,SACE,oBAAC,UAAK,aAAU,iBAAgB,WAAW,GAAG,uBAAuB,SAAS,GAAI,GAAG,OAAO;AAEhG;","names":[]}

package/dist/chunk-NT6EEI44.cjs

@@ -0,0 +1,86 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkV6MXOJQ4cjs = require('./chunk-V6MXOJQ4.cjs');
+
+// src/components/Quote/Quote.tsx
+require('react');
+var _classvarianceauthority = require('class-variance-authority');
+var _jsxruntime = require('react/jsx-runtime');
+var quoteVariants = _classvarianceauthority.cva.call(void 0, "ddga-quote", {
+  variants: {
+    size: {
+      sm: "ddga-quote--sm",
+      lg: "ddga-quote--lg"
+    },
+    whiteBackground: {
+      true: "ddga-quote--tint",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    size: "lg",
+    whiteBackground: true
+  }
+});
+function Quote({
+  size,
+  whiteBackground,
+  quoteTitle,
+  author,
+  authorTitle,
+  avatar,
+  cite,
+  className,
+  children,
+  ...props
+}) {
+  const hasAuthor = author != null || authorTitle != null;
+  const marks = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "aria-hidden": "true", className: "ddga-quote__mark ddga-quote__mark--open", children: "\u201D" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "aria-hidden": "true", className: "ddga-quote__mark ddga-quote__mark--close", children: "\u201D" })
+  ] });
+  const body = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { "data-slot": "quote-body", className: "ddga-quote__body", children: [
+    quoteTitle != null ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { "data-slot": "quote-title", className: "ddga-quote__title", children: quoteTitle }) : null,
+    children != null ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "data-slot": "quote-content", className: "ddga-quote__content", children }) : null
+  ] });
+  if (!hasAuthor) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "blockquote",
+      {
+        "data-slot": "quote",
+        className: _chunkV6MXOJQ4cjs.cn.call(void 0, quoteVariants({ size, whiteBackground }), className),
+        cite,
+        ...props,
+        children: [
+          marks,
+          body
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "figure",
+    {
+      "data-slot": "quote",
+      className: _chunkV6MXOJQ4cjs.cn.call(void 0, quoteVariants({ size, whiteBackground }), className),
+      ...props,
+      children: [
+        marks,
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "blockquote", { "data-slot": "quote-blockquote", className: "ddga-quote__blockquote", cite, children: body }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "figcaption", { "data-slot": "quote-caption", className: "ddga-quote__caption", children: [
+          avatar != null ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "data-slot": "quote-avatar", "aria-hidden": "true", className: "ddga-quote__avatar", children: avatar }) : null,
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "ddga-quote__author-info", children: [
+            author != null ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "data-slot": "quote-author", className: "ddga-quote__author", children: author }) : null,
+            authorTitle != null ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "data-slot": "quote-author-title", className: "ddga-quote__author-title", children: authorTitle }) : null
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+
+
+
+exports.quoteVariants = quoteVariants; exports.Quote = Quote;
+//# sourceMappingURL=chunk-NT6EEI44.cjs.map

package/dist/chunk-NT6EEI44.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-NT6EEI44.cjs","../src/components/Quote/Quote.tsx"],"names":[],"mappings":"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","file":"/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-NT6EEI44.cjs","sourcesContent":[null,"'use client';\n\nimport { type ReactNode } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst quoteVariants = cva('ddga-quote', {\n  variants: {\n    size: {\n      sm: 'ddga-quote--sm',\n      lg: 'ddga-quote--lg',\n    },\n    whiteBackground: {\n      true: 'ddga-quote--tint',\n      false: '',\n    },\n  },\n  defaultVariants: {\n    size: 'lg',\n    whiteBackground: true,\n  },\n});\n\ninterface QuoteProps extends React.HTMLAttributes<HTMLElement>, VariantProps<typeof quoteVariants> {\n  /** The quote text — the cited sentence. Rendered inside the `<blockquote>`. */\n  children?: ReactNode;\n  /** Optional bold lead-in above the quote (SDGA \"Title of quote\" — Display xs). */\n  quoteTitle?: ReactNode;\n  /** Attribution name (SDGA \"Author's name\" — Text xl, medium). */\n  author?: ReactNode;\n  /** Secondary attribution line — role / brief (SDGA author title — Text lg). */\n  authorTitle?: ReactNode;\n  /**\n   * Avatar media (e.g. an `<Avatar />`), shown 80px at the inline-start of the author row.\n   * Decorative (`aria-hidden`); only rendered alongside textual attribution.\n   */\n  avatar?: ReactNode;\n  /** Source URL — set as the machine-readable `cite=` attribute on the `<blockquote>`. */\n  cite?: string;\n}\n\n/**\n * SDGA Quote — a card-style quotation block: an optional bold title, the quote body, an optional\n * author (name + brief, with optional avatar), framed by two large SA-flag-green quotation marks.\n * Renders a bare `<blockquote>`; with author attribution it becomes a `<figure>` + `<figcaption>`\n * (a `<figcaption>` must not be empty). The corner marks are decorative (`aria-hidden`).\n */\nfunction Quote({\n  size,\n  whiteBackground,\n  quoteTitle,\n  author,\n  authorTitle,\n  avatar,\n  cite,\n  className,\n  children,\n  ...props\n}: QuoteProps) {\n  const hasAuthor = author != null || authorTitle != null;\n\n  // SDGA renders the marks as the literal U+201D glyph (IBM Plex Sans Arabic, 128px), not an icon;\n  // CSS orients each corner (open/close + RTL) so the same character serves both.\n  const marks = (\n    <>\n      <span aria-hidden=\"true\" className=\"ddga-quote__mark ddga-quote__mark--open\">\n        {'”'}\n      </span>\n      <span aria-hidden=\"true\" className=\"ddga-quote__mark ddga-quote__mark--close\">\n        {'”'}\n      </span>\n    </>\n  );\n\n  const body = (\n    <div data-slot=\"quote-body\" className=\"ddga-quote__body\">\n      {quoteTitle != null ? (\n        <p data-slot=\"quote-title\" className=\"ddga-quote__title\">\n          {quoteTitle}\n        </p>\n      ) : null}\n      {children != null ? (\n        <div data-slot=\"quote-content\" className=\"ddga-quote__content\">\n          {children}\n        </div>\n      ) : null}\n    </div>\n  );\n\n  if (!hasAuthor) {\n    return (\n      <blockquote\n        data-slot=\"quote\"\n        className={cn(quoteVariants({ size, whiteBackground }), className)}\n        cite={cite}\n        {...props}\n      >\n        {marks}\n        {body}\n      </blockquote>\n    );\n  }\n\n  return (\n    <figure\n      data-slot=\"quote\"\n      className={cn(quoteVariants({ size, whiteBackground }), className)}\n      {...props}\n    >\n      {marks}\n      <blockquote data-slot=\"quote-blockquote\" className=\"ddga-quote__blockquote\" cite={cite}>\n        {body}\n      </blockquote>\n      <figcaption data-slot=\"quote-caption\" className=\"ddga-quote__caption\">\n        {avatar != null ? (\n          <span data-slot=\"quote-avatar\" aria-hidden=\"true\" className=\"ddga-quote__avatar\">\n            {avatar}\n          </span>\n        ) : null}\n        <span className=\"ddga-quote__author-info\">\n          {author != null ? (\n            <span data-slot=\"quote-author\" className=\"ddga-quote__author\">\n              {author}\n            </span>\n          ) : null}\n          {authorTitle != null ? (\n            <span data-slot=\"quote-author-title\" className=\"ddga-quote__author-title\">\n              {authorTitle}\n            </span>\n          ) : null}\n        </span>\n      </figcaption>\n    </figure>\n  );\n}\n\nexport { Quote, quoteVariants };\nexport type { QuoteProps };\n"]}

package/dist/chunk-NVCOEKCU.js

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