@elabs-ai/components-ui 4.2.0 → 5.0.0

package/dist/chunk-7PS5MKVH.js

@@ -0,0 +1,97 @@
+"use client";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
+} from "./chunk-TU24Y4HN.js";
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage
+} from "./chunk-K6YRTASS.js";
+import {
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  useSidebar
+} from "./chunk-R3SYH7RG.js";
+import {
+  useLocale
+} from "./chunk-EJQYE4MY.js";
+
+// src/components/nav-user/nav-user.tsx
+import { ChevronsUpDown, LogOut, Settings } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function initialsOf(name) {
+  return name.split(" ").map((part) => part[0]).join("").slice(0, 2).toUpperCase();
+}
+function NavUser({ user, onSettings, settingsHref, onSignOut, children }) {
+  const { isMobile } = useSidebar();
+  const { t } = useLocale();
+  const initials = initialsOf(user.name);
+  return /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      SidebarMenuButton,
+      {
+        size: "lg",
+        tooltip: user.name,
+        "aria-label": `${user.name} ${user.email}`,
+        className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground",
+        children: [
+          /* @__PURE__ */ jsxs(Avatar, { className: "size-8 rounded-lg", children: [
+            user.avatar && /* @__PURE__ */ jsx(AvatarImage, { src: user.avatar, alt: "" }),
+            /* @__PURE__ */ jsx(AvatarFallback, { className: "rounded-lg", children: initials })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "grid flex-1 text-start text-body leading-tight group-data-[collapsible=icon]:hidden", children: [
+            /* @__PURE__ */ jsx("span", { className: "truncate font-medium", children: user.name }),
+            /* @__PURE__ */ jsx("span", { className: "truncate text-meta text-sidebar-muted-foreground", children: user.email })
+          ] }),
+          /* @__PURE__ */ jsx(
+            ChevronsUpDown,
+            {
+              "aria-hidden": "true",
+              className: "ms-auto size-4 group-data-[collapsible=icon]:hidden"
+            }
+          )
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(
+      DropdownMenuContent,
+      {
+        "data-slot": "nav-user-menu",
+        className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg",
+        side: isMobile ? "bottom" : "right",
+        align: "end",
+        sideOffset: 4,
+        children: [
+          /* @__PURE__ */ jsx(DropdownMenuLabel, { className: "text-meta text-muted-foreground", children: t("ui.navUser.label") }),
+          /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [
+            children,
+            settingsHref ? /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs("a", { href: settingsHref, children: [
+              /* @__PURE__ */ jsx(Settings, { "aria-hidden": "true" }),
+              t("ui.navUser.settings")
+            ] }) }) : /* @__PURE__ */ jsxs(DropdownMenuItem, { onSelect: onSettings, children: [
+              /* @__PURE__ */ jsx(Settings, { "aria-hidden": "true" }),
+              t("ui.navUser.settings")
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+          /* @__PURE__ */ jsxs(DropdownMenuItem, { onSelect: onSignOut, children: [
+            /* @__PURE__ */ jsx(LogOut, { "aria-hidden": "true" }),
+            t("ui.navUser.signOut")
+          ] })
+        ]
+      }
+    )
+  ] }) }) });
+}
+
+export {
+  NavUser
+};
+//# sourceMappingURL=chunk-7PS5MKVH.js.map

package/dist/chunk-7PS5MKVH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/nav-user/nav-user.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactNode } from \"react\";\nimport { ChevronsUpDown, LogOut, Settings } from \"lucide-react\";\nimport { Avatar, AvatarFallback, AvatarImage } from \"../avatar\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"../dropdown-menu\";\nimport { useLocale } from \"../locale-provider\";\nimport { SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar } from \"../sidebar\";\n\nexport interface NavUserUser {\n  name: string;\n  email: string;\n  /** URL for the user's avatar image. */\n  avatar?: string;\n}\n\nexport interface NavUserProps {\n  user: NavUserUser;\n  /** Fires when \"Settings\" is chosen. Ignored when `settingsHref` is set. */\n  onSettings?: () => void;\n  /** Route of the settings screen — \"Settings\" renders as a link to it. */\n  settingsHref?: string;\n  /** Fires when \"Sign out\" is chosen. */\n  onSignOut?: () => void;\n  /**\n   * Extra `DropdownMenuItem`s, placed above \"Settings\" (e.g. Profile, Billing).\n   * Settings and Sign out are always present — they are the standard pair.\n   */\n  children?: ReactNode;\n}\n\nfunction initialsOf(name: string): string {\n  return name\n    .split(\" \")\n    .map((part) => part[0])\n    .join(\"\")\n    .slice(0, 2)\n    .toUpperCase();\n}\n\n/**\n * The standard sidebar footer: the signed-in user (avatar, name, email) as one\n * row that opens the account menu — Settings, then Sign out. EVERY app shell's\n * nav rail ends with this; settings never sits in the footer as a loose nav\n * row, and the footer carries no environment/meta line.\n *\n * Collapsed to the 48px icon rail the row is the avatar alone, and its\n * accessible name is written out because the visible label is gone.\n */\nexport function NavUser({ user, onSettings, settingsHref, onSignOut, children }: NavUserProps) {\n  const { isMobile } = useSidebar();\n  const { t } = useLocale();\n  const initials = initialsOf(user.name);\n\n  return (\n    <SidebarMenu>\n      <SidebarMenuItem>\n        <DropdownMenu>\n          <DropdownMenuTrigger asChild>\n            <SidebarMenuButton\n              size=\"lg\"\n              tooltip={user.name}\n              // Written out: collapsed, the trigger is only an avatar, so its\n              // contents cannot name it. Same string as the visible label, in\n              // reading order (WCAG 2.5.3).\n              aria-label={`${user.name} ${user.email}`}\n              className=\"data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground\"\n            >\n              <Avatar className=\"size-8 rounded-lg\">\n                {user.avatar && <AvatarImage src={user.avatar} alt=\"\" />}\n                <AvatarFallback className=\"rounded-lg\">{initials}</AvatarFallback>\n              </Avatar>\n              <div className=\"grid flex-1 text-start text-body leading-tight group-data-[collapsible=icon]:hidden\">\n                <span className=\"truncate font-medium\">{user.name}</span>\n                <span className=\"truncate text-meta text-sidebar-muted-foreground\">\n                  {user.email}\n                </span>\n              </div>\n              <ChevronsUpDown\n                aria-hidden=\"true\"\n                className=\"ms-auto size-4 group-data-[collapsible=icon]:hidden\"\n              />\n            </SidebarMenuButton>\n          </DropdownMenuTrigger>\n          <DropdownMenuContent\n            data-slot=\"nav-user-menu\"\n            className=\"w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg\"\n            side={isMobile ? \"bottom\" : \"right\"}\n            align=\"end\"\n            sideOffset={4}\n          >\n            <DropdownMenuLabel className=\"text-meta text-muted-foreground\">\n              {t(\"ui.navUser.label\")}\n            </DropdownMenuLabel>\n            <DropdownMenuGroup>\n              {children}\n              {settingsHref ? (\n                <DropdownMenuItem asChild>\n                  <a href={settingsHref}>\n                    <Settings aria-hidden=\"true\" />\n                    {t(\"ui.navUser.settings\")}\n                  </a>\n                </DropdownMenuItem>\n              ) : (\n                <DropdownMenuItem onSelect={onSettings}>\n                  <Settings aria-hidden=\"true\" />\n                  {t(\"ui.navUser.settings\")}\n                </DropdownMenuItem>\n              )}\n            </DropdownMenuGroup>\n            <DropdownMenuSeparator />\n            <DropdownMenuItem onSelect={onSignOut}>\n              <LogOut aria-hidden=\"true\" />\n              {t(\"ui.navUser.signOut\")}\n            </DropdownMenuItem>\n          </DropdownMenuContent>\n        </DropdownMenu>\n      </SidebarMenuItem>\n    </SidebarMenu>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,SAAS,gBAAgB,QAAQ,gBAAgB;AAyEnC,SACkB,KADlB;AArCd,SAAS,WAAW,MAAsB;AACxC,SAAO,KACJ,MAAM,GAAG,EACT,IAAI,CAAC,SAAS,KAAK,CAAC,CAAC,EACrB,KAAK,EAAE,EACP,MAAM,GAAG,CAAC,EACV,YAAY;AACjB;AAWO,SAAS,QAAQ,EAAE,MAAM,YAAY,cAAc,WAAW,SAAS,GAAiB;AAC7F,QAAM,EAAE,SAAS,IAAI,WAAW;AAChC,QAAM,EAAE,EAAE,IAAI,UAAU;AACxB,QAAM,WAAW,WAAW,KAAK,IAAI;AAErC,SACE,oBAAC,eACC,8BAAC,mBACC,+BAAC,gBACC;AAAA,wBAAC,uBAAoB,SAAO,MAC1B;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS,KAAK;AAAA,QAId,cAAY,GAAG,KAAK,IAAI,IAAI,KAAK,KAAK;AAAA,QACtC,WAAU;AAAA,QAEV;AAAA,+BAAC,UAAO,WAAU,qBACf;AAAA,iBAAK,UAAU,oBAAC,eAAY,KAAK,KAAK,QAAQ,KAAI,IAAG;AAAA,YACtD,oBAAC,kBAAe,WAAU,cAAc,oBAAS;AAAA,aACnD;AAAA,UACA,qBAAC,SAAI,WAAU,uFACb;AAAA,gCAAC,UAAK,WAAU,wBAAwB,eAAK,MAAK;AAAA,YAClD,oBAAC,UAAK,WAAU,oDACb,eAAK,OACR;AAAA,aACF;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,eAAY;AAAA,cACZ,WAAU;AAAA;AAAA,UACZ;AAAA;AAAA;AAAA,IACF,GACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,aAAU;AAAA,QACV,WAAU;AAAA,QACV,MAAM,WAAW,WAAW;AAAA,QAC5B,OAAM;AAAA,QACN,YAAY;AAAA,QAEZ;AAAA,8BAAC,qBAAkB,WAAU,mCAC1B,YAAE,kBAAkB,GACvB;AAAA,UACA,qBAAC,qBACE;AAAA;AAAA,YACA,eACC,oBAAC,oBAAiB,SAAO,MACvB,+BAAC,OAAE,MAAM,cACP;AAAA,kCAAC,YAAS,eAAY,QAAO;AAAA,cAC5B,EAAE,qBAAqB;AAAA,eAC1B,GACF,IAEA,qBAAC,oBAAiB,UAAU,YAC1B;AAAA,kCAAC,YAAS,eAAY,QAAO;AAAA,cAC5B,EAAE,qBAAqB;AAAA,eAC1B;AAAA,aAEJ;AAAA,UACA,oBAAC,yBAAsB;AAAA,UACvB,qBAAC,oBAAiB,UAAU,WAC1B;AAAA,gCAAC,UAAO,eAAY,QAAO;AAAA,YAC1B,EAAE,oBAAoB;AAAA,aACzB;AAAA;AAAA;AAAA,IACF;AAAA,KACF,GACF,GACF;AAEJ;","names":[]}

