react-native-swipeable-actions 0.1.11 → 1.0.0-rc.0

package/build/resolveSwipeableActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveSwipeableActions.d.ts","sourceRoot":"","sources":["../src/resolveSwipeableActions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,UAAU,YAAY;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,SAAS,CAAA;IACf,KAAK,EAAE,MAAM,CAAA;CACd;AAMD,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,YAAY;;;;EAiB1D"}

package/build/resolveSwipeableActions.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.resolveSwipeableActions = resolveSwipeableActions;
+const isContent = (node) => node != null && typeof node !== 'boolean';
+const isWidth = (width) => width !== undefined && Number.isFinite(width) && width > 0;
+function resolveSwipeableActions(input) {
+    const warnings = [];
+    const resolve = (side, node, width) => {
+        if (node !== undefined) {
+            if (!isContent(node))
+                return { node: null, width: 0 };
+            if (isWidth(width))
+                return { node, width };
+            warnings.push(side + 'Actions requires a finite, positive ' + side + 'ActionsWidth.');
+            return { node: null, width: 0 };
+        }
+        if (width !== undefined) {
+            warnings.push(side + 'ActionsWidth is ignored without explicit ' + side + 'Actions.');
+        }
+        return { node: null, width: 0 };
+    };
+    const left = resolve('left', input.leftActions, input.leftActionsWidth);
+    const right = resolve('right', input.rightActions, input.rightActionsWidth);
+    return { left, right, warnings };
+}
+//# sourceMappingURL=resolveSwipeableActions.js.map

package/build/resolveSwipeableActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveSwipeableActions.js","sourceRoot":"","sources":["../src/resolveSwipeableActions.ts"],"names":[],"mappings":";;AAmBA,0DAiBC;AArBD,MAAM,SAAS,GAAG,CAAC,IAAe,EAAE,EAAE,CAAC,IAAI,IAAI,IAAI,IAAI,OAAO,IAAI,KAAK,SAAS,CAAA;AAChF,MAAM,OAAO,GAAG,CAAC,KAAyB,EAAmB,EAAE,CAC7D,KAAK,KAAK,SAAS,IAAI,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,CAAA;AAE5D,SAAgB,uBAAuB,CAAC,KAAmB;IACzD,MAAM,QAAQ,GAAa,EAAE,CAAA;IAC7B,MAAM,OAAO,GAAG,CAAC,IAAe,EAAE,IAAe,EAAE,KAAc,EAAmB,EAAE;QACpF,IAAI,IAAI,KAAK,SAAS,EAAE,CAAC;YACvB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;gBAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,CAAA;YACrD,IAAI,OAAO,CAAC,KAAK,CAAC;gBAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,CAAA;YAC1C,QAAQ,CAAC,IAAI,CAAC,IAAI,GAAG,sCAAsC,GAAG,IAAI,GAAG,eAAe,CAAC,CAAA;YACrF,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,CAAA;QACjC,CAAC;QACD,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;YACxB,QAAQ,CAAC,IAAI,CAAC,IAAI,GAAG,2CAA2C,GAAG,IAAI,GAAG,UAAU,CAAC,CAAA;QACvF,CAAC;QACD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,CAAA;IACjC,CAAC,CAAA;IACD,MAAM,IAAI,GAAG,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC,WAAW,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAA;IACvE,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC,CAAA;IAC3E,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAA;AAClC,CAAC"}

package/docs/migration-v1.md

