react-panel-layout 0.6.0 → 0.7.0

package/dist/modules/drawer/drawerStateMachine.d.ts

@@ -0,0 +1,168 @@
+/**
+ * @file Generic state machine for drawer animations.
+ *
+ * This module provides a React-independent state machine for managing drawer
+ * transitions. It handles swipe gestures, button operations, and animations through
+ * a reducer pattern with typed actions.
+ *
+ * The position type is generic, allowing different drawer modes (reveal, overlay)
+ * to use the same state machine logic with mode-specific position calculations.
+ *
+ * Key design principles:
+ * - Pure functions: same input → same output
+ * - No React/DOM dependencies
+ * - Testable in isolation
+ * - Deterministic state transitions
+ */
+import type { DrawerTransformStrategy, DrawerStrategyConfig } from "./strategies/types.js";
+/**
+ * Phase of drawer animation lifecycle.
+ * - closed: Drawer is hidden
+ * - opening: Drawer is animating open
+ * - open: Drawer is fully visible
+ * - closing: Drawer is animating closed
+ */
+export type DrawerPhase = "closed" | "opening" | "open" | "closing";
+/**
+ * Direction of swipe gesture.
+ */
+export type SwipeDirection = "opening" | "closing" | null;
+/**
+ * Animation state tracking from/to positions.
+ */
+export type AnimationState<TPosition> = {
+    /** Animation type */
+    type: "opening" | "closing";
+    /** Starting position */
+    from: TPosition;
+    /** Target position */
+    to: TPosition;
+};
+/**
+ * Complete state for drawer.
+ */
+export type DrawerState<TPosition> = {
+    /** Current animation phase */
+    phase: DrawerPhase;
+    /** Target open state (what the drawer should be after current operation) */
+    targetOpen: boolean;
+    /** Current position */
+    position: TPosition;
+    /** Whether a swipe operation is active */
+    isOperating: boolean;
+    /** Direction of current swipe */
+    swipeDirection: SwipeDirection;
+    /** Current swipe displacement in pixels */
+    displacement: number;
+    /** Animation state if animating */
+    animation: AnimationState<TPosition> | null;
+};
+/**
+ * Compute progress (0-1) from displacement.
+ *
+ * @param displacement - Current swipe displacement in pixels
+ * @param drawerSize - Size of the drawer in pixels
+ * @param direction - Swipe direction ("opening" or "closing")
+ * @returns Progress value between 0 and 1
+ */
+export declare function computeProgressFromDisplacement(displacement: number, drawerSize: number, direction: SwipeDirection): number;
+/**
+ * Determine if drawer should open or close after swipe ends.
+ *
+ * @param displacement - Final swipe displacement in pixels
+ * @param drawerSize - Size of the drawer in pixels
+ * @param direction - Swipe direction
+ * @returns true if drawer should be open, false if closed
+ */
+export declare function computeSwipeEndTarget(displacement: number, drawerSize: number, direction: SwipeDirection): boolean;
+/**
+ * Action creators for drawer state machine.
+ */
+export declare const drawerActions: {
+    /** Start swipe operation */
+    readonly swipeStart: ((direction: "opening" | "closing") => {
+        type: "SWIPE_START";
+        payload: {
+            direction: "opening" | "closing";
+        };
+    }) & {
+        readonly type: "SWIPE_START";
+    };
+    /** Update swipe displacement */
+    readonly swipeUpdate: ((displacement: number) => {
+        type: "SWIPE_UPDATE";
+        payload: {
+            displacement: number;
+        };
+    }) & {
+        readonly type: "SWIPE_UPDATE";
+    };
+    /** End swipe operation */
+    readonly swipeEnd: (() => {
+        type: "SWIPE_END";
+    }) & {
+        readonly type: "SWIPE_END";
+    };
+    /** Animation frame update */
+    readonly animationFrame: ((easedProgress: number) => {
+        type: "ANIMATION_FRAME";
+        payload: {
+            easedProgress: number;
+        };
+    }) & {
+        readonly type: "ANIMATION_FRAME";
+    };
+    /** Animation complete */
+    readonly animationComplete: (() => {
+        type: "ANIMATION_COMPLETE";
+    }) & {
+        readonly type: "ANIMATION_COMPLETE";
+    };
+    /** Button open */
+    readonly buttonOpen: (() => {
+        type: "BUTTON_OPEN";
+    }) & {
+        readonly type: "BUTTON_OPEN";
+    };
+    /** Button close */
+    readonly buttonClose: (() => {
+        type: "BUTTON_CLOSE";
+    }) & {
+        readonly type: "BUTTON_CLOSE";
+    };
+    /** Sync open state from external prop */
+    readonly syncOpenState: ((isOpen: boolean) => {
+        type: "SYNC_OPEN_STATE";
+        payload: {
+            isOpen: boolean;
+        };
+    }) & {
+        readonly type: "SYNC_OPEN_STATE";
+    };
+    /** Initialize state */
+    readonly initialize: ((isOpen: boolean) => {
+        type: "INITIALIZE";
+        payload: {
+            isOpen: boolean;
+        };
+    }) & {
+        readonly type: "INITIALIZE";
+    };
+};
+export type DrawerAction = ReturnType<(typeof drawerActions)[keyof typeof drawerActions]>;
+/**
+ * Create initial state for drawer.
+ *
+ * @param isOpen - Initial open state
+ * @param strategy - Transform strategy
+ * @param config - Drawer configuration
+ * @returns Initial state
+ */
+export declare function createDrawerInitialState<TPosition>(isOpen: boolean, strategy: DrawerTransformStrategy<TPosition>, config: DrawerStrategyConfig): DrawerState<TPosition>;
+/**
+ * Create a drawer reducer for a specific strategy.
+ *
+ * @param strategy - Transform strategy to use for position calculations
+ * @returns Reducer function for the drawer state machine
+ */
+export declare function createDrawerReducer<TPosition>(strategy: DrawerTransformStrategy<TPosition>): (state: DrawerState<TPosition>, action: DrawerAction, config: DrawerStrategyConfig) => DrawerState<TPosition>;

