@dev-dga/react 0.11.0 → 0.12.0

package/dist/{chunk-NQGCAXTW.cjs → chunk-JCOUZVG3.cjs}

@@ -10,13 +10,19 @@ var spinnerVariants = _classvarianceauthority.cva.call(void 0, "ddga-spinner", {
     size: {
       sm: "ddga-spinner--sm",
       md: "ddga-spinner--md",
-      lg: "ddga-spinner--lg"
+      lg: "ddga-spinner--lg",
+      xl: "ddga-spinner--xl"
+    },
+    tone: {
+      neutral: "ddga-spinner--neutral",
+      primary: "ddga-spinner--primary",
+      onColor: "ddga-spinner--on-color"
     }
   }
 });
-function Spinner({ size, className, "aria-label": ariaLabel, ...props }) {
+function Spinner({ size, tone, className, "aria-label": ariaLabel, ...props }) {
   const hidden = props["aria-hidden"] === true || props["aria-hidden"] === "true";
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -24,16 +30,26 @@ function Spinner({ size, className, "aria-label": ariaLabel, ...props }) {
       height: "1em",
       viewBox: "0 0 24 24",
       fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
       role: hidden ? void 0 : "status",
       "aria-label": hidden ? void 0 : _nullishCoalesce(ariaLabel, () => ( "Loading")),
       "data-slot": "spinner",
-      className: _chunkV6MXOJQ4cjs.cn.call(void 0, spinnerVariants({ size }), className),
+      className: _chunkV6MXOJQ4cjs.cn.call(void 0, spinnerVariants({ size, tone }), className),
       ...props,
-      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "circle", { className: "ddga-spinner__track", cx: "12", cy: "12", r: "10", strokeWidth: "2" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "circle",
+          {
+            className: "ddga-spinner__arc",
+            cx: "12",
+            cy: "12",
+            r: "10",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeDasharray: "47 16"
+          }
+        )
+      ]
     }
   );
 }
@@ -42,4 +58,4 @@ function Spinner({ size, className, "aria-label": ariaLabel, ...props }) {
 
 
 exports.spinnerVariants = spinnerVariants; exports.Spinner = Spinner;
-//# sourceMappingURL=chunk-NQGCAXTW.cjs.map
+//# sourceMappingURL=chunk-JCOUZVG3.cjs.map

package/dist/chunk-JCOUZVG3.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-JCOUZVG3.cjs","../src/components/Spinner/Spinner.tsx"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACFA,kEAAuC;AAgCnC,+CAAA;AA7BJ,IAAM,gBAAA,EAAkB,yCAAA,cAAI,EAAgB;AAAA,EAC1C,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,kBAAA;AAAA,MACJ,EAAA,EAAI,kBAAA;AAAA,MACJ,EAAA,EAAI,kBAAA;AAAA,MACJ,EAAA,EAAI;AAAA,IACN,CAAA;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,OAAA,EAAS,uBAAA;AAAA,MACT,OAAA,EAAS,uBAAA;AAAA,MACT,OAAA,EAAS;AAAA,IACX;AAAA,EACF;AACF,CAAC,CAAA;AAYD,SAAS,OAAA,CAAQ,EAAE,IAAA,EAAM,IAAA,EAAM,SAAA,EAAW,YAAA,EAAc,SAAA,EAAW,GAAG,MAAM,CAAA,EAAiB;AAC3F,EAAA,MAAM,OAAA,EAAS,KAAA,CAAM,aAAa,EAAA,IAAM,KAAA,GAAQ,KAAA,CAAM,aAAa,EAAA,IAAM,MAAA;AACzE,EAAA,uBACE,8BAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAM,4BAAA;AAAA,MACN,KAAA,EAAM,KAAA;AAAA,MACN,MAAA,EAAO,KAAA;AAAA,MACP,OAAA,EAAQ,WAAA;AAAA,MACR,IAAA,EAAK,MAAA;AAAA,MACL,IAAA,EAAM,OAAA,EAAS,KAAA,EAAA,EAAY,QAAA;AAAA,MAC3B,YAAA,EAAY,OAAA,EAAS,KAAA,EAAA,mBAAa,SAAA,UAAa,WAAA;AAAA,MAC/C,WAAA,EAAU,SAAA;AAAA,MACV,SAAA,EAAW,kCAAA,eAAG,CAAgB,EAAE,IAAA,EAAM,KAAK,CAAC,CAAA,EAAG,SAAS,CAAA;AAAA,MACvD,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,6BAAA,QAAC,EAAA,EAAO,SAAA,EAAU,qBAAA,EAAsB,EAAA,EAAG,IAAA,EAAK,EAAA,EAAG,IAAA,EAAK,CAAA,EAAE,IAAA,EAAK,WAAA,EAAY,IAAA,CAAI,CAAA;AAAA,wBAC/E,6BAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAU,mBAAA;AAAA,YACV,EAAA,EAAG,IAAA;AAAA,YACH,EAAA,EAAG,IAAA;AAAA,YACH,CAAA,EAAE,IAAA;AAAA,YACF,WAAA,EAAY,GAAA;AAAA,YACZ,aAAA,EAAc,OAAA;AAAA,YACd,eAAA,EAAgB;AAAA,UAAA;AAAA,QAClB;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,CAAA;AAEJ;ADHA;AACA;AACE;AACA;AACF,qEAAC","file":"/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-JCOUZVG3.cjs","sourcesContent":[null,"'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst spinnerVariants = cva('ddga-spinner', {\n  variants: {\n    size: {\n      sm: 'ddga-spinner--sm',\n      md: 'ddga-spinner--md',\n      lg: 'ddga-spinner--lg',\n      xl: 'ddga-spinner--xl',\n    },\n    tone: {\n      neutral: 'ddga-spinner--neutral',\n      primary: 'ddga-spinner--primary',\n      onColor: 'ddga-spinner--on-color',\n    },\n  },\n});\n\ntype SpinnerProps = Omit<React.SVGProps<SVGSVGElement>, 'children'> &\n  VariantProps<typeof spinnerVariants> & {\n    /**\n     * Accessible label announced by screen readers. Defaults to \"Loading\".\n     * Pass `aria-hidden=\"true\"` (e.g. inside a Button that already has its\n     * own label) to suppress.\n     */\n    'aria-label'?: string;\n  };\n\nfunction Spinner({ size, tone, className, 'aria-label': ariaLabel, ...props }: SpinnerProps) {\n  const hidden = props['aria-hidden'] === true || props['aria-hidden'] === 'true';\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"1em\"\n      height=\"1em\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      role={hidden ? undefined : 'status'}\n      aria-label={hidden ? undefined : (ariaLabel ?? 'Loading')}\n      data-slot=\"spinner\"\n      className={cn(spinnerVariants({ size, tone }), className)}\n      {...props}\n    >\n      <circle className=\"ddga-spinner__track\" cx=\"12\" cy=\"12\" r=\"10\" strokeWidth=\"2\" />\n      <circle\n        className=\"ddga-spinner__arc\"\n        cx=\"12\"\n        cy=\"12\"\n        r=\"10\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeDasharray=\"47 16\"\n      />\n    </svg>\n  );\n}\n\nexport { Spinner, spinnerVariants };\nexport type { SpinnerProps };\n"]}