package/dist/chunk-7WIHVGYL.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-7WIHVGYL.js.map

package/dist/chunk-7WIHVGYL.js.map

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

package/dist/chunk-7WXDSTNR.js

@@ -0,0 +1,62 @@
+"use client";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/reveal/reveal.tsx
+import {
+  Children,
+  cloneElement,
+  forwardRef,
+  isValidElement
+} from "react";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var revealVariants = cva("animate-in fill-mode-both", {
+  variants: {
+    appear: {
+      // Travel ~24px (slide-*-6): below ~16px a slide reads as a flicker/pop, not
+      // trackable motion — distance, not duration, is what makes it feel smooth.
+      fade: "fade-in",
+      up: "fade-in slide-in-from-bottom-6",
+      down: "fade-in slide-in-from-top-6",
+      left: "fade-in slide-in-from-right-6",
+      right: "fade-in slide-in-from-left-6",
+      zoom: "fade-in zoom-in-95"
+    },
+    speed: {
+      fast: "duration-fast ease-entrance",
+      base: "duration-base ease-entrance",
+      slow: "duration-slow ease-entrance"
+    }
+  },
+  defaultVariants: { appear: "up", speed: "slow" }
+});
+var Reveal = forwardRef(function Reveal2({ className, appear, speed, delayMs, style, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(revealVariants({ appear, speed }), className),
+      style: delayMs ? { animationDelay: `${delayMs}ms`, ...style } : style,
+      ...props
+    }
+  );
+});
+var RevealGroup = forwardRef(function RevealGroup2({ children, className, appear, speed, staggerMs = 60, ...props }, ref) {
+  return /* @__PURE__ */ jsx("div", { ref, className, ...props, children: Children.map(children, (child, index) => {
+    if (!isValidElement(child)) return child;
+    const el = child;
+    return cloneElement(el, {
+      className: cn(revealVariants({ appear, speed }), el.props.className),
+      style: { animationDelay: `${index * staggerMs}ms`, ...el.props.style }
+    });
+  }) });
+});
+
+export {
+  revealVariants,
+  Reveal,
+  RevealGroup
+};
+//# sourceMappingURL=chunk-7WXDSTNR.js.map

package/dist/chunk-7WXDSTNR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/reveal/reveal.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactElement,\n} from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../lib/cn\";\n\n/**\n * Entrance-animation classes (tw-animate-css), gated by the motion system: the\n * `duration-*` utility feeds `--tw-duration` (= the gated `--t-*`), so the\n * reveal slows to ~0 when motion is reduced/off. `fill-mode-both` holds the\n * start state through any stagger delay so items don't flash in early.\n */\nexport const revealVariants = cva(\"animate-in fill-mode-both\", {\n  variants: {\n    appear: {\n      // Travel ~24px (slide-*-6): below ~16px a slide reads as a flicker/pop, not\n      // trackable motion — distance, not duration, is what makes it feel smooth.\n      fade: \"fade-in\",\n      up: \"fade-in slide-in-from-bottom-6\",\n      down: \"fade-in slide-in-from-top-6\",\n      left: \"fade-in slide-in-from-right-6\",\n      right: \"fade-in slide-in-from-left-6\",\n      zoom: \"fade-in zoom-in-95\",\n    },\n    speed: {\n      fast: \"duration-fast ease-entrance\",\n      base: \"duration-base ease-entrance\",\n      slow: \"duration-slow ease-entrance\",\n    },\n  },\n  defaultVariants: { appear: \"up\", speed: \"slow\" },\n});\n\nexport interface RevealProps\n  extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof revealVariants> {\n  /** Animation delay in ms (RevealGroup sets this per child to stagger). */\n  delayMs?: number;\n}\n\n/**\n * Animates its content in on mount (fade + directional slide/zoom). Gated by the\n * motion system — no animation when motion is reduced/off. For a list/grid, use\n * {@link RevealGroup} to stagger children.\n */\nexport const Reveal = forwardRef<HTMLDivElement, RevealProps>(function Reveal(\n  { className, appear, speed, delayMs, style, ...props },\n  ref,\n) {\n  return (\n    <div\n      ref={ref}\n      className={cn(revealVariants({ appear, speed }), className)}\n      style={delayMs ? { animationDelay: `${delayMs}ms`, ...style } : style}\n      {...props}\n    />\n  );\n});\n\nexport interface RevealGroupProps\n  extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof revealVariants> {\n  /** Delay added per successive child, in ms. */\n  staggerMs?: number;\n}\n\ntype RevealableChild = ReactElement<{ className?: string; style?: CSSProperties }>;\n\n/**\n * Staggers an entrance across direct children. Clones each child to add the\n * reveal classes + an incremental `animation-delay` — no wrapper elements, so it\n * is safe inside flex/grid layouts. Remount it (e.g. via a changing `key`) to\n * replay. Gated by the motion system.\n */\nexport const RevealGroup = forwardRef<HTMLDivElement, RevealGroupProps>(function RevealGroup(\n  { children, className, appear, speed, staggerMs = 60, ...props },\n  ref,\n) {\n  return (\n    <div ref={ref} className={className} {...props}>\n      {Children.map(children, (child, index) => {\n        if (!isValidElement(child)) return child;\n        const el = child as RevealableChild;\n        return cloneElement(el, {\n          className: cn(revealVariants({ appear, speed }), el.props.className),\n          style: { animationDelay: `${index * staggerMs}ms`, ...el.props.style },\n        });\n      })}\n    </div>\n  );\n});\n"],"mappings":";;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AACP,SAAS,WAA8B;AA8CnC;AArCG,IAAM,iBAAiB,IAAI,6BAA6B;AAAA,EAC7D,UAAU;AAAA,IACR,QAAQ;AAAA;AAAA;AAAA,MAGN,MAAM;AAAA,MACN,IAAI;AAAA,MACJ,MAAM;AAAA,MACN,MAAM;AAAA,MACN,OAAO;AAAA,MACP,MAAM;AAAA,IACR;AAAA,IACA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,MAAM;AAAA,MACN,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB,EAAE,QAAQ,MAAM,OAAO,OAAO;AACjD,CAAC;AAaM,IAAM,SAAS,WAAwC,SAASA,QACrE,EAAE,WAAW,QAAQ,OAAO,SAAS,OAAO,GAAG,MAAM,GACrD,KACA;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,eAAe,EAAE,QAAQ,MAAM,CAAC,GAAG,SAAS;AAAA,MAC1D,OAAO,UAAU,EAAE,gBAAgB,GAAG,OAAO,MAAM,GAAG,MAAM,IAAI;AAAA,MAC/D,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAgBM,IAAM,cAAc,WAA6C,SAASC,aAC/E,EAAE,UAAU,WAAW,QAAQ,OAAO,YAAY,IAAI,GAAG,MAAM,GAC/D,KACA;AACA,SACE,oBAAC,SAAI,KAAU,WAAuB,GAAG,OACtC,mBAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACxC,QAAI,CAAC,eAAe,KAAK,EAAG,QAAO;AACnC,UAAM,KAAK;AACX,WAAO,aAAa,IAAI;AAAA,MACtB,WAAW,GAAG,eAAe,EAAE,QAAQ,MAAM,CAAC,GAAG,GAAG,MAAM,SAAS;AAAA,MACnE,OAAO,EAAE,gBAAgB,GAAG,QAAQ,SAAS,MAAM,GAAG,GAAG,MAAM,MAAM;AAAA,IACvE,CAAC;AAAA,EACH,CAAC,GACH;AAEJ,CAAC;","names":["Reveal","RevealGroup"]}

