@btndprojects/loam-ui-native 0.1.0 → 0.2.1

package/dist/chunk-TRGFFU6A.js

@@ -0,0 +1,1456 @@
+import { NavHeader, NavHeaderAction } from './chunk-NTQ2F3AU.js';
+import { ListRow } from './chunk-C4GTDLRC.js';
+import { ContextMenu } from './chunk-U5NLHYV6.js';
+import { EmptyState } from './chunk-KFJGFLMW.js';
+import { SegmentedControl } from './chunk-TQVAIKFD.js';
+import { Sheet } from './chunk-QYPE5JX3.js';
+import { DescriptionList } from './chunk-QIKT7LIB.js';
+import { Skeleton } from './chunk-PNF3NKB5.js';
+import { TextField } from './chunk-7BUIKDD6.js';
+import { Dialog, DialogFooter } from './chunk-GDKVKNR2.js';
+import { Button } from './chunk-E2E3I5W2.js';
+import { haptics } from './chunk-NY2U3PBI.js';
+import { useLabels, useLoamLocale } from './chunk-APCWFOZW.js';
+import { Icon } from './chunk-UXGIW7OK.js';
+import { __export, __reExport } from './chunk-I2KLQ2HA.js';
+import * as React5 from 'react';
+import { View, Image, Text, ScrollView, FlatList, Pressable } from 'react-native';
+import { createStyleSheet, useLoamTheme, useStyles } from '@btndprojects/loam-theme-native';
+import * as loam_file_manager_core_star from '@btndprojects/loam-file-manager-core';
+import { resolveFileManagerLabels, fileCategory, FILE_CATEGORY_ICON, DEFAULT_FILE_SORT, childrenOf, formatFileSize, indexEntries, pathTo, summarize, applyPending, isPlaceholderId, sortEntries, searchEntries, recentFiles, flattenRows, validateFileName, uniqueFileName, moveRefusal, placeholderId, topLevelIds } from '@btndprojects/loam-file-manager-core';
+import { TIMING } from '@btndprojects/loam-tokens';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+// src/file-manager/file-manager-labels.ts
+var file_manager_labels_exports = {};
+__export(file_manager_labels_exports, {
+  useFileManagerLabels: () => useFileManagerLabels
+});
+__reExport(file_manager_labels_exports, loam_file_manager_core_star);
+var NO_DEFAULTS = {};
+function useFileManagerLabels(own) {
+  const provided = useLabels("fileManager", NO_DEFAULTS);
+  return React5.useMemo(
+    () => resolveFileManagerLabels({
+      ...provided,
+      ...own,
+      sortKey: { ...provided.sortKey, ...own?.sortKey },
+      category: { ...provided.category, ...own?.category },
+      nameError: { ...provided.nameError, ...own?.nameError }
+    }),
+    [provided, own]
+  );
+}
+function useDelayedLoading(loading, delay = TIMING.loadingFloor) {
+  const [visible, setVisible] = React5.useState(false);
+  const shownAt = React5.useRef(0);
+  React5.useEffect(() => {
+    if (loading) {
+      if (visible) return;
+      const t2 = setTimeout(() => {
+        shownAt.current = Date.now();
+        setVisible(true);
+      }, delay);
+      return () => clearTimeout(t2);
+    }
+    if (!visible) return;
+    const remaining = Math.max(0, delay - (Date.now() - shownAt.current));
+    const t = setTimeout(() => setVisible(false), remaining);
+    return () => clearTimeout(t);
+  }, [loading, visible, delay]);
+  return visible;
+}
+function FileIcon({ entry, size = "md" }) {
+  const theme = useLoamTheme("file-manager");
+  const { styles } = useStyles(sheet, { size });
+  const [broken, setBroken] = React5.useState(false);
+  const [loaded, setLoaded] = React5.useState(false);
+  const thumb = entry.thumbnailUrl;
+  React5.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";
+  return /* @__PURE__ */ jsxs(View, { style: [styles.frame, showThumb && styles.thumbFrame], accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: [
+    !showThumb || !loaded ? /* @__PURE__ */ jsx(
+      Icon,
+      {
+        name: FILE_CATEGORY_ICON[category],
+        size: glyph,
+        strokeWidth: large ? 1.25 : 1.5,
+        color: 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
+  ] });
+}
+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
+  },
+  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__ */ jsxs(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityState: { selected: Boolean(selected), disabled: Boolean(disabled) },
+      accessibilityLabel: detail ? `${label}, ${detail}` : label,
+      disabled,
+      onPress,
+      style: ({ pressed }) => [
+        styles.choice,
+        { paddingStart: theme.space.s4 + indent * theme.space.s5 },
+        pressed && styles.choicePressed,
+        disabled && styles.choiceDisabled
+      ],
+      children: [
+        icon ? /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.icon.md, color: selected ? theme.color.accentStrong : theme.color.text2 }) : null,
+        /* @__PURE__ */ jsx(Text, { style: [styles.choiceLabel, selected && styles.choiceLabelSelected], numberOfLines: 1, children: label }),
+        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
+      ]
+    }
+  );
+}
+function GroupLabel({ children }) {
+  const { styles } = useStyles(sheet2);
+  return /* @__PURE__ */ jsx(Text, { style: styles.groupLabel, 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 = React5.useRef(entry);
+  if (entry) last.current = entry;
+  const shown = last.current;
+  const rows = React5.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 = React5.useRef(entry);
+  if (entry) last.current = entry;
+  const shown = last.current;
+  const [failed, setFailed] = React5.useState(false);
+  React5.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 = React5.useRef(entries);
+  if (entries.length > 0) last.current = entries;
+  const moving = last.current;
+  const [target, setTarget] = React5.useState(void 0);
+  React5.useEffect(() => {
+    if (entries.length > 0) setTarget(void 0);
+  }, [entries]);
+  const index = React5.useMemo(() => indexEntries(items), [items]);
+  const ids = React5.useMemo(() => moving.map((e) => e.id), [moving]);
+  const tree = React5.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, motion }) {
+  const [name, setName] = React5.useState(initialName);
+  const [touched, setTouched] = React5.useState(false);
+  React5.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({ entries, onConfirm, onClose, labels, motion }) {
+  const last = React5.useRef(entries);
+  if (entries) last.current = entries;
+  const list = last.current ?? [];
+  const first = list[0];
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open: entries !== null,
+      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) => ({
+  choice: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    minHeight: theme.ctl.lg,
+    paddingEnd: theme.space.s4,
+    paddingVertical: theme.space.s2,
+    borderRadius: theme.radius.md
+  },
+  choicePressed: { backgroundColor: theme.color.surface2 },
+  choiceDisabled: { opacity: theme.state.disabledOpacity },
+  choiceLabel: {
+    flex: 1,
+    minWidth: 0,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.body.fontSize,
+    lineHeight: theme.type.body.lineHeight,
+    color: theme.color.text
+  },
+  choiceLabelSelected: { color: theme.color.accentStrong, fontWeight: theme.type.headline.fontWeight },
+  choiceDetail: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    color: theme.color.text3
+  },
+  groupLabel: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    fontWeight: theme.type.headline.fontWeight,
+    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,
+    color: theme.color.text3,
+    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] = React5.useState(initial);
+  const current = value !== void 0 ? value : inner;
+  const set = React5.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,
+  error = 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] = React5.useState(null);
+  const [query, setQuery] = React5.useState("");
+  const [selecting, setSelecting] = React5.useState(false);
+  const [selection, setSelection] = React5.useState([]);
+  const [expanded, setExpanded] = React5.useState(
+    () => new Set(defaultExpanded)
+  );
+  const [pending, setPending] = React5.useState([]);
+  const [width, setWidth] = React5.useState(0);
+  const [optionsOpen, setOptionsOpen] = React5.useState(false);
+  const [locationsOpen, setLocationsOpen] = React5.useState(false);
+  const [info, setInfo] = React5.useState(null);
+  const [preview, setPreview] = React5.useState(null);
+  const [moving, setMoving] = React5.useState([]);
+  const [naming, setNaming] = React5.useState(null);
+  const [deleting, setDeleting] = React5.useState(null);
+  const { entries: drawn, pendingIds } = React5.useMemo(
+    () => applyPending(items, pending),
+    [items, pending]
+  );
+  const index = React5.useMemo(() => indexEntries(drawn), [drawn]);
+  const favoritesOn = Boolean(onFavoriteChange) || drawn.some((e) => e.favorite);
+  React5.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 = React5.useMemo(() => pathTo(index, folderId), [index, folderId]);
+  const parent = crumbs.length > 1 ? crumbs[crumbs.length - 2] : null;
+  const searching = query.trim().length > 0;
+  const listed = React5.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 = React5.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 = React5.useMemo(() => listed.filter((e) => e.type === "file"), [listed]);
+  const selectedEntries = React5.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 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;
+    const list = topLevel(entries);
+    void run(
+      labels.moveTo,
+      () => 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 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;
+    if (!star && !relocate && !trash) return void 0;
+    const trailing = relocate && trash ? [relocate, trash] : relocate ? [relocate] : trash ? [trash] : [];
+    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;
+    return /* @__PURE__ */ jsx(View, { style: 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" ? (
+            // No button role: the row is the button, and the disclosure is
+            // reachable to assistive tech through the row's actions.
+            /* @__PURE__ */ jsx(
+              Pressable,
+              {
+                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
+                  }
+                ) })
+              }
+            )
+          ) : /* @__PURE__ */ jsx(View, { style: styles.disclosure }) : null,
+          /* @__PURE__ */ jsx(FileIcon, { entry, size: density === "compact" ? "md" : "lg" })
+        ] }),
+        trailing: 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: swipesFor(entry),
+        menuItems: selecting ? void 0 : menuFor(entry),
+        motion
+      }
+    ) });
+  };
+  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, chosen && styles.checkOn], children: chosen ? /* @__PURE__ */ jsx(
+          Icon,
+          {
+            name: "check",
+            size: theme.icon.xs,
+            color: theme.color.surface,
+            strokeWidth: 2.5
+          }
+        ) : null }) : 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
+        }
+      );
+    }
+    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 (error)
+      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: [
+          /* @__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,
+              search: !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 || error ? /* @__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 ? /* @__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
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FileDeleteDialog,
+          {
+            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];
+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 },
+  disclosure: {
+    width: DISCLOSURE(theme),
+    height: DISCLOSURE(theme),
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  disclosureOpen: { transform: [{ rotate: "90deg" }] },
+  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,
+    fontStyle: "italic",
+    color: theme.color.text3
+  },
+  standInError: { color: theme.color.dangerOnSoft, fontStyle: "normal" },
+  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.lg,
+    marginBottom: theme.space.s1
+  },
+  tileArtChosen: {
+    backgroundColor: theme.color.accentSoft,
+    borderWidth: theme.borderWidth.base,
+    // The measured accent: a selection edge is a graphical object held to 3:1.
+    borderColor: theme.focus.ringColor
+  },
+  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"
+  },
+  check: {
+    position: "absolute",
+    bottom: theme.space.s1,
+    end: theme.space.s1,
+    width: theme.space.s5,
+    height: theme.space.s5,
+    borderRadius: theme.radius.full,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.borderStrong,
+    backgroundColor: theme.color.surface,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  checkOn: { backgroundColor: theme.color.accent, borderColor: theme.color.accent },
+  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 }
+}));
+
+export { FileDeleteDialog, FileIcon, FileInfoSheet, FileLocations, FileManager, FileMoveSheet, FileNameDialog, FileOptionsSheet, FilePreviewSheet, entryMeta, file_manager_labels_exports, useDelayedLoading, useFileManagerLabels };