package/dist/chunk-JWOG4I4P.js

@@ -0,0 +1,130 @@
+import {
+  Close
+} from "./chunk-FFGALWM2.js";
+import {
+  cn
+} from "./chunk-7NTT2UXP.js";
+
+// src/components/Tag/Tag.tsx
+import { useState } from "react";
+import { Slot as SlotPrimitive } from "radix-ui";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+var tagVariants = cva("ddga-tag", {
+  variants: {
+    variant: {
+      default: "ddga-tag--default",
+      primary: "ddga-tag--primary",
+      secondary: "ddga-tag--secondary",
+      destructive: "ddga-tag--destructive",
+      success: "ddga-tag--success",
+      warning: "ddga-tag--warning",
+      info: "ddga-tag--info",
+      "primary-subtle": "ddga-tag--primary-subtle",
+      "secondary-subtle": "ddga-tag--secondary-subtle",
+      "destructive-subtle": "ddga-tag--destructive-subtle",
+      "success-subtle": "ddga-tag--success-subtle",
+      "warning-subtle": "ddga-tag--warning-subtle",
+      "info-subtle": "ddga-tag--info-subtle",
+      outline: "ddga-tag--outline",
+      "on-color": "ddga-tag--on-color"
+    },
+    size: {
+      sm: "ddga-tag--sm",
+      md: "ddga-tag--md",
+      lg: "ddga-tag--lg"
+    },
+    // SDGA default is squared; we keep pill as the default to not reshape existing tags.
+    shape: {
+      pill: "",
+      squared: "ddga-tag--squared"
+    },
+    iconOnly: {
+      true: "ddga-tag--icon-only"
+    },
+    // Orthogonal to tone — composes with the *-subtle / on-color variants.
+    outlined: {
+      true: "ddga-tag--outlined"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "md",
+    shape: "pill"
+  }
+});
+function Tag({
+  variant,
+  size,
+  shape,
+  iconOnly,
+  outlined,
+  asChild,
+  startIcon,
+  endIcon,
+  dismissible,
+  open,
+  onDismiss,
+  closeLabel = "Dismiss",
+  className,
+  children,
+  ...props
+}) {
+  const isControlled = open !== void 0;
+  const [uncontrolledOpen, setUncontrolledOpen] = useState(true);
+  const isOpen = isControlled ? open : uncontrolledOpen;
+  if (process.env.NODE_ENV !== "production") {
+    if (asChild && dismissible) {
+      console.warn(
+        "[Tag] `dismissible` is not supported with `asChild` because it would nest an interactive close button inside the consumer's element (invalid HTML). The close button will not render."
+      );
+    }
+    if (iconOnly && props["aria-label"] == null && props["aria-labelledby"] == null) {
+      console.warn(
+        "[Tag] `iconOnly` removes the visible text \u2014 pass `aria-label` (or `aria-labelledby`) so the tag has an accessible name."
+      );
+    }
+  }
+  if (!isOpen) return null;
+  const Comp = asChild ? SlotPrimitive.Slot : "span";
+  const showClose = dismissible && !asChild;
+  const handleDismiss = () => {
+    if (!isControlled) setUncontrolledOpen(false);
+    onDismiss?.();
+  };
+  return /* @__PURE__ */ jsxs(
+    Comp,
+    {
+      "data-slot": "tag",
+      className: cn(tagVariants({ variant, size, shape, iconOnly, outlined }), className),
+      ...props,
+      children: [
+        startIcon ? /* @__PURE__ */ jsx("span", { className: "ddga-tag__icon", "aria-hidden": "true", children: startIcon }) : null,
+        asChild ? (
+          // children IS the consumer's single element (e.g. <a>). Slottable marks
+          // where THAT element's original children should land — without it the
+          // icons would replace the link text.
+          /* @__PURE__ */ jsx(SlotPrimitive.Slottable, { children })
+        ) : children,
+        endIcon ? /* @__PURE__ */ jsx("span", { className: "ddga-tag__icon", "aria-hidden": "true", children: endIcon }) : null,
+        showClose ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "ddga-tag__close",
+            "aria-label": closeLabel,
+            onClick: handleDismiss,
+            "data-slot": "tag-close",
+            children: /* @__PURE__ */ jsx(Close, { "aria-hidden": "true" })
+          }
+        ) : null
+      ]
+    }
+  );
+}
+
+export {
+  tagVariants,
+  Tag
+};
+//# sourceMappingURL=chunk-JWOG4I4P.js.map