package/dist/chunk-A43B4IT7.js

@@ -0,0 +1,395 @@
+"use client";
+import {
+  Progress
+} from "./chunk-QNEOO22E.js";
+import {
+  useLocale
+} from "./chunk-EJQYE4MY.js";
+import {
+  Button
+} from "./chunk-VA2OONPE.js";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/file-upload/file-upload.tsx
+import {
+  createContext,
+  forwardRef,
+  use,
+  useCallback,
+  useId,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import { X, Upload, FileIcon, CheckCircle2, AlertCircle } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function fileMatchesAccept(file, accept) {
+  if (!accept) return true;
+  const patterns = accept.split(",").map((p) => p.trim().toLowerCase()).filter(Boolean);
+  if (patterns.length === 0) return true;
+  const name = file.name.toLowerCase();
+  const type = file.type.toLowerCase();
+  return patterns.some((pattern) => {
+    if (pattern.startsWith(".")) return name.endsWith(pattern);
+    if (pattern.endsWith("/*")) return type.startsWith(pattern.slice(0, -1));
+    return type === pattern;
+  });
+}
+function makeUploadFileId(file) {
+  return `${file.name}-${Date.now()}-${Math.random()}`;
+}
+function describeFileRejection(rejection) {
+  switch (rejection.reason) {
+    case "accept":
+      return `${rejection.file.name} is not an accepted file type.`;
+    case "maxSize":
+      return `${rejection.file.name} is too large.`;
+    case "maxFiles":
+      return `${rejection.file.name} was not added \u2014 the file limit was reached.`;
+    case "multiple":
+      return `${rejection.file.name} was not added \u2014 only one file is allowed.`;
+    default:
+      return `${rejection.file.name} was not added.`;
+  }
+}
+var FileUploadContext = createContext(null);
+function useFileUpload() {
+  const ctx = use(FileUploadContext);
+  if (!ctx) throw new Error("FileUpload subcomponents must be used inside <FileUpload>.");
+  return ctx;
+}
+var FileUpload = forwardRef(function FileUpload2({
+  files: filesProp,
+  onFilesChange,
+  onFilesRejected,
+  accept,
+  multiple = false,
+  maxSize,
+  maxFiles,
+  disabled = false,
+  className,
+  children,
+  ...props
+}, ref) {
+  const isControlled = filesProp !== void 0;
+  const [internalFiles, setInternalFiles] = useState([]);
+  const [isDragging, setIsDragging] = useState(false);
+  const inputRef = useRef(null);
+  const inputId = useId();
+  const files = useMemo(
+    () => isControlled ? filesProp ?? [] : internalFiles,
+    [isControlled, filesProp, internalFiles]
+  );
+  const commit = useCallback(
+    (next) => {
+      if (!isControlled) setInternalFiles(next);
+      onFilesChange?.(next);
+    },
+    [isControlled, onFilesChange]
+  );
+  const addFiles = useCallback(
+    (incoming) => {
+      const rejections = [];
+      let candidates = incoming;
+      if (!multiple && candidates.length > 1) {
+        rejections.push(
+          ...candidates.slice(1).map((file) => ({ file, reason: "multiple" }))
+        );
+        candidates = candidates.slice(0, 1);
+      }
+      const toAdd = [];
+      for (const f of candidates) {
+        if (!fileMatchesAccept(f, accept)) {
+          rejections.push({ file: f, reason: "accept" });
+          continue;
+        }
+        if (maxSize && f.size > maxSize) {
+          rejections.push({ file: f, reason: "maxSize" });
+          continue;
+        }
+        toAdd.push(f);
+      }
+      const next = [...files];
+      for (const f of toAdd) {
+        if (maxFiles && next.length >= maxFiles) {
+          rejections.push({ file: f, reason: "maxFiles" });
+          continue;
+        }
+        next.push({ id: makeUploadFileId(f), file: f });
+      }
+      commit(next);
+      if (rejections.length > 0) onFilesRejected?.(rejections);
+    },
+    [files, accept, multiple, maxSize, maxFiles, commit, onFilesRejected]
+  );
+  const removeFile = useCallback(
+    (id) => {
+      commit(files.filter((f) => f.id !== id));
+    },
+    [files, commit]
+  );
+  const openPicker = useCallback(() => {
+    inputRef.current?.click();
+  }, []);
+  const handleInputChange = useCallback(
+    (e) => {
+      if (e.target.files) {
+        addFiles(Array.from(e.target.files));
+        e.target.value = "";
+      }
+    },
+    [addFiles]
+  );
+  const ctx = useMemo(
+    () => ({
+      files,
+      addFiles,
+      removeFile,
+      isDragging,
+      openPicker,
+      accept,
+      multiple,
+      maxSize,
+      maxFiles,
+      disabled,
+      inputId
+    }),
+    [
+      files,
+      addFiles,
+      removeFile,
+      isDragging,
+      openPicker,
+      accept,
+      multiple,
+      maxSize,
+      maxFiles,
+      disabled,
+      inputId
+    ]
+  );
+  return /* @__PURE__ */ jsx(FileUploadContext, { value: ctx, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      "data-slot": "file-upload",
+      "data-disabled": disabled || void 0,
+      className: cn("flex flex-col gap-3", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: inputRef,
+            id: inputId,
+            type: "file",
+            accept,
+            multiple,
+            disabled,
+            "aria-hidden": "true",
+            tabIndex: -1,
+            className: "sr-only",
+            onChange: handleInputChange
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            onDragEnter: () => {
+              if (!disabled) setIsDragging(true);
+            },
+            onDragLeave: (e) => {
+              if (!e.currentTarget.contains(e.relatedTarget)) {
+                setIsDragging(false);
+              }
+            },
+            onDragOver: (e) => {
+              e.preventDefault();
+            },
+            onDrop: (e) => {
+              e.preventDefault();
+              setIsDragging(false);
+              if (!disabled && e.dataTransfer.files.length > 0) {
+                addFiles(Array.from(e.dataTransfer.files));
+              }
+            },
+            className: "contents",
+            children
+          }
+        )
+      ]
+    }
+  ) });
+});
+var FileUploadDropzone = forwardRef(
+  function FileUploadDropzone2({ className, children, browseLabel, onClick, onKeyDown, ...props }, ref) {
+    const { isDragging, disabled, openPicker } = useFileUpload();
+    const { t } = useLocale();
+    const resolvedBrowseLabel = browseLabel ?? t("ui.fileUpload.browseFiles");
+    const isSelfControl = children != null;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: isSelfControl ? "button" : void 0,
+        tabIndex: isSelfControl && !disabled ? 0 : void 0,
+        "aria-disabled": disabled || void 0,
+        onClick: (e) => {
+          onClick?.(e);
+          if (disabled || e.defaultPrevented) return;
+          openPicker();
+        },
+        onKeyDown: (e) => {
+          onKeyDown?.(e);
+          if (!isSelfControl || disabled || e.defaultPrevented) return;
+          if (e.target !== e.currentTarget) return;
+          if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            openPicker();
+          }
+        },
+        "data-slot": "file-upload-dropzone",
+        "data-dragging": isDragging || void 0,
+        "data-disabled": disabled || void 0,
+        className: cn(
+          "flex flex-col items-center justify-center gap-3 rounded-lg border-2 border-dashed border-border-strong bg-surface-muted px-6 py-10",
+          "cursor-pointer transition-colors duration-fast",
+          "hover:border-ring hover:bg-accent/50",
+          "data-[dragging]:border-primary data-[dragging]:bg-primary/5",
+          "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+          "focus-ring-within focus-within:ring-offset-2 focus-within:ring-offset-background",
+          className
+        ),
+        ...props,
+        children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-muted", children: /* @__PURE__ */ jsx(Upload, { className: "size-5 text-muted-foreground", "aria-hidden": "true" }) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1 text-center", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-body font-medium text-foreground", children: t("ui.fileUpload.dragDropHere") }),
+            /* @__PURE__ */ jsxs("p", { className: "text-meta text-muted-foreground", children: [
+              "or",
+              " ",
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  disabled,
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    openPicker();
+                  },
+                  className: cn(
+                    // #399 — inline text trigger inside a sentence → `-text` rung.
+                    "text-primary-text underline-offset-2 hover:underline focus-ring rounded-sm",
+                    // #322 — the dropzone's `focus-ring-within` (above) is the
+                    // one compound indicator for this composite control; this
+                    // button delegates rather than painting a second one.
+                    "focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0",
+                    "disabled:pointer-events-none disabled:opacity-50"
+                  ),
+                  children: resolvedBrowseLabel
+                }
+              )
+            ] })
+          ] })
+        ] })
+      }
+    );
+  }
+);
+var FileUploadList = forwardRef(
+  function FileUploadList2({ className, children, ...props }, ref) {
+    const { files } = useFileUpload();
+    const { t } = useLocale();
+    if (files.length === 0 && !children) return null;
+    return (
+      // `aria-live="polite"` alone is enough to announce additions/removals —
+      // it does NOT require `role="status"`. Adding that role here used to
+      // override the `<ul>`'s implicit `list` role, which strips the
+      // `listitem` role from every `<FileUploadItem>` (`<li>`) inside it and
+      // fails axe's `listitem` rule the moment the list is non-empty.
+      /* @__PURE__ */ jsx(
+        "ul",
+        {
+          ref,
+          "aria-live": "polite",
+          "aria-label": t("ui.fileUpload.selectedFiles"),
+          "data-slot": "file-upload-list",
+          className: cn("flex flex-col gap-2", className),
+          ...props,
+          children
+        }
+      )
+    );
+  }
+);
+var statusIcon = {
+  pending: /* @__PURE__ */ jsx(FileIcon, { className: "size-4 text-muted-foreground", "aria-hidden": "true" }),
+  uploading: /* @__PURE__ */ jsx(FileIcon, { className: "size-4 text-primary", "aria-hidden": "true" }),
+  success: /* @__PURE__ */ jsx(CheckCircle2, { className: "size-4 text-success", "aria-hidden": "true" }),
+  error: /* @__PURE__ */ jsx(AlertCircle, { className: "size-4 text-destructive", "aria-hidden": "true" })
+};
+var FileUploadItem = forwardRef(
+  function FileUploadItem2({ uploadFile, progress, status = "pending", errorMessage, className, ...props }, ref) {
+    const { removeFile, disabled } = useFileUpload();
+    const resolvedProgress = progress ?? uploadFile.progress;
+    const resolvedStatus = status ?? uploadFile.status ?? "pending";
+    const resolvedError = errorMessage ?? uploadFile.errorMessage;
+    const isUploading = resolvedStatus === "uploading";
+    const isError = resolvedStatus === "error";
+    return /* @__PURE__ */ jsxs(
+      "li",
+      {
+        ref,
+        "data-slot": "file-upload-item",
+        "data-status": resolvedStatus,
+        className: cn(
+          "flex flex-col gap-1 rounded-md border border-border bg-card px-3 py-2",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            statusIcon[resolvedStatus],
+            /* @__PURE__ */ jsx("span", { className: "flex-1 min-w-0 truncate text-body text-foreground", children: uploadFile.file.name }),
+            /* @__PURE__ */ jsx("span", { className: "shrink-0 text-meta tabular-nums text-muted-foreground", children: formatFileSize(uploadFile.file.size) }),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                variant: "ghost",
+                size: "icon-sm",
+                "aria-label": `Remove ${uploadFile.file.name}`,
+                disabled,
+                onClick: () => removeFile(uploadFile.id),
+                className: "shrink-0",
+                children: /* @__PURE__ */ jsx(X, { className: "size-4", "aria-hidden": "true" })
+              }
+            )
+          ] }),
+          isUploading && resolvedProgress !== void 0 && /* @__PURE__ */ jsx(Progress, { value: resolvedProgress, className: "h-1" }),
+          isError && resolvedError && // #124: this is running text (the rejection reason), so it takes the
+          // >=4.5:1 ink rung `text-destructive-text` — not the 3:1 mark rung the
+          // `statusIcon.error` glyph above correctly keeps.
+          /* @__PURE__ */ jsx("p", { role: "alert", className: "text-meta text-destructive-text", children: resolvedError })
+        ]
+      }
+    );
+  }
+);
+function formatFileSize(bytes) {
+  if (bytes < 1024) return `${bytes}\xA0B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)}\xA0KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)}\xA0MB`;
+}
+
+export {
+  describeFileRejection,
+  useFileUpload,
+  FileUpload,
+  FileUploadDropzone,
+  FileUploadList,
+  FileUploadItem
+};
+//# sourceMappingURL=chunk-A43B4IT7.js.map

