@startdownnotez404/ui 1.3.5 → 1.3.6

package/dist/chunk-4SSJY32J.mjs

@@ -0,0 +1,1182 @@
+import {
+  MuiFormLabel,
+  default2 as default7
+} from "./chunk-T4X375IG.mjs";
+import {
+  LinearProgress
+} from "./chunk-WYYP3Y34.mjs";
+import {
+  default54 as default5,
+  default90 as default6
+} from "./chunk-ZVFYOXDE.mjs";
+import {
+  Button,
+  IconButton_default
+} from "./chunk-D4XPNSSI.mjs";
+import {
+  default as default4
+} from "./chunk-4RPFRNXG.mjs";
+import {
+  default as default2,
+  default2 as default3
+} from "./chunk-PNSJC6PC.mjs";
+
+// src/components/elemental/FileUpload/src/FileUpload.tsx
+import {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useId,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import { FileIcon, defaultStyles } from "react-file-icon";
+
+// src/components/elemental/FileUpload/src/theme.ts
+var fileUploadRootSx = {
+  "--fu-border": "var(--mui-palette-border-1)",
+  "--fu-border-hover": "var(--mui-palette-border-hover-1, var(--mui-palette-text-secondary))",
+  "--fu-border-active": "color-mix(in srgb, var(--mui-palette-text-secondary) 65%, transparent)",
+  "--fu-border-error": "var(--mui-palette-error-main)",
+  "--fu-surface": "color-mix(in srgb, var(--mui-palette-background-paper) 78%, transparent)",
+  "--fu-surface-hover": "color-mix(in srgb, var(--mui-palette-background-paper) 92%, transparent)",
+  "--fu-surface-active": "color-mix(in srgb, var(--mui-palette-primary-main) 8%, var(--mui-palette-background-paper))",
+  "--fu-item-bg": "color-mix(in srgb, var(--mui-palette-background-paper) 88%, transparent)",
+  "--fu-icon": "var(--mui-palette-text-secondary)",
+  "--fu-text": "var(--mui-palette-text-primary)",
+  "--fu-text-secondary": "var(--mui-palette-text-secondary)",
+  "--fu-shadow": "inset 0 1px 0 color-mix(in srgb, var(--mui-palette-common-white) 6%, transparent)",
+  "--fu-radius": "16px",
+  "--fu-item-radius": "12px",
+  display: "flex",
+  flexDirection: "column",
+  gap: 1,
+  width: "100%",
+  boxSizing: "border-box",
+  '[color-scheme="dark"] &': {
+    "--fu-surface": "color-mix(in srgb, var(--mui-palette-background-paper) 70%, transparent)",
+    "--fu-surface-hover": "color-mix(in srgb, var(--mui-palette-background-paper) 88%, transparent)",
+    "--fu-item-bg": "color-mix(in srgb, var(--mui-palette-background-paper) 82%, transparent)",
+    "--fu-shadow": "inset 0 1px 0 color-mix(in srgb, var(--mui-palette-common-white) 8%, transparent), 0 1px 2px rgba(0,0,0,0.18)"
+  }
+};
+var fileUploadDropzoneSx = {
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  justifyContent: "center",
+  textAlign: "center",
+  gap: 0.75,
+  px: 3,
+  py: 3.5,
+  minHeight: 140,
+  borderRadius: "var(--fu-radius)",
+  border: "1px dashed var(--fu-drop-border, var(--fu-border))",
+  backgroundColor: "var(--fu-drop-bg, var(--fu-surface))",
+  boxShadow: "var(--fu-shadow)",
+  color: "var(--fu-text-secondary)",
+  cursor: "pointer",
+  outline: "none",
+  boxSizing: "border-box",
+  transition: "border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease",
+  "&:hover": {
+    borderColor: "var(--fu-border-hover)",
+    backgroundColor: "var(--fu-surface-hover)"
+  },
+  "&:focus-visible": {
+    borderColor: "var(--fu-border-active)",
+    borderStyle: "solid"
+  },
+  '&[data-active="true"]': {
+    borderColor: "var(--fu-border-active)",
+    borderStyle: "solid",
+    backgroundColor: "var(--fu-surface-active)"
+  },
+  '&[data-error="true"]': {
+    "--fu-drop-border": "var(--fu-border-error)"
+  },
+  '&[data-disabled="true"]': {
+    opacity: 0.58,
+    cursor: "default",
+    pointerEvents: "none"
+  }
+};
+var fileUploadItemSx = {
+  display: "flex",
+  alignItems: "center",
+  gap: 1.25,
+  px: 1.25,
+  py: 1,
+  borderRadius: "var(--fu-item-radius)",
+  border: "1px solid var(--fu-border)",
+  backgroundColor: "var(--fu-item-bg)",
+  boxShadow: "var(--fu-shadow)",
+  boxSizing: "border-box",
+  minWidth: 0,
+  '&[data-status="error"]': {
+    borderColor: "color-mix(in srgb, var(--mui-palette-error-main) 55%, var(--fu-border))",
+    backgroundColor: "color-mix(in srgb, var(--mui-palette-error-main) 8%, var(--fu-item-bg))"
+  }
+};
+var fileUploadThumbSx = {
+  width: 36,
+  height: 36,
+  minWidth: 36,
+  borderRadius: "8px",
+  objectFit: "cover",
+  flexShrink: 0,
+  border: "1px solid var(--fu-border)",
+  backgroundColor: "var(--fu-item-bg)",
+  display: "block",
+  boxSizing: "border-box"
+};
+var fileUploadIconWellSx = {
+  width: 36,
+  height: 36,
+  minWidth: 36,
+  borderRadius: "8px",
+  flexShrink: 0,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  border: "1px solid var(--fu-border)",
+  backgroundColor: "color-mix(in srgb, var(--mui-palette-background-paper) 55%, transparent)",
+  boxSizing: "border-box",
+  overflow: "hidden"
+};
+var fileUploadLibIconSx = {
+  width: 24,
+  height: 30,
+  lineHeight: 0,
+  flexShrink: 0,
+  // Keep library colors vivid (no opacity / filter / color overrides).
+  color: "unset",
+  filter: "none",
+  opacity: 1,
+  "& svg": {
+    width: "100%",
+    height: "100%",
+    display: "block",
+    // Prevent inherited MUI text color from washing glyph/label fills.
+    color: "unset"
+  }
+};
+var fileUploadButtonSx = {
+  alignSelf: "flex-start",
+  textTransform: "none",
+  fontWeight: 600,
+  fontSize: "0.8125rem",
+  lineHeight: 1.25,
+  borderRadius: "10px",
+  px: 1.5,
+  py: 0.75,
+  minHeight: 36,
+  border: "1px solid var(--fu-border)",
+  backgroundColor: "var(--fu-surface)",
+  color: "var(--fu-text)",
+  boxShadow: "var(--fu-shadow)",
+  transition: "border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease",
+  "&:hover": {
+    borderColor: "var(--fu-border-hover)",
+    backgroundColor: "var(--fu-surface-hover)"
+  },
+  "&:focus-visible": {
+    borderColor: "var(--fu-border-active)",
+    outline: "none"
+  },
+  '&[data-active="true"]': {
+    borderColor: "var(--fu-border-active)",
+    backgroundColor: "var(--fu-surface-active)"
+  },
+  '&[data-error="true"]': {
+    borderColor: "var(--fu-border-error)",
+    color: "var(--fu-border-error)"
+  },
+  "&.Mui-disabled": {
+    opacity: 0.58,
+    borderColor: "var(--fu-border)",
+    color: "var(--fu-text-secondary)"
+  },
+  "& .MuiButton-startIcon": {
+    marginRight: "8px",
+    marginLeft: 0,
+    color: "var(--fu-icon)"
+  }
+};
+var fileUploadTileListSx = {
+  display: "flex",
+  flexWrap: "wrap",
+  gap: 1.25,
+  m: 0,
+  p: 0,
+  listStyle: "none"
+};
+var fileUploadTileSx = {
+  "--fu-tile-size": "80px",
+  position: "relative",
+  width: "var(--fu-tile-size)",
+  height: "var(--fu-tile-size)",
+  minWidth: "var(--fu-tile-size)",
+  borderRadius: "12px",
+  border: "1px solid var(--fu-border)",
+  backgroundColor: "var(--fu-item-bg)",
+  boxShadow: "var(--fu-shadow)",
+  boxSizing: "border-box",
+  overflow: "hidden",
+  flexShrink: 0,
+  '&[data-status="error"]': {
+    borderColor: "color-mix(in srgb, var(--mui-palette-error-main) 55%, var(--fu-border))"
+  },
+  "&:hover .fu-tile-remove, &:focus-within .fu-tile-remove": {
+    opacity: 1,
+    pointerEvents: "auto"
+  }
+};
+var fileUploadTileMediaSx = {
+  width: "100%",
+  height: "100%",
+  objectFit: "cover",
+  display: "block",
+  borderRadius: "inherit"
+};
+var fileUploadTileIconWellSx = {
+  width: "100%",
+  height: "100%",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  backgroundColor: "color-mix(in srgb, var(--mui-palette-background-paper) 55%, transparent)",
+  border: "none",
+  borderRadius: 0,
+  boxSizing: "border-box",
+  overflow: "hidden"
+};
+var fileUploadTileLibIconSx = {
+  width: 36,
+  height: 44,
+  lineHeight: 0,
+  flexShrink: 0,
+  color: "unset",
+  filter: "none",
+  opacity: 1,
+  "& svg": {
+    width: "100%",
+    height: "100%",
+    display: "block",
+    color: "unset"
+  }
+};
+var fileUploadTileRemoveSx = {
+  position: "absolute",
+  top: 4,
+  right: 4,
+  zIndex: 2,
+  width: 22,
+  height: 22,
+  p: 0,
+  opacity: 0,
+  pointerEvents: "none",
+  backgroundColor: "#fff",
+  color: "rgba(15, 23, 42, 0.72)",
+  boxShadow: "0 1px 3px rgba(0,0,0,0.22)",
+  border: "1px solid color-mix(in srgb, var(--mui-palette-common-black) 8%, transparent)",
+  transition: "opacity 140ms ease, background-color 140ms ease",
+  "&:hover": {
+    backgroundColor: "#fff",
+    color: "rgba(15, 23, 42, 0.92)"
+  },
+  "&.Mui-disabled": {
+    opacity: 0
+  }
+};
+var fileUploadTileProgressSx = {
+  position: "absolute",
+  left: 0,
+  right: 0,
+  bottom: 0,
+  zIndex: 1,
+  height: 3,
+  borderRadius: 0,
+  backgroundColor: "color-mix(in srgb, var(--mui-palette-common-black) 25%, transparent)",
+  "& .MuiLinearProgress-bar": {
+    borderRadius: 0
+  }
+};
+
+// src/components/elemental/FileUpload/src/utils.ts
+var idSeq = 0;
+function createFileUploadId() {
+  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
+    return crypto.randomUUID();
+  }
+  idSeq += 1;
+  return `fu-${Date.now()}-${idSeq}`;
+}
+function createFileUploadItem(file) {
+  return {
+    id: createFileUploadId(),
+    file,
+    status: "idle",
+    progress: 0
+  };
+}
+function formatFileSize(bytes) {
+  if (!Number.isFinite(bytes) || bytes < 0) return "\u2014";
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  if (bytes < 1024 * 1024 * 1024) {
+    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+  }
+  return `${(bytes / (1024 * 1024 * 1024)).toFixed(1)} GB`;
+}
+function parseAccept(accept) {
+  if (!accept || !accept.trim()) return [];
+  return accept.split(",").map((p) => p.trim()).filter(Boolean).map((token) => {
+    if (token.startsWith(".")) {
+      return { type: "ext", value: token.toLowerCase() };
+    }
+    return { type: "mime", value: token.toLowerCase() };
+  });
+}
+function matchesAccept(file, rules) {
+  if (rules.length === 0) return true;
+  const name = file.name.toLowerCase();
+  const mime = (file.type || "").toLowerCase();
+  return rules.some((rule) => {
+    if (rule.type === "ext") {
+      return name.endsWith(rule.value);
+    }
+    if (rule.value.endsWith("/*")) {
+      const prefix = rule.value.slice(0, -1);
+      return mime.startsWith(prefix);
+    }
+    return mime === rule.value;
+  });
+}
+function validateFiles(incoming, opts) {
+  const rules = parseAccept(opts.accept);
+  const accepted = [];
+  const rejections = [];
+  const hardCap = opts.multiple ? opts.maxFiles != null && opts.maxFiles > 0 ? opts.maxFiles : Infinity : 1;
+  for (const file of incoming) {
+    const errors = [];
+    if (!matchesAccept(file, rules)) {
+      errors.push("file-invalid-type");
+    }
+    if (opts.maxSize != null && opts.maxSize > 0 && file.size > opts.maxSize) {
+      errors.push("file-too-large");
+    }
+    if (opts.currentCount + accepted.length >= hardCap) {
+      errors.push("too-many-files");
+    }
+    if (errors.length > 0) {
+      rejections.push({ file, errors });
+    } else {
+      accepted.push(file);
+    }
+  }
+  return { accepted, rejections };
+}
+var MIME_TO_EXT = {
+  "application/pdf": "pdf",
+  "application/zip": "zip",
+  "application/x-zip-compressed": "zip",
+  "application/gzip": "gz",
+  "application/x-gzip": "gz",
+  "application/x-rar-compressed": "rar",
+  "application/vnd.rar": "rar",
+  "application/x-7z-compressed": "7z",
+  "application/x-tar": "tar",
+  "application/json": "json",
+  "application/msword": "doc",
+  "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "docx",
+  "application/vnd.ms-excel": "xls",
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "xlsx",
+  "application/vnd.ms-powerpoint": "ppt",
+  "application/vnd.openxmlformats-officedocument.presentationml.presentation": "pptx",
+  "text/plain": "txt",
+  "text/csv": "csv",
+  "text/markdown": "md",
+  "image/jpeg": "jpg",
+  "image/png": "png",
+  "image/gif": "gif",
+  "image/webp": "webp",
+  "image/svg+xml": "svg",
+  "audio/mpeg": "mp3",
+  "audio/wav": "wav",
+  "video/mp4": "mp4",
+  "video/webm": "webm"
+};
+function getFileExtension(file) {
+  const name = file.name || "";
+  const dot = name.lastIndexOf(".");
+  if (dot > 0 && dot < name.length - 1) {
+    return name.slice(dot + 1).toLowerCase();
+  }
+  const mime = (file.type || "").toLowerCase();
+  return MIME_TO_EXT[mime] ?? "";
+}
+function isImageFile(file) {
+  return typeof file.type === "string" && file.type.startsWith("image/");
+}
+var EXT_ALIASES = {
+  "7z": "7zip",
+  tgz: "gz",
+  tbz: "gz",
+  tbz2: "gz"
+};
+var ARCHIVE_FILE_ICON_STYLE = {
+  type: "compressed",
+  labelColor: "#E2A903",
+  labelTextColor: "#1A1A1A",
+  labelUppercase: true,
+  foldColor: "#C48E02",
+  color: "#F6E7A8",
+  glyphColor: "rgba(40, 30, 0, 0.35)"
+};
+var ARCHIVE_EXTS = /* @__PURE__ */ new Set([
+  "zip",
+  "zipx",
+  "rar",
+  "7z",
+  "7zip",
+  "gz",
+  "tar",
+  "tgz",
+  "sitx",
+  "bz2"
+]);
+var TYPE_COLOR_FALLBACKS = {
+  "3d": {
+    type: "3d",
+    labelColor: "#5FB9AD",
+    foldColor: "#4A9E94",
+    color: "#E5F6F4"
+  },
+  acrobat: {
+    type: "acrobat",
+    labelColor: "#D93831",
+    foldColor: "#B82E28",
+    color: "#FCE8E7"
+  },
+  android: {
+    type: "android",
+    labelColor: "#3DDC84",
+    foldColor: "#2BB86A",
+    color: "#E6FBF0"
+  },
+  audio: {
+    type: "audio",
+    labelColor: "#9B59B6",
+    foldColor: "#7E3F9A",
+    color: "#F3E9F8"
+  },
+  binary: {
+    type: "binary",
+    labelColor: "#E67E22",
+    foldColor: "#C86A1A",
+    color: "#FDF0E4"
+  },
+  code: {
+    type: "code",
+    labelColor: "#3498DB",
+    foldColor: "#2A7AB0",
+    color: "#E7F3FB"
+  },
+  compressed: { ...ARCHIVE_FILE_ICON_STYLE },
+  document: {
+    type: "document",
+    labelColor: "#5B8DEF",
+    labelUppercase: true,
+    foldColor: "#4A75C9",
+    color: "#E8EEF9",
+    glyphColor: "rgba(40, 60, 120, 0.35)"
+  },
+  drive: {
+    type: "drive",
+    labelColor: "#27AE60",
+    foldColor: "#1E8A4B",
+    color: "#E5F7ED"
+  },
+  font: {
+    type: "font",
+    labelColor: "#8E44AD",
+    foldColor: "#71368A",
+    color: "#F2E8F7"
+  },
+  image: {
+    type: "image",
+    labelColor: "#1ABC9C",
+    foldColor: "#14967C",
+    color: "#E4F8F3"
+  },
+  presentation: {
+    type: "presentation",
+    labelColor: "#D35400",
+    labelUppercase: true,
+    foldColor: "#A84300",
+    color: "#FCEADE",
+    glyphColor: "rgba(120, 50, 0, 0.35)"
+  },
+  settings: {
+    type: "settings",
+    labelColor: "#16A085",
+    foldColor: "#117A65",
+    color: "#E4F6F2"
+  },
+  spreadsheet: {
+    type: "spreadsheet",
+    labelColor: "#2D7D46",
+    labelUppercase: true,
+    foldColor: "#246338",
+    color: "#E5F2EA",
+    glyphColor: "rgba(20, 60, 30, 0.35)"
+  },
+  vector: {
+    type: "vector",
+    labelColor: "#FF7F18",
+    foldColor: "#D96A12",
+    color: "#FFF0E4"
+  },
+  video: {
+    type: "video",
+    labelColor: "#E74C3C",
+    foldColor: "#C0392B",
+    color: "#FCE9E7"
+  }
+};
+var UNKNOWN_FILE_ICON_STYLE = {
+  type: "document",
+  labelColor: "#5B8DEF",
+  labelTextColor: "#FFFFFF",
+  labelUppercase: true,
+  foldColor: "#4A75C9",
+  color: "#E8EEF9",
+  glyphColor: "rgba(40, 60, 120, 0.35)"
+};
+var MONO_PAGE_COLORS = /* @__PURE__ */ new Set([
+  "",
+  "whitesmoke",
+  "#fff",
+  "#ffffff",
+  "white",
+  "#f5f5f5",
+  "#fafafa"
+]);
+function hasVividColor(style) {
+  if (typeof style.labelColor === "string" && style.labelColor.trim()) {
+    return true;
+  }
+  if (typeof style.color === "string") {
+    const c = style.color.trim().toLowerCase();
+    if (c && !MONO_PAGE_COLORS.has(c)) return true;
+  }
+  return false;
+}
+function mergeColorEnrichment(lib, enrichment) {
+  return {
+    ...enrichment,
+    ...lib,
+    labelColor: lib.labelColor ?? enrichment.labelColor,
+    labelTextColor: lib.labelTextColor ?? enrichment.labelTextColor,
+    foldColor: lib.foldColor ?? enrichment.foldColor,
+    color: lib.color ?? enrichment.color,
+    glyphColor: lib.glyphColor ?? enrichment.glyphColor,
+    labelUppercase: lib.labelUppercase ?? enrichment.labelUppercase,
+    type: lib.type ?? enrichment.type
+  };
+}
+function resolveFileIconStyle(file, defaultStyles2) {
+  const rawExt = getFileExtension(file);
+  const styleKey = (EXT_ALIASES[rawExt] ?? rawExt).toLowerCase();
+  const displayExt = rawExt || styleKey || void 0;
+  const lib = {
+    ...(styleKey ? defaultStyles2[styleKey] : void 0) ?? {}
+  };
+  const isArchive = ARCHIVE_EXTS.has(rawExt) || ARCHIVE_EXTS.has(styleKey) || lib.type === "compressed";
+  let style;
+  if (isArchive) {
+    style = { ...lib, ...ARCHIVE_FILE_ICON_STYLE };
+  } else if (hasVividColor(lib)) {
+    style = { ...lib };
+  } else if (lib.type && TYPE_COLOR_FALLBACKS[lib.type]) {
+    style = mergeColorEnrichment(lib, TYPE_COLOR_FALLBACKS[lib.type]);
+  } else {
+    style = mergeColorEnrichment(lib, UNKNOWN_FILE_ICON_STYLE);
+  }
+  return {
+    extension: displayExt,
+    styleKey,
+    style
+  };
+}
+
+// src/components/elemental/FileUpload/src/FileUpload.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function mergeSx(...parts) {
+  const out = [];
+  for (const p of parts) {
+    if (!p) continue;
+    if (Array.isArray(p)) out.push(...p);
+    else out.push(p);
+  }
+  return out;
+}
+var FileUpload = forwardRef(
+  function FileUpload2(props, ref) {
+    const {
+      value: valueProp,
+      defaultValue,
+      onChange,
+      onRemove,
+      onReject,
+      multiple = true,
+      accept,
+      maxSize,
+      maxFiles,
+      disabled = false,
+      hideDropzone = false,
+      disableRemove = false,
+      readOnly = false,
+      label,
+      name,
+      helperText,
+      error = false,
+      required = false,
+      variant = "dropzone",
+      itemVariant = "row",
+      buttonLabel = "Upload file",
+      dropzoneTitle = "Drag & drop files here",
+      dropzoneDescription = "or click to browse",
+      id: idProp,
+      className,
+      sx,
+      "data-testid": dataTestId = "file-upload"
+    } = props;
+    const reactId = useId();
+    const inputId = idProp ?? `file-upload-${reactId}`;
+    const helperId = `${inputId}-helper`;
+    const inputRef = useRef(null);
+    const isControlled = valueProp !== void 0;
+    const [uncontrolled, setUncontrolled] = useState(
+      () => defaultValue ?? []
+    );
+    const items = useMemo(
+      () => isControlled ? valueProp ?? [] : uncontrolled,
+      [isControlled, valueProp, uncontrolled]
+    );
+    const [active, setActive] = useState(false);
+    const dragDepth = useRef(0);
+    const atCapacity = useMemo(() => {
+      if (!multiple) return items.length >= 1;
+      if (maxFiles != null && maxFiles > 0) return items.length >= maxFiles;
+      return false;
+    }, [items.length, maxFiles, multiple]);
+    const commit = useCallback(
+      (next) => {
+        if (!isControlled) setUncontrolled(next);
+        onChange?.(next);
+      },
+      [isControlled, onChange]
+    );
+    const ingest = useCallback(
+      (fileList) => {
+        if (disabled) return;
+        const incoming = Array.from(fileList);
+        if (incoming.length === 0) return;
+        const { accepted, rejections } = validateFiles(incoming, {
+          accept,
+          maxSize,
+          maxFiles,
+          currentCount: items.length,
+          multiple
+        });
+        if (rejections.length > 0) {
+          onReject?.(rejections);
+        }
+        if (accepted.length === 0) return;
+        const nextItems = accepted.map(createFileUploadItem);
+        if (!multiple) {
+          commit(nextItems.slice(0, 1));
+          return;
+        }
+        commit([...items, ...nextItems]);
+      },
+      [
+        accept,
+        disabled,
+        items,
+        maxFiles,
+        maxSize,
+        multiple,
+        onReject,
+        commit
+      ]
+    );
+    const handleRemove = useCallback(
+      (item) => {
+        if (disabled) return;
+        const next = items.filter((i) => i.id !== item.id);
+        commit(next);
+        onRemove?.(item, next);
+        if (inputRef.current) inputRef.current.value = "";
+      },
+      [commit, disabled, items, onRemove]
+    );
+    const openPicker = useCallback(() => {
+      if (disabled || atCapacity) return;
+      inputRef.current?.click();
+    }, [atCapacity, disabled]);
+    const onInputChange = useCallback(
+      (e) => {
+        if (e.target.files) ingest(e.target.files);
+        e.target.value = "";
+      },
+      [ingest]
+    );
+    const onDragEnter = useCallback(
+      (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        if (disabled || atCapacity) return;
+        dragDepth.current += 1;
+        setActive(true);
+      },
+      [atCapacity, disabled]
+    );
+    const onDragLeave = useCallback((e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      dragDepth.current = Math.max(0, dragDepth.current - 1);
+      if (dragDepth.current === 0) setActive(false);
+    }, []);
+    const onDragOver = useCallback((e) => {
+      e.preventDefault();
+      e.stopPropagation();
+    }, []);
+    const onDrop = useCallback(
+      (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        dragDepth.current = 0;
+        setActive(false);
+        if (disabled || atCapacity) return;
+        if (e.dataTransfer.files?.length) {
+          ingest(e.dataTransfer.files);
+        }
+      },
+      [atCapacity, disabled, ingest]
+    );
+    const queueOnly = readOnly || hideDropzone;
+    const removeDisabled = readOnly || disableRemove || disabled;
+    const showTrigger = !queueOnly && !atCapacity;
+    const isButton = variant === "button";
+    const fileInput = /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: inputRef,
+        id: inputId,
+        name,
+        type: "file",
+        accept,
+        multiple,
+        disabled,
+        onChange: onInputChange,
+        style: { display: "none" },
+        "aria-hidden": true,
+        tabIndex: -1
+      }
+    );
+    const dragHandlers = {
+      onDragEnter,
+      onDragLeave,
+      onDragOver,
+      onDrop
+    };
+    return /* @__PURE__ */ jsxs(
+      default2,
+      {
+        ref,
+        className,
+        "data-testid": dataTestId,
+        "data-variant": variant,
+        "data-readonly": readOnly || queueOnly ? "true" : void 0,
+        sx: mergeSx(fileUploadRootSx, sx),
+        children: [
+          label ? /* @__PURE__ */ jsx(
+            MuiFormLabel,
+            {
+              htmlFor: showTrigger ? inputId : void 0,
+              required,
+              error,
+              sx: {
+                mb: 0.25,
+                color: error ? "error.main" : "text.secondary",
+                fontSize: "0.8rem",
+                fontWeight: 600
+              },
+              children: label
+            }
+          ) : null,
+          fileInput,
+          showTrigger ? isButton ? /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              disableElevation: true,
+              disabled,
+              "aria-invalid": error || void 0,
+              "aria-describedby": helperText ? helperId : void 0,
+              "data-active": active ? "true" : "false",
+              "data-error": error ? "true" : "false",
+              "data-testid": `${dataTestId}-button`,
+              startIcon: /* @__PURE__ */ jsx(default6, { sx: { fontSize: "1.15rem" } }),
+              onClick: openPicker,
+              sx: fileUploadButtonSx,
+              ...dragHandlers,
+              children: buttonLabel
+            }
+          ) : /* @__PURE__ */ jsxs(
+            default2,
+            {
+              role: "button",
+              tabIndex: disabled ? -1 : 0,
+              "aria-disabled": disabled || void 0,
+              "aria-invalid": error || void 0,
+              "aria-describedby": helperText ? helperId : void 0,
+              "data-active": active ? "true" : "false",
+              "data-error": error ? "true" : "false",
+              "data-disabled": disabled ? "true" : "false",
+              "data-testid": `${dataTestId}-dropzone`,
+              sx: fileUploadDropzoneSx,
+              onClick: openPicker,
+              onKeyDown: (e) => {
+                if (e.key === "Enter" || e.key === " ") {
+                  e.preventDefault();
+                  openPicker();
+                }
+              },
+              ...dragHandlers,
+              children: [
+                /* @__PURE__ */ jsx(
+                  default6,
+                  {
+                    "aria-hidden": true,
+                    sx: { fontSize: 36, color: "var(--fu-icon)", opacity: 0.9 }
+                  }
+                ),
+                typeof dropzoneTitle === "string" ? /* @__PURE__ */ jsx(
+                  default4,
+                  {
+                    variant: "subtitle2",
+                    sx: { m: 0, color: "var(--fu-text)", fontWeight: 600 },
+                    children: dropzoneTitle
+                  }
+                ) : dropzoneTitle,
+                dropzoneDescription ? typeof dropzoneDescription === "string" ? /* @__PURE__ */ jsx(
+                  default4,
+                  {
+                    variant: "caption",
+                    sx: { m: 0, color: "var(--fu-text-secondary)" },
+                    children: dropzoneDescription
+                  }
+                ) : dropzoneDescription : null
+              ]
+            }
+          ) : null,
+          items.length > 0 ? itemVariant === "tile" ? /* @__PURE__ */ jsx(
+            default2,
+            {
+              component: "ul",
+              "data-testid": `${dataTestId}-list`,
+              "data-item-variant": "tile",
+              sx: fileUploadTileListSx,
+              children: items.map((item) => /* @__PURE__ */ jsx(
+                FileUploadListItem,
+                {
+                  item,
+                  disabled,
+                  disableRemove: removeDisabled,
+                  onRemove: handleRemove,
+                  testId: `${dataTestId}-item`,
+                  itemVariant: "tile"
+                },
+                item.id
+              ))
+            }
+          ) : /* @__PURE__ */ jsx(
+            default3,
+            {
+              component: "ul",
+              spacing: 1,
+              "data-testid": `${dataTestId}-list`,
+              "data-item-variant": "row",
+              sx: { m: 0, p: 0, listStyle: "none" },
+              children: items.map((item) => /* @__PURE__ */ jsx(
+                FileUploadListItem,
+                {
+                  item,
+                  disabled,
+                  disableRemove: removeDisabled,
+                  onRemove: handleRemove,
+                  testId: `${dataTestId}-item`,
+                  itemVariant: "row"
+                },
+                item.id
+              ))
+            }
+          ) : null,
+          helperText ? /* @__PURE__ */ jsx(
+            default7,
+            {
+              id: helperId,
+              error,
+              sx: { mx: 0.5, mt: 0 },
+              children: helperText
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+function FileUploadTypeIcon({
+  file,
+  tile = false
+}) {
+  const resolved = resolveFileIconStyle(
+    file,
+    defaultStyles
+  );
+  const { extension, styleKey } = resolved;
+  const iconStyle = resolved.style;
+  return /* @__PURE__ */ jsx(
+    default2,
+    {
+      "aria-hidden": true,
+      "data-testid": "file-upload-icon",
+      "data-ext": extension || void 0,
+      "data-style-key": styleKey || void 0,
+      sx: tile ? fileUploadTileIconWellSx : fileUploadIconWellSx,
+      children: /* @__PURE__ */ jsx(default2, { sx: tile ? fileUploadTileLibIconSx : fileUploadLibIconSx, children: /* @__PURE__ */ jsx(
+        FileIcon,
+        {
+          fold: true,
+          radius: 3,
+          extension,
+          ...iconStyle
+        }
+      ) })
+    }
+  );
+}
+function FileUploadThumb({
+  file,
+  tile = false
+}) {
+  const [url, setUrl] = useState(null);
+  const [previewFailed, setPreviewFailed] = useState(false);
+  useEffect(() => {
+    setPreviewFailed(false);
+    if (!isImageFile(file)) {
+      setUrl(null);
+      return;
+    }
+    const objectUrl = URL.createObjectURL(file);
+    setUrl(objectUrl);
+    return () => {
+      URL.revokeObjectURL(objectUrl);
+    };
+  }, [file]);
+  if (url && !previewFailed) {
+    return /* @__PURE__ */ jsx(
+      default2,
+      {
+        component: "img",
+        src: url,
+        alt: "",
+        "data-testid": "file-upload-thumb",
+        sx: tile ? fileUploadTileMediaSx : fileUploadThumbSx,
+        onError: () => setPreviewFailed(true)
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(FileUploadTypeIcon, { file, tile });
+}
+function FileUploadListItem({
+  item,
+  disabled,
+  disableRemove = false,
+  onRemove,
+  testId,
+  itemVariant
+}) {
+  if (itemVariant === "tile") {
+    return /* @__PURE__ */ jsx(
+      FileUploadTileItem,
+      {
+        item,
+        disabled,
+        disableRemove,
+        onRemove,
+        testId
+      }
+    );
+  }
+  const status = item.status ?? (item.error ? "error" : "idle");
+  const showProgress = status === "uploading" || typeof item.progress === "number" && item.progress > 0 && item.progress < 100 && status !== "error" && status !== "success";
+  return /* @__PURE__ */ jsxs(
+    default2,
+    {
+      component: "li",
+      "data-testid": testId,
+      "data-status": status,
+      "data-item-variant": "row",
+      sx: fileUploadItemSx,
+      children: [
+        /* @__PURE__ */ jsx(FileUploadThumb, { file: item.file }),
+        /* @__PURE__ */ jsxs(default2, { sx: { flex: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ jsx(
+            default4,
+            {
+              variant: "body2",
+              noWrap: true,
+              title: item.file.name,
+              sx: { m: 0, fontWeight: 500, color: "var(--fu-text)" },
+              children: item.file.name
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            default4,
+            {
+              variant: "caption",
+              sx: { m: 0, color: "var(--fu-text-secondary)" },
+              children: [
+                formatFileSize(item.file.size),
+                item.error ? ` \xB7 ${item.error}` : null,
+                status === "success" && !item.error ? " \xB7 Done" : null
+              ]
+            }
+          ),
+          showProgress ? /* @__PURE__ */ jsx(
+            LinearProgress,
+            {
+              variant: "determinate",
+              value: Math.max(0, Math.min(100, item.progress ?? 0)),
+              "aria-label": `Upload progress ${item.progress ?? 0}%`,
+              sx: { mt: 0.75, height: 4, borderRadius: 2 }
+            }
+          ) : null,
+          status === "uploading" && item.progress == null ? /* @__PURE__ */ jsx(
+            LinearProgress,
+            {
+              "aria-label": "Uploading",
+              sx: { mt: 0.75, height: 4, borderRadius: 2 }
+            }
+          ) : null
+        ] }),
+        disableRemove ? null : /* @__PURE__ */ jsx(
+          IconButton_default,
+          {
+            size: "small",
+            "aria-label": `Remove ${item.file.name}`,
+            disabled,
+            onClick: () => onRemove(item),
+            sx: {
+              flexShrink: 0,
+              color: "var(--fu-text-secondary)",
+              p: 0.35
+            },
+            children: /* @__PURE__ */ jsx(default5, { sx: { fontSize: "1rem" } })
+          }
+        )
+      ]
+    }
+  );
+}
+function FileUploadTileItem({
+  item,
+  disabled,
+  disableRemove = false,
+  onRemove,
+  testId
+}) {
+  const status = item.status ?? (item.error ? "error" : "idle");
+  const showProgress = status === "uploading" || typeof item.progress === "number" && item.progress > 0 && item.progress < 100 && status !== "error" && status !== "success";
+  const indeterminate = status === "uploading" && item.progress == null;
+  return /* @__PURE__ */ jsxs(
+    default2,
+    {
+      component: "li",
+      "data-testid": testId,
+      "data-status": status,
+      "data-item-variant": "tile",
+      title: item.file.name,
+      sx: fileUploadTileSx,
+      children: [
+        /* @__PURE__ */ jsx(FileUploadThumb, { file: item.file, tile: true }),
+        showProgress ? /* @__PURE__ */ jsx(
+          LinearProgress,
+          {
+            variant: "determinate",
+            value: Math.max(0, Math.min(100, item.progress ?? 0)),
+            "aria-label": `Upload progress ${item.progress ?? 0}%`,
+            sx: fileUploadTileProgressSx
+          }
+        ) : null,
+        indeterminate ? /* @__PURE__ */ jsx(
+          LinearProgress,
+          {
+            "aria-label": "Uploading",
+            sx: fileUploadTileProgressSx
+          }
+        ) : null,
+        disableRemove ? null : /* @__PURE__ */ jsx(
+          IconButton_default,
+          {
+            className: "fu-tile-remove",
+            size: "small",
+            "aria-label": `Remove ${item.file.name}`,
+            disabled,
+            onClick: (e) => {
+              e.stopPropagation();
+              onRemove(item);
+            },
+            sx: fileUploadTileRemoveSx,
+            children: /* @__PURE__ */ jsx(default5, { sx: { fontSize: "0.85rem" } })
+          }
+        )
+      ]
+    }
+  );
+}
+
+export {
+  fileUploadRootSx,
+  fileUploadDropzoneSx,
+  fileUploadItemSx,
+  fileUploadThumbSx,
+  fileUploadIconWellSx,
+  fileUploadLibIconSx,
+  fileUploadButtonSx,
+  fileUploadTileListSx,
+  fileUploadTileSx,
+  fileUploadTileMediaSx,
+  fileUploadTileIconWellSx,
+  fileUploadTileLibIconSx,
+  fileUploadTileRemoveSx,
+  fileUploadTileProgressSx,
+  createFileUploadId,
+  createFileUploadItem,
+  formatFileSize,
+  validateFiles,
+  getFileExtension,
+  isImageFile,
+  ARCHIVE_FILE_ICON_STYLE,
+  TYPE_COLOR_FALLBACKS,
+  UNKNOWN_FILE_ICON_STYLE,
+  resolveFileIconStyle,
+  FileUpload
+};
+//# sourceMappingURL=chunk-4SSJY32J.mjs.map