package/dist/modules/drawer/revealDrawerConstants.d.ts

@@ -0,0 +1,33 @@
+/**
+ * @file Constants for reveal drawer state machine.
+ *
+ * Centralizes all threshold values used in reveal drawer behavior.
+ * These values control swipe gestures, animations, and state transitions.
+ */
+/**
+ * Minimum swipe distance in pixels to trigger drawer open.
+ * Used when opening via edge swipe gesture.
+ * ~27% of a 375px mobile screen width.
+ */
+export declare const REVEAL_DRAWER_OPEN_DISTANCE_THRESHOLD = 100;
+/**
+ * Ratio of drawer size that must be swiped to dismiss (close) the drawer.
+ * Value between 0 and 1. When swiping to close, if displacement exceeds
+ * this ratio of the drawer size, the drawer will close.
+ */
+export declare const REVEAL_DRAWER_DISMISS_RATIO = 0.3;
+/**
+ * Percentage offset for drawer when closed.
+ * The drawer is positioned at -30% (or +30% for right/bottom) when closed,
+ * creating a "pull out" parallax effect during the reveal animation.
+ */
+export declare const REVEAL_DRAWER_CLOSED_OFFSET_PERCENT = 30;
+/**
+ * Animation duration in milliseconds for reveal transitions.
+ */
+export declare const REVEAL_DRAWER_ANIMATION_DURATION = 300;
+/**
+ * Threshold in pixels below which positions are considered equal.
+ * Used to determine if animation is needed between two positions.
+ */
+export declare const REVEAL_DRAWER_SNAP_THRESHOLD = 1;

package/dist/modules/drawer/revealDrawerStateMachine.d.ts

