@btndprojects/loam-ui-native 0.1.1 → 0.3.1

package/dist/chunk-VZYYZRPN.js

@@ -0,0 +1,1992 @@
+import { NavHeaderAction, NavHeader } from './chunk-WFMQ3WKM.js';
+import { useDelayedLoading } from './chunk-KRBUZV45.js';
+import { useFileManagerLabels, NameConflictDialog } from './chunk-CHPX4MFI.js';
+import { ListRow } from './chunk-JA6TK7H2.js';
+import { DescriptionList } from './chunk-PFLNFIVB.js';
+import { Checkbox } from './chunk-KNILMM4H.js';
+import { EmptyState } from './chunk-QJMMM4RC.js';
+import { IconTile } from './chunk-XBXUBBJZ.js';
+import { ContextMenu, ContextMenuOverlay } from './chunk-7CGJBQUA.js';
+import { Alert } from './chunk-Z7I4ZSO6.js';
+import { Sheet } from './chunk-B7JZ3N5G.js';
+import { Dialog, DialogFooter } from './chunk-AQ5FIG74.js';
+import { Button } from './chunk-5DTKORLI.js';
+import { Text as Text$1, resolveTextRole } from './chunk-L4D5LHCH.js';
+import { Badge } from './chunk-LGNTP5XA.js';
+import { Skeleton } from './chunk-YJ5PXOX3.js';
+import { softToneSkin } from './chunk-PJLTKDVY.js';
+import { SegmentedControl } from './chunk-NZG75DGA.js';
+import { TextField } from './chunk-KXLDK6HB.js';
+import { haptics } from './chunk-NY2U3PBI.js';
+import { isAndroidIdiom } from './chunk-TH4PW2WU.js';
+import { useLoamLocale } from './chunk-APCWFOZW.js';
+import { Icon } from './chunk-PCEFCOLN.js';
+import * as React3 from 'react';
+import { View, Image, Text, ScrollView, FlatList, Pressable } from 'react-native';
+import { createStyleSheet, useLoamTheme, useStyles } from '@btndprojects/loam-theme-native';
+import { fileCategory, FILE_CATEGORY_ICON, DEFAULT_FILE_SORT, childrenOf, formatFileSize, indexEntries, pathTo, summarize, applyPending, isPlaceholderId, sortEntries, searchEntries, recentFiles, flattenRows, validateFileName, uniqueFileName, newerSide, answerNameConflict, moveRefusal, placeholderId, topLevelIds, findNameConflicts, resolveNameConflicts } from '@btndprojects/loam-file-manager-core';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var STEP_DOWN = { sm: "sm", md: "sm", lg: "md", xl: "lg" };
+function FileIcon({
+  entry,
+  size: sizeProp = "md",
+  open = false,
+  tone,
+  shape,
+  status,
+  density = "comfortable",
+  loading = false
+}) {
+  const size = density === "compact" ? STEP_DOWN[sizeProp] : sizeProp;
+  const theme = useLoamTheme("file-manager");
+  const { styles } = useStyles(sheet, { size });
+  const [broken, setBroken] = React3.useState(false);
+  const [loaded, setLoaded] = React3.useState(false);
+  const thumb = entry.thumbnailUrl;
+  React3.useEffect(() => {
+    setBroken(false);
+    setLoaded(false);
+  }, [thumb]);
+  const category = fileCategory(entry);
+  const showThumb = Boolean(thumb) && !broken && (size === "lg" || size === "xl");
+  const glyph = { sm: theme.icon.sm, md: theme.icon.md, lg: theme.space.s6, xl: theme.space.s7 }[size];
+  const large = size === "lg" || size === "xl";
+  const skin = tone ? softToneSkin(theme, tone) : null;
+  const statusColor = status ? theme.color[status] : void 0;
+  const radius = shape === "circle" ? theme.radius.full : shape === "rounded" ? theme.radius.md : shape === "square" ? 0 : void 0;
+  const frameSize = {
+    sm: theme.icon.sm,
+    md: theme.icon.md,
+    lg: theme.space[48],
+    xl: theme.space[64]
+  }[size];
+  if (loading) {
+    return /* @__PURE__ */ jsx(View, { style: styles.frame, accessibilityElementsHidden: true, children: /* @__PURE__ */ jsx(Skeleton, { variant: "rect", width: frameSize, height: frameSize, decorative: true }) });
+  }
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: [
+        styles.frame,
+        showThumb && styles.thumbFrame,
+        skin ? { backgroundColor: skin.fill } : null,
+        radius !== void 0 ? { borderRadius: radius } : null,
+        statusColor ? { overflow: "visible" } : null
+      ],
+      accessibilityElementsHidden: true,
+      importantForAccessibility: "no-hide-descendants",
+      children: [
+        !showThumb || !loaded ? /* @__PURE__ */ jsx(
+          Icon,
+          {
+            name: category === "folder" && open ? "folder-open" : FILE_CATEGORY_ICON[category],
+            size: glyph,
+            strokeWidth: large ? 1.25 : 1.5,
+            color: skin ? skin.ink : category === "folder" ? theme.color.accentStrong : theme.color.text3
+          }
+        ) : null,
+        showThumb ? /* @__PURE__ */ jsx(
+          Image,
+          {
+            source: { uri: thumb },
+            resizeMode: "cover",
+            onLoad: () => setLoaded(true),
+            onError: () => setBroken(true),
+            style: [styles.thumb, { opacity: loaded ? 1 : 0 }]
+          }
+        ) : null,
+        statusColor ? /* @__PURE__ */ jsx(
+          View,
+          {
+            testID: "file-icon-status",
+            style: [styles.statusDot, { backgroundColor: statusColor }]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+var sheet = createStyleSheet((theme) => ({
+  frame: {
+    alignItems: "center",
+    justifyContent: "center",
+    overflow: "hidden",
+    variants: {
+      size: {
+        sm: { width: theme.icon.sm, height: theme.icon.sm },
+        md: { width: theme.icon.md, height: theme.icon.md },
+        lg: { width: theme.space[48], height: theme.space[48], borderRadius: theme.radius.sm },
+        xl: { width: theme.space[64], height: theme.space[64], borderRadius: theme.radius.md }
+      }
+    }
+  },
+  thumbFrame: {
+    backgroundColor: theme.color.surface3,
+    borderWidth: theme.borderWidth.hair,
+    borderColor: theme.color.border
+  },
+  statusDot: {
+    position: "absolute",
+    right: 0,
+    bottom: 0,
+    width: theme.space[8],
+    height: theme.space[8],
+    borderRadius: theme.radius.full,
+    borderWidth: theme.borderWidth.thin,
+    borderColor: theme.color.surface
+  },
+  thumb: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0
+  }
+}));
+function ChoiceRow({
+  icon,
+  label,
+  detail,
+  selected,
+  disabled,
+  indent = 0,
+  onPress
+}) {
+  const theme = useLoamTheme("file-manager");
+  const { styles } = useStyles(sheet2);
+  return /* @__PURE__ */ jsx(View, { style: { paddingStart: indent * theme.space.s5 }, children: /* @__PURE__ */ jsx(
+    ListRow,
+    {
+      density: "compact",
+      title: label,
+      accessibilityLabel: detail ? `${label}, ${detail}` : label,
+      disabled,
+      onPress,
+      leading: icon ? /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.icon.md, color: theme.color.text2 }) : void 0,
+      trailing: detail || selected ? /* @__PURE__ */ jsxs(View, { style: styles.choiceTrail, children: [
+        detail ? /* @__PURE__ */ jsx(Text, { style: styles.choiceDetail, children: detail }) : null,
+        selected ? /* @__PURE__ */ jsx(Icon, { name: "check", size: theme.icon.md, color: theme.color.accentStrong }) : null
+      ] }) : void 0
+    }
+  ) });
+}
+function GroupLabel({ children }) {
+  const theme = useLoamTheme("file-manager");
+  const { styles } = useStyles(sheet2);
+  return /* @__PURE__ */ jsx(
+    Text,
+    {
+      style: [styles.groupLabel, resolveTextRole(theme, "overline", isAndroidIdiom(theme))],
+      accessibilityRole: "header",
+      children
+    }
+  );
+}
+var SORT_KEYS = ["name", "modified", "size", "type"];
+function FileOptionsSheet({
+  open,
+  onClose,
+  view,
+  onViewChange,
+  sort,
+  onSortChange,
+  onNewFolder,
+  labels,
+  safeAreaBottom,
+  motion
+}) {
+  const { styles } = useStyles(sheet2);
+  return /* @__PURE__ */ jsxs(
+    Sheet,
+    {
+      open,
+      onClose,
+      title: labels.view,
+      closeLabel: labels.close,
+      safeAreaBottom,
+      motion,
+      children: [
+        /* @__PURE__ */ jsx(View, { style: styles.segment, children: /* @__PURE__ */ jsx(
+          SegmentedControl,
+          {
+            accessibilityLabel: labels.view,
+            items: [
+              { value: "grid", label: labels.viewGrid, icon: "grid" },
+              { value: "list", label: labels.viewList, icon: "list-ul" }
+            ],
+            value: view,
+            onValueChange: (v) => onViewChange(v),
+            motion
+          }
+        ) }),
+        /* @__PURE__ */ jsx(GroupLabel, { children: labels.sort }),
+        SORT_KEYS.map((key) => {
+          const chosen = sort.key === key;
+          return /* @__PURE__ */ jsx(
+            ChoiceRow,
+            {
+              icon: chosen ? sort.direction === "asc" ? "arrow-up" : "arrow-down" : void 0,
+              label: labels.sortKey[key],
+              detail: chosen ? sort.direction === "asc" ? labels.ascending : labels.descending : void 0,
+              selected: chosen,
+              onPress: () => {
+                haptics.selection();
+                onSortChange(
+                  chosen ? { key, direction: sort.direction === "asc" ? "desc" : "asc" } : {
+                    key,
+                    direction: key === "modified" || key === "size" ? "desc" : DEFAULT_FILE_SORT.direction
+                  }
+                );
+              }
+            },
+            key
+          );
+        }),
+        onNewFolder ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(View, { style: styles.rule }),
+          /* @__PURE__ */ jsx(
+            ChoiceRow,
+            {
+              icon: "folder-plus",
+              label: labels.newFolder,
+              onPress: () => {
+                onClose();
+                onNewFolder();
+              }
+            }
+          )
+        ] }) : null
+      ]
+    }
+  );
+}
+function FileLocations({
+  location,
+  onLocationChange,
+  folders,
+  recents,
+  favorites,
+  labels
+}) {
+  const at = (l) => l.kind === location.kind && (l.kind !== "folder" || location.kind === "folder" && location.id === l.id);
+  return (
+    // A labelled group, not a list: its children are headings and choice rows,
+    // and a `list` that owns no `listitem` is an invalid ARIA tree on the web.
+    /* @__PURE__ */ jsxs(View, { role: "group", accessibilityLabel: labels.locations, children: [
+      /* @__PURE__ */ jsx(GroupLabel, { children: labels.locations }),
+      /* @__PURE__ */ jsx(
+        ChoiceRow,
+        {
+          icon: "folder",
+          label: labels.root,
+          selected: at({ kind: "folder", id: null }),
+          onPress: () => onLocationChange({ kind: "folder", id: null })
+        }
+      ),
+      recents ? /* @__PURE__ */ jsx(
+        ChoiceRow,
+        {
+          icon: "clock",
+          label: labels.recent,
+          selected: at({ kind: "recent" }),
+          onPress: () => onLocationChange({ kind: "recent" })
+        }
+      ) : null,
+      favorites ? /* @__PURE__ */ jsx(
+        ChoiceRow,
+        {
+          icon: "star",
+          label: labels.favorites,
+          selected: at({ kind: "favorites" }),
+          onPress: () => onLocationChange({ kind: "favorites" })
+        }
+      ) : null,
+      folders.length > 0 ? /* @__PURE__ */ jsx(GroupLabel, { children: labels.folders }) : null,
+      folders.map((f) => /* @__PURE__ */ jsx(
+        ChoiceRow,
+        {
+          icon: "folder",
+          label: f.name,
+          selected: at({ kind: "folder", id: f.id }),
+          onPress: () => onLocationChange({ kind: "folder", id: f.id })
+        },
+        f.id
+      ))
+    ] })
+  );
+}
+function entryMeta(entry, items, labels, locale) {
+  if (entry.type === "folder") return labels.items(childrenOf(items, entry.id).length);
+  return [
+    labels.category[fileCategory(entry)],
+    entry.size !== void 0 ? formatFileSize(entry.size, locale) : ""
+  ].filter(Boolean).join(" \xB7 ");
+}
+function formatDate(value, locale) {
+  if (value === void 0) return "";
+  const d = new Date(value);
+  return Number.isNaN(d.getTime()) ? "" : d.toLocaleString(locale, { dateStyle: "medium", timeStyle: "short" });
+}
+function FileInfoSheet({
+  entry,
+  items,
+  onClose,
+  labels,
+  locale,
+  safeAreaBottom,
+  motion
+}) {
+  const { styles } = useStyles(sheet2);
+  const last = React3.useRef(entry);
+  if (entry) last.current = entry;
+  const shown = last.current;
+  const rows = React3.useMemo(() => {
+    if (!shown) return [];
+    const index = indexEntries(items);
+    const where = [labels.root, ...pathTo(index, shown.parentId).map((e) => e.name)].join(" \u203A ");
+    const out = [{ term: labels.kind, description: labels.category[fileCategory(shown)] }];
+    if (shown.type === "folder") {
+      const s = summarize(childrenOf(items, shown.id));
+      out.push({ term: labels.contains, description: labels.items(s.files + s.folders) });
+    } else if (shown.size !== void 0) {
+      out.push({ term: labels.size, description: formatFileSize(shown.size, locale) });
+    }
+    out.push({ term: labels.location, description: where });
+    const date = formatDate(shown.modifiedAt, locale);
+    if (date) out.push({ term: labels.modified, description: date });
+    if (shown.tags?.length) out.push({ term: labels.tags, description: shown.tags.join(", ") });
+    return out;
+  }, [shown, items, labels, locale]);
+  return /* @__PURE__ */ jsxs(
+    Sheet,
+    {
+      open: entry !== null,
+      onClose,
+      title: labels.getInfo,
+      closeLabel: labels.close,
+      safeAreaBottom,
+      motion,
+      children: [
+        shown ? /* @__PURE__ */ jsxs(View, { style: styles.infoHead, children: [
+          /* @__PURE__ */ jsx(FileIcon, { entry: shown, size: "lg" }),
+          /* @__PURE__ */ jsxs(View, { style: styles.infoTitle, children: [
+            /* @__PURE__ */ jsx(Text, { style: styles.infoName, numberOfLines: 2, children: shown.name }),
+            /* @__PURE__ */ jsx(Text, { style: styles.infoMeta, numberOfLines: 1, children: entryMeta(shown, items, labels, locale) })
+          ] })
+        ] }) : null,
+        /* @__PURE__ */ jsx(View, { style: styles.infoBody, children: /* @__PURE__ */ jsx(DescriptionList, { items: rows }) })
+      ]
+    }
+  );
+}
+function FilePreviewSheet({
+  entry,
+  files,
+  onEntryChange,
+  onClose,
+  items,
+  renderPreview,
+  labels,
+  locale,
+  safeAreaBottom,
+  motion
+}) {
+  const { styles } = useStyles(sheet2);
+  const last = React3.useRef(entry);
+  if (entry) last.current = entry;
+  const shown = last.current;
+  const [failed, setFailed] = React3.useState(false);
+  React3.useEffect(() => setFailed(false), [shown?.id]);
+  const at = shown ? files.findIndex((f) => f.id === shown.id) : -1;
+  const step = (by) => {
+    const next = files[at + by];
+    if (next) {
+      haptics.selection();
+      onEntryChange(next);
+    }
+  };
+  const src = shown?.url ?? shown?.thumbnailUrl;
+  const custom = shown ? renderPreview?.(shown) : void 0;
+  const isImage = shown ? fileCategory(shown) === "image" && Boolean(src) && !failed : false;
+  return /* @__PURE__ */ jsx(
+    Sheet,
+    {
+      open: entry !== null,
+      onClose,
+      title: shown?.name,
+      closeLabel: labels.close,
+      detents: ["full"],
+      initialDetent: "full",
+      safeAreaBottom,
+      motion,
+      footer: files.length > 1 ? /* @__PURE__ */ jsxs(View, { style: styles.stepper, children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "ghost",
+            size: "sm",
+            leadingIcon: "chevron-left",
+            disabled: at <= 0,
+            onPress: () => step(-1),
+            accessibilityLabel: labels.previous,
+            children: labels.previous
+          }
+        ),
+        /* @__PURE__ */ jsx(Text, { style: styles.stepperCount, children: at >= 0 ? `${at + 1} / ${files.length}` : "" }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "ghost",
+            size: "sm",
+            trailingIcon: "chevron-right",
+            disabled: at < 0 || at >= files.length - 1,
+            onPress: () => step(1),
+            accessibilityLabel: labels.next,
+            children: labels.next
+          }
+        )
+      ] }) : void 0,
+      children: shown ? custom !== void 0 ? /* @__PURE__ */ jsx(View, { style: styles.previewBody, children: custom }) : isImage ? /* @__PURE__ */ jsx(View, { style: styles.previewImageWrap, children: /* @__PURE__ */ jsx(
+        Image,
+        {
+          source: { uri: src },
+          resizeMode: "contain",
+          onError: () => setFailed(true),
+          style: styles.previewImage,
+          accessibilityLabel: shown.name
+        }
+      ) }) : /* @__PURE__ */ jsxs(View, { style: styles.previewEmpty, children: [
+        /* @__PURE__ */ jsx(FileIcon, { entry: shown, size: "xl" }),
+        /* @__PURE__ */ jsx(Text, { style: styles.previewTitle, children: failed ? labels.previewFailed : labels.previewUnavailable }),
+        /* @__PURE__ */ jsx(Text, { style: styles.previewMeta, children: entryMeta(shown, items, labels, locale) })
+      ] }) : null
+    }
+  );
+}
+function FileMoveSheet({
+  entries,
+  items,
+  onMove,
+  onClose,
+  labels,
+  locale,
+  safeAreaBottom,
+  motion
+}) {
+  const last = React3.useRef(entries);
+  if (entries.length > 0) last.current = entries;
+  const moving = last.current;
+  const [target, setTarget] = React3.useState(void 0);
+  React3.useEffect(() => {
+    if (entries.length > 0) setTarget(void 0);
+  }, [entries]);
+  const index = React3.useMemo(() => indexEntries(items), [items]);
+  const ids = React3.useMemo(() => moving.map((e) => e.id), [moving]);
+  const tree = React3.useMemo(() => {
+    const out = [];
+    const walk = (parentId, depth) => {
+      for (const f of sortEntries(childrenOf(items, parentId), DEFAULT_FILE_SORT, locale)) {
+        if (f.type !== "folder") continue;
+        out.push({ entry: f, depth });
+        walk(f.id, depth + 1);
+      }
+    };
+    walk(null, 1);
+    return out;
+  }, [items, locale]);
+  const allowed = (id) => moveRefusal(index, ids, id) === null;
+  return /* @__PURE__ */ jsx(
+    Sheet,
+    {
+      open: entries.length > 0,
+      onClose,
+      title: labels.chooseFolder,
+      closeLabel: labels.close,
+      detents: ["half", "full"],
+      initialDetent: "full",
+      safeAreaBottom,
+      motion,
+      footer: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "primary",
+          fullWidth: true,
+          disabled: target === void 0,
+          onPress: () => {
+            if (target !== void 0) onMove(target);
+          },
+          children: labels.moveHere
+        }
+      ),
+      children: /* @__PURE__ */ jsxs(ScrollView, { children: [
+        /* @__PURE__ */ jsx(
+          ChoiceRow,
+          {
+            icon: "folder",
+            label: labels.root,
+            selected: target === null,
+            disabled: !allowed(null),
+            onPress: () => setTarget(null)
+          }
+        ),
+        tree.map(({ entry, depth }) => /* @__PURE__ */ jsx(
+          ChoiceRow,
+          {
+            icon: "folder",
+            indent: depth,
+            label: entry.name,
+            selected: target === entry.id,
+            disabled: !allowed(entry.id),
+            onPress: () => setTarget(entry.id)
+          },
+          entry.id
+        ))
+      ] })
+    }
+  );
+}
+function FileNameDialog({
+  open,
+  title,
+  initialName,
+  confirmLabel,
+  validate,
+  onSubmit,
+  onClose,
+  labels: labelsProp,
+  motion
+}) {
+  const labels = useFileManagerLabels(labelsProp);
+  const [name, setName] = React3.useState(initialName);
+  const [touched, setTouched] = React3.useState(false);
+  React3.useEffect(() => {
+    if (open) {
+      setName(initialName);
+      setTouched(false);
+    }
+  }, [open, initialName]);
+  const error = validate(name);
+  const submit = () => {
+    setTouched(true);
+    if (error) {
+      haptics.notify("error");
+      return;
+    }
+    onSubmit(name.trim());
+  };
+  const dot = initialName.lastIndexOf(".");
+  const stemEnd = dot > 0 ? dot : initialName.length;
+  return /* @__PURE__ */ jsxs(Dialog, { open, onClose, title, motion, children: [
+    /* @__PURE__ */ jsx(
+      TextField,
+      {
+        label: labels.nameLabel,
+        value: name,
+        onChangeText: (t) => {
+          setName(t);
+          setTouched(true);
+        },
+        autoFocus: true,
+        selectTextOnFocus: false,
+        selection: touched ? void 0 : { start: 0, end: stemEnd },
+        autoCapitalize: "none",
+        autoCorrect: false,
+        returnKeyType: "done",
+        onSubmitEditing: submit,
+        error: touched && error ? labels.nameError[error] : void 0
+      }
+    ),
+    /* @__PURE__ */ jsxs(DialogFooter, { children: [
+      /* @__PURE__ */ jsx(Button, { variant: "ghost", onPress: onClose, children: labels.cancel }),
+      /* @__PURE__ */ jsx(Button, { variant: "primary", onPress: submit, children: confirmLabel })
+    ] })
+  ] });
+}
+function FileDeleteDialog({
+  open,
+  entries,
+  onConfirm,
+  onClose,
+  labels: labelsProp,
+  motion
+}) {
+  const labels = useFileManagerLabels(labelsProp);
+  const last = React3.useRef(entries);
+  if (entries.length > 0) last.current = entries;
+  const list = last.current;
+  const first = list[0];
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open,
+      onClose,
+      title: labels.deleteTitle(list.length, first?.name ?? ""),
+      description: labels.deleteDescription,
+      motion,
+      children: /* @__PURE__ */ jsxs(DialogFooter, { children: [
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", onPress: onClose, children: labels.keep }),
+        /* @__PURE__ */ jsx(Button, { variant: "danger", onPress: onConfirm, children: labels.deleteConfirm(list.length) })
+      ] })
+    }
+  );
+}
+var sheet2 = createStyleSheet((theme) => ({
+  choiceTrail: { flexDirection: "row", alignItems: "center", gap: theme.space.s2 },
+  choiceDetail: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    color: theme.color.text2
+  },
+  groupLabel: {
+    fontFamily: theme.font.sans,
+    color: theme.color.text3,
+    paddingHorizontal: theme.space.s4,
+    paddingTop: theme.space.s4,
+    paddingBottom: theme.space.s2
+  },
+  segment: { paddingHorizontal: theme.space.s4, paddingTop: theme.space.s2 },
+  rule: {
+    height: theme.borderWidth.hair,
+    backgroundColor: theme.color.border,
+    marginHorizontal: theme.space.s4,
+    marginVertical: theme.space.s2
+  },
+  infoHead: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    paddingHorizontal: theme.space.s4,
+    paddingBottom: theme.space.s3
+  },
+  infoTitle: { flex: 1, minWidth: 0, gap: theme.space.s1 },
+  infoName: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.headline.fontSize,
+    fontWeight: theme.type.headline.fontWeight,
+    lineHeight: theme.type.headline.lineHeight,
+    color: theme.color.text
+  },
+  infoMeta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.subheadline.fontSize,
+    color: theme.color.text2
+  },
+  infoBody: { paddingHorizontal: theme.space.s4 },
+  stepper: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: theme.space.s2
+  },
+  stepperCount: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    fontWeight: theme.type.headline.fontWeight,
+    color: theme.color.text2,
+    fontVariant: ["tabular-nums"]
+  },
+  previewBody: { flex: 1, paddingHorizontal: theme.space.s4 },
+  previewImageWrap: { flex: 1, minHeight: theme.space[256], paddingHorizontal: theme.space.s4 },
+  previewImage: { flex: 1, width: "100%", borderRadius: theme.radius.md },
+  previewEmpty: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    gap: theme.space.s3,
+    paddingVertical: theme.space.s8,
+    paddingHorizontal: theme.space.s5
+  },
+  previewTitle: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.headline.fontSize,
+    fontWeight: theme.type.headline.fontWeight,
+    color: theme.color.text,
+    textAlign: "center"
+  },
+  previewMeta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.subheadline.fontSize,
+    color: theme.color.text2,
+    textAlign: "center"
+  }
+}));
+var SIDEBAR_MIN_WIDTH = 768;
+function useControllable(value, initial, onChange) {
+  const [inner, setInner] = React3.useState(initial);
+  const current = value !== void 0 ? value : inner;
+  const set = React3.useCallback(
+    (next) => {
+      if (value === void 0) setInner(next);
+      onChange?.(next);
+    },
+    [value, onChange]
+  );
+  return [current, set];
+}
+var seq = 0;
+var nextKey = () => `fm${++seq}`;
+function FileManager({
+  items,
+  folderId: folderIdProp,
+  defaultFolderId = null,
+  onFolderChange,
+  view: viewProp,
+  defaultView = "list",
+  onViewChange,
+  sort: sortProp,
+  defaultSort = DEFAULT_FILE_SORT,
+  onSortChange,
+  onCreateFolder,
+  onRename,
+  onDelete,
+  confirmDelete = false,
+  onMove,
+  onOpenFile,
+  onShare,
+  onFavoriteChange,
+  renderPreview,
+  onNotify,
+  loading = false,
+  failed = false,
+  onRetry,
+  recents = true,
+  nested = true,
+  defaultExpanded,
+  sidebar = "auto",
+  density = "comfortable",
+  platform,
+  safeAreaBottom = 0,
+  motion,
+  locale: localeProp,
+  labels: labelsProp
+}) {
+  const theme = useLoamTheme("file-manager");
+  const { styles } = useStyles(sheet3);
+  const labels = useFileManagerLabels(labelsProp);
+  const providerLocale = useLoamLocale();
+  const locale = localeProp ?? providerLocale;
+  const [folderId, setFolderId] = useControllable(
+    folderIdProp,
+    defaultFolderId,
+    onFolderChange
+  );
+  const [view, setView] = useControllable(viewProp, defaultView, onViewChange);
+  const [sort, setSort] = useControllable(sortProp, defaultSort, onSortChange);
+  const [special, setSpecial] = React3.useState(null);
+  const [query, setQuery] = React3.useState("");
+  const android = isAndroidIdiom(
+    theme,
+    platform === "android" || platform === "ios" ? platform : void 0
+  );
+  const [selecting, setSelecting] = React3.useState(false);
+  const [selection, setSelection] = React3.useState([]);
+  const [expanded, setExpanded] = React3.useState(
+    () => new Set(defaultExpanded)
+  );
+  const [pending, setPending] = React3.useState([]);
+  const [width, setWidth] = React3.useState(0);
+  const [optionsOpen, setOptionsOpen] = React3.useState(false);
+  const [locationsOpen, setLocationsOpen] = React3.useState(false);
+  const [info, setInfo] = React3.useState(null);
+  const [preview, setPreview] = React3.useState(null);
+  const [moving, setMoving] = React3.useState([]);
+  const [naming, setNaming] = React3.useState(null);
+  const [deleting, setDeleting] = React3.useState(null);
+  const { entries: drawn, pendingIds } = React3.useMemo(
+    () => applyPending(items, pending),
+    [items, pending]
+  );
+  const index = React3.useMemo(() => indexEntries(drawn), [drawn]);
+  const favoritesOn = Boolean(onFavoriteChange) || drawn.some((e) => e.favorite);
+  React3.useEffect(() => {
+    if (folderId !== null && !index.has(folderId) && !isPlaceholderId(folderId)) setFolderId(null);
+  }, [folderId, index, setFolderId]);
+  const location = special ? { kind: special } : { kind: "folder", id: folderId };
+  const folder = folderId !== null ? index.get(folderId) ?? null : null;
+  const crumbs = React3.useMemo(() => pathTo(index, folderId), [index, folderId]);
+  const parent = crumbs.length > 1 ? crumbs[crumbs.length - 2] : null;
+  const searching = query.trim().length > 0;
+  const listed = React3.useMemo(() => {
+    if (searching)
+      return sortEntries(searchEntries(drawn, query, special ? null : folderId), sort, locale);
+    if (special === "recent") return recentFiles(drawn);
+    if (special === "favorites")
+      return sortEntries(
+        drawn.filter((e) => e.favorite),
+        sort,
+        locale
+      );
+    return sortEntries(childrenOf(drawn, folderId), sort, locale);
+  }, [drawn, query, searching, special, folderId, sort, locale]);
+  const rows = React3.useMemo(
+    () => nested && view === "list" && !searching && special === null ? flattenRows(listed, expanded, (f) => sortEntries(childrenOf(drawn, f.id), sort, locale)) : listed.map((entry) => ({ kind: "entry", entry, depth: 0 })),
+    [nested, view, searching, special, listed, expanded, drawn, sort, locale]
+  );
+  const files = React3.useMemo(() => listed.filter((e) => e.type === "file"), [listed]);
+  const selectedEntries = React3.useMemo(
+    () => selection.map((id) => index.get(id)).filter((e) => e !== void 0),
+    [selection, index]
+  );
+  const wide = sidebar === true || sidebar === "auto" && width >= SIDEBAR_MIN_WIDTH;
+  const showSkeleton = useDelayedLoading(loading && drawn.length === 0);
+  const notify = (title2, result) => {
+    if (typeof result === "function") {
+      const undo = result;
+      onNotify?.({ title: title2, tone: "good", undoable: true, undo: () => void undo() });
+    } else onNotify?.({ title: title2, tone: "good" });
+  };
+  const run = async (action, op, success, optimistic) => {
+    const key = optimistic ? nextKey() : null;
+    if (key && optimistic) setPending((list) => [...list, { key, op: optimistic }]);
+    try {
+      notify(success, await op());
+      return true;
+    } catch {
+      haptics.notify("error");
+      onNotify?.({ title: labels.failed(action), tone: "danger" });
+      return false;
+    } finally {
+      if (key) setPending((list) => list.filter((p) => p.key !== key));
+    }
+  };
+  const folderName = (id) => id === null ? labels.root : index.get(id)?.name ?? labels.root;
+  const topLevel = (entries) => topLevelIds(
+    index,
+    entries.map((e) => e.id)
+  ).map((id) => index.get(id)).filter((e) => e !== void 0);
+  const remove = (entries) => {
+    if (!onDelete || entries.length === 0) return;
+    const list = topLevel(entries);
+    setSelection((s) => s.filter((id) => !list.some((e) => e.id === id)));
+    haptics.notify("warning");
+    void run(labels.delete, () => onDelete(list), labels.deleted(list.length), {
+      kind: "delete",
+      ids: list.map((e) => e.id)
+    });
+  };
+  const askDelete = (entries) => confirmDelete ? setDeleting([...entries]) : remove(entries);
+  const [asking, setAsking] = React3.useState(null);
+  const settleConflicts = (entries, targetId, proceed) => {
+    const ids = new Set(entries.map((e) => e.id));
+    const siblings = childrenOf(drawn, targetId).filter((e) => !ids.has(e.id));
+    const conflicts = findNameConflicts(entries, siblings);
+    if (conflicts.length === 0) {
+      proceed([...entries]);
+      return;
+    }
+    setAsking({
+      conflicts,
+      choices: [],
+      done: (choices) => {
+        if (choices) proceed(...resolveNameConflicts(entries, siblings, conflicts, choices));
+      }
+    });
+  };
+  const answerConflict = (choice, applyToAll) => {
+    if (!asking) return;
+    const next = answerNameConflict(asking.conflicts, asking.choices, choice, applyToAll);
+    if (next.length >= asking.conflicts.length) {
+      setAsking(null);
+      asking.done(next);
+    } else setAsking({ ...asking, choices: next });
+  };
+  const move = (entries, targetId) => {
+    if (!onMove) return;
+    const ids = entries.map((e) => e.id);
+    const refusal = moveRefusal(index, ids, targetId);
+    if (refusal === "into-itself") onNotify?.({ title: labels.cannotMoveIntoItself, tone: "warn" });
+    if (refusal) return;
+    settleConflicts(topLevel(entries), targetId, (list, resolution) => {
+      if (list.length === 0) return;
+      void run(
+        labels.moveTo,
+        () => resolution ? onMove(list, targetId, resolution) : onMove(list, targetId),
+        labels.moved(list.length, folderName(targetId)),
+        {
+          kind: "move",
+          ids: list.map((e) => e.id),
+          targetId
+        }
+      );
+    });
+  };
+  const favorite = (entry) => {
+    if (!onFavoriteChange) return;
+    const next = !entry.favorite;
+    haptics.selection();
+    void run(
+      next ? labels.favorite : labels.unfavorite,
+      () => onFavoriteChange(entry, next),
+      next ? labels.favorite : labels.unfavorite,
+      {
+        kind: "favorite",
+        id: entry.id,
+        favorite: next
+      }
+    );
+  };
+  const submitName = (name) => {
+    const target = naming?.entry ?? null;
+    setNaming(null);
+    if (target) {
+      if (!onRename || name === target.name) return;
+      void run(labels.rename, () => onRename(target, name), labels.renamed(name), {
+        kind: "rename",
+        id: target.id,
+        name
+      });
+    } else if (onCreateFolder) {
+      const at = special ? null : folderId;
+      const draft = {
+        id: placeholderId(nextKey()),
+        name,
+        type: "folder",
+        parentId: at,
+        modifiedAt: Date.now()
+      };
+      void run(labels.newFolder, () => onCreateFolder(at, name), labels.created(name), {
+        kind: "add",
+        entries: [draft]
+      });
+    }
+  };
+  const go = (l) => {
+    setLocationsOpen(false);
+    setQuery("");
+    setSelection([]);
+    if (l.kind === "folder") {
+      setSpecial(null);
+      setFolderId(l.id);
+    } else setSpecial(l.kind);
+  };
+  const toggleSelected = (id) => {
+    haptics.selection();
+    setSelection((s) => s.includes(id) ? s.filter((x) => x !== id) : [...s, id]);
+  };
+  const startSelecting = (id) => {
+    haptics.selection();
+    setSelecting(true);
+    setSelection((s) => s.includes(id) ? s : [...s, id]);
+  };
+  const endSelecting = () => {
+    setSelecting(false);
+    setSelection([]);
+  };
+  const open = (entry) => {
+    if (pendingIds.has(entry.id) && isPlaceholderId(entry.id)) return;
+    if (selecting) return toggleSelected(entry.id);
+    if (entry.type === "folder") return go({ kind: "folder", id: entry.id });
+    if (onOpenFile) return onOpenFile(entry);
+    setPreview(entry);
+  };
+  const toggleExpanded = (id) => {
+    haptics.selection();
+    setExpanded((s) => {
+      const next = new Set(s);
+      if (next.has(id)) next.delete(id);
+      else next.add(id);
+      return next;
+    });
+  };
+  const menuFor = (entry) => {
+    const busy = pendingIds.has(entry.id);
+    const out = [];
+    out.push({
+      key: "open",
+      label: labels.open,
+      icon: entry.type === "folder" ? "folder-open" : "external-link",
+      onSelect: () => open(entry)
+    });
+    if (entry.type === "file")
+      out.push({
+        key: "preview",
+        label: labels.preview,
+        icon: "eye",
+        onSelect: () => setPreview(entry)
+      });
+    if (entry.type === "folder" && nested && view === "list" && !searching && special === null) {
+      const isOpen = expanded.has(entry.id);
+      out.push({
+        key: "disclose",
+        label: isOpen ? labels.collapseFolder(entry.name) : labels.expandFolder(entry.name),
+        icon: isOpen ? "chevron-up" : "chevron-down",
+        onSelect: () => toggleExpanded(entry.id)
+      });
+    }
+    out.push({ key: "info", label: labels.getInfo, icon: "info", onSelect: () => setInfo(entry) });
+    if (busy) return out;
+    if (onRename && !entry.locked)
+      out.push({
+        key: "rename",
+        label: labels.rename,
+        icon: "rename",
+        onSelect: () => setNaming({ entry })
+      });
+    if (onMove && !entry.locked)
+      out.push({
+        key: "move",
+        label: labels.moveTo,
+        icon: "folder-input",
+        onSelect: () => setMoving([entry])
+      });
+    if (onFavoriteChange)
+      out.push({
+        key: "favorite",
+        label: entry.favorite ? labels.unfavorite : labels.favorite,
+        icon: "star",
+        onSelect: () => favorite(entry)
+      });
+    if (onShare && entry.type === "file")
+      out.push({
+        key: "share",
+        label: labels.download,
+        icon: "upload",
+        onSelect: () => onShare([entry])
+      });
+    if (onDelete && !entry.locked)
+      out.push({
+        key: "delete",
+        label: labels.delete,
+        icon: "trash",
+        destructive: true,
+        onSelect: () => askDelete([entry])
+      });
+    return out;
+  };
+  const swipesFor = (entry) => {
+    if (selecting || pendingIds.has(entry.id) || entry.locked) return void 0;
+    const star = onFavoriteChange ? {
+      key: "favorite",
+      label: entry.favorite ? labels.swipeUnfavorite : labels.swipeFavorite,
+      icon: "star",
+      fullSwipe: true,
+      onAction: () => favorite(entry)
+    } : null;
+    const relocate = onMove ? {
+      key: "move",
+      label: labels.moveTo,
+      icon: "folder-input",
+      onAction: () => setMoving([entry])
+    } : null;
+    const trash = onDelete ? {
+      key: "delete",
+      label: labels.delete,
+      icon: "trash",
+      destructive: true,
+      fullSwipe: !confirmDelete,
+      collapses: !confirmDelete,
+      onAction: () => askDelete([entry])
+    } : null;
+    const share = onShare && entry.type === "file" ? {
+      key: "share",
+      label: labels.download,
+      icon: "upload",
+      onAction: () => onShare([entry])
+    } : null;
+    if (!star && !relocate && !trash && !share) return void 0;
+    const picked = [share ?? relocate, trash].filter((a) => a !== null);
+    const trailing = picked.length === 2 ? [picked[0], picked[1]] : picked.length === 1 ? [picked[0]] : [];
+    return { leading: star ? [star] : [], trailing };
+  };
+  const pad = theme.space.s4;
+  const gap = theme.space.s3;
+  const tileMin = theme.space[104] ?? theme.space[100];
+  const mainWidth = wide ? width - SIDEBAR_WIDTH(theme) : width;
+  const columns = Math.max(3, Math.floor((mainWidth - 2 * pad + gap) / (tileMin + gap)));
+  const tileWidth = mainWidth > 0 ? (mainWidth - 2 * pad - gap * (columns - 1)) / columns : tileMin;
+  const renderRow = ({ item: row }) => {
+    if (row.kind !== "entry") {
+      return /* @__PURE__ */ jsx(
+        View,
+        {
+          style: [
+            styles.standIn,
+            { paddingStart: pad + indentOf(row.depth, theme) + DISCLOSURE(theme) }
+          ],
+          children: row.kind === "loading" ? /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: theme.space[120] }) : /* @__PURE__ */ jsx(Text, { style: [styles.standInText, row.kind === "error" && styles.standInError], children: row.kind === "error" ? labels.loadFailed : labels.nestedEmpty })
+        }
+      );
+    }
+    const { entry, depth } = row;
+    const busy = pendingIds.has(entry.id);
+    const isOpen = expanded.has(entry.id);
+    const treeable = nested && view === "list" && !searching && special === null;
+    const meta = entryMeta(entry, drawn, labels, locale);
+    const where = searching || special ? folderName(entry.parentId) : null;
+    const hasDisclosure = treeable && entry.type === "folder";
+    const hasOverflow = android && !selecting;
+    return /* @__PURE__ */ jsxs(View, { style: [styles.rowWrap, busy && styles.busy], children: [
+      /* @__PURE__ */ jsx(
+        ListRow,
+        {
+          title: entry.name,
+          subtitle: where ? `${where} \xB7 ${meta}` : meta,
+          density,
+          divider: true,
+          leading: /* @__PURE__ */ jsxs(View, { style: [styles.lead, { paddingStart: indentOf(depth, theme) }], children: [
+            treeable ? entry.type === "folder" ? (
+              // Holds the disclosure's place; the button itself is a sibling of
+              // the row (below) so two buttons are never nested.
+              /* @__PURE__ */ jsx(View, { style: styles.disclosure })
+            ) : /* @__PURE__ */ jsx(View, { style: styles.disclosure }) : null,
+            /* @__PURE__ */ jsx(FileIcon, { entry, size: density === "compact" ? "md" : "lg" })
+          ] }),
+          trailing: android && !selecting ? (
+            // Android: no swipe or press-and-hold menu (that gesture starts a
+            // selection), so the row's actions sit behind a ghost overflow.
+            /* @__PURE__ */ jsxs(View, { style: styles.trailingRow, children: [
+              entry.favorite ? /* @__PURE__ */ jsx(Icon, { name: "star", size: theme.icon.sm, color: theme.color.text3 }) : null,
+              /* @__PURE__ */ jsx(View, { style: styles.overflow })
+            ] })
+          ) : entry.favorite ? /* @__PURE__ */ jsx(Icon, { name: "star", size: theme.icon.sm, color: theme.color.text3 }) : entry.type === "folder" && !selecting && !treeable ? /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: theme.icon.sm, color: theme.color.text3 }) : void 0,
+          selectable: selecting,
+          selected: selection.includes(entry.id),
+          onSelectedChange: () => toggleSelected(entry.id),
+          onPress: () => open(entry),
+          swipeActions: android ? void 0 : swipesFor(entry),
+          menuItems: selecting || android ? void 0 : menuFor(entry),
+          onLongPress: android && !selecting ? () => startSelecting(entry.id) : void 0,
+          motion
+        }
+      ),
+      hasDisclosure ? /* @__PURE__ */ jsx(
+        View,
+        {
+          pointerEvents: "box-none",
+          style: [styles.slot, { start: theme.space.s4 + indentOf(depth, theme) }],
+          children: /* @__PURE__ */ jsx(
+            Pressable,
+            {
+              accessibilityRole: "button",
+              accessibilityLabel: isOpen ? labels.collapseFolder(entry.name) : labels.expandFolder(entry.name),
+              accessibilityState: { expanded: isOpen },
+              hitSlop: theme.space.s3,
+              onPress: () => toggleExpanded(entry.id),
+              style: styles.disclosure,
+              children: /* @__PURE__ */ jsx(View, { style: isOpen && styles.disclosureOpen, children: /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  name: "chevron-right",
+                  size: theme.icon.sm,
+                  color: theme.color.text3,
+                  strokeWidth: 2
+                }
+              ) })
+            }
+          )
+        }
+      ) : null,
+      hasOverflow ? /* @__PURE__ */ jsx(View, { pointerEvents: "box-none", style: [styles.slot, { end: theme.space.s4 }], children: /* @__PURE__ */ jsx(
+        OverflowAction,
+        {
+          label: labels.moreActions(entry.name),
+          items: menuFor(entry),
+          motion
+        }
+      ) }) : null
+    ] });
+  };
+  const renderTile = ({ item: entry }) => {
+    const busy = pendingIds.has(entry.id);
+    const chosen = selection.includes(entry.id);
+    const body = /* @__PURE__ */ jsxs(View, { style: [styles.tile, { width: tileWidth }, busy && styles.busy], children: [
+      /* @__PURE__ */ jsxs(View, { style: [styles.tileArt, chosen && styles.tileArtChosen], children: [
+        /* @__PURE__ */ jsx(FileIcon, { entry, size: "xl" }),
+        selecting ? /* @__PURE__ */ jsx(View, { style: styles.check, pointerEvents: "none", children: /* @__PURE__ */ jsx(Checkbox, { size: "sm", checked: chosen, accessibilityLabel: entry.name }) }) : null
+      ] }),
+      /* @__PURE__ */ jsx(Text, { style: styles.tileName, numberOfLines: 2, children: entry.name }),
+      /* @__PURE__ */ jsx(Text, { style: styles.tileMeta, numberOfLines: 1, children: entryMeta(entry, drawn, labels, locale) })
+    ] });
+    if (selecting) {
+      return /* @__PURE__ */ jsx(
+        Pressable,
+        {
+          accessibilityRole: "checkbox",
+          accessibilityLabel: entry.name,
+          accessibilityState: { checked: chosen },
+          onPress: () => toggleSelected(entry.id),
+          children: body
+        }
+      );
+    }
+    if (android) {
+      return /* @__PURE__ */ jsx(
+        Pressable,
+        {
+          accessibilityRole: "button",
+          accessibilityLabel: entry.name,
+          onPress: () => open(entry),
+          onLongPress: () => startSelecting(entry.id),
+          children: body
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      ContextMenu,
+      {
+        items: menuFor(entry),
+        onPress: () => open(entry),
+        platform,
+        accessibilityLabel: entry.name,
+        radius: theme.radius.md,
+        motion,
+        children: body
+      }
+    );
+  };
+  const title = searching ? labels.searchResults(special ? labels.root : folderName(folderId)) : special === "recent" ? labels.recent : special === "favorites" ? labels.favorites : folder?.name ?? labels.root;
+  const canBack = special === null && folderId !== null;
+  const hasLocations = recents || favoritesOn || childrenOf(drawn, null).some((e) => e.type === "folder");
+  const empty = (() => {
+    if (failed)
+      return /* @__PURE__ */ jsx(
+        EmptyState,
+        {
+          variant: "error",
+          title: labels.loadFailed,
+          actionLabel: onRetry ? labels.retry : void 0,
+          onAction: onRetry
+        }
+      );
+    if (showSkeleton)
+      return /* @__PURE__ */ jsx(SkeletonRows, { view, columns, tileWidth, label: labels.loading });
+    if (loading) return null;
+    if (searching)
+      return /* @__PURE__ */ jsx(
+        EmptyState,
+        {
+          variant: "no-results",
+          title: labels.noResultsTitle(query.trim()),
+          description: labels.noResultsDescription,
+          actionLabel: labels.clearSearch,
+          onAction: () => setQuery("")
+        }
+      );
+    if (special === "recent") return /* @__PURE__ */ jsx(EmptyState, { icon: "clock", title: labels.noRecent });
+    return /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        icon: "folder-open",
+        title: labels.emptyFolderTitle,
+        actionLabel: onCreateFolder && special === null ? labels.newFolder : void 0,
+        onAction: () => setNaming({ entry: null })
+      }
+    );
+  })();
+  const locationsList = /* @__PURE__ */ jsx(
+    FileLocations,
+    {
+      location,
+      onLocationChange: go,
+      folders: sortEntries(
+        childrenOf(drawn, null).filter((e) => e.type === "folder"),
+        DEFAULT_FILE_SORT,
+        locale
+      ),
+      recents,
+      favorites: favoritesOn,
+      labels
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: styles.root,
+      onLayout: (e) => setWidth(e.nativeEvent.layout.width),
+      children: [
+        wide ? /* @__PURE__ */ jsx(View, { style: styles.side, children: locationsList }) : null,
+        /* @__PURE__ */ jsxs(View, { style: styles.main, children: [
+          android && selecting ? /* @__PURE__ */ jsxs(View, { style: styles.appBar, accessibilityRole: "toolbar", children: [
+            /* @__PURE__ */ jsx(NavHeaderAction, { icon: "x", accessibilityLabel: labels.done, onPress: endSelecting }),
+            /* @__PURE__ */ jsx(Text, { style: styles.appBarTitle, accessibilityRole: "header", children: labels.selected(selection.length) }),
+            /* @__PURE__ */ jsx(
+              NavHeaderAction,
+              {
+                icon: "folder-input",
+                accessibilityLabel: labels.moveTo,
+                disabled: !onMove || selectedEntries.length === 0,
+                onPress: () => setMoving(selectedEntries)
+              }
+            ),
+            onShare ? /* @__PURE__ */ jsx(
+              NavHeaderAction,
+              {
+                icon: "upload",
+                accessibilityLabel: labels.download,
+                disabled: !selectedEntries.some((e) => e.type === "file"),
+                onPress: () => onShare(selectedEntries.filter((e) => e.type === "file"))
+              }
+            ) : null,
+            /* @__PURE__ */ jsx(
+              NavHeaderAction,
+              {
+                icon: "trash",
+                accessibilityLabel: labels.delete,
+                disabled: !onDelete || selectedEntries.length === 0,
+                onPress: () => {
+                  askDelete(selectedEntries);
+                  if (!confirmDelete) setSelecting(false);
+                }
+              }
+            )
+          ] }) : /* @__PURE__ */ jsx(
+            NavHeader,
+            {
+              title: selecting ? labels.selected(selection.length) : title,
+              large: !selecting,
+              leading: !selecting && canBack ? "chevron-left" : void 0,
+              leadingLabel: canBack ? parent?.name ?? labels.root : void 0,
+              onLeadingPress: () => go({ kind: "folder", id: folder?.parentId ?? null }),
+              leadingSlot: !selecting && !canBack && !wide && hasLocations ? /* @__PURE__ */ jsx(
+                NavHeaderAction,
+                {
+                  icon: "menu",
+                  accessibilityLabel: labels.locations,
+                  onPress: () => setLocationsOpen(true)
+                }
+              ) : void 0,
+              showSearch: !selecting,
+              searchPlaceholder: labels.searchPlaceholder,
+              searchValue: query,
+              onSearchChangeText: setQuery,
+              onSearchCancel: () => setQuery(""),
+              trailing: /* @__PURE__ */ jsxs(View, { style: styles.headerActions, children: [
+                selecting ? null : /* @__PURE__ */ jsx(
+                  NavHeaderAction,
+                  {
+                    icon: "sliders",
+                    accessibilityLabel: labels.view,
+                    onPress: () => setOptionsOpen(true)
+                  }
+                ),
+                listed.length > 0 || selecting ? /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "ghost",
+                    size: "sm",
+                    onPress: () => selecting ? endSelecting() : setSelecting(true),
+                    children: selecting ? labels.done : labels.select
+                  }
+                ) : null
+              ] })
+            }
+          ),
+          listed.length === 0 || failed ? /* @__PURE__ */ jsx(View, { style: styles.empty, children: empty }) : view === "grid" ? /* @__PURE__ */ jsx(
+            FlatList,
+            {
+              data: listed,
+              keyExtractor: (e) => e.id,
+              numColumns: columns,
+              renderItem: renderTile,
+              columnWrapperStyle: { gap },
+              contentContainerStyle: [
+                styles.gridContent,
+                { paddingBottom: theme.space.s6 + safeAreaBottom }
+              ],
+              initialNumToRender: columns * 6,
+              windowSize: 7
+            },
+            `grid-${columns}`
+          ) : /* @__PURE__ */ jsx(
+            FlatList,
+            {
+              data: rows,
+              keyExtractor: (r) => r.kind === "entry" ? r.entry.id : `${r.kind}:${r.parent.id}`,
+              renderItem: renderRow,
+              contentContainerStyle: { paddingBottom: theme.space.s6 + safeAreaBottom },
+              initialNumToRender: 16,
+              windowSize: 9
+            },
+            "list"
+          ),
+          selecting && !android ? /* @__PURE__ */ jsxs(View, { style: [styles.bar, { paddingBottom: theme.space.s2 + safeAreaBottom }], children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                leadingIcon: "folder-input",
+                disabled: !onMove || selectedEntries.length === 0,
+                onPress: () => setMoving(selectedEntries),
+                children: labels.moveTo
+              }
+            ),
+            onShare ? /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                leadingIcon: "upload",
+                disabled: !selectedEntries.some((e) => e.type === "file"),
+                onPress: () => onShare(selectedEntries.filter((e) => e.type === "file")),
+                children: labels.download
+              }
+            ) : null,
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                leadingIcon: "trash",
+                disabled: !onDelete || selectedEntries.length === 0,
+                onPress: () => {
+                  askDelete(selectedEntries);
+                  if (!confirmDelete) setSelecting(false);
+                },
+                accessibilityLabel: labels.delete,
+                children: /* @__PURE__ */ jsx(Text, { style: styles.danger, children: labels.delete })
+              }
+            )
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ jsx(
+          FileOptionsSheet,
+          {
+            open: optionsOpen,
+            onClose: () => setOptionsOpen(false),
+            view,
+            onViewChange: setView,
+            sort,
+            onSortChange: setSort,
+            onNewFolder: onCreateFolder && special === null ? () => setNaming({ entry: null }) : void 0,
+            labels,
+            safeAreaBottom,
+            motion
+          }
+        ),
+        !wide ? /* @__PURE__ */ jsx(
+          SheetLocations,
+          {
+            open: locationsOpen,
+            onClose: () => setLocationsOpen(false),
+            labels,
+            safeAreaBottom,
+            motion,
+            children: locationsList
+          }
+        ) : null,
+        /* @__PURE__ */ jsx(
+          FileInfoSheet,
+          {
+            entry: info,
+            items: drawn,
+            onClose: () => setInfo(null),
+            labels,
+            locale,
+            safeAreaBottom,
+            motion
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FilePreviewSheet,
+          {
+            entry: preview,
+            files,
+            onEntryChange: setPreview,
+            onClose: () => setPreview(null),
+            items: drawn,
+            renderPreview,
+            labels,
+            locale,
+            safeAreaBottom,
+            motion
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FileMoveSheet,
+          {
+            entries: moving,
+            items: drawn,
+            onClose: () => setMoving([]),
+            onMove: (target) => {
+              const list = moving;
+              setMoving([]);
+              endSelecting();
+              move(list, target);
+            },
+            labels,
+            locale,
+            safeAreaBottom,
+            motion
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FileNameDialog,
+          {
+            open: naming !== null,
+            title: naming?.entry ? labels.rename : labels.newFolder,
+            initialName: naming?.entry ? naming.entry.name : uniqueFileName(labels.untitledFolder, childrenOf(drawn, folderId)),
+            confirmLabel: naming?.entry ? labels.save : labels.create,
+            validate: (name) => validateFileName(
+              name,
+              childrenOf(drawn, naming?.entry?.parentId ?? folderId),
+              naming?.entry?.id
+            ),
+            onSubmit: submitName,
+            onClose: () => setNaming(null),
+            labels,
+            motion
+          }
+        ),
+        asking ? /* @__PURE__ */ jsx(
+          NameConflictDialog,
+          {
+            open: true,
+            onClose: () => {
+              setAsking(null);
+              asking.done(null);
+            },
+            existing: asking.conflicts[asking.choices.length].existing,
+            incoming: asking.conflicts[asking.choices.length].incoming,
+            index: asking.choices.length + 1,
+            total: asking.conflicts.length,
+            onResolve: answerConflict,
+            labels,
+            motion
+          }
+        ) : null,
+        /* @__PURE__ */ jsx(
+          FileDeleteDialog,
+          {
+            open: deleting !== null,
+            entries: deleting ?? [],
+            onClose: () => setDeleting(null),
+            onConfirm: () => {
+              const list = deleting ?? [];
+              setDeleting(null);
+              endSelecting();
+              remove(list);
+            },
+            labels,
+            motion
+          }
+        )
+      ]
+    }
+  );
+}
+function SheetLocations({
+  open,
+  onClose,
+  labels,
+  safeAreaBottom,
+  motion,
+  children
+}) {
+  return /* @__PURE__ */ jsx(
+    Sheet,
+    {
+      open,
+      onClose,
+      title: labels.locations,
+      closeLabel: labels.close,
+      safeAreaBottom,
+      motion,
+      children
+    }
+  );
+}
+function SkeletonRows({
+  view,
+  columns,
+  tileWidth,
+  label
+}) {
+  const theme = useLoamTheme("file-manager");
+  const { styles } = useStyles(sheet3);
+  if (view === "grid") {
+    return /* @__PURE__ */ jsx(View, { style: [styles.gridContent, styles.skeletonGrid], accessibilityLabel: label, children: Array.from({ length: columns * 2 }, (_, i) => /* @__PURE__ */ jsxs(View, { style: [styles.tile, { width: tileWidth }], children: [
+      /* @__PURE__ */ jsx(Skeleton, { variant: "rect", width: theme.space[64], height: theme.space[64], radius: "md" }),
+      /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: tileWidth * 0.7 })
+    ] }, i)) });
+  }
+  return /* @__PURE__ */ jsx(View, { accessibilityLabel: label, children: Array.from({ length: 8 }, (_, i) => /* @__PURE__ */ jsxs(View, { style: styles.skeletonRow, children: [
+    /* @__PURE__ */ jsx(Skeleton, { variant: "rect", width: theme.space[48], height: theme.space[48], radius: "sm" }),
+    /* @__PURE__ */ jsxs(View, { style: styles.skeletonText, children: [
+      /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: theme.space[160] * (i % 3 === 0 ? 1 : 0.75) }),
+      /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: theme.space[100] })
+    ] })
+  ] }, i)) });
+}
+var SIDEBAR_WIDTH = (theme) => theme.space[256];
+var DISCLOSURE = (theme) => theme.space.s5;
+var indentOf = (depth, theme) => depth * theme.space[20];
+function OverflowAction({
+  label,
+  items,
+  motion
+}) {
+  const { styles, theme } = useStyles(sheet3);
+  const ref = React3.useRef(null);
+  const [open, setOpen] = React3.useState(false);
+  const [anchor, setAnchor] = React3.useState(null);
+  const show = () => {
+    const node = ref.current;
+    if (node && typeof node.measureInWindow === "function") {
+      node.measureInWindow((x, y, width, height) => setAnchor({ x, y, width, height }));
+    }
+    setOpen(true);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        ref,
+        testID: "file-manager-overflow",
+        accessibilityRole: "button",
+        accessibilityLabel: label,
+        onPress: show,
+        hitSlop: Math.max(0, (theme.hit.sm - theme.ctl.sm) / 2),
+        android_ripple: { color: theme.state.pressed, borderless: true },
+        style: styles.overflow,
+        children: /* @__PURE__ */ jsx(Icon, { name: "more-horizontal", size: theme.icon.md, color: theme.color.text2 })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ContextMenuOverlay,
+      {
+        open,
+        onClose: () => setOpen(false),
+        items,
+        anchor,
+        platform: "android",
+        accessibilityLabel: label,
+        motion
+      }
+    )
+  ] });
+}
+var sheet3 = createStyleSheet((theme) => ({
+  root: { flex: 1, flexDirection: "row", backgroundColor: theme.color.bg },
+  side: {
+    width: SIDEBAR_WIDTH(theme),
+    borderEndWidth: theme.borderWidth.hair,
+    borderEndColor: theme.color.border,
+    backgroundColor: theme.color.surface,
+    paddingHorizontal: theme.space.s2,
+    paddingTop: theme.space.s4
+  },
+  main: { flex: 1, minWidth: 0 },
+  headerActions: { flexDirection: "row", alignItems: "center", gap: theme.space.s1 },
+  empty: { flex: 1, justifyContent: "center" },
+  lead: { flexDirection: "row", alignItems: "center", gap: theme.space.s1 },
+  trailingRow: { flexDirection: "row", alignItems: "center", gap: theme.space.s2 },
+  overflow: {
+    width: theme.ctl.sm,
+    height: theme.ctl.sm,
+    borderRadius: theme.radius.full,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  disclosure: {
+    width: DISCLOSURE(theme),
+    height: DISCLOSURE(theme),
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  disclosureOpen: { transform: [{ rotate: "90deg" }] },
+  rowWrap: { position: "relative" },
+  slot: { position: "absolute", top: 0, bottom: 0, justifyContent: "center" },
+  busy: { opacity: theme.state.disabledOpacity },
+  standIn: {
+    minHeight: theme.ctl.lg,
+    justifyContent: "center",
+    paddingEnd: theme.space.s4
+  },
+  standInText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    color: theme.color.text2
+  },
+  standInError: { color: theme.color.dangerOnSoft },
+  gridContent: {
+    paddingHorizontal: theme.space.s4,
+    paddingTop: theme.space.s2,
+    gap: theme.space.s5
+  },
+  skeletonGrid: { flexDirection: "row", flexWrap: "wrap", columnGap: theme.space.s3 },
+  tile: { alignItems: "center", gap: theme.space.s1, paddingVertical: theme.space.s1 },
+  tileArt: {
+    width: theme.space[76],
+    height: theme.space[76],
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: theme.radius.md,
+    marginBottom: theme.space.s1
+  },
+  tileArtChosen: {
+    backgroundColor: theme.state.selected
+  },
+  tileName: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    fontWeight: theme.type.headline.fontWeight,
+    color: theme.color.text,
+    textAlign: "center"
+  },
+  tileMeta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    lineHeight: theme.type.caption1.lineHeight,
+    color: theme.color.text3,
+    textAlign: "center"
+  },
+  // Top-start, where web draws it, so it never sits under the status badge.
+  check: { position: "absolute", top: theme.space.s1, start: theme.space.s1 },
+  appBar: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s1,
+    minHeight: theme.layout.appbarH,
+    paddingHorizontal: theme.space.s2,
+    backgroundColor: theme.color.surface2
+  },
+  appBarTitle: {
+    flex: 1,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.title3.fontSize,
+    color: theme.color.text
+  },
+  bar: {
+    flexDirection: "row",
+    justifyContent: "space-around",
+    alignItems: "center",
+    paddingTop: theme.space.s2,
+    paddingHorizontal: theme.space.s2,
+    borderTopWidth: theme.borderWidth.hair,
+    borderTopColor: theme.color.border,
+    backgroundColor: theme.color.surface
+  },
+  danger: {
+    color: theme.color.dangerOnSoft,
+    fontFamily: theme.font.sans,
+    fontWeight: theme.type.headline.fontWeight
+  },
+  skeletonRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    paddingHorizontal: theme.space.s4,
+    minHeight: theme.layout.listRowH
+  },
+  skeletonText: { gap: theme.space.s2 }
+}));
+var isPromise = (value) => typeof value?.then === "function";
+var DEFAULT_NAME_CONFLICT_LABELS = {
+  counter: (i, n) => `Conflict ${i} of ${n}`,
+  title: (name) => `\u201C${name}\u201D already exists`,
+  description: (folder, destination) => `A ${folder ? "folder" : "file"} with this name is already in ${destination ?? "this folder"}.`,
+  existing: (destination) => `In ${destination ?? "this folder"}`,
+  incoming: "Uploading",
+  newer: "Newer",
+  modified: (date) => `Modified ${date}`,
+  skip: "Skip",
+  keepBoth: "Keep both",
+  replace: "Replace",
+  merge: "Merge",
+  applyToAll: (others) => `Do this for the other ${others} ${others === 1 ? "conflict" : "conflicts"}`,
+  keepBothNote: (newName) => `Keep both saves it as \u201C${newName}\u201D.`,
+  folderConsequence: (items) => items === void 0 ? "Replace removes the existing folder and everything in it." : `Replace removes the ${items.toLocaleString()} ${items === 1 ? "file" : "files"} in the existing folder.`,
+  cannotReplace: "The existing item is locked, so it cannot be replaced.",
+  failed: (action) => `${action} failed.`,
+  tryAgain: "Try again"
+};
+function keepBothName(name) {
+  const dot = name.lastIndexOf(".");
+  return dot > 0 ? `${name.slice(0, dot)} (1)${name.slice(dot)}` : `${name} (1)`;
+}
+function ConflictRow({
+  kind,
+  name,
+  origin,
+  side,
+  newer,
+  labels
+}) {
+  const { styles: s } = useStyles(sheet4);
+  const date = side?.modifiedAt === void 0 ? "" : new Date(side.modifiedAt).toLocaleDateString(void 0, { day: "numeric", month: "short" });
+  const meta = [
+    kind === "file" && side?.size !== void 0 ? formatFileSize(side.size) : "",
+    date ? labels.modified(date) : ""
+  ].filter(Boolean).join(" \xB7 ");
+  return /* @__PURE__ */ jsxs(View, { style: s.row, children: [
+    /* @__PURE__ */ jsx(
+      IconTile,
+      {
+        icon: FILE_CATEGORY_ICON[fileCategory({ name, type: kind })],
+        tone: kind === "folder" ? "accent" : "neutral",
+        size: "md"
+      }
+    ),
+    /* @__PURE__ */ jsxs(View, { style: s.rowText, children: [
+      /* @__PURE__ */ jsx(Text$1, { variant: "overline", tone: "secondary", children: origin }),
+      /* @__PURE__ */ jsx(Text$1, { variant: "subheadline", style: s.name, numberOfLines: 1, ellipsizeMode: "middle", children: name }),
+      meta ? /* @__PURE__ */ jsx(Text$1, { variant: "caption1", tone: "secondary", style: s.meta, children: meta }) : null
+    ] }),
+    newer ? /* @__PURE__ */ jsx(Badge, { variant: "good", size: "sm", children: labels.newer }) : null
+  ] });
+}
+function NameConflictCard({
+  name,
+  kind = "file",
+  destination,
+  existing,
+  incoming,
+  existingItems,
+  index,
+  total,
+  onResolve,
+  loading,
+  error,
+  cannotReplace,
+  labels: labelsProp
+}) {
+  const { styles: s } = useStyles(sheet4);
+  const labels = React3.useMemo(() => ({ ...DEFAULT_NAME_CONFLICT_LABELS, ...labelsProp }), [labelsProp]);
+  const [pending, setPending] = React3.useState(null);
+  const [failed, setFailed] = React3.useState(null);
+  const [all, setAll] = React3.useState(false);
+  const mounted = React3.useRef(true);
+  React3.useEffect(
+    () => () => {
+      mounted.current = false;
+    },
+    []
+  );
+  const folder = kind === "folder";
+  const batch = total !== void 0 && total > 1;
+  const busy = loading ?? pending;
+  const newer = newerSide(existing?.modifiedAt, incoming?.modifiedAt);
+  const resolve = (choice) => () => {
+    if (busy) return;
+    setFailed(null);
+    const result = onResolve(choice, batch && all);
+    if (!isPromise(result)) return;
+    setPending(choice);
+    result.then(
+      () => {
+        if (mounted.current) setPending(null);
+      },
+      () => {
+        if (!mounted.current) return;
+        setPending(null);
+        setFailed(choice);
+      }
+    );
+  };
+  const choices = folder ? [
+    { choice: "skip", label: labels.skip },
+    { choice: "replace", label: labels.replace },
+    { choice: "merge", label: labels.merge, primary: true }
+  ] : [
+    { choice: "skip", label: labels.skip },
+    { choice: "keep-both", label: labels.keepBoth },
+    { choice: "replace", label: labels.replace, primary: true }
+  ];
+  const primary = choices.find((c) => c.primary);
+  const retry = failed ?? primary.choice;
+  const showError = error !== void 0 || failed !== null;
+  return /* @__PURE__ */ jsxs(View, { style: s.card, accessibilityRole: "alert", children: [
+    /* @__PURE__ */ jsxs(View, { style: s.header, children: [
+      index !== void 0 && total !== void 0 ? /* @__PURE__ */ jsx(Text$1, { variant: "overline", tone: "secondary", children: labels.counter(index, total) }) : null,
+      /* @__PURE__ */ jsx(Text$1, { variant: "headline", style: s.title, children: labels.title(name) }),
+      /* @__PURE__ */ jsx(Text$1, { variant: "subheadline", tone: "secondary", children: labels.description(folder, destination) })
+    ] }),
+    /* @__PURE__ */ jsxs(View, { style: s.compare, children: [
+      /* @__PURE__ */ jsx(
+        ConflictRow,
+        {
+          kind,
+          name,
+          origin: labels.existing(destination),
+          side: existing,
+          newer: newer === "a",
+          labels
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        ConflictRow,
+        {
+          kind,
+          name,
+          origin: labels.incoming,
+          side: incoming,
+          newer: newer === "b",
+          labels
+        }
+      )
+    ] }),
+    folder ? /* @__PURE__ */ jsx(View, { style: s.consequence, children: /* @__PURE__ */ jsx(Text$1, { variant: "footnote", children: labels.folderConsequence(existingItems) }) }) : null,
+    cannotReplace ? /* @__PURE__ */ jsx(Text$1, { variant: "footnote", tone: "secondary", children: cannotReplace }) : null,
+    batch ? /* @__PURE__ */ jsx(
+      Checkbox,
+      {
+        size: "sm",
+        label: labels.applyToAll((total ?? 1) - 1),
+        checked: all,
+        disabled: !!busy,
+        onCheckedChange: setAll
+      }
+    ) : null,
+    showError ? /* @__PURE__ */ jsx(
+      Alert,
+      {
+        tone: "danger",
+        size: "compact",
+        title: error ?? labels.failed(choices.find((c) => c.choice === retry)?.label ?? ""),
+        action: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", disabled: !!busy, onPress: resolve(retry), children: labels.tryAgain })
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(View, { style: s.actions, children: choices.map((c) => /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: c.primary ? "primary" : "outline",
+        size: "md",
+        loading: busy === c.choice,
+        disabled: !!busy && busy !== c.choice || c.choice === "replace" && !!cannotReplace,
+        onPress: resolve(c.choice),
+        children: c.label
+      },
+      c.choice
+    )) }),
+    !folder ? /* @__PURE__ */ jsx(Text$1, { variant: "footnote", tone: "secondary", children: labels.keepBothNote(keepBothName(name)) }) : null
+  ] });
+}
+var sheet4 = createStyleSheet((theme) => ({
+  card: {
+    width: "100%",
+    maxWidth: theme.panel.xl,
+    backgroundColor: theme.color.surface,
+    borderRadius: theme.radius.xl,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    padding: theme.space.s5,
+    gap: theme.space.s3,
+    ...theme.shadow.lg
+  },
+  header: { gap: theme.space.s1 },
+  title: { color: theme.color.text },
+  compare: {
+    gap: theme.space.s3,
+    padding: theme.space.s3,
+    borderRadius: theme.radius.md,
+    backgroundColor: theme.color.surface2
+  },
+  row: { flexDirection: "row", alignItems: "center", gap: theme.space.s3 },
+  rowText: { flex: 1, minWidth: 0, gap: theme.space[2] },
+  name: { fontWeight: theme.type.headline.fontWeight, color: theme.color.text },
+  meta: { fontVariant: ["tabular-nums"] },
+  consequence: {
+    borderRadius: theme.radius.md,
+    backgroundColor: theme.color.surface2,
+    paddingHorizontal: theme.space.s4,
+    paddingVertical: theme.space.s3
+  },
+  actions: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    justifyContent: "flex-end",
+    gap: theme.space.s2
+  }
+}));
+
+export { DEFAULT_NAME_CONFLICT_LABELS, FileDeleteDialog, FileIcon, FileInfoSheet, FileLocations, FileManager, FileMoveSheet, FileNameDialog, FileOptionsSheet, FilePreviewSheet, NameConflictCard, entryMeta, keepBothName };