package/dist/chunk-JWOG4I4P.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Tag/Tag.tsx"],"sourcesContent":["'use client';\n\nimport { useState, type ReactNode } from 'react';\nimport { Slot as SlotPrimitive } from 'radix-ui';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { Close } from '../../internal/icons';\n\n// ─── 1. Variants (cva) ─── //\n\n// SDGA Tag (docs/compliance/components/Tags.md): the icon + label tag. `*-subtle` are the\n// SDGA filled fills (−50/−200/−800); the dot + status pill is the separate `StatusTag`.\nconst tagVariants = cva('ddga-tag', {\n  variants: {\n    variant: {\n      default: 'ddga-tag--default',\n      primary: 'ddga-tag--primary',\n      secondary: 'ddga-tag--secondary',\n      destructive: 'ddga-tag--destructive',\n      success: 'ddga-tag--success',\n      warning: 'ddga-tag--warning',\n      info: 'ddga-tag--info',\n      'primary-subtle': 'ddga-tag--primary-subtle',\n      'secondary-subtle': 'ddga-tag--secondary-subtle',\n      'destructive-subtle': 'ddga-tag--destructive-subtle',\n      'success-subtle': 'ddga-tag--success-subtle',\n      'warning-subtle': 'ddga-tag--warning-subtle',\n      'info-subtle': 'ddga-tag--info-subtle',\n      outline: 'ddga-tag--outline',\n      'on-color': 'ddga-tag--on-color',\n    },\n    size: {\n      sm: 'ddga-tag--sm',\n      md: 'ddga-tag--md',\n      lg: 'ddga-tag--lg',\n    },\n    // SDGA default is squared; we keep pill as the default to not reshape existing tags.\n    shape: {\n      pill: '',\n      squared: 'ddga-tag--squared',\n    },\n    iconOnly: {\n      true: 'ddga-tag--icon-only',\n    },\n    // Orthogonal to tone — composes with the *-subtle / on-color variants.\n    outlined: {\n      true: 'ddga-tag--outlined',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    size: 'md',\n    shape: 'pill',\n  },\n});\n\n// ─── 2. Types ─── //\n\ninterface TagProps extends React.ComponentProps<'span'>, VariantProps<typeof tagVariants> {\n  /** Render as the single child element instead of a `<span>` (see Button). */\n  asChild?: boolean;\n  /** Icon rendered before the tag text. Sized to the tag font (0.875em). */\n  startIcon?: ReactNode;\n  /** Icon rendered after the tag text. Sized to the tag font (0.875em). */\n  endIcon?: ReactNode;\n  /**\n   * Render a trailing close button — turns the tag into the DGA \"tag/chip\"\n   * pattern. Uncontrolled by default: the tag hides itself when the close\n   * button is clicked. Pass `open` to control visibility yourself.\n   *\n   * Not combinable with `asChild` — the consumer's slotted element (usually an\n   * `<a>`) would end up with an interactive `<button>` inside it, which is\n   * invalid HTML. In that combo the close button is suppressed and a dev\n   * warning is logged.\n   */\n  dismissible?: boolean;\n  /** Controlled visibility. When provided, `onDismiss` becomes the only signal. */\n  open?: boolean;\n  /** Fires when the close button is clicked, in both controlled and uncontrolled mode. */\n  onDismiss?: () => void;\n  /** Accessible label on the close button. Defaults to `\"Dismiss\"`. Override for i18n. */\n  closeLabel?: string;\n}\n\n// ─── 3. Component ─── //\n\nfunction Tag({\n  variant,\n  size,\n  shape,\n  iconOnly,\n  outlined,\n  asChild,\n  startIcon,\n  endIcon,\n  dismissible,\n  open,\n  onDismiss,\n  closeLabel = 'Dismiss',\n  className,\n  children,\n  ...props\n}: TagProps) {\n  const isControlled = open !== undefined;\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(true);\n  const isOpen = isControlled ? open : uncontrolledOpen;\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (asChild && dismissible) {\n      console.warn(\n        \"[Tag] `dismissible` is not supported with `asChild` because it would nest an interactive close button inside the consumer's element (invalid HTML). The close button will not render.\",\n      );\n    }\n    if (iconOnly && props['aria-label'] == null && props['aria-labelledby'] == null) {\n      console.warn(\n        '[Tag] `iconOnly` removes the visible text — pass `aria-label` (or `aria-labelledby`) so the tag has an accessible name.',\n      );\n    }\n  }\n\n  if (!isOpen) return null;\n\n  const Comp = asChild ? SlotPrimitive.Slot : 'span';\n  const showClose = dismissible && !asChild;\n\n  const handleDismiss = () => {\n    if (!isControlled) setUncontrolledOpen(false);\n    onDismiss?.();\n  };\n\n  return (\n    <Comp\n      data-slot=\"tag\"\n      className={cn(tagVariants({ variant, size, shape, iconOnly, outlined }), className)}\n      {...props}\n    >\n      {startIcon ? (\n        <span className=\"ddga-tag__icon\" aria-hidden=\"true\">\n          {startIcon}\n        </span>\n      ) : null}\n      {asChild ? (\n        // children IS the consumer's single element (e.g. <a>). Slottable marks\n        // where THAT element's original children should land — without it the\n        // icons would replace the link text.\n        <SlotPrimitive.Slottable>{children}</SlotPrimitive.Slottable>\n      ) : (\n        children\n      )}\n      {endIcon ? (\n        <span className=\"ddga-tag__icon\" aria-hidden=\"true\">\n          {endIcon}\n        </span>\n      ) : null}\n      {showClose ? (\n        <button\n          type=\"button\"\n          className=\"ddga-tag__close\"\n          aria-label={closeLabel}\n          onClick={handleDismiss}\n          data-slot=\"tag-close\"\n        >\n          <Close aria-hidden=\"true\" />\n        </button>\n      ) : null}\n    </Comp>\n  );\n}\n\n// ─── 4. Exports ─── //\n\nexport { Tag, tagVariants };\nexport type { TagProps };\n"],"mappings":";;;;;;;;AAEA,SAAS,gBAAgC;AACzC,SAAS,QAAQ,qBAAqB;AACtC,SAAS,WAA8B;AA+HnC,SAMI,KANJ;AAvHJ,IAAM,cAAc,IAAI,YAAY;AAAA,EAClC,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,MACT,WAAW;AAAA,MACX,aAAa;AAAA,MACb,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,MACN,kBAAkB;AAAA,MAClB,oBAAoB;AAAA,MACpB,sBAAsB;AAAA,MACtB,kBAAkB;AAAA,MAClB,kBAAkB;AAAA,MAClB,eAAe;AAAA,MACf,SAAS;AAAA,MACT,YAAY;AAAA,IACd;AAAA,IACA,MAAM;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA;AAAA,IAEA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IACA,UAAU;AAAA,MACR,MAAM;AAAA,IACR;AAAA;AAAA,IAEA,UAAU;AAAA,MACR,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AACF,CAAC;AAgCD,SAAS,IAAI;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAa;AACX,QAAM,eAAe,SAAS;AAC9B,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAS,IAAI;AAC7D,QAAM,SAAS,eAAe,OAAO;AAErC,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,QAAI,WAAW,aAAa;AAC1B,cAAQ;AAAA,QACN;AAAA,MACF;AAAA,IACF;AACA,QAAI,YAAY,MAAM,YAAY,KAAK,QAAQ,MAAM,iBAAiB,KAAK,MAAM;AAC/E,cAAQ;AAAA,QACN;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,MAAI,CAAC,OAAQ,QAAO;AAEpB,QAAM,OAAO,UAAU,cAAc,OAAO;AAC5C,QAAM,YAAY,eAAe,CAAC;AAElC,QAAM,gBAAgB,MAAM;AAC1B,QAAI,CAAC,aAAc,qBAAoB,KAAK;AAC5C,gBAAY;AAAA,EACd;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,EAAE,SAAS,MAAM,OAAO,UAAU,SAAS,CAAC,GAAG,SAAS;AAAA,MACjF,GAAG;AAAA,MAEH;AAAA,oBACC,oBAAC,UAAK,WAAU,kBAAiB,eAAY,QAC1C,qBACH,IACE;AAAA,QACH;AAAA;AAAA;AAAA;AAAA,UAIC,oBAAC,cAAc,WAAd,EAAyB,UAAS;AAAA,YAEnC;AAAA,QAED,UACC,oBAAC,UAAK,WAAU,kBAAiB,eAAY,QAC1C,mBACH,IACE;AAAA,QACH,YACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAU;AAAA,YACV,cAAY;AAAA,YACZ,SAAS;AAAA,YACT,aAAU;AAAA,YAEV,8BAAC,SAAM,eAAY,QAAO;AAAA;AAAA,QAC5B,IACE;AAAA;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/chunk-JXATJSBR.js