@@ -0,0 +1,146 @@
+/**
+ * @file Reveal drawer state machine (backward-compatible re-export).
+ *
+ * This module provides backward compatibility by re-exporting the generic
+ * drawer state machine configured with the reveal strategy.
+ *
+ * For new code, prefer importing from drawerStateMachine.ts directly
+ * with the appropriate strategy.
+ */
+import type { DrawerPlacement } from "../../components/window/drawerStyles.js";
+import type { RevealPosition } from "./strategies/types.js";
+import { computeProgressFromDisplacement as genericComputeProgress, computeSwipeEndTarget as genericComputeSwipeEndTarget, type DrawerPhase, type SwipeDirection, type AnimationState, type DrawerState, type DrawerAction } from "./drawerStateMachine.js";
+import { getPlacementConfig } from "./strategies/types.js";
+/**
+ * @deprecated Use DrawerPhase from drawerStateMachine.ts
+ */
+export type RevealDrawerPhase = DrawerPhase;
+/**
+ * @deprecated Use RevealPosition from strategies/types.ts
+ */
+export type RevealPositionPx = RevealPosition;
+/**
+ * @deprecated Use AnimationState<RevealPosition>
+ */
+export type { AnimationState };
+/**
+ * @deprecated Use DrawerState<RevealPosition>
+ */
+export type RevealDrawerState = DrawerState<RevealPosition>;
+/**
+ * Configuration for the reveal drawer state machine.
+ */
+export type RevealDrawerConfig = {
+    placement: DrawerPlacement;
+    drawerSize: number;
+};
+export type { SwipeDirection };
+export { getPlacementConfig };
+/**
+ * @deprecated Use drawerActions from drawerStateMachine.ts
+ */
+export declare const revealDrawerActions: {
+    readonly swipeStart: ((direction: "opening" | "closing") => {
+        type: "SWIPE_START";
+        payload: {
+            direction: "opening" | "closing";
+        };
+    }) & {
+        readonly type: "SWIPE_START";
+    };
+    readonly swipeUpdate: ((displacement: number) => {
+        type: "SWIPE_UPDATE";
+        payload: {
+            displacement: number;
+        };
+    }) & {
+        readonly type: "SWIPE_UPDATE";
+    };
+    readonly swipeEnd: (() => {
+        type: "SWIPE_END";
+    }) & {
+        readonly type: "SWIPE_END";
+    };
+    readonly animationFrame: ((easedProgress: number) => {
+        type: "ANIMATION_FRAME";
+        payload: {
+            easedProgress: number;
+        };
+    }) & {
+        readonly type: "ANIMATION_FRAME";
+    };
+    readonly animationComplete: (() => {
+        type: "ANIMATION_COMPLETE";
+    }) & {
+        readonly type: "ANIMATION_COMPLETE";
+    };
+    readonly buttonOpen: (() => {
+        type: "BUTTON_OPEN";
+    }) & {
+        readonly type: "BUTTON_OPEN";
+    };
+    readonly buttonClose: (() => {
+        type: "BUTTON_CLOSE";
+    }) & {
+        readonly type: "BUTTON_CLOSE";
+    };
+    readonly syncOpenState: ((isOpen: boolean) => {
+        type: "SYNC_OPEN_STATE";
+        payload: {
+            isOpen: boolean;
+        };
+    }) & {
+        readonly type: "SYNC_OPEN_STATE";
+    };
+    readonly initialize: ((isOpen: boolean) => {
+        type: "INITIALIZE";
+        payload: {
+            isOpen: boolean;
+        };
+    }) & {
+        readonly type: "INITIALIZE";
+    };
+};
+export type RevealDrawerAction = DrawerAction;
+/**
+ * Compute progress from displacement.
+ * @deprecated Use computeProgressFromDisplacement from drawerStateMachine.ts
+ */
+export declare const computeProgressFromDisplacement: typeof genericComputeProgress;
+/**
+ * Compute swipe end target.
+ * @deprecated Use computeSwipeEndTarget from drawerStateMachine.ts
+ */
+export declare const computeSwipeEndTarget: typeof genericComputeSwipeEndTarget;
+/**
+ * Compute drawer offset in pixels from progress.
+ */
+export declare function computeDrawerOffsetPx(progress: number, drawerSize: number, placement: DrawerPlacement): number;
+/**
+ * Compute content offset in pixels from progress.
+ */
+export declare function computeContentOffsetPx(progress: number, drawerSize: number, placement: DrawerPlacement): number;
+/**
+ * Compute position from progress.
+ */
+export declare function computePositionFromProgress(progress: number, config: RevealDrawerConfig): RevealPosition;
+/**
+ * Compute target position for open or closed state.
+ */
+export declare function computeTargetPosition(isOpen: boolean, config: RevealDrawerConfig): RevealPosition;
+/**
+ * Determine if animation is needed between two positions.
+ */
+export declare function shouldAnimate(from: RevealPosition, to: RevealPosition): boolean;
+/**
+ * Interpolate between two positions.
+ */
+export declare function interpolatePosition(from: RevealPosition, to: RevealPosition, progress: number): RevealPosition;
+/**
+ * Create initial state for reveal drawer.
+ */
+export declare function createInitialState(isOpen: boolean, config: RevealDrawerConfig): RevealDrawerState;
+/**
+ * Reveal drawer reducer function.
+ */
+export declare function revealDrawerReducer(state: RevealDrawerState, action: RevealDrawerAction, config: RevealDrawerConfig): RevealDrawerState;

