@lodev09/react-native-true-sheet 3.10.1 → 3.11.0-beta.1

package/lib/typescript/src/web/vaul/index.d.ts

@@ -0,0 +1,210 @@
+import React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import './style.css';
+export interface WithFadeFromProps {
+    /**
+     * Array of numbers from 0 to 100 that corresponds to % of the screen a given snap point should take up.
+     * Should go from least visible. Example `[0.2, 0.5, 0.8]`.
+     * You can also use px values, which doesn't take screen height into account.
+     */
+    snapPoints: (number | string)[];
+    /**
+     * Index of a `snapPoint` from which the overlay fade should be applied. Defaults to the last snap point.
+     */
+    fadeFromIndex: number;
+}
+export interface WithoutFadeFromProps {
+    /**
+     * Array of numbers from 0 to 100 that corresponds to % of the screen a given snap point should take up.
+     * Should go from least visible. Example `[0.2, 0.5, 0.8]`.
+     * You can also use px values, which doesn't take screen height into account.
+     */
+    snapPoints?: (number | string)[];
+    fadeFromIndex?: never;
+}
+export type DialogProps = {
+    activeSnapPoint?: number | string | null;
+    setActiveSnapPoint?: (snapPoint: number | string | null) => void;
+    children?: React.ReactNode;
+    open?: boolean;
+    /**
+     * Number between 0 and 1 that determines when the drawer should be closed.
+     * Example: threshold of 0.5 would close the drawer if the user swiped for 50% of the height of the drawer or more.
+     * @default 0.25
+     */
+    closeThreshold?: number;
+    /**
+     * When `true` the `body` doesn't get any styles assigned from Vaul
+     */
+    noBodyStyles?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    shouldScaleBackground?: boolean;
+    /**
+     * When `false` we don't change body's background color when the drawer is open.
+     * @default true
+     */
+    setBackgroundColorOnScale?: boolean;
+    /**
+     * Duration for which the drawer is not draggable after scrolling content inside of the drawer.
+     * @default 500ms
+     */
+    scrollLockTimeout?: number;
+    /**
+     * When `true`, don't move the drawer upwards if there's space, but rather only change it's height so it's fully scrollable when the keyboard is open
+     */
+    fixed?: boolean;
+    /**
+     * When `true` only allows the drawer to be dragged by the `<Drawer.Handle />` component.
+     * @default false
+     */
+    handleOnly?: boolean;
+    /**
+     * When `false` dragging, clicking outside, pressing esc, etc. will not close the drawer.
+     * Use this in comination with the `open` prop, otherwise you won't be able to open/close the drawer.
+     * @default true
+     */
+    dismissible?: boolean;
+    /**
+     * When `false` the drawer can't be dragged by the user. Programmatic snap-point
+     * changes still animate. Defaults to `true`.
+     */
+    draggable?: boolean;
+    onDrag?: (event: React.PointerEvent<HTMLDivElement>, percentageDragged: number) => void;
+    onRelease?: (event: React.PointerEvent<HTMLDivElement>, open: boolean) => void;
+    /**
+     * When `false` it allows to interact with elements outside of the drawer without closing it.
+     * @default true
+     */
+    modal?: boolean;
+    nested?: boolean;
+    onClose?: () => void;
+    /**
+     * Direction of the drawer. Can be `top` or `bottom`, `left`, `right`.
+     * @default 'bottom'
+     */
+    direction?: 'top' | 'bottom' | 'left' | 'right';
+    /**
+     * Opened by default, skips initial enter animation. Still reacts to `open` state changes
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /**
+     * When set to `true` prevents scrolling on the document body on mount, and restores it on unmount.
+     * @default false
+     */
+    disablePreventScroll?: boolean;
+    /**
+     * When `true` Vaul will reposition inputs rather than scroll then into view if the keyboard is in the way.
+     * Setting it to `false` will fall back to the default browser behavior.
+     * @default true when {@link snapPoints} is defined
+     */
+    repositionInputs?: boolean;
+    /**
+     * Disabled velocity based swiping for snap points.
+     * This means that a snap point won't be skipped even if the velocity is high enough.
+     * Useful if each snap point in a drawer is equally important.
+     * @default false
+     */
+    snapToSequentialPoint?: boolean;
+    container?: HTMLElement | null;
+    /**
+     * Gets triggered after the open or close animation ends, it receives an `open` argument with the `open` state of the drawer by the time the function was triggered.
+     * Useful to revert any state changes for example.
+     */
+    onAnimationEnd?: (open: boolean) => void;
+    /**
+     * Fires on every animation frame while the drawer is open with the drawer's
+     * current top edge in the viewport (px). Emits during drag, snap, and the
+     * open/close transitions.
+     */
+    onPositionChange?: (position: number) => void;
+    preventScrollRestoration?: boolean;
+    autoFocus?: boolean;
+    /**
+     * Renders the drawer as a floating card offset from the bottom edge so it
+     * doesn't visually attach to the viewport. Snap points are computed against
+     * the reduced floating area, so {@link detachedOffset} is preserved during
+     * drag and snap.
+     * @default false
+     */
+    detached?: boolean;
+    /**
+     * Gap (in px) between the drawer's bottom edge and the viewport bottom when
+     * {@link detached} is `true`.
+     * @default 0
+     */
+    detachedOffset?: number;
+    /**
+     * Corner radius (in px) applied to the clip wrapper's bottom when
+     * {@link detached} is `true`, so the floating card's bottom edge stays
+     * rounded while it's clipped at the floating anchor.
+     * @default 0
+     */
+    detachedRadius?: number;
+    /**
+     * Extra styles merged into the detached clip wrapper. Use this to match the
+     * wrapper's horizontal bounds to the drawer's on desktop (e.g. `maxWidth` +
+     * auto margins) so its rounded-bottom clip aligns with the drawer.
+     */
+    detachedWrapperStyle?: React.CSSProperties;
+    /**
+     * Caps the visible sheet height (in px) so full and 'auto' snap points
+     * respect a user-specified ceiling.
+     */
+    maxContentHeight?: number;
+    /**
+     * When `false` the first snap on mount is applied without a transition so
+     * the sheet appears at its target detent instantly. Defaults to `true`.
+     */
+    initialAnimated?: boolean;
+} & (WithFadeFromProps | WithoutFadeFromProps);
+export declare function Root({ open: openProp, onOpenChange, children, onDrag: onDragProp, onRelease: onReleaseProp, snapPoints, shouldScaleBackground, setBackgroundColorOnScale, closeThreshold, scrollLockTimeout, dismissible, draggable, handleOnly, fadeFromIndex, activeSnapPoint: activeSnapPointProp, setActiveSnapPoint: setActiveSnapPointProp, fixed, modal, onClose, nested, noBodyStyles, direction, defaultOpen, disablePreventScroll, snapToSequentialPoint, preventScrollRestoration, repositionInputs, onAnimationEnd, onPositionChange, container, autoFocus, detached, detachedOffset, detachedRadius, detachedWrapperStyle, maxContentHeight, initialAnimated, }: DialogProps): import("react/jsx-runtime").JSX.Element;
+export declare const Overlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type ContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {
+    /**
+     * Extra nodes rendered inside the detached clip wrapper as siblings of the
+     * drawer. Use for floating elements (e.g. a footer) that should slide with
+     * the wrapper on dismiss and drag-overshoot instead of staying pinned.
+     */
+    detachedSiblings?: React.ReactNode;
+};
+export declare const Content: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    /**
+     * Extra nodes rendered inside the detached clip wrapper as siblings of the
+     * drawer. Use for floating elements (e.g. a footer) that should slide with
+     * the wrapper on dismiss and drag-overshoot instead of staying pinned.
+     */
+    detachedSiblings?: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement>>;
+export type HandleProps = React.ComponentPropsWithoutRef<'div'> & {
+    preventCycle?: boolean;
+};
+export declare const Handle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    preventCycle?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+export declare function NestedRoot({ onDrag, onOpenChange, open: nestedIsOpen, ...rest }: DialogProps): import("react/jsx-runtime").JSX.Element;
+type PortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;
+export declare function Portal(props: PortalProps): import("react/jsx-runtime").JSX.Element;
+export declare const Drawer: {
+    Root: typeof Root;
+    NestedRoot: typeof NestedRoot;
+    Content: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+        /**
+         * Extra nodes rendered inside the detached clip wrapper as siblings of the
+         * drawer. Use for floating elements (e.g. a footer) that should slide with
+         * the wrapper on dismiss and drag-overshoot instead of staying pinned.
+         */
+        detachedSiblings?: React.ReactNode;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Overlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Trigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+    Portal: typeof Portal;
+    Handle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        preventCycle?: boolean;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Close: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+    Title: React.ForwardRefExoticComponent<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+    Description: React.ForwardRefExoticComponent<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+};
+export {};
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/web/vaul/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/web/vaul/index.tsx"],"names":[],"mappings":"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"}