@@ -0,0 +1,45 @@
+import {
+  cn
+} from "./chunk-7NTT2UXP.js";
+
+// src/components/Metric/MetricGroup.tsx
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var metricGroupVariants = cva("ddga-metric-group", {
+  variants: {
+    orientation: {
+      horizontal: "ddga-metric-group--horizontal",
+      vertical: "ddga-metric-group--vertical"
+    },
+    gap: {
+      sm: "ddga-metric-group--gap-sm",
+      md: "ddga-metric-group--gap-md",
+      lg: "ddga-metric-group--gap-lg"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    gap: "md"
+  }
+});
+function MetricGroup({ orientation, gap, columns, className, style, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "metric-group",
+      className: cn(
+        metricGroupVariants({ orientation, gap }),
+        columns != null && "ddga-metric-group--cols",
+        className
+      ),
+      style: columns != null ? { "--ddga-metric-group-columns": columns, ...style } : style,
+      ...props
+    }
+  );
+}
+
+export {
+  metricGroupVariants,
+  MetricGroup
+};
+//# sourceMappingURL=chunk-JXATJSBR.js.map

package/dist/chunk-JXATJSBR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Metric/MetricGroup.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\n// ─── 1. Variants (cva) ─── //\n\nconst metricGroupVariants = cva('ddga-metric-group', {\n  variants: {\n    orientation: {\n      horizontal: 'ddga-metric-group--horizontal',\n      vertical: 'ddga-metric-group--vertical',\n    },\n    gap: {\n      sm: 'ddga-metric-group--gap-sm',\n      md: 'ddga-metric-group--gap-md',\n      lg: 'ddga-metric-group--gap-lg',\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n    gap: 'md',\n  },\n});\n\n// ─── 2. Types ─── //\n\ninterface MetricGroupProps\n  extends React.ComponentProps<'div'>, VariantProps<typeof metricGroupVariants> {\n  /**\n   * Fixed column count for the horizontal grid (collapses to one column on\n   * narrow screens). Omit for an auto-fit responsive grid.\n   */\n  columns?: number;\n}\n\n// ─── 3. Component ─── //\n\n// Layout container for Metric cards. `columns` is passed as a CSS custom\n// property so the `--cols` rule can collapse it responsively (see metric.css).\nfunction MetricGroup({ orientation, gap, columns, className, style, ...props }: MetricGroupProps) {\n  return (\n    <div\n      data-slot=\"metric-group\"\n      className={cn(\n        metricGroupVariants({ orientation, gap }),\n        columns != null && 'ddga-metric-group--cols',\n        className,\n      )}\n      style={\n        columns != null\n          ? ({ '--ddga-metric-group-columns': columns, ...style } as React.CSSProperties)\n          : style\n      }\n      {...props}\n    />\n  );\n}\n\n// ─── 4. Exports ─── //\n\nexport { MetricGroup, metricGroupVariants };\nexport type { MetricGroupProps };\n"],"mappings":";;;;;AAEA,SAAS,WAA8B;AAwCnC;AAnCJ,IAAM,sBAAsB,IAAI,qBAAqB;AAAA,EACnD,UAAU;AAAA,IACR,aAAa;AAAA,MACX,YAAY;AAAA,MACZ,UAAU;AAAA,IACZ;AAAA,IACA,KAAK;AAAA,MACH,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,aAAa;AAAA,IACb,KAAK;AAAA,EACP;AACF,CAAC;AAiBD,SAAS,YAAY,EAAE,aAAa,KAAK,SAAS,WAAW,OAAO,GAAG,MAAM,GAAqB;AAChG,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT,oBAAoB,EAAE,aAAa,IAAI,CAAC;AAAA,QACxC,WAAW,QAAQ;AAAA,QACnB;AAAA,MACF;AAAA,MACA,OACE,WAAW,OACN,EAAE,+BAA+B,SAAS,GAAG,MAAM,IACpD;AAAA,MAEL,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/chunk-K27GNXBF.cjs