package/dist/modules/drawer/strategies/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @file Drawer transform strategies module.
+ *
+ * Exports strategy implementations for different drawer animation modes.
+ */
+export * from "./types.js";
+export { revealStrategy } from "./revealStrategy.js";
+export { overlayStrategy } from "./overlayStrategy.js";

package/dist/modules/drawer/strategies/overlayStrategy.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @file Overlay mode drawer transform strategy.
+ *
+ * Implements the overlay animation where:
+ * - Drawer slides from ±100% to 0% (slides over content)
+ * - Backdrop opacity changes from 0 to 1
+ */
+import type { DrawerTransformStrategy, OverlayPosition } from "./types.js";
+/**
+ * Overlay mode drawer transform strategy.
+ */
+export declare const overlayStrategy: DrawerTransformStrategy<OverlayPosition>;

package/dist/modules/drawer/strategies/revealStrategy.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @file Reveal mode drawer transform strategy.
+ *
+ * Implements the reveal animation where:
+ * - Drawer slides from -30% to 0% (parallax effect)
+ * - Content slides from 0 to +drawerSize (reveals drawer behind)
+ */
+import type { DrawerTransformStrategy, RevealPosition } from "./types.js";
+/**
+ * Reveal mode drawer transform strategy.
+ */
+export declare const revealStrategy: DrawerTransformStrategy<RevealPosition>;

package/dist/modules/drawer/strategies/types.d.ts

@@ -0,0 +1,116 @@
+/**
+ * @file Drawer transform strategy types.
+ *
+ * Defines the strategy pattern interface for different drawer animation modes.
+ * Each mode (reveal, overlay) implements this interface with mode-specific
+ * position calculations and DOM operations.
+ */
+import type { DrawerPlacement } from "../../../components/window/drawerStyles.js";
+/**
+ * Position values for reveal mode.
+ * - Drawer moves from -30% to 0%
+ * - Content moves from 0 to +drawerSize
+ */
+export type RevealPosition = {
+    /** Drawer offset in pixels */
+    drawerPx: number;
+    /** Content offset in pixels */
+    contentPx: number;
+};
+/**
+ * Position values for overlay mode.
+ * - Drawer moves from ±100% to 0%
+ * - Backdrop opacity changes from 0 to 1
+ */
+export type OverlayPosition = {
+    /** Drawer offset in pixels */
+    drawerPx: number;
+    /** Backdrop opacity (0-1) */
+    backdropOpacity: number;
+};
+/**
+ * Configuration for drawer strategy calculations.
+ */
+export type DrawerStrategyConfig = {
+    /** Drawer placement (left, right, top, bottom) */
+    placement: DrawerPlacement;
+    /** Drawer size in pixels */
+    drawerSize: number;
+    /** Content background color (reveal mode) */
+    contentBackground?: string;
+};
+/**
+ * DOM elements used by drawer strategies.
+ */
+export type DrawerElements = {
+    /** Drawer element */
+    drawer: HTMLElement | null;
+    /** Content element (reveal mode) */
+    content: HTMLElement | null;
+    /** Backdrop element (overlay mode) */
+    backdrop: HTMLElement | null;
+};
+/**
+ * Placement configuration for transform calculations.
+ */
+export type PlacementConfig = {
+    /** Transform axis (X or Y) */
+    axis: "X" | "Y";
+    /** Sign for transform direction (1 or -1) */
+    sign: 1 | -1;
+};
+/**
+ * Lookup table for placement configuration.
+ */
+export declare const PLACEMENT_CONFIG: Record<DrawerPlacement, PlacementConfig>;
+/**
+ * Get placement configuration for a drawer placement.
+ */
+export declare function getPlacementConfig(placement: DrawerPlacement): PlacementConfig;
+/**
+ * Strategy interface for drawer transform calculations.
+ *
+ * Each drawer mode (reveal, overlay) implements this interface to provide
+ * mode-specific position calculations and DOM operations while sharing
+ * the common state machine logic.
+ *
+ * @typeParam TPosition - The position type used by this strategy
+ */
+export type DrawerTransformStrategy<TPosition> = {
+    /**
+     * Get the closed position (progress = 0).
+     */
+    getClosedPosition: (config: DrawerStrategyConfig) => TPosition;
+    /**
+     * Get the open position (progress = 1).
+     */
+    getOpenPosition: (config: DrawerStrategyConfig) => TPosition;
+    /**
+     * Compute position from progress (0 = closed, 1 = open).
+     */
+    computePositionFromProgress: (progress: number, config: DrawerStrategyConfig) => TPosition;
+    /**
+     * Interpolate between two positions.
+     */
+    interpolatePosition: (from: TPosition, to: TPosition, progress: number) => TPosition;
+    /**
+     * Determine if animation is needed between two positions.
+     */
+    shouldAnimate: (from: TPosition, to: TPosition) => boolean;
+    /**
+     * Apply position to DOM elements.
+     */
+    applyToDOM: (position: TPosition, elements: DrawerElements, config: DrawerStrategyConfig) => void;
+    /**
+     * Clear transforms from DOM elements.
+     */
+    clearFromDOM: (elements: DrawerElements, config: DrawerStrategyConfig) => void;
+    /**
+     * Called when opening animation starts (optional).
+     */
+    onOpeningStart?: (elements: DrawerElements, config: DrawerStrategyConfig) => void;
+    /**
+     * Called when closing animation completes (optional).
+     */
+    onClosingComplete?: (elements: DrawerElements, config: DrawerStrategyConfig) => void;
+};