package/lib/typescript/src/web/vaul/types.d.ts

@@ -0,0 +1,7 @@
+export type DrawerDirection = 'top' | 'bottom' | 'left' | 'right';
+export interface SnapPoint {
+    fraction: number;
+    height: number;
+}
+export type AnyFunction = (...args: any) => any;
+//# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/web/vaul/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/web/vaul/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,eAAe,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAClE,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,WAAW,GAAG,CAAC,GAAG,IAAI,EAAE,GAAG,KAAK,GAAG,CAAC"}

package/lib/typescript/src/web/vaul/use-composed-refs.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+type PossibleRef<T> = React.Ref<T> | undefined;
+/**
+ * A utility to compose multiple refs together
+ * Accepts callback refs and RefObject(s)
+ */
+declare function composeRefs<T>(...refs: PossibleRef<T>[]): (node: T) => void;
+/**
+ * A custom hook that composes multiple refs
+ * Accepts callback refs and RefObject(s)
+ */
+declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): (node: T) => void;
+export { composeRefs, useComposedRefs };
+//# sourceMappingURL=use-composed-refs.d.ts.map

package/lib/typescript/src/web/vaul/use-composed-refs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-composed-refs.d.ts","sourceRoot":"","sources":["../../../../../src/web/vaul/use-composed-refs.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,WAAW,CAAC,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;AAc/C;;;GAGG;AACH,iBAAS,WAAW,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,IACvC,MAAM,CAAC,UAChB;AAED;;;GAGG;AACH,iBAAS,eAAe,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,qBAEpD;AAED,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,CAAC"}