@@ -0,0 +1,272 @@
+"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 _chunk5NENDJOMcjs = require('./chunk-5NENDJOM.cjs');
+
+
+var _chunkJCOUZVG3cjs = require('./chunk-JCOUZVG3.cjs');
+
+
+
+
+
+var _chunkYS2JJ73Mcjs = require('./chunk-YS2JJ73M.cjs');
+
+
+var _chunk3UT22WQMcjs = require('./chunk-3UT22WQM.cjs');
+
+
+var _chunkNH3KGR65cjs = require('./chunk-NH3KGR65.cjs');
+
+
+var _chunkV6MXOJQ4cjs = require('./chunk-V6MXOJQ4.cjs');
+
+// src/components/FileUpload/FileUpload.tsx
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+function matchesAccept(file, accept) {
+  if (!accept) return true;
+  const tokens = accept.split(",").map((t) => t.trim().toLowerCase()).filter(Boolean);
+  if (tokens.length === 0) return true;
+  const name = file.name.toLowerCase();
+  const type = file.type.toLowerCase();
+  return tokens.some((token) => {
+    if (token.startsWith(".")) return name.endsWith(token);
+    if (token.endsWith("/*")) return type.startsWith(token.slice(0, token.indexOf("/") + 1));
+    return type === token;
+  });
+}
+function splitFiles(incoming, config) {
+  const { accept, maxSize, maxFiles, currentCount } = config;
+  const accepted = [];
+  const rejections = [];
+  for (const file of incoming) {
+    const errors = [];
+    if (!matchesAccept(file, accept)) errors.push("file-invalid-type");
+    if (maxSize != null && file.size > maxSize) errors.push("file-too-large");
+    if (errors.length > 0) {
+      rejections.push({ file, errors });
+      continue;
+    }
+    if (maxFiles != null && currentCount + accepted.length >= maxFiles) {
+      rejections.push({ file, errors: ["too-many-files"] });
+      continue;
+    }
+    accepted.push(file);
+  }
+  return { accepted, rejections };
+}
+function FileRow({
+  item,
+  onRemove,
+  removeLabel
+}) {
+  const status = _nullishCoalesce(item.status, () => ( "uploading"));
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "li",
+    {
+      "data-slot": "file-upload-item",
+      "data-status": status,
+      className: _chunkV6MXOJQ4cjs.cn.call(void 0, 
+        "ddga-file-upload__file",
+        status === "error" && "ddga-file-upload__file--error"
+      ),
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ddga-file-upload__file-main", children: [
+          status === "uploading" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ddga-file-upload__file-indicator ddga-file-upload__file-indicator--loading", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJCOUZVG3cjs.Spinner, { "aria-label": `Uploading ${item.file.name}` }) }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "span",
+            {
+              "aria-hidden": "true",
+              className: _chunkV6MXOJQ4cjs.cn.call(void 0, 
+                "ddga-file-upload__file-indicator",
+                `ddga-file-upload__file-indicator--${status}`
+              ),
+              children: status === "success" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.Check, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.Exclamation, {})
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ddga-file-upload__file-name", dir: "auto", title: item.file.name, children: item.file.name }),
+          onRemove && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "button",
+            {
+              type: "button",
+              className: "ddga-file-upload__file-remove",
+              "aria-label": `${removeLabel}: ${item.file.name}`,
+              onClick: () => onRemove(item.id),
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.Close, { "aria-hidden": "true" })
+            }
+          )
+        ] }),
+        status === "error" && item.error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "ddga-file-upload__file-error-row", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { role: "alert", className: "ddga-file-upload__file-error", children: item.error }) })
+      ]
+    }
+  );
+}
+function FileUpload({
+  variant = "dropzone",
+  files,
+  onFilesAdded,
+  onFilesRejected,
+  onRemove,
+  accept,
+  maxSize,
+  maxFiles,
+  multiple = true,
+  disabled = false,
+  required,
+  label,
+  title = "Drag and drop files here to upload",
+  description,
+  buttonLabel = "Browse Files",
+  errorMessage,
+  error,
+  removeLabel = "Remove",
+  id: externalId,
+  className,
+  ...props
+}) {
+  const inputRef = _react.useRef.call(void 0, null);
+  const [isDragging, setIsDragging] = _react.useState.call(void 0, false);
+  const { fieldId, errorId, helperId, hasErrorMessage, controlProps } = _chunkNH3KGR65cjs.useFieldA11y.call(void 0, {
+    name: "FileUpload",
+    id: externalId,
+    label,
+    error,
+    errorMessage,
+    helperText: description,
+    "aria-label": props["aria-label"],
+    "aria-labelledby": props["aria-labelledby"]
+  });
+  const effectiveMaxFiles = multiple ? maxFiles : 1;
+  function process(incoming) {
+    if (disabled || incoming.length === 0) return;
+    const { accepted, rejections } = splitFiles(incoming, {
+      accept,
+      maxSize,
+      maxFiles: effectiveMaxFiles,
+      currentCount: files.length
+    });
+    if (accepted.length > 0) onFilesAdded(accepted);
+    if (rejections.length > 0) _optionalChain([onFilesRejected, 'optionalCall', _ => _(rejections)]);
+  }
+  function openPicker() {
+    if (!disabled) _optionalChain([inputRef, 'access', _2 => _2.current, 'optionalAccess', _3 => _3.click, 'call', _4 => _4()]);
+  }
+  function handleInputChange(event) {
+    process(Array.from(_nullishCoalesce(event.target.files, () => ( []))));
+    event.target.value = "";
+  }
+  function handleDrop(event) {
+    event.preventDefault();
+    setIsDragging(false);
+    if (disabled) return;
+    process(Array.from(event.dataTransfer.files));
+  }
+  function handleDragOver(event) {
+    event.preventDefault();
+    if (!disabled) setIsDragging(true);
+  }
+  function handleDragLeave(event) {
+    if (!event.currentTarget.contains(event.relatedTarget)) {
+      setIsDragging(false);
+    }
+  }
+  const labelNode = label && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "label", { htmlFor: fieldId, className: "ddga-file-upload__label", children: [
+    required && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "aria-hidden": "true", className: "ddga-file-upload__required", children: "*" }),
+    label
+  ] });
+  const descriptionNode = description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { id: helperId, className: "ddga-file-upload__description", children: description });
+  const fileInput = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "input",
+    {
+      ...props,
+      ...controlProps,
+      ref: inputRef,
+      type: "file",
+      tabIndex: -1,
+      className: "ddga-file-upload__input",
+      accept,
+      multiple,
+      disabled,
+      required,
+      onChange: handleInputChange,
+      onClick: (event) => event.stopPropagation(),
+      "data-slot": "file-upload-input"
+    }
+  );
+  const showTrigger = variant === "dropzone" || multiple || files.length === 0;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "div",
+    {
+      "data-slot": "file-upload-field",
+      "data-variant": variant,
+      className: _chunkV6MXOJQ4cjs.cn.call(void 0, "ddga-field", "ddga-file-upload", className),
+      children: [
+        variant === "dropzone" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+          labelNode,
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+            "div",
+            {
+              "data-slot": "file-upload-dropzone",
+              className: "ddga-file-upload__dropzone",
+              "data-dragging": isDragging || void 0,
+              "data-disabled": disabled || void 0,
+              "aria-disabled": disabled || void 0,
+              onClick: openPicker,
+              onDragOver: handleDragOver,
+              onDragLeave: handleDragLeave,
+              onDrop: handleDrop,
+              children: [
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "ddga-file-upload__border", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "rect", { width: "100%", height: "100%", rx: "4", ry: "4" }) }),
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYS2JJ73Mcjs.Upload, { className: "ddga-file-upload__icon", "aria-hidden": "true" }),
+                /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ddga-file-upload__copy", children: [
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ddga-file-upload__title", children: title }),
+                  descriptionNode
+                ] }),
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                  _chunk5NENDJOMcjs.Button,
+                  {
+                    type: "button",
+                    variant: "secondary",
+                    size: "md",
+                    disabled,
+                    className: "ddga-file-upload__browse",
+                    onClick: (event) => {
+                      event.stopPropagation();
+                      openPicker();
+                    },
+                    children: buttonLabel
+                  }
+                ),
+                fileInput
+              ]
+            }
+          )
+        ] }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ddga-file-upload__header", children: [
+            labelNode,
+            descriptionNode
+          ] }),
+          showTrigger && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunk5NENDJOMcjs.Button,
+            {
+              type: "button",
+              variant: "black",
+              size: "md",
+              disabled,
+              className: "ddga-file-upload__browse",
+              onClick: openPicker,
+              children: buttonLabel
+            }
+          ),
+          fileInput
+        ] }),
+        hasErrorMessage && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk3UT22WQMcjs.FieldMessage, { id: errorId, variant: "error", children: errorMessage }),
+        files.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ul", { "data-slot": "file-upload-list", className: "ddga-file-upload__list", children: files.map((item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FileRow, { item, onRemove, removeLabel }, item.id)) })
+      ]
+    }
+  );
+}
+
+
+
+exports.FileUpload = FileUpload;
+//# sourceMappingURL=chunk-K27GNXBF.cjs.map