package/dist/modules/drawer/types.d.ts

@@ -0,0 +1,74 @@
+/**
+ * @file Type definitions for Drawer swipe gesture handling.
+ */
+import type * as React from "react";
+import type { ContinuousOperationState } from "../../hooks/gesture/types.js";
+/**
+ * Direction for drawer anchor (same as anchor edge).
+ */
+export type DrawerSwipeDirection = "left" | "right" | "top" | "bottom";
+/**
+ * Options for useDrawerSwipeInput hook.
+ */
+export type UseDrawerSwipeInputOptions = {
+    /** Container ref for edge detection zone (e.g., GridLayout container) */
+    edgeContainerRef: React.RefObject<HTMLElement | null>;
+    /** Drawer content ref (for close gesture) */
+    drawerContentRef: React.RefObject<HTMLElement | null>;
+    /** Drawer direction (anchor edge) */
+    direction: DrawerSwipeDirection;
+    /** Whether the drawer is currently open */
+    isOpen: boolean;
+    /** Callback when swipe should open the drawer */
+    onSwipeOpen: () => void;
+    /** Callback when swipe should close the drawer */
+    onSwipeClose: () => void;
+    /** Whether edge swipe to open is enabled. @default true */
+    enableEdgeSwipeOpen?: boolean;
+    /** Whether swipe to close is enabled. @default true */
+    enableSwipeClose?: boolean;
+    /** Width of edge detection zone in pixels. @default 20 */
+    edgeWidth?: number;
+    /** Dismiss threshold ratio (0-1). @default 0.3 */
+    dismissThreshold?: number;
+};
+/**
+ * Result from useDrawerSwipeInput hook.
+ */
+export type UseDrawerSwipeInputResult = {
+    /** Current operation state */
+    state: ContinuousOperationState;
+    /** Whether currently opening via edge swipe */
+    isOpening: boolean;
+    /** Whether currently closing via drag */
+    isClosing: boolean;
+    /** Progress (0-1) towards open/close threshold */
+    progress: number;
+    /** Displacement in pixels (primary axis) */
+    displacement: number;
+    /** Props for edge container (open gesture zone) */
+    edgeContainerProps: React.HTMLAttributes<HTMLElement> & {
+        style: React.CSSProperties;
+    };
+    /** Props for drawer content (close gesture zone) */
+    drawerContentProps: React.HTMLAttributes<HTMLElement> & {
+        style: React.CSSProperties;
+    };
+};
+/**
+ * Get animation axis from direction.
+ */
+export declare function getDrawerAnimationAxis(direction: DrawerSwipeDirection): "x" | "y";
+/**
+ * Get the sign for the close swipe direction.
+ * Left drawer closes by swiping left (-1).
+ * Right drawer closes by swiping right (+1).
+ * Top drawer closes by swiping up (-1).
+ * Bottom drawer closes by swiping down (+1).
+ */
+export declare function getDrawerCloseSwipeSign(direction: DrawerSwipeDirection): 1 | -1;
+/**
+ * Get the sign for the open swipe direction.
+ * This is the opposite of the close direction.
+ */
+export declare function getDrawerOpenSwipeSign(direction: DrawerSwipeDirection): 1 | -1;