package/lib/typescript/src/web/vaul/use-controllable-state.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+type UseControllableStateParams<T> = {
+    prop?: T | undefined;
+    defaultProp?: T | undefined;
+    onChange?: (state: T) => void;
+};
+export declare function useControllableState<T>({ prop, defaultProp, onChange, }: UseControllableStateParams<T>): readonly [T | undefined, React.Dispatch<React.SetStateAction<T | undefined>>];
+export {};
+//# sourceMappingURL=use-controllable-state.d.ts.map

package/lib/typescript/src/web/vaul/use-controllable-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-controllable-state.d.ts","sourceRoot":"","sources":["../../../../../src/web/vaul/use-controllable-state.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,KAAK,0BAA0B,CAAC,CAAC,IAAI;IACnC,IAAI,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;CAC/B,CAAC;AAiCF,wBAAgB,oBAAoB,CAAC,CAAC,EAAE,EACtC,IAAI,EACJ,WAAW,EACX,QAAmB,GACpB,EAAE,0BAA0B,CAAC,CAAC,CAAC,iFAoB/B"}

package/lib/typescript/src/web/vaul/use-position-fixed.d.ts

@@ -0,0 +1,19 @@
+/**
+ * This hook is necessary to prevent buggy behavior on iOS devices (need to test on Android).
+ * I won't get into too much detail about what bugs it solves, but so far I've found that setting the body to `position: fixed` is the most reliable way to prevent those bugs.
+ * Issues that this hook solves:
+ * https://github.com/emilkowalski/vaul/issues/435
+ * https://github.com/emilkowalski/vaul/issues/433
+ * And more that I discovered, but were just not reported.
+ */
+export declare function usePositionFixed({ isOpen, modal, nested, hasBeenOpened, preventScrollRestoration, noBodyStyles, }: {
+    isOpen: boolean;
+    modal: boolean;
+    nested: boolean;
+    hasBeenOpened: boolean;
+    preventScrollRestoration: boolean;
+    noBodyStyles: boolean;
+}): {
+    restorePositionSetting: () => void;
+};
+//# sourceMappingURL=use-position-fixed.d.ts.map

package/lib/typescript/src/web/vaul/use-position-fixed.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-position-fixed.d.ts","sourceRoot":"","sources":["../../../../../src/web/vaul/use-position-fixed.ts"],"names":[],"mappings":"AAKA;;;;;;;GAOG;AAEH,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,KAAK,EACL,MAAM,EACN,aAAa,EACb,wBAAwB,EACxB,YAAY,GACb,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,aAAa,EAAE,OAAO,CAAC;IACvB,wBAAwB,EAAE,OAAO,CAAC;IAClC,YAAY,EAAE,OAAO,CAAC;CACvB;;EAsHA"}

