@oxyhq/services 28.0.0 → 30.0.0

package/lib/commonjs/ui/screens/fileManagement/FileListSection.js

@@ -1,121 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _reactNative = require("react-native");
-var _Ionicons = _interopRequireDefault(require("@expo/vector-icons/Ionicons"));
-var _settingsList = require("@oxyhq/bloom/settings-list");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/** A pre-built list row descriptor (produced by the orchestrator's memo). */
-
-/**
- * The non-photo file list (list-style `all`/`videos`/`documents`/`audio`
- * views). Extracted verbatim from FileManagementScreen — the orchestrator
- * still owns the item construction and pagination logic and threads them in.
- */
-const FileListSection = ({
-  scrollViewRef,
-  filteredFiles,
-  searchQuery,
-  items,
-  paging,
-  refreshing,
-  colors,
-  t,
-  onRefresh,
-  onLoadMore,
-  onClearSearch,
-  renderEmptyState
-}) => {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
-    ref: scrollViewRef,
-    className: "flex-1",
-    style: {
-      flex: 1
-    },
-    contentContainerClassName: "px-space-12 pt-0 pb-space-12",
-    refreshControl: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.RefreshControl, {
-      refreshing: refreshing,
-      onRefresh: onRefresh,
-      tintColor: colors.primary
-    }),
-    onScroll: ({
-      nativeEvent
-    }) => {
-      const {
-        layoutMeasurement,
-        contentOffset,
-        contentSize
-      } = nativeEvent;
-      const distanceFromBottom = contentSize.height - (contentOffset.y + layoutMeasurement.height);
-      if (distanceFromBottom < 200 && !paging.loadingMore && paging.hasMore) {
-        onLoadMore();
-      }
-    },
-    scrollEventThrottle: 250,
-    children: filteredFiles.length === 0 && searchQuery.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      className: "items-center py-10 px-space-24",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Ionicons.default, {
-        name: "search",
-        size: 64,
-        color: colors.textTertiary
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        className: "text-[24px] font-bold mt-space-16 mb-space-8",
-        style: {
-          color: colors.text
-        },
-        children: t('fileManagement.noResults.title')
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        className: "text-[16px] text-center leading-[24px] mb-space-32",
-        style: {
-          color: colors.textSecondary
-        },
-        children: t('fileManagement.noResults.description', {
-          query: searchQuery
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-        className: "flex-row items-center px-space-24 py-space-12 rounded-[24px] gap-space-8",
-        style: {
-          backgroundColor: colors.primary
-        },
-        onPress: onClearSearch,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Ionicons.default, {
-          name: "refresh",
-          size: 20,
-          color: "#FFFFFF"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          className: "text-white text-[16px] font-semibold",
-          children: t('fileManagement.clearSearch')
-        })]
-      })]
-    }) : filteredFiles.length === 0 ? renderEmptyState() : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_settingsList.SettingsListGroup, {
-        children: items.map(item => /*#__PURE__*/(0, _jsxRuntime.jsx)(_settingsList.SettingsListItem, {
-          icon: item.icon,
-          title: item.title,
-          description: item.description,
-          onPress: item.onPress,
-          showChevron: false,
-          rightElement: item.rightElement
-        }, item.id))
-      }), paging.loadingMore && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        className: "flex-row items-center justify-center py-space-12 gap-space-8",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ActivityIndicator, {
-          size: "small",
-          color: colors.primary
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          className: "text-[13px] font-medium",
-          style: {
-            color: colors.text
-          },
-          children: t('fileManagement.loadingMore')
-        })]
-      })]
-    })
-  });
-};
-var _default = exports.default = FileListSection;
-//# sourceMappingURL=FileListSection.js.map