package/dist/modules/drawer/useDrawerSwipeInput.d.ts

@@ -0,0 +1,24 @@
+import type { UseDrawerSwipeInputOptions, UseDrawerSwipeInputResult } from "./types.js";
+/**
+ * Hook for detecting swipe gestures to open/close a drawer.
+ *
+ * When drawer is closed:
+ * - Detects edge swipe from the anchor edge to trigger open
+ *
+ * When drawer is open:
+ * - Detects drag gesture within drawer to trigger close
+ * - Respects scrollable content boundaries
+ *
+ * @example
+ * ```tsx
+ * const { state, edgeContainerProps, drawerContentProps } = useDrawerSwipeInput({
+ *   edgeContainerRef: gridLayoutRef,
+ *   drawerContentRef: drawerRef,
+ *   direction: "left",
+ *   isOpen,
+ *   onSwipeOpen: () => setOpen(true),
+ *   onSwipeClose: () => setOpen(false),
+ * });
+ * ```
+ */
+export declare function useDrawerSwipeInput(options: UseDrawerSwipeInputOptions): UseDrawerSwipeInputResult;

package/dist/modules/pivot/SwipePivotTabBar.d.ts

@@ -86,4 +86,7 @@ export type SwipePivotTabBarProps<TId extends string = string> = {
      */
     renderIndicator?: (props: IndicatorRenderProps) => React.ReactNode;
 };
+/**
+ * Swipeable tab bar for pivot navigation.
+ */
 export declare function SwipePivotTabBar<TId extends string = string>({ items, activeId, activeIndex, itemCount, inputState, tabWidth, viewportWidth, navigationMode, axis, renderTab, animationDuration, fixedTabs, renderIndicator, }: SwipePivotTabBarProps<TId>): React.ReactElement;

package/dist/modules/stack/SwipeStackContent.d.ts

@@ -8,10 +8,13 @@
  * Uses useSwipeContentTransform for immediate DOM updates.
  */
 import * as React from "react";