package/lib/typescript/src/web/vaul/use-prevent-scroll.d.ts

@@ -0,0 +1,18 @@
+import { useEffect } from 'react';
+export declare const useIsomorphicLayoutEffect: typeof useEffect;
+interface PreventScrollOptions {
+    /** Whether the scroll lock is disabled. */
+    isDisabled?: boolean;
+    focusCallback?: () => void;
+}
+export declare function isScrollable(node: Element): boolean;
+export declare function getScrollParent(node: Element): Element;
+/**
+ * Prevents scrolling on the document body on mount, and
+ * restores it on unmount. Also ensures that content does not
+ * shift due to the scrollbars disappearing.
+ */
+export declare function usePreventScroll(options?: PreventScrollOptions): void;
+export declare function isInput(target: Element): boolean;
+export {};
+//# sourceMappingURL=use-prevent-scroll.d.ts.map

package/lib/typescript/src/web/vaul/use-prevent-scroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-prevent-scroll.d.ts","sourceRoot":"","sources":["../../../../../src/web/vaul/use-prevent-scroll.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAmB,MAAM,OAAO,CAAC;AAKnD,eAAO,MAAM,yBAAyB,kBACuB,CAAC;AAE9D,UAAU,oBAAoB;IAC5B,2CAA2C;IAC3C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAeD,wBAAgB,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,OAAO,CAGnD;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,OAAO,GAAG,OAAO,CAUtD;AAmBD;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,GAAE,oBAAyB,QAsBlE;AAoND,wBAAgB,OAAO,CAAC,MAAM,EAAE,OAAO,WAMtC"}

package/lib/typescript/src/web/vaul/use-scale-background.d.ts

@@ -0,0 +1,2 @@
+export declare function useScaleBackground(): void;
+//# sourceMappingURL=use-scale-background.d.ts.map

package/lib/typescript/src/web/vaul/use-scale-background.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-scale-background.d.ts","sourceRoot":"","sources":["../../../../../src/web/vaul/use-scale-background.ts"],"names":[],"mappings":"AAQA,wBAAgB,kBAAkB,SAuDjC"}

package/lib/typescript/src/web/vaul/use-snap-points.d.ts

@@ -0,0 +1,37 @@
+import React from 'react';
+import type { DrawerDirection } from './types';
+export declare function useSnapPoints({ activeSnapPointProp, setActiveSnapPointProp, snapPoints, drawerRef, overlayRef, fadeFromIndex, onSnapPointChange, direction, container, snapToSequentialPoint, isOpen, contentHeight, detachedOffset, maxContentHeight, initialAnimated, }: {
+    activeSnapPointProp?: number | string | null;
+    setActiveSnapPointProp?(snapPoint: number | null | string): void;
+    snapPoints?: (number | string)[];
+    fadeFromIndex?: number;
+    drawerRef: React.RefObject<HTMLDivElement | null>;
+    overlayRef: React.RefObject<HTMLDivElement | null>;
+    onSnapPointChange(activeSnapPointIndex: number): void;
+    direction?: DrawerDirection;
+    container?: HTMLElement | null | undefined;
+    snapToSequentialPoint?: boolean;
+    isOpen?: boolean;
+    contentHeight?: number;
+    detachedOffset?: number;
+    maxContentHeight?: number;
+    initialAnimated?: boolean;
+}): {
+    isLastSnapPoint: true | null;
+    activeSnapPoint: string | number | null | undefined;
+    shouldFade: boolean;
+    getPercentageDragged: (absDraggedDistance: number, isDraggingDown: boolean) => number | null;
+    setActiveSnapPoint: React.Dispatch<React.SetStateAction<string | number | null | undefined>>;
+    activeSnapPointIndex: number | null;
+    onRelease: ({ draggedDistance, closeDrawer, velocity, dismissible, }: {
+        draggedDistance: number;
+        closeDrawer: () => void;
+        velocity: number;
+        dismissible: boolean;
+    }) => void;
+    onDrag: ({ draggedDistance }: {
+        draggedDistance: number;
+    }) => void;
+    snapPointsOffset: number[];
+};
+//# sourceMappingURL=use-snap-points.d.ts.map

