@webority-technologies/mobile-ui 0.0.1 → 0.0.3

package/README.md

@@ -10,6 +10,7 @@ npm install @webority-technologies/mobile-ui
 
 No external runtime dependencies beyond `@webority-technologies/mobile-core`. Requires
 `react-native-gesture-handler`, `react-native-reanimated` and `react-native-safe-area-context` as
-peers; `react-native-linear-gradient` and `react-native-haptic-feedback` are optional.
+peers; `react-native-haptic-feedback` is optional. Gradients use React Native's own
+`experimental_backgroundImage`, so no gradient library is needed.
 
 Full documentation lives in the repository's `docs/` directory.

package/lib/commonjs/components/AuthedImage/AuthedImage.js

@@ -0,0 +1,225 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.AuthedImage = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _index = require("../../theme/index.js");
+var _index2 = require("../Spinner/index.js");
+var _authedImageCache = require("./authedImageCache.js");
+var _jsxRuntime = require("react/jsx-runtime");
+const toError = value => value instanceof Error ? value : new Error(String(value));
+const AuthedImage = props => {
+  const {
+    uri,
+    headers,
+    authenticated = true,
+    ttlMs = _authedImageCache.DEFAULT_TTL_MS,
+    placeholder,
+    fallback,
+    onLoadStart,
+    onLoadEnd,
+    onError,
+    cacheKey,
+    testID,
+    accessibilityLabel,
+    style,
+    ...imageProps
+  } = props;
+  const theme = (0, _index.useTheme)();
+  const styles = (0, _react.useMemo)(() => buildStyles(theme), [theme]);
+  const [state, setState] = (0, _react.useState)({
+    status: 'loading'
+  });
+
+  // Callbacks live behind refs so a caller passing inline arrows does not
+  // restart the fetch on every render.
+  const callbacks = (0, _react.useRef)({
+    onLoadStart,
+    onLoadEnd,
+    onError
+  });
+  callbacks.current = {
+    onLoadStart,
+    onLoadEnd,
+    onError
+  };
+
+  // Compared by value: a headers object literal is a new identity every render.
+  const headersKey = JSON.stringify(headers ?? {});
+  (0, _react.useEffect)(() => {
+    let cancelled = false;
+    let acquired = null;
+    const finish = next => {
+      if (cancelled) {
+        return;
+      }
+      setState(next);
+      callbacks.current.onLoadEnd?.();
+    };
+    const run = async () => {
+      if (!uri) {
+        const error = new Error('[@webority-technologies/mobile-ui] AuthedImage was given an empty `uri`. Pass the ' + 'image URL, or render nothing while the URL is still unknown.');
+        if (!cancelled) {
+          setState({
+            status: 'error'
+          });
+          callbacks.current.onError?.(error);
+        }
+        return;
+      }
+      setState({
+        status: 'loading'
+      });
+      callbacks.current.onLoadStart?.();
+      const key = (0, _authedImageCache.deriveCacheKey)(uri, cacheKey);
+      const cached = await (0, _authedImageCache.readEntry)(key);
+      if (cancelled) {
+        return;
+      }
+      if (cached && (0, _authedImageCache.isFresh)(cached.meta, ttlMs)) {
+        void (0, _authedImageCache.touchEntry)(key, cached.meta);
+        finish({
+          status: 'ready',
+          dataUri: cached.dataUri
+        });
+        return;
+      }
+      const entry = (0, _authedImageCache.acquireFetch)(key, {
+        uri,
+        headers: JSON.parse(headersKey),
+        authenticated
+      });
+      acquired = {
+        key,
+        entry
+      };
+      try {
+        const result = await entry.promise;
+        finish({
+          status: 'ready',
+          dataUri: result.dataUri
+        });
+      } catch (error) {
+        if (cancelled) {
+          return;
+        }
+        // A stale image beats an empty box: the entry is only expired, and the
+        // refetch that would have replaced it failed.
+        if (cached) {
+          finish({
+            status: 'ready',
+            dataUri: cached.dataUri
+          });
+          return;
+        }
+        setState({
+          status: 'error'
+        });
+        callbacks.current.onError?.(toError(error));
+        callbacks.current.onLoadEnd?.();
+      }
+    };
+    void run();
+    return () => {
+      cancelled = true;
+      if (acquired) {
+        (0, _authedImageCache.releaseFetch)(acquired.key, acquired.entry);
+      }
+    };
+  }, [uri, cacheKey, ttlMs, authenticated, headersKey]);
+
+  // The base `testID` sits on the root in EVERY state, with the state-specific
+  // suffixes nested inside it. A consumer that can only find the component while
+  // it happens to be loaded cannot wait for it to load.
+  if (state.status === 'loading') {
+    if (placeholder !== undefined) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: style,
+        testID: testID,
+        children: placeholder
+      });
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [styles.placeholder, style],
+      testID: testID,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: styles.stateFill,
+        testID: testID ? `${testID}-placeholder` : undefined,
+        pointerEvents: "none",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Spinner, {
+          size: "sm",
+          accessibilityLabel: accessibilityLabel ?? 'Loading image'
+        })
+      })
+    });
+  }
+  if (state.status === 'error') {
+    if (fallback !== undefined) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: style,
+        testID: testID,
+        children: fallback
+      });
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [styles.fallback, style],
+      testID: testID,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        accessible: true,
+        accessibilityRole: "image",
+        accessibilityLabel: accessibilityLabel ? `${accessibilityLabel}, image unavailable` : 'Image unavailable',
+        testID: testID ? `${testID}-fallback` : undefined,
+        style: styles.stateFill,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.fallbackText,
+          children: "!"
+        })
+      })
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Image, {
+    ...imageProps,
+    accessible: true,
+    accessibilityRole: "image",
+    accessibilityLabel: accessibilityLabel,
+    testID: testID,
+    style: style,
+    source: {
+      uri: state.dataUri
+    }
+  });
+};
+exports.AuthedImage = AuthedImage;
+AuthedImage.displayName = 'AuthedImage';
+const buildStyles = theme => _reactNative.StyleSheet.create({
+  placeholder: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: theme.colors.background.secondary,
+    borderRadius: theme.radius.md
+  },
+  fallback: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: theme.colors.background.secondary,
+    borderRadius: theme.radius.md,
+    borderWidth: theme.colors.border.width,
+    borderColor: theme.colors.border.secondary,
+    padding: theme.spacing.sm
+  },
+  stateFill: {
+    alignItems: 'center',
+    flex: 1,
+    justifyContent: 'center'
+  },
+  fallbackText: {
+    color: theme.colors.text.tertiary,
+    fontSize: theme.typography.fontSize.lg,
+    fontWeight: theme.typography.fontWeight.bold
+  }
+});
+var _default = exports.default = AuthedImage;
+//# sourceMappingURL=AuthedImage.js.map