-import type { SwipeInputState, GestureAxis } from "../../hooks/gesture/types.js";
+import type { ContinuousOperationState, GestureAxis } from "../../hooks/gesture/types.js";
 import type { StackDisplayMode } from "./types.js";
 /**
  * Props for SwipeStackContent component.
+ *
+ * This component accepts ContinuousOperationState, meaning it responds uniformly
+ * to any continuous operation (whether human gesture or system animation).
  */
 export type SwipeStackContentProps = {
     /** Panel ID */
@@ -22,8 +25,8 @@ export type SwipeStackContentProps = {
     navigationDepth: number;
     /** Whether this panel is currently active */
     isActive: boolean;
-    /** Swipe input state from useStackSwipeInput */
-    inputState: SwipeInputState;
+    /** Continuous operation state (from gesture input or animation system) */
+    operationState: ContinuousOperationState;
     /** Container size in pixels (width for horizontal, height for vertical) */
     containerSize: number;
     /** Gesture axis. @default "horizontal" */

package/dist/modules/stack/SwipeStackOutlet.d.ts

@@ -5,7 +5,7 @@
  * providing iOS-style smooth swipe-to-go-back behavior.
  */
 import * as React from "react";
-import type { SwipeInputState } from "../../hooks/gesture/types.js";
+import type { ContinuousOperationState } from "../../hooks/gesture/types.js";
 import type { StackPanel, StackNavigationState } from "./types.js";
 /**
  * Props for SwipeStackOutlet component.
@@ -15,8 +15,8 @@ export type SwipeStackOutletProps = {
     panels: ReadonlyArray<StackPanel>;
     /** Current navigation state */
     navigationState: StackNavigationState;
-    /** Swipe input state from useStackSwipeInput */
-    inputState: SwipeInputState;
+    /** Continuous operation state (from gesture input or animation system) */
+    operationState: ContinuousOperationState;
     /** Container size in pixels (width for horizontal swipe) */
     containerSize: number;
     /** Function to get cached content for a panel */
@@ -70,7 +70,7 @@ export type SwipeStackOutletProps = {
  *     <SwipeStackOutlet
  *       panels={navigation.panels}
  *       navigationState={navigation.state}
- *       inputState={swipeInput.inputState}
+ *       operationState={toContinuousOperationState(swipeInput.inputState)}
  *       containerSize={containerWidth}
  *     />
  *   </div>

package/dist/modules/stack/computeSwipeStackTransform.d.ts

@@ -48,7 +48,7 @@ export type ComputeSwipeVisibilityInput = {
     /** Whether this panel is currently active */
     isActive: boolean;
     /** Whether swipe gesture is active */
-    isSwiping: boolean;
+    isOperating: boolean;
     /** Whether snap-back animation is running */
     isAnimating: boolean;
 };

package/dist/panels.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./PanelSystem-Bs8bQwQF.cjs");exports.DropSuggestOverlay=e.DropSuggestOverlay;exports.PanelGroupView=e.PanelGroupView;exports.PanelSystem=e.PanelSystem;exports.PanelSystemProvider=e.PanelSystemProvider;exports.addTabToGroup=e.addTabToGroup;exports.addTabToGroupAtIndex=e.addTabToGroupAtIndex;exports.buildInitialState=e.buildInitialState;exports.closeLeaf=e.closeLeaf;exports.collectGroupsInOrder=e.collectGroupsInOrder;exports.createEmptyGroup=e.createEmptyGroup;exports.focusGroupIndex=e.focusGroupIndex;exports.isGroup=e.isGroup;exports.moveTab=e.moveTab;exports.nextGroup=e.nextGroup;exports.prevGroup=e.prevGroup;exports.refreshGroupOrder=e.refreshGroupOrder;exports.removeTabFromGroup=e.removeTabFromGroup;exports.reorderTabWithinGroup=e.reorderTabWithinGroup;exports.setActiveTab=e.setActiveTab;exports.setFocusedGroup=e.setFocusedGroup;exports.setSplitRatio=e.setSplitRatio;exports.splitGroup=e.splitGroup;exports.splitLeaf=e.splitLeaf;exports.usePanelSystem=e.usePanelSystem;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./PanelSystem-B8Igvnb2.cjs");exports.DropSuggestOverlay=e.DropSuggestOverlay;exports.PanelGroupView=e.PanelGroupView;exports.PanelSystem=e.PanelSystem;exports.PanelSystemProvider=e.PanelSystemProvider;exports.addTabToGroup=e.addTabToGroup;exports.addTabToGroupAtIndex=e.addTabToGroupAtIndex;exports.buildInitialState=e.buildInitialState;exports.closeLeaf=e.closeLeaf;exports.collectGroupsInOrder=e.collectGroupsInOrder;exports.createEmptyGroup=e.createEmptyGroup;exports.focusGroupIndex=e.focusGroupIndex;exports.isGroup=e.isGroup;exports.moveTab=e.moveTab;exports.nextGroup=e.nextGroup;exports.prevGroup=e.prevGroup;exports.refreshGroupOrder=e.refreshGroupOrder;exports.removeTabFromGroup=e.removeTabFromGroup;exports.reorderTabWithinGroup=e.reorderTabWithinGroup;exports.setActiveTab=e.setActiveTab;exports.setFocusedGroup=e.setFocusedGroup;exports.setSplitRatio=e.setSplitRatio;exports.splitGroup=e.splitGroup;exports.splitLeaf=e.splitLeaf;exports.usePanelSystem=e.usePanelSystem;
 //# sourceMappingURL=panels.cjs.map