package/dist/chunk-K27GNXBF.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-K27GNXBF.cjs","../src/components/FileUpload/FileUpload.tsx"],"names":[],"mappings":"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","file":"/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-K27GNXBF.cjs","sourcesContent":[null,"'use client';\n\nimport { useRef, useState, type ReactNode } from 'react';\nimport { cn } from '../../utils/cn';\nimport { useFieldA11y, FieldMessage } from '../../field';\nimport { Button } from '../Button';\nimport { Spinner } from '../Spinner';\nimport { Upload, Check, Exclamation, Close } from '../../internal/icons';\n\ntype FileStatus = 'uploading' | 'success' | 'error';\n\n/** Reason codes attached to a rejected file. */\ntype RejectionCode = 'file-too-large' | 'file-invalid-type' | 'too-many-files';\n\n/**\n * A controlled file entry. The consumer owns this array and is responsible for\n * performing the actual upload, updating `status`, and assigning a stable `id`\n * (used as the React key and the `onRemove` target).\n */\ninterface UploadFile {\n  /** Stable, consumer-assigned id. Used as the React key and remove target. */\n  id: string;\n  /** The native File. */\n  file: File;\n  /** Defaults to `'uploading'`. Drives the per-row indicator. */\n  status?: FileStatus;\n  /** Shown in the row's second line (red) while `status === 'error'`. */\n  error?: string;\n}\n\ninterface FileRejection {\n  file: File;\n  errors: RejectionCode[];\n}\n\ninterface FileUploadProps extends Omit<\n  React.ComponentProps<'input'>,\n  | 'onChange'\n  | 'type'\n  | 'accept'\n  | 'multiple'\n  | 'required'\n  | 'disabled'\n  | 'className'\n  | 'id'\n  | 'children'\n  | 'title'\n> {\n  variant?: 'dropzone' | 'button';\n\n  /** Controlled list of files to render. The consumer is the source of truth. */\n  files: UploadFile[];\n  /** Called with the files that passed validation. The consumer wraps each in\n   *  an {@link UploadFile} (assigning an `id`) and starts the upload. */\n  onFilesAdded: (accepted: File[]) => void;\n  /** Called with files that failed validation. Never enter `files`. */\n  onFilesRejected?: (rejections: FileRejection[]) => void;\n  /** Per-row remove handler. Omit to hide the remove button. */\n  onRemove?: (id: string) => void;\n\n  /** Native `accept` string (e.g. `'image/*,.pdf'`). Also drives validation. */\n  accept?: string;\n  /** Maximum size per file, in bytes. */\n  maxSize?: number;\n  /** Maximum total files (existing + incoming). When `multiple` is false this\n   *  is forced to 1. */\n  maxFiles?: number;\n  /** Allow selecting/dropping more than one file. Defaults to true. */\n  multiple?: boolean;\n  /** Disables the drop zone / button and the picker. */\n  disabled?: boolean;\n  /** Marks the field required: renders the asterisk and sets the input's\n   *  `required` attribute. */\n  required?: boolean;\n\n  /** Visible field label, auto-associated to the input. */\n  label?: ReactNode;\n  title?: ReactNode;\n  description?: ReactNode;\n  buttonLabel?: ReactNode;\n  /** Message shown below the field when `error` is true. */\n  errorMessage?: ReactNode;\n  /** Marks the field invalid: sets `aria-invalid` and error styling. */\n  error?: boolean;\n\n  /** Accessible label for the per-row remove button. Defaults to `'Remove'`. */\n  removeLabel?: string;\n\n  id?: string;\n  className?: string;\n  'aria-label'?: string;\n  'aria-labelledby'?: string;\n}\n\nfunction matchesAccept(file: File, accept?: string): boolean {\n  if (!accept) return true;\n  const tokens = accept\n    .split(',')\n    .map((t) => t.trim().toLowerCase())\n    .filter(Boolean);\n  if (tokens.length === 0) return true;\n\n  const name = file.name.toLowerCase();\n  const type = file.type.toLowerCase();\n\n  return tokens.some((token) => {\n    if (token.startsWith('.')) return name.endsWith(token);\n    if (token.endsWith('/*')) return type.startsWith(token.slice(0, token.indexOf('/') + 1));\n    return type === token;\n  });\n}\n\ninterface ValidationConfig {\n  accept?: string;\n  maxSize?: number;\n  maxFiles?: number;\n  /** Files already in the list — counts against `maxFiles`. */\n  currentCount: number;\n}\n\nfunction splitFiles(incoming: File[], config: ValidationConfig) {\n  const { accept, maxSize, maxFiles, currentCount } = config;\n  const accepted: File[] = [];\n  const rejections: FileRejection[] = [];\n\n  for (const file of incoming) {\n    const errors: RejectionCode[] = [];\n    if (!matchesAccept(file, accept)) errors.push('file-invalid-type');\n    if (maxSize != null && file.size > maxSize) errors.push('file-too-large');\n\n    if (errors.length > 0) {\n      rejections.push({ file, errors });\n      continue;\n    }\n    // Count last: only an otherwise-valid file consumes a slot.\n    if (maxFiles != null && currentCount + accepted.length >= maxFiles) {\n      rejections.push({ file, errors: ['too-many-files'] });\n      continue;\n    }\n    accepted.push(file);\n  }\n\n  return { accepted, rejections };\n}\n\nfunction FileRow({\n  item,\n  onRemove,\n  removeLabel,\n}: {\n  item: UploadFile;\n  onRemove?: (id: string) => void;\n  removeLabel: string;\n}) {\n  const status = item.status ?? 'uploading';\n  return (\n    <li\n      data-slot=\"file-upload-item\"\n      data-status={status}\n      className={cn(\n        'ddga-file-upload__file',\n        status === 'error' && 'ddga-file-upload__file--error',\n      )}\n    >\n      <div className=\"ddga-file-upload__file-main\">\n        {status === 'uploading' ? (\n          <span className=\"ddga-file-upload__file-indicator ddga-file-upload__file-indicator--loading\">\n            <Spinner aria-label={`Uploading ${item.file.name}`} />\n          </span>\n        ) : (\n          <span\n            aria-hidden=\"true\"\n            className={cn(\n              'ddga-file-upload__file-indicator',\n              `ddga-file-upload__file-indicator--${status}`,\n            )}\n          >\n            {status === 'success' ? <Check /> : <Exclamation />}\n          </span>\n        )}\n\n        <span className=\"ddga-file-upload__file-name\" dir=\"auto\" title={item.file.name}>\n          {item.file.name}\n        </span>\n\n        {onRemove && (\n          <button\n            type=\"button\"\n            className=\"ddga-file-upload__file-remove\"\n            aria-label={`${removeLabel}: ${item.file.name}`}\n            onClick={() => onRemove(item.id)}\n          >\n            <Close aria-hidden=\"true\" />\n          </button>\n        )}\n      </div>\n\n      {status === 'error' && item.error && (\n        <div className=\"ddga-file-upload__file-error-row\">\n          <span role=\"alert\" className=\"ddga-file-upload__file-error\">\n            {item.error}\n          </span>\n        </div>\n      )}\n    </li>\n  );\n}\n\nfunction FileUpload({\n  variant = 'dropzone',\n  files,\n  onFilesAdded,\n  onFilesRejected,\n  onRemove,\n  accept,\n  maxSize,\n  maxFiles,\n  multiple = true,\n  disabled = false,\n  required,\n  label,\n  title = 'Drag and drop files here to upload',\n  description,\n  buttonLabel = 'Browse Files',\n  errorMessage,\n  error,\n  removeLabel = 'Remove',\n  id: externalId,\n  className,\n  ...props\n}: FileUploadProps) {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [isDragging, setIsDragging] = useState(false);\n\n  const { fieldId, errorId, helperId, hasErrorMessage, controlProps } = useFieldA11y({\n    name: 'FileUpload',\n    id: externalId,\n    label,\n    error,\n    errorMessage,\n    helperText: description,\n    'aria-label': props['aria-label'],\n    'aria-labelledby': props['aria-labelledby'],\n  });\n\n  const effectiveMaxFiles = multiple ? maxFiles : 1;\n\n  function process(incoming: File[]) {\n    if (disabled || incoming.length === 0) return;\n    const { accepted, rejections } = splitFiles(incoming, {\n      accept,\n      maxSize,\n      maxFiles: effectiveMaxFiles,\n      currentCount: files.length,\n    });\n    if (accepted.length > 0) onFilesAdded(accepted);\n    if (rejections.length > 0) onFilesRejected?.(rejections);\n  }\n\n  function openPicker() {\n    if (!disabled) inputRef.current?.click();\n  }\n\n  function handleInputChange(event: React.ChangeEvent<HTMLInputElement>) {\n    process(Array.from(event.target.files ?? []));\n    // Reset so re-selecting the same file re-fires change.\n    event.target.value = '';\n  }\n\n  function handleDrop(event: React.DragEvent<HTMLDivElement>) {\n    event.preventDefault();\n    setIsDragging(false);\n    if (disabled) return;\n    process(Array.from(event.dataTransfer.files));\n  }\n\n  function handleDragOver(event: React.DragEvent<HTMLDivElement>) {\n    event.preventDefault();\n    if (!disabled) setIsDragging(true);\n  }\n\n  function handleDragLeave(event: React.DragEvent<HTMLDivElement>) {\n    // Ignore dragleave bubbling from descendants.\n    if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n      setIsDragging(false);\n    }\n  }\n\n  const labelNode = label && (\n    <label htmlFor={fieldId} className=\"ddga-file-upload__label\">\n      {required && (\n        <span aria-hidden=\"true\" className=\"ddga-file-upload__required\">\n          *\n        </span>\n      )}\n      {label}\n    </label>\n  );\n\n  const descriptionNode = description && (\n    <span id={helperId} className=\"ddga-file-upload__description\">\n      {description}\n    </span>\n  );\n\n  const fileInput = (\n    <input\n      {...props}\n      {...controlProps}\n      ref={inputRef}\n      type=\"file\"\n      tabIndex={-1}\n      className=\"ddga-file-upload__input\"\n      accept={accept}\n      multiple={multiple}\n      disabled={disabled}\n      required={required}\n      onChange={handleInputChange}\n      // Guard the openPicker() recursion: the programmatic input.click() would\n      // bubble back to the dropzone's onClick.\n      onClick={(event) => event.stopPropagation()}\n      data-slot=\"file-upload-input\"\n    />\n  );\n\n  // SDGA Single: the file row replaces the trigger once the one file is chosen.\n  const showTrigger = variant === 'dropzone' || multiple || files.length === 0;\n\n  return (\n    <div\n      data-slot=\"file-upload-field\"\n      data-variant={variant}\n      className={cn('ddga-field', 'ddga-file-upload', className)}\n    >\n      {variant === 'dropzone' ? (\n        <>\n          {labelNode}\n          <div\n            data-slot=\"file-upload-dropzone\"\n            className=\"ddga-file-upload__dropzone\"\n            data-dragging={isDragging || undefined}\n            data-disabled={disabled || undefined}\n            aria-disabled={disabled || undefined}\n            onClick={openPicker}\n            onDragOver={handleDragOver}\n            onDragLeave={handleDragLeave}\n            onDrop={handleDrop}\n          >\n            <svg className=\"ddga-file-upload__border\" aria-hidden=\"true\" focusable=\"false\">\n              <rect width=\"100%\" height=\"100%\" rx=\"4\" ry=\"4\" />\n            </svg>\n            <Upload className=\"ddga-file-upload__icon\" aria-hidden=\"true\" />\n            <div className=\"ddga-file-upload__copy\">\n              <span className=\"ddga-file-upload__title\">{title}</span>\n              {descriptionNode}\n            </div>\n            <Button\n              type=\"button\"\n              variant=\"secondary\"\n              size=\"md\"\n              disabled={disabled}\n              className=\"ddga-file-upload__browse\"\n              onClick={(event) => {\n                event.stopPropagation();\n                openPicker();\n              }}\n            >\n              {buttonLabel}\n            </Button>\n            {fileInput}\n          </div>\n        </>\n      ) : (\n        <>\n          <div className=\"ddga-file-upload__header\">\n            {labelNode}\n            {descriptionNode}\n          </div>\n          {showTrigger && (\n            <Button\n              type=\"button\"\n              variant=\"black\"\n              size=\"md\"\n              disabled={disabled}\n              className=\"ddga-file-upload__browse\"\n              onClick={openPicker}\n            >\n              {buttonLabel}\n            </Button>\n          )}\n          {fileInput}\n        </>\n      )}\n\n      {hasErrorMessage && (\n        <FieldMessage id={errorId} variant=\"error\">\n          {errorMessage}\n        </FieldMessage>\n      )}\n\n      {files.length > 0 && (\n        <ul data-slot=\"file-upload-list\" className=\"ddga-file-upload__list\">\n          {files.map((item) => (\n            <FileRow key={item.id} item={item} onRemove={onRemove} removeLabel={removeLabel} />\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n}\n\nexport { FileUpload };\nexport type { FileUploadProps, UploadFile, FileRejection, FileStatus, RejectionCode };\n"]}

package/dist/{chunk-3VOOMW6O.js → chunk-KDV7V5S4.js}

@@ -1,7 +1,7 @@
 import {
   Check,
   ChevronRight
-} from "./chunk-CDS4SYEQ.js";
+} from "./chunk-FFGALWM2.js";
 import {
   DgaContext
 } from "./chunk-TMXABSFE.js";
@@ -212,4 +212,4 @@ export {
   MenubarSubTrigger,
   MenubarSubContent
 };
-//# sourceMappingURL=chunk-3VOOMW6O.js.map
+//# sourceMappingURL=chunk-KDV7V5S4.js.map