@@ -0,0 +1,191 @@
+# Migrating to v1
+
+The component name stays `Swipeable`. All rows now use explicit physical-side
+content/width pairs and one native engine. Rebuild the native app after upgrading.
+Do not mix v1 JavaScript with an older native binary.
+
+## Before you install
+
+- v1 requires the New Architecture (Fabric) on iOS and Android. The legacy
+  architecture (Paper) is not supported. If your app still uses it, stay on 0.x.
+- v1 requires Expo SDK 54 or newer, React Native 0.81 or newer and React 19.1 or
+  newer. Upgrade the app first, then install v1.
+- Install it with `npx expo install react-native-swipeable-actions@next` while
+  1.0 is a release candidate, then rebuild the iOS and Android apps.
+
+## At a glance
+
+| Kind | 0.x | 1.0 |
+| --- | --- | --- |
+| Removed | `actions`, `actionsWidth` | `rightActions`/`rightActionsWidth` or `leftActions`/`leftActionsWidth` |
+| Removed | `actionsPosition` | Choose the side by which pair you pass. Use `open(side)` for commands. |
+| Removed | `SWIPE_DEFAULTS.ACTIONS_POSITION` | No replacement. There is no default side. |
+| Removed | Raw `SwipeableView` `actionsWidth`, `actionsPosition` | `leftActionsWidth`/`rightActionsWidth`. The raw view is low-level; prefer `Swipeable`. |
+| Removed | Fallback between old and new props | Resolve content in your code, then pass explicit pairs. |
+| Changed shape | `interface SwipeableProps` | `type SwipeableProps`, a union of valid side pairs. Extend it with `&`, not `extends`. |
+| Unchanged | `open`, `close`, `cancel`, `closeAll`, static keyed methods | Same names. `open` takes an optional side. |
+| Unchanged | `onSwipeStart`, `onSwipeStateChange`, `onSwipeEnd`, `onProgress` | Same arguments. Some timing changed, see below. |
+| New | - | `onLeftSwipeEnd`, `onRightSwipeEnd`, `appearance`, `hapticFeedback` |
+| New | - | Type aliases `TwoSidedSwipeableProps` and `SwipeableComponentProps` (both equal `SwipeableProps`), `SwipeSide`, `SwipeAppearance` |
+
+## Replace the previous single-sided props
+
+Before, right/default actions:
+
+```tsx
+<Swipeable actions={<DeleteAction />} actionsWidth={80}>
+  <Row />
+</Swipeable>
+```
+
+After:
+
+```tsx
+<Swipeable rightActions={<DeleteAction />} rightActionsWidth={80}>
+  <Row />
+</Swipeable>
+```
+
+Before, left actions:
+
+```tsx
+<Swipeable actions={<ReplyAction />} actionsWidth={60} actionsPosition="left">
+  <Message />
+</Swipeable>
+```
+
+After:
+
+```tsx
+<Swipeable leftActions={<ReplyAction />} leftActionsWidth={60}>
+  <Message />
+</Swipeable>
+```
+
+For both sides, supply both complete pairs. Select alternate/default content in
+the caller before passing it; there is no legacy fallback or precedence resolution.
+
+| Previous input                                | v1 replacement                                                |
+| --------------------------------------------- | ------------------------------------------------------------- |
+| `actions` and `actionsWidth` on right/default | `rightActions` and `rightActionsWidth`                        |
+| `actions` and `actionsWidth` on left          | `leftActions` and `leftActionsWidth`                          |
+| `actionsPosition`                             | Select explicit pairs; use `open(side)` for command selection |
+| Mixed old and explicit props                  | Caller resolves content, then passes explicit pairs           |
+
+An enabled side needs a finite positive width. Disabled/omitted content has no
+width and cannot borrow another edge's width. `null`, `false`, and `undefined`
+disable content; numeric `0` is still valid React content. Runtime invalid-width
+handling disables the edge and warns in development rather than enabling fallback.
+A fully disabled configuration can use `leftActions={null} rightActions={false}`.
+
+### Full-width swipe with no visible actions
+
+Some 0.x screens used `actions={null}` with a full-width `actionsWidth` to slide
+the whole screen, for example to swipe back. Before:
+
+```tsx
+<Swipeable actions={null} actionsWidth={width} actionsPosition="left">
+  <Screen />
+</Swipeable>
+```
+
+After:
+
+```tsx
+<Swipeable leftActions={<View />} leftActionsWidth={width}>
+  <Screen />
+</Swipeable>
+```
+
+In v1, `null` disables the side, so the swipe does not start. An empty `<View />`
+keeps the side enabled and shows nothing behind the content. See
+[Swipe to go back](../README.md#swipe-to-go-back) for the full recipe.
+
+## Types: removed inputs versus retained aliases
+
+`SwipeableProps` is the canonical explicit-side shape.
+`TwoSidedSwipeableProps` and `SwipeableComponentProps` remain aliases of that same
+shape. They are not an old/new compatibility union and do not accept removed props.
+
+The previous extendable interface is now a union-based side configuration.
+Use an intersection for wrapper-specific fields, not an interface extending that
+union. Keep each content/width pair together instead of independently widening
+its fields to optional values.
+
+```tsx
+import { forwardRef } from "react";
+import {
+  Swipeable,
+  type SwipeableMethods,
+  type SwipeableProps,
+} from "react-native-swipeable-actions";
+
+type MessageSwipeProps = SwipeableProps & { itemKey: string };
+
+export const MessageSwipe = forwardRef<SwipeableMethods, MessageSwipeProps>(
+  function MessageSwipe({ itemKey, ...props }, ref) {
+    return <Swipeable {...props} ref={ref} recyclingKey={itemKey} />;
+  },
+);
+```
+
+The ref/static method names and callback signatures remain. `SwipeSide` is
+`'left' | 'right'`; `SwipeAppearance` is `'default' | 'ios26'`.
+Native child layout and side/key event routing are internal implementation
+details, not new arguments to the component's public callbacks.
+
+## Commands and default selection
+
+`open()` and `Swipeable.open(key)` choose enabled right first, otherwise enabled
+left. With neither enabled they do nothing. Use `open('left')` when both sides are
+enabled and left is intended. An explicit disabled side never opens the opposite
+edge. Opening the opposite enabled side closes the current edge before opening it.
+
+`close(animated?)`, `cancel()`, and the static keyed operations remain.
+Ref commands still need a usable recycling key. Numeric keys become strings for
+the static API. Stable keys identify items, not their current list position or language.
+
+## Intentional behavior changes
+
+Migrated single-side rows deliberately adopt the canonical engine's behavior.
+The goal is not to reproduce old implementation quirks.
+
+- **Disabled directions:** dragging toward a disabled edge stays closed without
+  starting a swipe lifecycle. The old wrong-direction rubber-band behavior is gone.
+- **State callbacks:** threshold/intent transitions follow the enabled, latched
+  edge. Code must not depend on the old single-side suppression or incidental
+  callback cadence. Public callback argument lists are unchanged.
+- **Cancellation:** cancels pending/active interaction and cached open intent
+  without completing the action. Continuing the same cancelled touch must not
+  restart it; a fresh gesture can. A swipe that settled open before the cancel ran
+  has already reported `onSwipeEnd("open")` (without `autoClose`).
+- **Instant close:** `close(false)` clears cached open intent. Reattaching or
+  restoring that key must not resurrect the old open state.
+- **Restoration and widths:** restore the cached physical edge at its current
+  width. If it is disabled, restore closed rather than the opposite edge.
+  Restoration/width reconciliation is not a new swipe and must not be used as a
+  synthetic start/end signal.
+- **Completion:** aggregate `onSwipeEnd(state)` precedes the matching side
+  callback. Do not wire both to the same business action unless two invocations
+  are intended. A successful auto-close gesture reports `'open'` intent after
+  returning visually closed; that does not mean the cache remains open.
+- **Raw direct gestures:** the direct native gesture path now shares activation,
+  threshold and auto-close handling with the canonical engine; it is not the old
+  single-side shortcut.
+
+The appearance/haptic options are additive on this breaking base. They work with
+one or both explicit sides; they do not restore removed API inputs or behaviors.
+
+## RTL and app migration checklist
+
+1. Map logical start/end actions to physical left/right in your app. RTL does not
+   exchange the library's sides, widths, command arguments or side callbacks.
+2. Update examples, wrappers, mocks and type fixtures to complete explicit pairs.
+3. Keep action padding/gaps inside the declared width and preserve usable targets.
+   Give each row a path to its actions without a swipe, with `accessibilityActions`
+   on the row content. See [Accessibility](../README.md#accessibility).
+4. Keep recycling keys stable through reorder, translation updates and reattachment.
+5. Rebuild iOS/Android and rerun application behavior, including close/reset,
+   recycling, disabled edges, child gestures, chat auto-close and RTL.
+6. Treat earlier physical checks and pre-migration CI as historical evidence,
+   not acceptance of the new binary.

package/docs/support.md

@@ -0,0 +1,90 @@
+# Support and tested configurations
+
+This page states what 1.0 was tested on. A configuration that is not listed here
+can work, but nobody has checked it.
+
+## Requirements
+
+The package is an Expo module with native code.
+
+- It needs a native build with Expo Modules: an Expo development build, `expo run`,
+  or a bare React Native app with `install-expo-modules`.
+- It needs the New Architecture (Fabric) on iOS and Android. The iOS view does not
+  compile on the legacy architecture (Paper).
+- It needs Expo SDK 54 or newer, React Native 0.81 or newer and React 19.1 or newer.
+- Expo Go cannot load it.
+- Rebuild the iOS and Android apps after every install or upgrade. A JavaScript
+  reload or an OTA update cannot change native code.
+
+## iOS 27 and the UIScene lifecycle
+
+An app built with the iOS 27 SDK (Xcode 27) stops at launch on iOS 27 if it does not
+adopt the UIScene lifecycle. iOS sets this requirement for the app. The Expo SDK 54
+app template does not meet it. This package does not cause it and cannot fix it.
+
+- The Expo SDK 54 template creates its window in the app delegate. It has no scene
+  delegate.
+- The example app adopts the UIScene lifecycle with a local config plugin,
+  `example/plugins/with-scene-lifecycle.js`.
+- Built with Xcode 27, the example app launched on a physical iPhone 11 Pro Max with
+  iOS 27.0.1. Only the launch was checked. The E2E suites did not run on iOS 27.
+
+## Declared ranges
+
+The package declares these ranges. They are minimums, not a tested matrix.
+
+| Declaration | Value |
+| --- | --- |
+| `expo` peer | `>=54.0.0` |
+| `react` peer | `>=19.1.0` |
+| `react-native` peer | `>=0.81.0` |
+| Architecture | New Architecture (Fabric) only |
+| iOS deployment target | 13.4 |
+| Android `minSdkVersion` | 23 |
+
+## Tested for 1.0
+
+Every configuration below ran the release candidate. The E2E suite has 62 cases
+(25 single-sided, 19 two-sided, 14 RTL, 3 swipe to go back, 1 performance) plus the
+Maestro flows.
+
+| Area | Configuration | What ran |
+| --- | --- | --- |
+| App stack | Expo SDK 54.0, React Native 0.81.5, React 19.1.0 | Example app and a clean app that installs the packed tarball |
+| Architecture | New Architecture (Fabric), Hermes | All runs below |
+| Android | API 34 x86_64 emulator (Pixel 6 profile) | 62 E2E cases, Robolectric unit tests |
+| iOS | iOS 26.4 simulator (iPhone 17 Pro), Xcode 26.6 | 62 E2E cases, Maestro flows, Swift unit tests |
+| Packaging | `npm pack` tarball in a clean Expo app | Install, type check, autolinking, release builds on both platforms |
+
+The Swift unit tests run with `swift test` on macOS in the `test-ios` CI job. They
+cover the platform-independent helpers and state logic: swipe physics, side
+selection, gesture completion, the open-state cache, child roles, rail visibility
+and haptic state. They do not load UIKit or the native view. The E2E suites cover
+the UIKit view on the simulator.
+
+## Not supported
+
+- The legacy architecture (Paper). The iOS view does not compile on it, and no
+  Android run used it.
+- Expo SDK below 54, React Native below 0.81 and React below 19.1. The peer ranges
+  exclude them.
+
+## Not tested
+
+- iOS versions below the simulator runtime above, and Android API levels other than 34.
+- Physical Android devices for 1.0. Earlier 0.x benchmarks used a Pixel 8 Pro.
+- Automated tests of how haptics feel and how Reduce Motion behaves on a device.
+  The maintainer checks them by hand on a physical iPhone. The check runs when no
+  earlier check is recorded, and after a change to the iOS code, the haptics,
+  appearance or Reduce Motion code, or the example app's React Native or Expo
+  version.
+
+If you run the package on another configuration, an issue with the result helps,
+whether it works or not.
+
+## Reporting a problem
+
+Open an issue at
+<https://github.com/chocky335/react-native-swipeable-actions/issues> with the
+package version, Expo and React Native versions, the architecture, and the OS and
+device.

package/ios/SwipeAnimationConfig.swift

@@ -25,3 +25,35 @@ enum SwipeAnimationConfig {
     static let velocityProjectionFactor: CGFloat = 0.15
     static let progressChangeThreshold: CGFloat = 0.001
 }
+
+extension SwipeAnimationConfig {
+    static let actionRailEntryScale: CGFloat = 0.96
+    static let actionRailPopScale: CGFloat = 1.03
+    static let actionRailRestScale: CGFloat = 1.0
+    static let actionRailPopRiseDuration: TimeInterval = 0.12
+    static let actionRailPopSettleDuration: TimeInterval = 0.18
+
+    static func actionRailScale(
+        progress: CGFloat, popElapsed: TimeInterval?, hasPopped: Bool, reduceMotion: Bool
+    ) -> CGFloat {
+        guard !reduceMotion else { return actionRailRestScale }
+        let entryScale = actionRailEntryScale + (actionRailRestScale - actionRailEntryScale) * max(0, min(1, progress))
+        if let elapsed = popElapsed {
+            if elapsed < actionRailPopRiseDuration {
+                // Rise from the scale shown at the crossing, so the pop starts without a jump.
+                let t = CGFloat(max(0, elapsed) / actionRailPopRiseDuration)
+                return entryScale + (actionRailPopScale - entryScale) * t
+            }
+            let t = CGFloat(min(1, (elapsed - actionRailPopRiseDuration) / actionRailPopSettleDuration))
+            return actionRailPopScale + (actionRailRestScale - actionRailPopScale) * (1 - (1 - t) * (1 - t))
+        }
+        if hasPopped { return actionRailRestScale }
+        return entryScale
+    }
+
+    /// Rails span the row and align actions to their outer edge. Scaling about
+    /// that edge, not the rail center, keeps a pop from pushing actions past the row.
+    static func actionRailTranslation(offset: CGFloat, scale: CGFloat, railWidth: CGFloat, side: SwipeSide) -> CGFloat {
+        offset - side.sign * railWidth / 2 * (1 - scale)
+    }
+}