package/lib/commonjs/ui/screens/fileManagement/FileListSection.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_reactNative","require","_Ionicons","_interopRequireDefault","_settingsList","_jsxRuntime","e","__esModule","default","FileListSection","scrollViewRef","filteredFiles","searchQuery","items","paging","refreshing","colors","t","onRefresh","onLoadMore","onClearSearch","renderEmptyState","jsx","ScrollView","ref","className","style","flex","contentContainerClassName","refreshControl","RefreshControl","tintColor","primary","onScroll","nativeEvent","layoutMeasurement","contentOffset","contentSize","distanceFromBottom","height","y","loadingMore","hasMore","scrollEventThrottle","children","length","jsxs","View","name","size","color","textTertiary","Text","text","textSecondary","query","TouchableOpacity","backgroundColor","onPress","Fragment","SettingsListGroup","map","item","SettingsListItem","icon","title","description","showChevron","rightElement","id","ActivityIndicator","_default","exports"],"sourceRoot":"../../../../../src","sources":["ui/screens/fileManagement/FileListSection.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/ui/screens/fileManagement/PhotoPickerSection.js

@@ -1,552 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _expoImage = require("expo-image");
-var _Ionicons = _interopRequireDefault(require("@expo/vector-icons/Ionicons"));
-var _MaterialCommunityIcons = _interopRequireDefault(require("@expo/vector-icons/MaterialCommunityIcons"));
-var Skeleton = _interopRequireWildcard(require("@oxyhq/bloom/skeleton"));
-var _photoGridLayout = require("./photoGridLayout.js");
-var _FileLibraryError = _interopRequireDefault(require("./FileLibraryError.js"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); } /**
- * Haptic feedback wrapper. `expo-haptics` is an optional dependency — when not
- * installed (or on web), all calls degrade silently. We resolve the module
- * once and cache the promise so subsequent calls don't repeat the dynamic
- * import. Matches the pattern used by AvatarCropScreen.
- */
-let hapticsModulePromise = null;
-const getHaptics = () => {
-  if (_reactNative.Platform.OS === 'web') return Promise.resolve(null);
-  if (hapticsModulePromise) return hapticsModulePromise;
-  hapticsModulePromise = (async () => {
-    try {
-      const mod = await Promise.resolve().then(() => _interopRequireWildcard(require('expo-haptics')));
-      if (!mod || typeof mod.impactAsync !== 'function') return null;
-      return mod;
-    } catch {
-      return null;
-    }
-  })();
-  return hapticsModulePromise;
-};
-const hapticImpact = async style => {
-  const h = await getHaptics();
-  if (!h) return;
-  const styleEnum = style === 'heavy' ? h.ImpactFeedbackStyle.Heavy : style === 'medium' ? h.ImpactFeedbackStyle.Medium : h.ImpactFeedbackStyle.Light;
-  try {
-    await h.impactAsync(styleEnum);
-  } catch {
-    // Silent — haptics are non-critical UX polish.
-  }
-};
-const hapticSelection = async () => {
-  const h = await getHaptics();
-  if (!h) return;
-  try {
-    await h.selectionAsync();
-  } catch {
-    // Silent.
-  }
-};
-
-/**
- * The picker renders inside a Bloom `<Dialog>` in NAV-HEADER mode with
- * `tone: 'onImage'` (bottom-sheet on narrow, centered card on `md+`). The Dialog
- * owns the shared gradient nav bar (Cancel / "Choose Photo" / Upload, wired by
- * `FileManagementScreen` through `useSurfaceHeader`). Because the tone is
- * `'onImage'`, the Dialog inserts NO nav-bar spacer above this content
- * (`DialogNavBarSpacer` collapses to nothing), so the black photo grid slides UP
- * under the floating translucent bar and reads EDGE-TO-EDGE — the Apple/Google
- * Photos immersive picker. The grid therefore takes the FULL `frameSize` height
- * and carries no top padding; only the pull-to-refresh spinner is offset so it
- * lands below the floating bar.
- *
- * `FLOATING_NAV_BAR_HEIGHT` mirrors Bloom's `DIALOG_NAV_BAR_HEIGHT` (not exported
- * from `@oxyhq/bloom/dialog`) — the height of the floating bar the refresh spinner
- * must clear.
- */
-const FLOATING_NAV_BAR_HEIGHT = 52;
-
-/**
- * Props for the dedicated photo picker view. Used by FileManagementScreen
- * only when `selectMode + image-only` is active. All callbacks are wired by
- * the parent — this component is purely presentational.
- */
-
-/**
- * Photo-cell animation tuning. The cell uses RN's own `Animated` (NOT
- * Reanimated): its entrance is a staggered opacity fade — replacing the
- * Reanimated `entering={FadeIn}` LAYOUT animation, which cannot load on the
- * RN-Web build (no `react-native-worklets` babel plugin) and only warns +
- * no-ops there. RN `Animated` runs cross-platform: native-driven on device,
- * JS-driven on web (`useNativeDriver: false`), so the fade actually plays on
- * web instead of being skipped.
- */
-const STAGGER_PER_CELL_MS = 15;
-const MAX_TOTAL_STAGGER_MS = 800;
-const ENTRANCE_DURATION_MS = 200;
-/** Selection-ring pulse: a quick scale bump that springs back to rest. */
-const RING_PULSE_PEAK = 1.05;
-const RING_PULSE_UP_MS = 110;
-const RING_SPRING_FRICTION = 9;
-const RING_SPRING_TENSION = 120;
-/**
- * The selection ring is an `Animated.View` (its pulse transform must be inline,
- * and `className` interop on `Animated.View` is not guaranteed under the RN-Web
- * build), so these mirror the `rounded-radius-8 border-[3px]` design tokens.
- */
-const CELL_CORNER_RADIUS = 8; // `rounded-radius-8`
-const SELECTION_RING_WIDTH = 3; // `border-[3px]`
-
-/**
- * Loading-skeleton tile fill. The picker's backdrop is ALWAYS black regardless
- * of theme, so we cannot use Bloom `Skeleton.Box`'s theme default (`contrast50`,
- * which is a near-black gray on a dark theme → invisible on this backdrop). A
- * neutral dark gray reads as a photo placeholder on black; Bloom's shimmer still
- * pulses the tile opacity on top of it. `Skeleton.Box` applies `style` after its
- * own base, so this override wins while the animated opacity is preserved.
- */
-const SKELETON_TILE_COLOR = '#26262A';
-/** Minimum skeleton rows so the grid never looks empty on a very short panel. */
-const SKELETON_MIN_ROWS = 4;
-/**
- * A single photo cell. Memoized so re-renders during selection only touch
- * affected cells — selecting one photo must not redraw the whole grid.
- *
- * Apple Photos pattern: when any cell is selected, *non-selected* siblings fade
- * to 0.6 opacity to focus attention on the active selection. A staggered
- * entrance fade plays on mount; a spring pulse plays each time a cell enters the
- * selected state. Both animations are pinned off under reduce-motion, so the
- * one component covers both the animated and the reduced-motion paths.
- */
-const PhotoPickerCell = /*#__PURE__*/_react.default.memo(function PhotoPickerCell(props) {
-  const {
-    photo,
-    size,
-    marginRight,
-    marginBottom,
-    isSelected,
-    selectionIndex,
-    dim,
-    primaryColor,
-    thumbUrl,
-    enterIndex,
-    reduceMotion,
-    onPress,
-    onLongPress,
-    a11yLabel
-  } = props;
-  const delay = Math.min(enterIndex * STAGGER_PER_CELL_MS, MAX_TOTAL_STAGGER_MS);
-
-  // Entrance fade, staggered by the cell's grid index. Started from the wrapper's
-  // ref callback (fires on mount) rather than an effect. Reduce-motion pins
-  // opacity at 1 and never animates.
-  //
-  // CRITICAL: `Animated.View` rebuilds its merged ref on every render, so React
-  // re-invokes this callback on EVERY commit (not just mount) — and re-running
-  // `Animated.timing().start()`/`setValue` each time drives a web re-render that
-  // re-fires the ref → "Maximum update depth exceeded" once the grid has cells.
-  // The `startedRef` latch makes it genuinely run-once per mount, breaking the
-  // loop. (jest/react-test-renderer never exercises the Animated merged-ref path,
-  // so this only reproduces in a real browser.)
-  const opacity = (0, _react.useRef)(new _reactNative.Animated.Value(reduceMotion ? 1 : 0)).current;
-  const startedRef = (0, _react.useRef)(false);
-  const startEntrance = (0, _react.useCallback)(node => {
-    if (!node) return; // unmount
-    if (startedRef.current) return; // ref re-fired on a later commit — already ran
-    startedRef.current = true;
-    if (reduceMotion) {
-      opacity.setValue(1);
-      return;
-    }
-    opacity.setValue(0);
-    _reactNative.Animated.timing(opacity, {
-      toValue: 1,
-      duration: ENTRANCE_DURATION_MS,
-      delay,
-      useNativeDriver: _reactNative.Platform.OS !== 'web'
-    }).start();
-  }, [opacity, delay, reduceMotion]);
-
-  // Selection-ring pulse: a quick scale bump that springs back to rest. The ring
-  // renders ONLY while selected, so its own mount IS the "became selected"
-  // signal — driven from the ring's ref callback, not an effect. Reduce-motion
-  // holds the ring at rest scale. Same run-once latch as the entrance (the ring's
-  // `Animated.View` re-fires this ref every commit too) — reset on unmount so a
-  // later re-selection pulses again.
-  const ringScale = (0, _react.useRef)(new _reactNative.Animated.Value(1)).current;
-  const pulsedRef = (0, _react.useRef)(false);
-  const startRingPulse = (0, _react.useCallback)(node => {
-    if (!node) {
-      pulsedRef.current = false; // ring unmounted (deselected) — arm the next pulse
-      return;
-    }
-    if (pulsedRef.current) return; // ref re-fired on a later commit — already pulsed
-    pulsedRef.current = true;
-    ringScale.setValue(1);
-    if (reduceMotion) return;
-    _reactNative.Animated.sequence([_reactNative.Animated.timing(ringScale, {
-      toValue: RING_PULSE_PEAK,
-      duration: RING_PULSE_UP_MS,
-      useNativeDriver: _reactNative.Platform.OS !== 'web'
-    }), _reactNative.Animated.spring(ringScale, {
-      toValue: 1,
-      friction: RING_SPRING_FRICTION,
-      tension: RING_SPRING_TENSION,
-      useNativeDriver: _reactNative.Platform.OS !== 'web'
-    })]).start();
-  }, [ringScale, reduceMotion]);
-  return (
-    /*#__PURE__*/
-    // The animated wrapper carries the entrance opacity + the layout box as
-    // inline `style`: animated values must be inline, and the box's
-    // size/margins are runtime pixels className cannot express. `className`
-    // drives the static chrome below (`flex-1` fills this fixed-size box).
-    (0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
-      ref: startEntrance,
-      style: {
-        width: size,
-        height: size,
-        marginRight,
-        marginBottom,
-        position: 'relative',
-        opacity
-      },
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-        activeOpacity: 0.85,
-        onPress: onPress,
-        onLongPress: onLongPress,
-        className: "flex-1",
-        accessibilityRole: "button",
-        accessibilityLabel: a11yLabel,
-        accessibilityState: {
-          selected: isSelected
-        },
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          className: `flex-1 rounded-radius-8 overflow-hidden bg-[#111111]${dim ? ' opacity-60' : ''}`,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_expoImage.Image, {
-            source: {
-              uri: thumbUrl
-            },
-            style: {
-              width: '100%',
-              height: '100%'
-            },
-            contentFit: "cover",
-            transition: 120,
-            cachePolicy: "memory-disk",
-            accessibilityLabel: photo.filename
-          })
-        }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
-          ref: startRingPulse,
-          style: {
-            position: 'absolute',
-            top: 0,
-            right: 0,
-            bottom: 0,
-            left: 0,
-            borderRadius: CELL_CORNER_RADIUS,
-            borderWidth: SELECTION_RING_WIDTH,
-            borderColor: primaryColor,
-            transform: [{
-              scale: ringScale
-            }],
-            pointerEvents: 'none'
-          }
-        }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          className: "absolute top-1.5 right-1.5 min-w-[22px] h-[22px] px-1.5 rounded-full items-center justify-center",
-          style: {
-            backgroundColor: primaryColor,
-            pointerEvents: 'none'
-          },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            className: "text-white text-[12px] font-bold leading-[14px]",
-            children: selectionIndex > 0 ? String(selectionIndex) : ''
-          })
-        })]
-      })
-    })
-  );
-});
-const PhotoPickerView = ({
-  photos,
-  selectedIds,
-  multiSelect,
-  maxSelection,
-  allowUpload,
-  refreshing,
-  uploading,
-  isPickingDocument,
-  hasMore,
-  loadingMore,
-  loading,
-  loadError,
-  onRetry,
-  reduceMotion,
-  getThumbUrl,
-  primaryColor,
-  isOwner,
-  onTogglePhoto,
-  onPreviewPhoto,
-  onUpload,
-  onRefresh,
-  onLoadMore,
-  t
-}) => {
-  // Grid sizing width. We PREFER the measured grid-container width (the
-  // bottom-sheet content width) so tiles size to the sheet, not the device
-  // screen — on wide viewports the sheet is centered/narrower than the screen.
-  // But we must NEVER gate the whole grid on that measurement: `onLayout` is
-  // unreliable on web (react-native-css can suppress it), and a grid that only
-  // renders after a measurement can stay blank forever. So we fall back to the
-  // window width until a real measurement arrives — the grid ALWAYS renders,
-  // then snaps to the sheet width once `onLayout` reports it. The measured
-  // wrapper carries ONLY a `style` (no `className`) to maximise the chance
-  // `onLayout` fires on web.
-  const {
-    width: windowWidth,
-    height: windowHeight
-  } = (0, _reactNative.useWindowDimensions)();
-  const [gridWidth, setGridWidth] = (0, _react.useState)(0);
-  const onRootLayout = (0, _react.useCallback)(e => {
-    const w = Math.round(e.nativeEvent.layout.width);
-    setGridWidth(prev => prev === w ? prev : w);
-  }, []);
-
-  // The picker FILLS its panel: the surface morphs the container UP to an
-  // explicit large target (`frameSize.heightRatio: 0.9` in `surfaceRegistry`),
-  // and this root takes that SAME 0.9-of-viewport height. Under `tone:'onImage'`
-  // the Dialog inserts NO nav-bar spacer, so the grid uses the FULL morph target
-  // (no `-52`) and slides up under the floating bar, edge-to-edge, within the
-  // panel's `maxHeightRatio: 0.9` cap. A `flex: 1` root can't fill (no definite
-  // bound propagates through the sheet's flex chain at rest, where the panel is
-  // height:auto), so the fixed height is required; the FlatList scrolls within
-  // it. Keep the 0.9 ratio in sync with the picker's `frameSize` in
-  // `surfaceRegistry.ts`.
-  const panelHeight = (0, _react.useMemo)(() => Math.round(windowHeight * 0.9), [windowHeight]);
-  const rootStyle = (0, _react.useMemo)(() => ({
-    height: panelHeight
-  }), [panelHeight]);
-  const effectiveWidth = gridWidth > 0 ? gridWidth : windowWidth;
-  const {
-    columns,
-    cellSize,
-    gutter
-  } = (0, _react.useMemo)(() => (0, _photoGridLayout.computePhotoGridLayout)(effectiveWidth), [effectiveWidth]);
-
-  // How many shimmer tiles the loading skeleton renders: enough FULL rows to
-  // fill the panel down to (but never past) its `maxHeight` cap, so the panel
-  // hugs the skeleton content instead of overflowing or scrolling. `floor`
-  // keeps the last row whole; `SKELETON_MIN_ROWS` guards a very short panel.
-  const skeletonTileCount = (0, _react.useMemo)(() => {
-    const rowHeight = cellSize + gutter;
-    if (rowHeight <= 0) return columns * SKELETON_MIN_ROWS;
-    const available = Math.max(0, panelHeight - FLOATING_NAV_BAR_HEIGHT);
-    const rows = Math.max(SKELETON_MIN_ROWS, Math.floor(available / rowHeight));
-    return rows * columns;
-  }, [cellSize, gutter, columns, panelHeight]);
-
-  // Map selectedIds → 1-based selection order for the badge. We freeze a
-  // stable order at the time of selection: the order is the insertion
-  // order of the Set (which JS preserves natively).
-  const selectionOrder = (0, _react.useMemo)(() => {
-    const map = new Map();
-    let i = 1;
-    for (const id of selectedIds) {
-      map.set(id, i++);
-    }
-    return map;
-  }, [selectedIds]);
-  const hasAnySelection = selectedIds.size > 0;
-  const isEmpty = photos.length === 0;
-  const atSelectionLimit = multiSelect && maxSelection != null && selectedIds.size >= maxSelection;
-  const handleCellPress = (0, _react.useCallback)(photo => {
-    if (_reactNative.Platform.OS !== 'web') {
-      void hapticImpact('light');
-    }
-    onTogglePhoto(photo);
-  }, [onTogglePhoto]);
-  const handleCellLongPress = (0, _react.useCallback)(photo => {
-    if (_reactNative.Platform.OS !== 'web') {
-      void hapticSelection();
-    }
-    onPreviewPhoto(photo);
-  }, [onPreviewPhoto]);
-
-  // FlatList renderItem: each cell knows its enterIndex (for stagger).
-  const renderItem = (0, _react.useCallback)(({
-    item,
-    index
-  }) => {
-    const isSelected = selectedIds.has(item.id);
-    const selIndex = isSelected ? selectionOrder.get(item.id) || 0 : 0;
-    // Last column gets no right margin; last row no bottom margin
-    // (FlatList handles row breaks via numColumns).
-    const isLastInRow = (index + 1) % columns === 0;
-    const a11yLabel = t(isSelected ? 'fileManagement.a11y.photoCellSelected' : 'fileManagement.a11y.photoCellUnselected', {
-      name: item.filename || 'photo'
-    });
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(PhotoPickerCell, {
-      photo: item,
-      size: cellSize,
-      marginRight: isLastInRow ? 0 : gutter,
-      marginBottom: gutter,
-      isSelected: isSelected,
-      selectionIndex: selIndex,
-      dim: multiSelect && !isSelected && (hasAnySelection || atSelectionLimit),
-      primaryColor: primaryColor,
-      thumbUrl: getThumbUrl(item),
-      enterIndex: index,
-      reduceMotion: reduceMotion,
-      onPress: () => handleCellPress(item),
-      onLongPress: () => handleCellLongPress(item),
-      a11yLabel: a11yLabel
-    });
-  }, [selectedIds, selectionOrder, columns, cellSize, gutter, multiSelect, hasAnySelection, atSelectionLimit, primaryColor, getThumbUrl, reduceMotion, handleCellPress, handleCellLongPress, t]);
-  const keyExtractor = (0, _react.useCallback)(item => item.id, []);
-  const listFooter = (0, _react.useMemo)(() => {
-    if (!loadingMore) return null;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      className: "py-space-16 items-center",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ActivityIndicator, {
-        size: "small",
-        color: "#FFFFFF"
-      })
-    });
-  }, [loadingMore]);
-  const handleEndReached = (0, _react.useCallback)(() => {
-    if (loadingMore || !hasMore) return;
-    onLoadMore();
-  }, [loadingMore, hasMore, onLoadMore]);
-  return (
-    /*#__PURE__*/
-    // Measured wrapper: `style`-only (no className) so RN-Web fires onLayout.
-    // `rootStyle` is placement-aware — a `maxHeight` cap that gives the
-    // FlatList a bounded scroll region while letting a short grid hug its
-    // content (see the `rootStyle` derivation). It must NOT carry a className
-    // (that can suppress web `onLayout`).
-    (0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: rootStyle,
-      onLayout: onRootLayout,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        className: "flex-1 min-h-0 bg-black",
-        children: isEmpty && loadError ?
-        /*#__PURE__*/
-        /* Terminal load failure — a DISTINCT error surface (not the
-           empty state), centered in the immersive frame. Retry re-runs
-           the list query. */
-        (0, _jsxRuntime.jsx)(_reactNative.View, {
-          className: "flex-1 items-center justify-center",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FileLibraryError.default, {
-            title: t('fileManagement.loadError.title'),
-            description: t('fileManagement.loadError.description'),
-            retryLabel: t('fileManagement.retry'),
-            onRetry: onRetry,
-            iconColor: "#FF6B6B",
-            titleColor: "#FFFFFF",
-            descriptionColor: "rgba(255,255,255,0.7)",
-            buttonColor: primaryColor
-          })
-        }) : isEmpty && loading ?
-        /*#__PURE__*/
-        /* Loading skeleton — the picker's OWN shape: shimmer tiles laid
-           out with the SAME placement-aware geometry the real grid uses
-           (`computePhotoGridLayout(effectiveWidth)`), edge-to-edge under
-           the floating bar. `flexWrap` breaks rows exactly at `columns`
-           because the last tile in each row carries no right margin (a
-           full row + gutters fits the measured width by construction). */
-        (0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: {
-            flexDirection: 'row',
-            flexWrap: 'wrap',
-            pointerEvents: 'none'
-          },
-          accessibilityElementsHidden: true,
-          importantForAccessibility: "no-hide-descendants",
-          children: Array.from({
-            length: skeletonTileCount
-          }, (_, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Skeleton.Box, {
-            width: cellSize,
-            height: cellSize,
-            borderRadius: CELL_CORNER_RADIUS,
-            style: {
-              marginRight: (index + 1) % columns === 0 ? 0 : gutter,
-              marginBottom: gutter,
-              backgroundColor: SKELETON_TILE_COLOR
-            }
-          }, `skeleton-${index}`))
-        }) : isEmpty ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          className: "flex-1 items-center justify-center px-space-32",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            className: "opacity-30 mb-space-16",
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MaterialCommunityIcons.default, {
-              name: "image-outline",
-              size: 64,
-              color: "#FFFFFF"
-            })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            className: "text-white text-[17px] font-semibold text-center mb-1.5",
-            children: t('fileManagement.photoPicker.emptyTitle')
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            className: "text-white text-[14px] font-normal text-center opacity-70 mb-space-24",
-            children: t('fileManagement.photoPicker.emptySubtitle')
-          }), isOwner && allowUpload && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
-            className: "flex-row items-center gap-space-8 px-[22px] py-space-12 rounded-full",
-            style: {
-              backgroundColor: primaryColor
-            },
-            onPress: onUpload,
-            disabled: uploading || isPickingDocument,
-            accessibilityRole: "button",
-            accessibilityLabel: t('fileManagement.uploadPhoto'),
-            accessibilityState: {
-              busy: uploading || isPickingDocument
-            },
-            children: uploading || isPickingDocument ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ActivityIndicator, {
-              size: "small",
-              color: "#FFFFFF"
-            }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Ionicons.default, {
-                name: "cloud-upload",
-                size: 18,
-                color: "#FFFFFF"
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                className: "text-white text-[15px] font-semibold",
-                children: t('fileManagement.uploadPhoto')
-              })]
-            })
-          })]
-        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.FlatList, {
-          data: photos,
-          renderItem: renderItem,
-          keyExtractor: keyExtractor,
-          numColumns: columns,
-          className: "flex-1 min-h-0",
-          contentContainerClassName: "pb-space-24",
-          showsVerticalScrollIndicator: false,
-          refreshControl: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.RefreshControl, {
-            refreshing: refreshing,
-            onRefresh: onRefresh,
-            tintColor: "#FFFFFF",
-            colors: [primaryColor],
-            progressViewOffset: FLOATING_NAV_BAR_HEIGHT
-          }),
-          onEndReached: handleEndReached,
-          onEndReachedThreshold: 0.4,
-          ListFooterComponent: listFooter,
-          removeClippedSubviews: _reactNative.Platform.OS !== 'web',
-          initialNumToRender: Math.max(12, columns * 6),
-          windowSize: 9
-        }, `cols-${columns}`)
-      })
-    })
-  );
-};
-var _default = exports.default = PhotoPickerView;
-//# sourceMappingURL=PhotoPickerSection.js.map