package/lib/typescript/src/web/vaul/use-snap-points.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-snap-points.d.ts","sourceRoot":"","sources":["../../../../../src/web/vaul/use-snap-points.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,wBAAgB,aAAa,CAAC,EAC5B,mBAAmB,EACnB,sBAAsB,EACtB,UAAU,EACV,SAAS,EACT,UAAU,EACV,aAAa,EACb,iBAAiB,EACjB,SAAoB,EACpB,SAAS,EACT,qBAAqB,EACrB,MAAM,EACN,aAAa,EACb,cAAkB,EAClB,gBAAgB,EAChB,eAAsB,GACvB,EAAE;IACD,mBAAmB,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC7C,sBAAsB,CAAC,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;IACjE,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAClD,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACnD,iBAAiB,CAAC,oBAAoB,EAAE,MAAM,GAAG,IAAI,CAAC;IACtD,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,SAAS,CAAC,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,CAAC;IAC3C,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;;;;+CAsUmD,MAAM,kBAAkB,OAAO;;;0EA3H9E;QACD,eAAe,EAAE,MAAM,CAAC;QACxB,WAAW,EAAE,MAAM,IAAI,CAAC;QACxB,QAAQ,EAAE,MAAM,CAAC;QACjB,WAAW,EAAE,OAAO,CAAC;KACtB;kCA4EoC;QAAE,eAAe,EAAE,MAAM,CAAA;KAAE;;EA6GjE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lodev09/react-native-true-sheet",
-  "version": "3.10.1",
+  "version": "3.11.0-beta.1",
   "description": "The true native bottom sheet experience for your React Native Apps.",
   "source": "./src/index.ts",
   "main": "./lib/module/index.js",
@@ -88,7 +88,7 @@
     "@eslint/eslintrc": "^3.3.1",
     "@eslint/js": "^9.35.0",
     "@evilmartians/lefthook": "^2.0.4",
-    "@gorhom/bottom-sheet": "^5.2.8",
+    "@radix-ui/react-dialog": "^1.1.1",
     "@react-native/babel-preset": "^0.83.4",
     "@react-native/eslint-config": "^0.83.4",
     "@react-navigation/native": "^7.1.6",