package/lib/commonjs/components/AuthedImage/authedImageCache.js

@@ -0,0 +1,253 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.touchEntry = exports.setAuthedImageCacheLimit = exports.releaseFetch = exports.readEntry = exports.isFresh = exports.getAuthedImageCacheLimit = exports.deriveCacheKey = exports.clearAuthedImageCache = exports.authedImageCacheStats = exports.acquireFetch = exports.DEFAULT_TTL_MS = void 0;
+var _mobileCore = require("@webority-technologies/mobile-core");
+const KEY_PREFIX = '@webority/authed-image/v1/';
+const DATA_PREFIX = `${KEY_PREFIX}d/`;
+const META_PREFIX = `${KEY_PREFIX}m/`;
+const DEFAULT_BYTE_CEILING = 50 * 1024 * 1024;
+const DEFAULT_TTL_MS = exports.DEFAULT_TTL_MS = 7 * 24 * 60 * 60 * 1000;
+let byteCeiling = DEFAULT_BYTE_CEILING;
+
+/**
+ * Ceiling for the total stored size of cached images. Exceeding it evicts the
+ * least recently used entries. An image cache with no ceiling grows until the
+ * OS reclaims the app's storage, which is the defect this replaces.
+ */
+const setAuthedImageCacheLimit = bytes => {
+  if (!Number.isFinite(bytes) || bytes <= 0) {
+    throw new Error('[@webority-technologies/mobile-ui] setAuthedImageCacheLimit() needs a positive number of ' + `bytes, received ${String(bytes)}. Pass e.g. 50 * 1024 * 1024 for 50 MB.`);
+  }
+  byteCeiling = bytes;
+};
+exports.setAuthedImageCacheLimit = setAuthedImageCacheLimit;
+const getAuthedImageCacheLimit = () => byteCeiling;
+exports.getAuthedImageCacheLimit = getAuthedImageCacheLimit;
+const hashString = input => {
+  let h1 = 0x811c9dc5;
+  let h2 = 0x1000193;
+  for (let i = 0; i < input.length; i += 1) {
+    const code = input.charCodeAt(i);
+    h1 = Math.imul(h1 ^ code, 16777619) >>> 0;
+    h2 = (Math.imul(h2 + code, 2654435761) ^ h2 >>> 7) >>> 0;
+  }
+  return `${h1.toString(16)}${h2.toString(16)}${input.length.toString(16)}`;
+};
+
+/**
+ * Hex only by construction, so it is always a safe storage key segment.
+ */
+const deriveCacheKey = (uri, override) => hashString(override ?? uri);
+exports.deriveCacheKey = deriveCacheKey;
+const B64_ALPHABET = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
+const encodeBase64 = buffer => {
+  const bytes = new Uint8Array(buffer);
+  let out = '';
+  for (let i = 0; i < bytes.length; i += 3) {
+    const b0 = bytes[i];
+    const b1 = i + 1 < bytes.length ? bytes[i + 1] : undefined;
+    const b2 = i + 2 < bytes.length ? bytes[i + 2] : undefined;
+    out += B64_ALPHABET[b0 >> 2];
+    out += B64_ALPHABET[(b0 & 0x03) << 4 | (b1 ?? 0) >> 4];
+    out += b1 === undefined ? '=' : B64_ALPHABET[((b1 & 0x0f) << 2 | (b2 ?? 0) >> 6) & 0x3f];
+    out += b2 === undefined ? '=' : B64_ALPHABET[b2 & 0x3f];
+  }
+  return out;
+};
+
+/**
+ * The cache is an OPTIMISATION, so a failing store must never stop an image
+ * rendering. That used to mean guarding on whether a backend existed at all,
+ * warning once and skipping the cache; under Expo-first the backend ships with
+ * the library, so "no backend" is no longer a state an app can be in and that
+ * branch was unreachable.
+ *
+ * What remains is a store that exists and FAILS, which the per-operation error
+ * handling below already covers: each read returns null and each write returns
+ * false, the image still fetches, and nothing is logged per image.
+ */
+const cacheUsable = () => (0, _mobileCore.isStorageAvailable)();
+const readEntry = async cacheKey => {
+  if (!cacheUsable()) {
+    return null;
+  }
+  const values = await _mobileCore.Storage.multiGet([`${DATA_PREFIX}${cacheKey}`, `${META_PREFIX}${cacheKey}`]);
+  const dataUri = values[`${DATA_PREFIX}${cacheKey}`];
+  const rawMeta = values[`${META_PREFIX}${cacheKey}`];
+  if (!dataUri || !rawMeta) {
+    return null;
+  }
+  try {
+    return {
+      dataUri,
+      meta: JSON.parse(rawMeta)
+    };
+  } catch {
+    return null;
+  }
+};
+exports.readEntry = readEntry;
+const isFresh = (meta, ttlMs, now = Date.now()) => now - meta.fetchedAt < ttlMs;
+exports.isFresh = isFresh;
+const touchEntry = async (cacheKey, meta) => {
+  if (!cacheUsable()) {
+    return;
+  }
+  await _mobileCore.Storage.setItem(`${META_PREFIX}${cacheKey}`, JSON.stringify({
+    ...meta,
+    lastAccessedAt: Date.now()
+  }));
+};
+exports.touchEntry = touchEntry;
+const listMeta = async () => {
+  if (!cacheUsable()) {
+    return [];
+  }
+  const keys = await _mobileCore.Storage.getAllKeys();
+  const metaKeys = keys.filter(key => key.startsWith(META_PREFIX));
+  if (metaKeys.length === 0) {
+    return [];
+  }
+  const values = await _mobileCore.Storage.multiGet(metaKeys);
+  const out = [];
+  for (const key of metaKeys) {
+    const raw = values[key];
+    if (!raw) {
+      continue;
+    }
+    try {
+      out.push({
+        cacheKey: key.slice(META_PREFIX.length),
+        meta: JSON.parse(raw)
+      });
+    } catch {
+      // A meta entry we cannot parse is unusable; dropping it from the ledger
+      // lets the next eviction pass remove its orphaned data entry.
+    }
+  }
+  return out;
+};
+const evictIfNeeded = async () => {
+  const entries = await listMeta();
+  let total = entries.reduce((sum, entry) => sum + entry.meta.bytes, 0);
+  if (total <= byteCeiling) {
+    return;
+  }
+  const ordered = [...entries].sort((a, b) => a.meta.lastAccessedAt - b.meta.lastAccessedAt);
+  const doomed = [];
+  for (const entry of ordered) {
+    if (total <= byteCeiling) {
+      break;
+    }
+    doomed.push(`${DATA_PREFIX}${entry.cacheKey}`, `${META_PREFIX}${entry.cacheKey}`);
+    total -= entry.meta.bytes;
+  }
+  if (doomed.length > 0) {
+    await _mobileCore.Storage.multiRemove(doomed);
+    _mobileCore.Logger.info(`[AuthedImage] evicted ${doomed.length / 2} cached image(s) over the byte ceiling`);
+  }
+};
+const clearAuthedImageCache = async () => {
+  if (!cacheUsable()) {
+    return;
+  }
+  const keys = await _mobileCore.Storage.getAllKeys();
+  const ours = keys.filter(key => key.startsWith(KEY_PREFIX));
+  if (ours.length > 0) {
+    await _mobileCore.Storage.multiRemove(ours);
+  }
+};
+exports.clearAuthedImageCache = clearAuthedImageCache;
+const authedImageCacheStats = async () => {
+  const entries = await listMeta();
+  return {
+    entries: entries.length,
+    bytes: entries.reduce((sum, entry) => sum + entry.meta.bytes, 0)
+  };
+};
+exports.authedImageCacheStats = authedImageCacheStats;
+const fetchAndStore = async (cacheKey, options, signal) => {
+  const headers = {
+    ...options.headers
+  };
+  if (options.authenticated) {
+    const stored = await (0, _mobileCore.getToken)(_mobileCore.ACCESS_TOKEN_KEY);
+    if (stored?.token) {
+      headers.Authorization = `Bearer ${stored.token}`;
+    }
+  }
+  const response = await fetch(options.uri, {
+    headers,
+    signal
+  });
+  if (!response.ok) {
+    throw new Error(`[@webority-technologies/mobile-ui] AuthedImage could not load "${options.uri}": the server ` + `answered ${response.status}. Check the URL and whether the request needs a bearer token ` + '(pass authenticated={false} for public media).');
+  }
+  const buffer = await response.arrayBuffer();
+  const rawType = response.headers?.get?.('content-type');
+  const contentType = (rawType ? rawType.split(';')[0].trim() : '') || 'image/jpeg';
+  const dataUri = `data:${contentType};base64,${encodeBase64(buffer)}`;
+  const now = Date.now();
+  // `bytes` measures the stored data URI, not the decoded image: the ceiling
+  // exists to bound what sits in storage, and base64 costs about a third more.
+  const meta = {
+    fetchedAt: now,
+    bytes: dataUri.length,
+    contentType,
+    lastAccessedAt: now
+  };
+  if (cacheUsable()) {
+    await _mobileCore.Storage.multiSet({
+      [`${DATA_PREFIX}${cacheKey}`]: dataUri,
+      [`${META_PREFIX}${cacheKey}`]: JSON.stringify(meta)
+    });
+    await evictIfNeeded();
+  }
+  return {
+    dataUri,
+    meta
+  };
+};
+const inFlight = new Map();
+
+/**
+ * Two mounts of the same image share one request. The controller is aborted
+ * only when the last waiter releases, so one unmount cannot cancel the fetch
+ * another mount is still waiting on.
+ */
+const acquireFetch = (cacheKey, options) => {
+  const existing = inFlight.get(cacheKey);
+  if (existing) {
+    existing.waiters += 1;
+    return existing;
+  }
+  const controller = new AbortController();
+  const entry = {
+    controller,
+    waiters: 1,
+    promise: Promise.resolve()
+  };
+  entry.promise = fetchAndStore(cacheKey, options, controller.signal).finally(() => {
+    if (inFlight.get(cacheKey) === entry) {
+      inFlight.delete(cacheKey);
+    }
+  });
+  inFlight.set(cacheKey, entry);
+  return entry;
+};
+exports.acquireFetch = acquireFetch;
+const releaseFetch = (cacheKey, entry) => {
+  entry.waiters -= 1;
+  if (entry.waiters > 0) {
+    return;
+  }
+  if (inFlight.get(cacheKey) === entry) {
+    inFlight.delete(cacheKey);
+  }
+  entry.controller.abort();
+};
+exports.releaseFetch = releaseFetch;
+//# sourceMappingURL=authedImageCache.js.map