package/dist/chunk-A43B4IT7.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/file-upload/file-upload.tsx"],"sourcesContent":["\"use client\";\n// a2ui.exposed: no\n\nimport {\n  createContext,\n  forwardRef,\n  use,\n  useCallback,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type DragEvent,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport { X, Upload, FileIcon, CheckCircle2, AlertCircle } from \"lucide-react\";\nimport { cn } from \"../../lib/cn\";\nimport { Button } from \"../button\";\nimport { useLocale } from \"../locale-provider\";\nimport { Progress } from \"../progress\";\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\nexport type FileUploadStatus = \"pending\" | \"uploading\" | \"success\" | \"error\";\n\nexport interface UploadFile {\n  /** Unique identifier for this file in the list. */\n  id: string;\n  /** The underlying File object. */\n  file: File;\n  /** Upload progress 0–100. */\n  progress?: number;\n  /** Upload lifecycle status. */\n  status?: FileUploadStatus;\n  /** Error message shown when status is \"error\". */\n  errorMessage?: string;\n}\n\n/** Why `addFiles` (picker OR drag-and-drop) declined a file. */\nexport type FileRejectionReason = \"accept\" | \"maxSize\" | \"maxFiles\" | \"multiple\";\n\nexport interface FileRejection {\n  file: File;\n  reason: FileRejectionReason;\n}\n\n/**\n * Match a file against an `<input accept>`-style pattern list (comma-separated\n * extensions like `.png`, exact MIME types like `image/png`, or wildcards like\n * `image/*`). Drag-and-drop delivers files straight from `DataTransfer` — the\n * browser only enforces `accept` for the native picker dialog, never for a\n * drop — so this has to be re-applied by hand for the drop path to actually\n * \"respect `accept`\".\n */\nfunction fileMatchesAccept(file: File, accept: string | undefined): boolean {\n  if (!accept) return true;\n  const patterns = accept\n    .split(\",\")\n    .map((p) => p.trim().toLowerCase())\n    .filter(Boolean);\n  if (patterns.length === 0) return true;\n  const name = file.name.toLowerCase();\n  const type = file.type.toLowerCase();\n  return patterns.some((pattern) => {\n    if (pattern.startsWith(\".\")) return name.endsWith(pattern);\n    if (pattern.endsWith(\"/*\")) return type.startsWith(pattern.slice(0, -1));\n    return type === pattern;\n  });\n}\n\nfunction makeUploadFileId(file: File): string {\n  return `${file.name}-${Date.now()}-${Math.random()}`;\n}\n\n// ---------------------------------------------------------------------------\n// Context\n// ---------------------------------------------------------------------------\n\ninterface FileUploadContextValue {\n  files: UploadFile[];\n  addFiles: (incoming: File[]) => void;\n  removeFile: (id: string) => void;\n  isDragging: boolean;\n  /** Programmatically open the native file picker. */\n  openPicker: () => void;\n  accept?: string;\n  multiple?: boolean;\n  maxSize?: number;\n  maxFiles?: number;\n  disabled?: boolean;\n  inputId: string;\n}\n\n/** Read `accept`/`multiple`/`maxSize`/`maxFiles` off a rejection for a default message. */\nexport function describeFileRejection(rejection: FileRejection): string {\n  switch (rejection.reason) {\n    case \"accept\":\n      return `${rejection.file.name} is not an accepted file type.`;\n    case \"maxSize\":\n      return `${rejection.file.name} is too large.`;\n    case \"maxFiles\":\n      return `${rejection.file.name} was not added — the file limit was reached.`;\n    case \"multiple\":\n      return `${rejection.file.name} was not added — only one file is allowed.`;\n    default:\n      return `${rejection.file.name} was not added.`;\n  }\n}\n\nconst FileUploadContext = createContext<FileUploadContextValue | null>(null);\n\nfunction useFileUpload(): FileUploadContextValue {\n  const ctx = use(FileUploadContext);\n  if (!ctx) throw new Error(\"FileUpload subcomponents must be used inside <FileUpload>.\");\n  return ctx;\n}\n\n// ---------------------------------------------------------------------------\n// Provider (FileUpload root)\n// ---------------------------------------------------------------------------\n\nexport interface FileUploadProps extends HTMLAttributes<HTMLDivElement> {\n  /** Controlled file list. */\n  files?: UploadFile[];\n  /** Called when files are added or removed. */\n  onFilesChange?: (files: UploadFile[]) => void;\n  /**\n   * Called with the files a picker selection OR a drag-and-drop declined —\n   * wrong type (`accept`), over `maxSize`, over `maxFiles`, or extra files\n   * dropped when `multiple` is false — each with its {@link FileRejectionReason}.\n   */\n  onFilesRejected?: (rejections: FileRejection[]) => void;\n  /** Accepted MIME types / extensions (forwarded to <input accept>). */\n  accept?: string;\n  /** Allow multiple files at once. */\n  multiple?: boolean;\n  /** Maximum individual file size in bytes. */\n  maxSize?: number;\n  /** Maximum number of files in the list at once. */\n  maxFiles?: number;\n  /** Disable all interactions. */\n  disabled?: boolean;\n  children?: ReactNode;\n}\n\n/**\n * FileUpload — compound-component root (Provider).\n *\n * Holds the selected-file list + drag state and exposes\n * `{ files, addFiles, removeFile, isDragging }` via context.\n * **Presentational** — the app drives per-item `progress` + `status` on\n * `<FileUploadItem>`. No upload/network logic lives here.\n *\n * Controlled via `files`/`onFilesChange`; uncontrolled by default.\n */\nexport const FileUpload = forwardRef<HTMLDivElement, FileUploadProps>(function FileUpload(\n  {\n    files: filesProp,\n    onFilesChange,\n    onFilesRejected,\n    accept,\n    multiple = false,\n    maxSize,\n    maxFiles,\n    disabled = false,\n    className,\n    children,\n    ...props\n  },\n  ref,\n) {\n  const isControlled = filesProp !== undefined;\n  const [internalFiles, setInternalFiles] = useState<UploadFile[]>([]);\n  const [isDragging, setIsDragging] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const inputId = useId();\n\n  const files = useMemo(\n    () => (isControlled ? (filesProp ?? []) : internalFiles),\n    [isControlled, filesProp, internalFiles],\n  );\n\n  const commit = useCallback(\n    (next: UploadFile[]) => {\n      if (!isControlled) setInternalFiles(next);\n      onFilesChange?.(next);\n    },\n    [isControlled, onFilesChange],\n  );\n\n  const addFiles = useCallback(\n    (incoming: File[]) => {\n      const rejections: FileRejection[] = [];\n\n      // A drop can deliver more files than the native picker ever would —\n      // `multiple` is only enforced by the browser for the `<input>` dialog,\n      // never for `DataTransfer`, so re-apply it here for the drop path too.\n      let candidates = incoming;\n      if (!multiple && candidates.length > 1) {\n        rejections.push(\n          ...candidates.slice(1).map((file) => ({ file, reason: \"multiple\" as const })),\n        );\n        candidates = candidates.slice(0, 1);\n      }\n\n      const toAdd: File[] = [];\n      for (const f of candidates) {\n        if (!fileMatchesAccept(f, accept)) {\n          rejections.push({ file: f, reason: \"accept\" });\n          continue;\n        }\n        if (maxSize && f.size > maxSize) {\n          rejections.push({ file: f, reason: \"maxSize\" });\n          continue;\n        }\n        toAdd.push(f);\n      }\n\n      const next = [...files];\n      for (const f of toAdd) {\n        if (maxFiles && next.length >= maxFiles) {\n          rejections.push({ file: f, reason: \"maxFiles\" });\n          continue;\n        }\n        next.push({ id: makeUploadFileId(f), file: f });\n      }\n\n      commit(next);\n      if (rejections.length > 0) onFilesRejected?.(rejections);\n    },\n    [files, accept, multiple, maxSize, maxFiles, commit, onFilesRejected],\n  );\n\n  const removeFile = useCallback(\n    (id: string) => {\n      commit(files.filter((f) => f.id !== id));\n    },\n    [files, commit],\n  );\n\n  const openPicker = useCallback(() => {\n    inputRef.current?.click();\n  }, []);\n\n  const handleInputChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      if (e.target.files) {\n        addFiles(Array.from(e.target.files));\n        // Reset so the same file can be re-selected\n        e.target.value = \"\";\n      }\n    },\n    [addFiles],\n  );\n\n  const ctx = useMemo<FileUploadContextValue>(\n    () => ({\n      files,\n      addFiles,\n      removeFile,\n      isDragging,\n      openPicker,\n      accept,\n      multiple,\n      maxSize,\n      maxFiles,\n      disabled,\n      inputId,\n    }),\n    [\n      files,\n      addFiles,\n      removeFile,\n      isDragging,\n      openPicker,\n      accept,\n      multiple,\n      maxSize,\n      maxFiles,\n      disabled,\n      inputId,\n    ],\n  );\n\n  return (\n    <FileUploadContext value={ctx}>\n      <div\n        ref={ref}\n        data-slot=\"file-upload\"\n        data-disabled={disabled || undefined}\n        className={cn(\"flex flex-col gap-3\", className)}\n        {...props}\n      >\n        {/* Visually hidden real file input — always present for keyboard users */}\n        <input\n          ref={inputRef}\n          id={inputId}\n          type=\"file\"\n          accept={accept}\n          multiple={multiple}\n          disabled={disabled}\n          aria-hidden=\"true\"\n          tabIndex={-1}\n          className=\"sr-only\"\n          onChange={handleInputChange}\n        />\n        {/* Drag state setter lives here so any child drag interaction is captured */}\n        <div\n          onDragEnter={() => {\n            if (!disabled) setIsDragging(true);\n          }}\n          onDragLeave={(e) => {\n            // Only clear dragging when leaving the root container\n            if (!e.currentTarget.contains(e.relatedTarget as Node | null)) {\n              setIsDragging(false);\n            }\n          }}\n          onDragOver={(e: DragEvent) => {\n            e.preventDefault();\n          }}\n          onDrop={(e: DragEvent) => {\n            e.preventDefault();\n            setIsDragging(false);\n            if (!disabled && e.dataTransfer.files.length > 0) {\n              addFiles(Array.from(e.dataTransfer.files));\n            }\n          }}\n          className=\"contents\"\n        >\n          {children}\n        </div>\n      </div>\n    </FileUploadContext>\n  );\n});\n\n// ---------------------------------------------------------------------------\n// FileUploadDropzone\n// ---------------------------------------------------------------------------\n\nexport interface FileUploadDropzoneProps extends HTMLAttributes<HTMLDivElement> {\n  /** Label for the default \"Browse files\" button. */\n  browseLabel?: string;\n}\n\n/**\n * FileUploadDropzone — the drag-and-drop target.\n *\n * A plain `<div>` drop surface with exactly ONE keyboard-reachable control:\n *\n * - Default content: a real `<button>` (\"Browse files\") is the tab stop; the\n *   zone itself carries no role and no tab stop, so nothing interactive is\n *   nested inside another interactive element.\n * - Custom `children`: there is no inner button, so the zone itself becomes\n *   the control (`role=\"button\"`, a tab stop, Enter/Space). Custom children\n *   must then be non-interactive content.\n *\n * A pointer click anywhere on the zone also opens the picker — a mouse\n * convenience on top of the keyboard path above, never the only path.\n */\nexport const FileUploadDropzone = forwardRef<HTMLDivElement, FileUploadDropzoneProps>(\n  function FileUploadDropzone(\n    { className, children, browseLabel, onClick, onKeyDown, ...props },\n    ref,\n  ) {\n    const { isDragging, disabled, openPicker } = useFileUpload();\n    const { t } = useLocale();\n    const resolvedBrowseLabel = browseLabel ?? t(\"ui.fileUpload.browseFiles\");\n    // With custom children there is no inner button, so the zone owns the\n    // one keyboard path itself.\n    const isSelfControl = children != null;\n\n    return (\n      <div\n        ref={ref}\n        role={isSelfControl ? \"button\" : undefined}\n        tabIndex={isSelfControl && !disabled ? 0 : undefined}\n        // Also on the default (role-less) zone: it marks the dimmed copy as\n        // inactive UI, which WCAG 1.4.3 exempts from contrast — the same\n        // exemption a `<label>` of a disabled control gets.\n        aria-disabled={disabled || undefined}\n        onClick={(e) => {\n          onClick?.(e);\n          if (disabled || e.defaultPrevented) return;\n          openPicker();\n        }}\n        onKeyDown={(e) => {\n          onKeyDown?.(e);\n          if (!isSelfControl || disabled || e.defaultPrevented) return;\n          if (e.target !== e.currentTarget) return;\n          if (e.key === \"Enter\" || e.key === \" \") {\n            e.preventDefault();\n            openPicker();\n          }\n        }}\n        data-slot=\"file-upload-dropzone\"\n        data-dragging={isDragging || undefined}\n        data-disabled={disabled || undefined}\n        className={cn(\n          \"flex flex-col items-center justify-center gap-3 rounded-lg border-2 border-dashed border-border-strong bg-surface-muted px-6 py-10\",\n          \"cursor-pointer transition-colors duration-fast\",\n          \"hover:border-ring hover:bg-accent/50\",\n          \"data-[dragging]:border-primary data-[dragging]:bg-primary/5\",\n          \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n          \"focus-ring-within focus-within:ring-offset-2 focus-within:ring-offset-background\",\n          className,\n        )}\n        {...props}\n      >\n        {children ?? (\n          <>\n            <div className=\"flex h-12 w-12 items-center justify-center rounded-full bg-muted\">\n              <Upload className=\"size-5 text-muted-foreground\" aria-hidden=\"true\" />\n            </div>\n            <div className=\"flex flex-col items-center gap-1 text-center\">\n              <p className=\"text-body font-medium text-foreground\">\n                {t(\"ui.fileUpload.dragDropHere\")}\n              </p>\n              <p className=\"text-meta text-muted-foreground\">\n                or{\" \"}\n                <button\n                  type=\"button\"\n                  disabled={disabled}\n                  onClick={(e) => {\n                    // The zone's own click handler opens the picker; stop the\n                    // bubble so one activation opens it exactly once.\n                    e.stopPropagation();\n                    openPicker();\n                  }}\n                  className={cn(\n                    // #399 — inline text trigger inside a sentence → `-text` rung.\n                    \"text-primary-text underline-offset-2 hover:underline focus-ring rounded-sm\",\n                    // #322 — the dropzone's `focus-ring-within` (above) is the\n                    // one compound indicator for this composite control; this\n                    // button delegates rather than painting a second one.\n                    \"focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0\",\n                    \"disabled:pointer-events-none disabled:opacity-50\",\n                  )}\n                >\n                  {resolvedBrowseLabel}\n                </button>\n              </p>\n            </div>\n          </>\n        )}\n      </div>\n    );\n  },\n);\n\n// ---------------------------------------------------------------------------\n// FileUploadList\n// ---------------------------------------------------------------------------\n\nexport type FileUploadListProps = HTMLAttributes<HTMLUListElement>;\n\n/**\n * FileUploadList — the `role=\"status\"` region that lists accepted files.\n * Reads from context; children are `<FileUploadItem>` elements.\n */\nexport const FileUploadList = forwardRef<HTMLUListElement, FileUploadListProps>(\n  function FileUploadList({ className, children, ...props }, ref) {\n    const { files } = useFileUpload();\n    const { t } = useLocale();\n    if (files.length === 0 && !children) return null;\n\n    return (\n      // `aria-live=\"polite\"` alone is enough to announce additions/removals —\n      // it does NOT require `role=\"status\"`. Adding that role here used to\n      // override the `<ul>`'s implicit `list` role, which strips the\n      // `listitem` role from every `<FileUploadItem>` (`<li>`) inside it and\n      // fails axe's `listitem` rule the moment the list is non-empty.\n      <ul\n        ref={ref}\n        aria-live=\"polite\"\n        aria-label={t(\"ui.fileUpload.selectedFiles\")}\n        data-slot=\"file-upload-list\"\n        className={cn(\"flex flex-col gap-2\", className)}\n        {...props}\n      >\n        {children}\n      </ul>\n    );\n  },\n);\n\n// ---------------------------------------------------------------------------\n// FileUploadItem\n// ---------------------------------------------------------------------------\n\nexport interface FileUploadItemProps extends HTMLAttributes<HTMLLIElement> {\n  /** The UploadFile entry to display. */\n  uploadFile: UploadFile;\n  /** Upload progress 0–100. Shown only during \"uploading\" status. */\n  progress?: number;\n  /** Current status of the upload. */\n  status?: FileUploadStatus;\n  /** Error message (displayed when status=\"error\"). */\n  errorMessage?: string;\n}\n\nconst statusIcon: Record<FileUploadStatus, ReactNode> = {\n  pending: <FileIcon className=\"size-4 text-muted-foreground\" aria-hidden=\"true\" />,\n  uploading: <FileIcon className=\"size-4 text-primary\" aria-hidden=\"true\" />,\n  success: <CheckCircle2 className=\"size-4 text-success\" aria-hidden=\"true\" />,\n  error: <AlertCircle className=\"size-4 text-destructive\" aria-hidden=\"true\" />,\n};\n\n/**\n * FileUploadItem — a single row in the file list.\n *\n * The app controls `progress` and `status` to drive the upload lifecycle.\n * Per-file errors use `role=\"alert\"`.\n */\nexport const FileUploadItem = forwardRef<HTMLLIElement, FileUploadItemProps>(\n  function FileUploadItem(\n    { uploadFile, progress, status = \"pending\", errorMessage, className, ...props },\n    ref,\n  ) {\n    const { removeFile, disabled } = useFileUpload();\n    const resolvedProgress = progress ?? uploadFile.progress;\n    const resolvedStatus = status ?? uploadFile.status ?? \"pending\";\n    const resolvedError = errorMessage ?? uploadFile.errorMessage;\n\n    const isUploading = resolvedStatus === \"uploading\";\n    const isError = resolvedStatus === \"error\";\n\n    return (\n      <li\n        ref={ref}\n        data-slot=\"file-upload-item\"\n        data-status={resolvedStatus}\n        className={cn(\n          \"flex flex-col gap-1 rounded-md border border-border bg-card px-3 py-2\",\n          className,\n        )}\n        {...props}\n      >\n        <div className=\"flex items-center gap-2\">\n          {statusIcon[resolvedStatus]}\n          <span className=\"flex-1 min-w-0 truncate text-body text-foreground\">\n            {uploadFile.file.name}\n          </span>\n          <span className=\"shrink-0 text-meta tabular-nums text-muted-foreground\">\n            {formatFileSize(uploadFile.file.size)}\n          </span>\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"icon-sm\"\n            aria-label={`Remove ${uploadFile.file.name}`}\n            disabled={disabled}\n            onClick={() => removeFile(uploadFile.id)}\n            className=\"shrink-0\"\n          >\n            <X className=\"size-4\" aria-hidden=\"true\" />\n          </Button>\n        </div>\n        {isUploading && resolvedProgress !== undefined && (\n          <Progress value={resolvedProgress} className=\"h-1\" />\n        )}\n        {isError && resolvedError && (\n          // #124: this is running text (the rejection reason), so it takes the\n          // >=4.5:1 ink rung `text-destructive-text` — not the 3:1 mark rung the\n          // `statusIcon.error` glyph above correctly keeps.\n          <p role=\"alert\" className=\"text-meta text-destructive-text\">\n            {resolvedError}\n          </p>\n        )}\n      </li>\n    );\n  },\n);\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nfunction formatFileSize(bytes: number): string {\n  if (bytes < 1024) return `${bytes}\\u00A0B`;\n  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)}\\u00A0KB`;\n  return `${(bytes / (1024 * 1024)).toFixed(1)}\\u00A0MB`;\n}\n\n// ---------------------------------------------------------------------------\n// useFileUpload export (for advanced consumers outside a subpart)\n// ---------------------------------------------------------------------------\nexport { useFileUpload };\n"],"mappings":";;;;;;;;;;;;;;;AAGA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAKK;AACP,SAAS,GAAG,QAAQ,UAAU,cAAc,mBAAmB;AAiRzD,SA4HI,UApHF,KARF;AAxON,SAAS,kBAAkB,MAAY,QAAqC;AAC1E,MAAI,CAAC,OAAQ,QAAO;AACpB,QAAM,WAAW,OACd,MAAM,GAAG,EACT,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,YAAY,CAAC,EACjC,OAAO,OAAO;AACjB,MAAI,SAAS,WAAW,EAAG,QAAO;AAClC,QAAM,OAAO,KAAK,KAAK,YAAY;AACnC,QAAM,OAAO,KAAK,KAAK,YAAY;AACnC,SAAO,SAAS,KAAK,CAAC,YAAY;AAChC,QAAI,QAAQ,WAAW,GAAG,EAAG,QAAO,KAAK,SAAS,OAAO;AACzD,QAAI,QAAQ,SAAS,IAAI,EAAG,QAAO,KAAK,WAAW,QAAQ,MAAM,GAAG,EAAE,CAAC;AACvE,WAAO,SAAS;AAAA,EAClB,CAAC;AACH;AAEA,SAAS,iBAAiB,MAAoB;AAC5C,SAAO,GAAG,KAAK,IAAI,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC;AACpD;AAsBO,SAAS,sBAAsB,WAAkC;AACtE,UAAQ,UAAU,QAAQ;AAAA,IACxB,KAAK;AACH,aAAO,GAAG,UAAU,KAAK,IAAI;AAAA,IAC/B,KAAK;AACH,aAAO,GAAG,UAAU,KAAK,IAAI;AAAA,IAC/B,KAAK;AACH,aAAO,GAAG,UAAU,KAAK,IAAI;AAAA,IAC/B,KAAK;AACH,aAAO,GAAG,UAAU,KAAK,IAAI;AAAA,IAC/B;AACE,aAAO,GAAG,UAAU,KAAK,IAAI;AAAA,EACjC;AACF;AAEA,IAAM,oBAAoB,cAA6C,IAAI;AAE3E,SAAS,gBAAwC;AAC/C,QAAM,MAAM,IAAI,iBAAiB;AACjC,MAAI,CAAC,IAAK,OAAM,IAAI,MAAM,4DAA4D;AACtF,SAAO;AACT;AAwCO,IAAM,aAAa,WAA4C,SAASA,YAC7E;AAAA,EACE,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,KACA;AACA,QAAM,eAAe,cAAc;AACnC,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAuB,CAAC,CAAC;AACnE,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,UAAU,MAAM;AAEtB,QAAM,QAAQ;AAAA,IACZ,MAAO,eAAgB,aAAa,CAAC,IAAK;AAAA,IAC1C,CAAC,cAAc,WAAW,aAAa;AAAA,EACzC;AAEA,QAAM,SAAS;AAAA,IACb,CAAC,SAAuB;AACtB,UAAI,CAAC,aAAc,kBAAiB,IAAI;AACxC,sBAAgB,IAAI;AAAA,IACtB;AAAA,IACA,CAAC,cAAc,aAAa;AAAA,EAC9B;AAEA,QAAM,WAAW;AAAA,IACf,CAAC,aAAqB;AACpB,YAAM,aAA8B,CAAC;AAKrC,UAAI,aAAa;AACjB,UAAI,CAAC,YAAY,WAAW,SAAS,GAAG;AACtC,mBAAW;AAAA,UACT,GAAG,WAAW,MAAM,CAAC,EAAE,IAAI,CAAC,UAAU,EAAE,MAAM,QAAQ,WAAoB,EAAE;AAAA,QAC9E;AACA,qBAAa,WAAW,MAAM,GAAG,CAAC;AAAA,MACpC;AAEA,YAAM,QAAgB,CAAC;AACvB,iBAAW,KAAK,YAAY;AAC1B,YAAI,CAAC,kBAAkB,GAAG,MAAM,GAAG;AACjC,qBAAW,KAAK,EAAE,MAAM,GAAG,QAAQ,SAAS,CAAC;AAC7C;AAAA,QACF;AACA,YAAI,WAAW,EAAE,OAAO,SAAS;AAC/B,qBAAW,KAAK,EAAE,MAAM,GAAG,QAAQ,UAAU,CAAC;AAC9C;AAAA,QACF;AACA,cAAM,KAAK,CAAC;AAAA,MACd;AAEA,YAAM,OAAO,CAAC,GAAG,KAAK;AACtB,iBAAW,KAAK,OAAO;AACrB,YAAI,YAAY,KAAK,UAAU,UAAU;AACvC,qBAAW,KAAK,EAAE,MAAM,GAAG,QAAQ,WAAW,CAAC;AAC/C;AAAA,QACF;AACA,aAAK,KAAK,EAAE,IAAI,iBAAiB,CAAC,GAAG,MAAM,EAAE,CAAC;AAAA,MAChD;AAEA,aAAO,IAAI;AACX,UAAI,WAAW,SAAS,EAAG,mBAAkB,UAAU;AAAA,IACzD;AAAA,IACA,CAAC,OAAO,QAAQ,UAAU,SAAS,UAAU,QAAQ,eAAe;AAAA,EACtE;AAEA,QAAM,aAAa;AAAA,IACjB,CAAC,OAAe;AACd,aAAO,MAAM,OAAO,CAAC,MAAM,EAAE,OAAO,EAAE,CAAC;AAAA,IACzC;AAAA,IACA,CAAC,OAAO,MAAM;AAAA,EAChB;AAEA,QAAM,aAAa,YAAY,MAAM;AACnC,aAAS,SAAS,MAAM;AAAA,EAC1B,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAoB;AAAA,IACxB,CAAC,MAAqC;AACpC,UAAI,EAAE,OAAO,OAAO;AAClB,iBAAS,MAAM,KAAK,EAAE,OAAO,KAAK,CAAC;AAEnC,UAAE,OAAO,QAAQ;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,MAAM;AAAA,IACV,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SACE,oBAAC,qBAAkB,OAAO,KACxB;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,iBAAe,YAAY;AAAA,MAC3B,WAAW,GAAG,uBAAuB,SAAS;AAAA,MAC7C,GAAG;AAAA,MAGJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,IAAI;AAAA,YACJ,MAAK;AAAA,YACL;AAAA,YACA;AAAA,YACA;AAAA,YACA,eAAY;AAAA,YACZ,UAAU;AAAA,YACV,WAAU;AAAA,YACV,UAAU;AAAA;AAAA,QACZ;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC,aAAa,MAAM;AACjB,kBAAI,CAAC,SAAU,eAAc,IAAI;AAAA,YACnC;AAAA,YACA,aAAa,CAAC,MAAM;AAElB,kBAAI,CAAC,EAAE,cAAc,SAAS,EAAE,aAA4B,GAAG;AAC7D,8BAAc,KAAK;AAAA,cACrB;AAAA,YACF;AAAA,YACA,YAAY,CAAC,MAAiB;AAC5B,gBAAE,eAAe;AAAA,YACnB;AAAA,YACA,QAAQ,CAAC,MAAiB;AACxB,gBAAE,eAAe;AACjB,4BAAc,KAAK;AACnB,kBAAI,CAAC,YAAY,EAAE,aAAa,MAAM,SAAS,GAAG;AAChD,yBAAS,MAAM,KAAK,EAAE,aAAa,KAAK,CAAC;AAAA,cAC3C;AAAA,YACF;AAAA,YACA,WAAU;AAAA,YAET;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF,GACF;AAEJ,CAAC;AA0BM,IAAM,qBAAqB;AAAA,EAChC,SAASC,oBACP,EAAE,WAAW,UAAU,aAAa,SAAS,WAAW,GAAG,MAAM,GACjE,KACA;AACA,UAAM,EAAE,YAAY,UAAU,WAAW,IAAI,cAAc;AAC3D,UAAM,EAAE,EAAE,IAAI,UAAU;AACxB,UAAM,sBAAsB,eAAe,EAAE,2BAA2B;AAGxE,UAAM,gBAAgB,YAAY;AAElC,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAM,gBAAgB,WAAW;AAAA,QACjC,UAAU,iBAAiB,CAAC,WAAW,IAAI;AAAA,QAI3C,iBAAe,YAAY;AAAA,QAC3B,SAAS,CAAC,MAAM;AACd,oBAAU,CAAC;AACX,cAAI,YAAY,EAAE,iBAAkB;AACpC,qBAAW;AAAA,QACb;AAAA,QACA,WAAW,CAAC,MAAM;AAChB,sBAAY,CAAC;AACb,cAAI,CAAC,iBAAiB,YAAY,EAAE,iBAAkB;AACtD,cAAI,EAAE,WAAW,EAAE,cAAe;AAClC,cAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,cAAE,eAAe;AACjB,uBAAW;AAAA,UACb;AAAA,QACF;AAAA,QACA,aAAU;AAAA,QACV,iBAAe,cAAc;AAAA,QAC7B,iBAAe,YAAY;AAAA,QAC3B,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEH,sBACC,iCACE;AAAA,8BAAC,SAAI,WAAU,oEACb,8BAAC,UAAO,WAAU,gCAA+B,eAAY,QAAO,GACtE;AAAA,UACA,qBAAC,SAAI,WAAU,gDACb;AAAA,gCAAC,OAAE,WAAU,yCACV,YAAE,4BAA4B,GACjC;AAAA,YACA,qBAAC,OAAE,WAAU,mCAAkC;AAAA;AAAA,cAC1C;AAAA,cACH;AAAA,gBAAC;AAAA;AAAA,kBACC,MAAK;AAAA,kBACL;AAAA,kBACA,SAAS,CAAC,MAAM;AAGd,sBAAE,gBAAgB;AAClB,+BAAW;AAAA,kBACb;AAAA,kBACA,WAAW;AAAA;AAAA,oBAET;AAAA;AAAA;AAAA;AAAA,oBAIA;AAAA,oBACA;AAAA,kBACF;AAAA,kBAEC;AAAA;AAAA,cACH;AAAA,eACF;AAAA,aACF;AAAA,WACF;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAYO,IAAM,iBAAiB;AAAA,EAC5B,SAASC,gBAAe,EAAE,WAAW,UAAU,GAAG,MAAM,GAAG,KAAK;AAC9D,UAAM,EAAE,MAAM,IAAI,cAAc;AAChC,UAAM,EAAE,EAAE,IAAI,UAAU;AACxB,QAAI,MAAM,WAAW,KAAK,CAAC,SAAU,QAAO;AAE5C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAME;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,aAAU;AAAA,UACV,cAAY,EAAE,6BAA6B;AAAA,UAC3C,aAAU;AAAA,UACV,WAAW,GAAG,uBAAuB,SAAS;AAAA,UAC7C,GAAG;AAAA,UAEH;AAAA;AAAA,MACH;AAAA;AAAA,EAEJ;AACF;AAiBA,IAAM,aAAkD;AAAA,EACtD,SAAS,oBAAC,YAAS,WAAU,gCAA+B,eAAY,QAAO;AAAA,EAC/E,WAAW,oBAAC,YAAS,WAAU,uBAAsB,eAAY,QAAO;AAAA,EACxE,SAAS,oBAAC,gBAAa,WAAU,uBAAsB,eAAY,QAAO;AAAA,EAC1E,OAAO,oBAAC,eAAY,WAAU,2BAA0B,eAAY,QAAO;AAC7E;AAQO,IAAM,iBAAiB;AAAA,EAC5B,SAASC,gBACP,EAAE,YAAY,UAAU,SAAS,WAAW,cAAc,WAAW,GAAG,MAAM,GAC9E,KACA;AACA,UAAM,EAAE,YAAY,SAAS,IAAI,cAAc;AAC/C,UAAM,mBAAmB,YAAY,WAAW;AAChD,UAAM,iBAAiB,UAAU,WAAW,UAAU;AACtD,UAAM,gBAAgB,gBAAgB,WAAW;AAEjD,UAAM,cAAc,mBAAmB;AACvC,UAAM,UAAU,mBAAmB;AAEnC,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,aAAU;AAAA,QACV,eAAa;AAAA,QACb,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEJ;AAAA,+BAAC,SAAI,WAAU,2BACZ;AAAA,uBAAW,cAAc;AAAA,YAC1B,oBAAC,UAAK,WAAU,qDACb,qBAAW,KAAK,MACnB;AAAA,YACA,oBAAC,UAAK,WAAU,yDACb,yBAAe,WAAW,KAAK,IAAI,GACtC;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,MAAK;AAAA,gBACL,cAAY,UAAU,WAAW,KAAK,IAAI;AAAA,gBAC1C;AAAA,gBACA,SAAS,MAAM,WAAW,WAAW,EAAE;AAAA,gBACvC,WAAU;AAAA,gBAEV,8BAAC,KAAE,WAAU,UAAS,eAAY,QAAO;AAAA;AAAA,YAC3C;AAAA,aACF;AAAA,UACC,eAAe,qBAAqB,UACnC,oBAAC,YAAS,OAAO,kBAAkB,WAAU,OAAM;AAAA,UAEpD,WAAW;AAAA;AAAA;AAAA,UAIV,oBAAC,OAAE,MAAK,SAAQ,WAAU,mCACvB,yBACH;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAMA,SAAS,eAAe,OAAuB;AAC7C,MAAI,QAAQ,KAAM,QAAO,GAAG,KAAK;AACjC,MAAI,QAAQ,OAAO,KAAM,QAAO,IAAI,QAAQ,MAAM,QAAQ,CAAC,CAAC;AAC5D,SAAO,IAAI,SAAS,OAAO,OAAO,QAAQ,CAAC,CAAC;AAC9C;","names":["FileUpload","FileUploadDropzone","FileUploadList","FileUploadItem"]}