@@ -121,7 +121,7 @@
     "react-native-worklets": "0.7.2"
   },
   "peerDependencies": {
-    "@gorhom/bottom-sheet": ">=5",
+    "@radix-ui/react-dialog": ">=1",
     "@react-navigation/native": ">=7",
     "react": "*",
     "react-native": "*",
@@ -129,7 +129,7 @@
     "react-native-worklets": "*"
   },
   "peerDependenciesMeta": {
-    "@gorhom/bottom-sheet": {
+    "@radix-ui/react-dialog": {
       "optional": true
     },
     "@react-navigation/native": {

package/src/TrueSheet.tsx

@@ -10,6 +10,8 @@ import {
 
 import type {
   TrueSheetProps,
+  TrueSheetMethods,
+  TrueSheetStaticMethods,
   DragBeginEvent,
   DragChangeEvent,
   DragEndEvent,
@@ -59,7 +61,10 @@ interface TrueSheetState {
   shouldRenderNativeView: boolean;
 }
 
-export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
+export class TrueSheet
+  extends PureComponent<TrueSheetProps, TrueSheetState>
+  implements TrueSheetMethods
+{
   displayName = 'TrueSheet';
 
   private readonly nativeRef: RefObject<NativeRef | null>;
@@ -548,6 +553,9 @@ export class TrueSheet extends PureComponent<TrueSheetProps, TrueSheetState> {
   }
 }
 
+// Compile-time check: `TrueSheet`'s static surface must satisfy `TrueSheetStaticMethods`.
+TrueSheet satisfies TrueSheetStaticMethods;
+
 const styles = StyleSheet.create({
   sheetView: {
     ...StyleSheet.absoluteFill,

package/src/TrueSheet.types.ts

@@ -154,30 +154,6 @@ export interface BlurOptions {
   interaction?: boolean;
 }
 
-/**
- * Defines the stack behavior when a modal is presented on web.
- *
- * @platform web
- */
-export type StackBehavior =
-  /**
-   * Mount the modal on top of the current one.
-   */
-  | 'push'
-  /**
-   * Minimize the current modal then mount the new one.
-   */
-  | 'switch'
-  /**
-   * Dismiss the current modal then mount the new one.
-   */
-  | 'replace'
-  /**
-   * Use a regular BottomSheet instead of BottomSheetModal.
-   * This bypasses the modal stack entirely.
-   */
-  | 'none';
-
 /**
  * Inset adjustment behavior for the sheet content.
  */
@@ -354,11 +330,11 @@ export interface TrueSheetProps extends ViewProps {
   grabberOptions?: GrabberOptions;
 
   /**
-   * Controls the sheet presentation style on iPad.
+   * Controls the sheet presentation style on iPad and web (landscape/tablet).
    * When enabled (true), uses a large page sheet for better readability.
    * When disabled (false), uses a centered form sheet.
    *
-   * @platform ios 17+
+   * @platform ios 17+, web
    * @default true
    */
   pageSizing?: boolean;
@@ -489,18 +465,6 @@ export interface TrueSheetProps extends ViewProps {
    */
   detachedOffset?: number;
 
-  /**
-   * Defines the stack behavior when a modal is presented.
-   * - `push`: Mount the modal on top of the current one.
-   * - `switch`: Minimize the current modal then mount the new one.
-   * - `replace`: Dismiss the current modal then mount the new one.
-   * - `none`: Use a regular BottomSheet instead of BottomSheetModal.
-   *
-   * @platform web
-   * @default 'switch'
-   */
-  stackBehavior?: StackBehavior;
-
   /**
    * Called when the sheet's content is mounted and ready.
    * The sheet automatically waits for this event before presenting.
@@ -587,3 +551,89 @@ export interface TrueSheetProps extends ViewProps {
    */
   onBackPress?: () => boolean | void;
 }
+
+/**
+ * Imperative methods available on a TrueSheet ref.
+ *
+ * Example:
+ * ```tsx
+ * const sheetRef = useRef<TrueSheetMethods>(null);
+ * sheetRef.current?.present();
+ * ```
+ */
+export interface TrueSheetMethods {
+  /**
+   * Present the sheet at a given detent index.
+   *
+   * @param index - The detent index to present at (default: `0`).
+   * @param animated - Whether to animate the presentation (default: `true`). Ignored on web.
+   */
+  present(index?: number, animated?: boolean): Promise<void>;
+
+  /**
+   * Resize the sheet to a given detent index.
+   *
+   * @param index - The detent index to resize to.
+   */
+  resize(index: number): Promise<void>;
+
+  /**
+   * Dismiss this sheet and all sheets presented on top of it in a single animation.
+   *
+   * @param animated - Whether to animate the dismissal (default: `true`). Ignored on web.
+   */
+  dismiss(animated?: boolean): Promise<void>;
+
+  /**
+   * Dismiss only the sheets presented on top of this sheet, keeping this sheet presented.
+   * No-op if no sheets are presented on top.
+   *
+   * @param animated - Whether to animate the dismissal (default: `true`). Ignored on web.
+   */
+  dismissStack(animated?: boolean): Promise<void>;
+}
+
+/**
+ * Static methods exposed on the `TrueSheet` component for controlling sheets by `name`.
+ *
+ * Example:
+ * ```ts
+ * TrueSheet.present('my-sheet')
+ * ```
+ *
+ * @note Not supported on web — use the `useTrueSheet()` hook instead.
+ */
+export interface TrueSheetStaticMethods {
+  /**
+   * Present the sheet with the given `name`.
+   *
+   * @throws if no sheet with the given `name` is registered.
+   */
+  present(name: string, index?: number, animated?: boolean): Promise<void>;
+
+  /**
+   * Resize the sheet with the given `name`.
+   *
+   * @throws if no sheet with the given `name` is registered.
+   */
+  resize(name: string, index: number): Promise<void>;
+
+  /**
+   * Dismiss the sheet with the given `name` and all sheets presented on top of it.
+   *
+   * @throws if no sheet with the given `name` is registered.
+   */
+  dismiss(name: string, animated?: boolean): Promise<void>;
+
+  /**
+   * Dismiss only the sheets presented on top of the sheet with the given `name`.
+   *
+   * @throws if no sheet with the given `name` is registered.
+   */
+  dismissStack(name: string, animated?: boolean): Promise<void>;
+
+  /**
+   * Dismiss every presented sheet, from the top of the stack downward.
+   */
+  dismissAll(animated?: boolean): Promise<void>;
+}