package/lib/commonjs/components/AuthedImage/index.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "AuthedImage", {
+  enumerable: true,
+  get: function () {
+    return _AuthedImage.AuthedImage;
+  }
+});
+Object.defineProperty(exports, "authedImageCacheStats", {
+  enumerable: true,
+  get: function () {
+    return _authedImageCache.authedImageCacheStats;
+  }
+});
+Object.defineProperty(exports, "clearAuthedImageCache", {
+  enumerable: true,
+  get: function () {
+    return _authedImageCache.clearAuthedImageCache;
+  }
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _AuthedImage.default;
+  }
+});
+Object.defineProperty(exports, "getAuthedImageCacheLimit", {
+  enumerable: true,
+  get: function () {
+    return _authedImageCache.getAuthedImageCacheLimit;
+  }
+});
+Object.defineProperty(exports, "setAuthedImageCacheLimit", {
+  enumerable: true,
+  get: function () {
+    return _authedImageCache.setAuthedImageCacheLimit;
+  }
+});
+var _AuthedImage = _interopRequireWildcard(require("./AuthedImage.js"));
+var _authedImageCache = require("./authedImageCache.js");
+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); }
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/BottomSheet/BottomSheet.js

@@ -126,6 +126,12 @@ const BottomSheet = exports.BottomSheet = /*#__PURE__*/(0, _react.forwardRef)((p
 
   // Convert a snap-point index → translateY position. -1 = closed.
   const yForIndex = (0, _react.useCallback)(idx => {
+    // NOT dead code, despite every ordinary call site clamping first.
+    // `expand()` has no empty-snapPoints guard (unlike `collapse`), so with
+    // snapPoints={[]} it arrives here out of range — and without this,
+    // `screenHeight - resolvedSnapPoints[idx]` is `screenHeight - undefined`,
+    // i.e. NaN into the sheet position, which breaks layout silently rather
+    // than degrading. Covered by the "degenerate snapPoints" tests.
     if (idx < 0 || idx >= resolvedSnapPoints.length) {
       return closedY;
     }
@@ -262,7 +268,7 @@ const BottomSheet = exports.BottomSheet = /*#__PURE__*/(0, _react.forwardRef)((p
     const closed = closedY;
     const top = minTopY;
     const canPanDownToClose = enablePanDownToClose;
-    return _reactNativeGestureHandler.Gesture.Pan().activeOffsetY([-DRAG_ACTIVATION_OFFSET, DRAG_ACTIVATION_OFFSET]).failOffsetX([-15, 15]).onStart(() => {
+    return _reactNativeGestureHandler.Gesture.Pan().withTestId(testID ? `${testID}-pan-gesture` : 'bottom-sheet-pan-gesture').activeOffsetY([-DRAG_ACTIVATION_OFFSET, DRAG_ACTIVATION_OFFSET]).failOffsetX([-15, 15]).onStart(() => {
       'worklet';
 
       dragStartY.value = translateY.value;
@@ -312,7 +318,7 @@ const BottomSheet = exports.BottomSheet = /*#__PURE__*/(0, _react.forwardRef)((p
       }
       (0, _reactNativeReanimated.runOnJS)(handleSnapEnd)(nearestIdx, targets[nearestIdx]);
     });
-  }, [closedY, dragStartY, enablePanDownToClose, handleSnapEnd, minTopY, snapTargets, translateY]);
+  }, [closedY, dragStartY, enablePanDownToClose, handleSnapEnd, minTopY, snapTargets, testID, translateY]);
 
   // ───────── Keyboard tracking ─────────
   // keyboardOffset is added to translateY in sheetStyle so we don't disturb
@@ -384,14 +390,14 @@ const BottomSheet = exports.BottomSheet = /*#__PURE__*/(0, _react.forwardRef)((p
   // gesture-handler/reanimated sheet doesn't fire reliably on RN 0.85 / Fabric
   // (the gesture system swallows the touch sequence). gorhom/bottom-sheet uses
   // the same Gesture.Tap() pattern for the same reason.
-  const backdropTapGesture = (0, _react.useMemo)(() => _reactNativeGestureHandler.Gesture.Tap().maxDuration(250).onEnd((_e, success) => {
+  const backdropTapGesture = (0, _react.useMemo)(() => _reactNativeGestureHandler.Gesture.Tap().withTestId(testID ? `${testID}-backdrop-gesture` : 'bottom-sheet-backdrop-gesture').maxDuration(250).onEnd((_e, success) => {
     'worklet';
 
     if (!success) {
       return;
     }
     (0, _reactNativeReanimated.runOnJS)(handleBackdropPress)();
-  }), [handleBackdropPress]);
+  }), [handleBackdropPress, testID]);
   const contextValue = (0, _react.useMemo)(() => ({
     snapIndex: currentIndex,
     snapPoints: resolvedSnapPoints,

package/lib/commonjs/components/Drawer/Drawer.js

@@ -82,8 +82,12 @@ const Drawer = exports.Drawer = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
         return sheetSize;
     }
   }, [side, sheetSize]);
-  const offset = (0, _reactNativeReanimated.useSharedValue)(closedOffset);
-  const dragStart = (0, _reactNativeReanimated.useSharedValue)(closedOffset);
+
+  // Uncontrolled defaultVisible starts already open — the offset must start at the
+  // open position (0) too, or the sheet is logically open while visually still
+  // pinned at the closed edge until the next explicit open()/close()/drag.
+  const offset = (0, _reactNativeReanimated.useSharedValue)(defaultVisible ? 0 : closedOffset);
+  const dragStart = (0, _reactNativeReanimated.useSharedValue)(defaultVisible ? 0 : closedOffset);
   const [isOpen, setIsOpen] = (0, _react.useState)(defaultVisible);
   const isOpenShared = (0, _reactNativeReanimated.useSharedValue)(defaultVisible);
 
@@ -335,7 +339,6 @@ const Drawer = exports.Drawer = /*#__PURE__*/(0, _react.forwardRef)((props, ref)
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
         accessibilityRole: "alert",
         accessibilityLabel: accessibilityLabel ?? 'Drawer',
-        accessibilityViewIsModal: isOpen,
         style: [sideLayout, {
           backgroundColor: theme.colors.background.elevated,
           ...theme.shadows.xl