@surdeddd/bottom-sheet 0.2.0 → 0.4.0

package/dist/solid.d.cts

@@ -1,7 +1,302 @@
 import { JSX } from 'solid-js';
-import { S as SnapPointDef, a as SheetMode, E as EngineState, B as BottomSheetEngine } from './BottomSheetEngine-CIT9Htti.cjs';
-export { b as EngineOptions, c as SnapPoint } from './BottomSheetEngine-CIT9Htti.cjs';
-import './transform-jVfAikE9.cjs';
+
+type TransformAxis = "bottom" | "top" | "left" | "right";
+
+type SnapPoint = number | `${number}%` | "fit" | "content" | "full" | (string & {});
+type SnapPointDef<Id extends string = string> = {
+    id: Id;
+    size: SnapPoint;
+};
+type SheetMode = TransformAxis;
+type ScrimPreset = "subtle" | "standard" | "monitoring" | "cinematic";
+type ScrimUpdate = {
+    color?: string | null;
+    blur?: string | null;
+    interactive?: boolean;
+    range?: [number, number];
+    preset?: ScrimPreset;
+    mode?: "full" | "above-sheet" | "off";
+    tapToClose?: boolean;
+    enabled?: boolean;
+};
+type ScrimOverlayPosition = "top-left" | "top-center" | "top-right" | "center-left" | "center" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right" | "sheet-top-left" | "sheet-top-center" | "sheet-top-right";
+type ScrimOverlayOptions = {
+    children: HTMLElement | DocumentFragment;
+    position?: ScrimOverlayPosition;
+    interactive?: boolean;
+    inset?: string;
+};
+type SheetEventMap = {
+    "before-snap": {
+        id: string;
+        size: number;
+        cancel: () => void;
+        previousId: string;
+    };
+    "before-close": {
+        reason: "programmatic" | "backdrop" | "escape" | "back";
+        cancel: () => void;
+    };
+    snap: {
+        id: string;
+        size: number;
+        progress: number;
+    };
+    progress: {
+        value: number;
+        size: number;
+    };
+    dragstart: {
+        size: number;
+    };
+    drag: {
+        size: number;
+        delta: number;
+    };
+    dragend: {
+        size: number;
+        velocity: number;
+    };
+    close: void;
+    open: {
+        id: string;
+    };
+    opened: {
+        id: string;
+    };
+    closed: undefined;
+};
+type CloseReason = "programmatic" | "backdrop" | "escape" | "back";
+type EngineOptions = {
+    element: HTMLElement;
+    handle?: HTMLElement;
+    scrollContainer?: HTMLElement;
+    backdrop?: HTMLElement;
+    scrim?: HTMLElement;
+    screenComponent?: HTMLElement;
+    mode?: SheetMode;
+    snapPoints: SnapPointDef[];
+    allowed?: string[];
+    initial?: string;
+    duration?: number;
+    easing?: (t: number) => number;
+    respectReducedMotion?: boolean;
+    flickVelocity?: number;
+    dragThreshold?: number;
+    rubberBand?: boolean;
+    backdropRange?: [number, number];
+    screenRange?: [number, number];
+    scrimMode?: "full" | "above-sheet" | "off";
+    scrimColor?: string;
+    scrimBlur?: string;
+    scrimInteractive?: boolean;
+    scrimTapToClose?: boolean;
+    scrimPreset?: ScrimPreset;
+    animation?: "spring" | "tween" | "ios-spring" | "material-bounce" | "linear" | "snappy";
+    spring?: {
+        stiffness?: number;
+        damping?: number;
+        mass?: number;
+    };
+    focusTrap?: boolean;
+    initialFocus?: string | HTMLElement;
+    closeOnEscape?: boolean;
+    lockBodyScroll?: boolean;
+    closeOnBack?: boolean;
+    routedTo?: string;
+    inertSiblings?: boolean;
+    persistent?: boolean;
+    disableClose?: boolean;
+    disableDrag?: boolean;
+    closeOnRouteChange?: boolean;
+    radius?: string | number;
+    maxHeight?: string | number;
+    returnFocusTo?: HTMLElement | string | (() => HTMLElement | null);
+    persistKey?: string;
+    autoCollapseAfter?: number;
+    linkedSheets?: BottomSheetEngineLike[];
+    viewTransitions?: boolean;
+    stackEffect?: boolean;
+};
+
+type BottomSheetEngineLike = BottomSheetEngine;
+type TeardownScope = {
+    add: (fn: (() => void) | null | undefined) => void;
+};
+type Plugin = {
+    name: string;
+    install: (engine: BottomSheetEngine, scope: TeardownScope) => void | (() => void);
+};
+type EngineState = {
+    size: number;
+    activeId: string;
+    isDragging: boolean;
+    isAnimating: boolean;
+    progress: number;
+};
+
+type AnchorAnimationPreset = "fade" | "scale" | "slide" | "pop" | "none";
+type AnchorAnimationSpec = AnchorAnimationPreset | {
+    preset?: AnchorAnimationPreset;
+    enter?: Keyframe[];
+    exit?: Keyframe[];
+    duration?: number;
+    easing?: string;
+    respectReducedMotion?: boolean;
+};
+
+type AnchorState = {
+    activeId: string;
+    size: number;
+    progress: number;
+};
+type AnchorPosition = ScrimOverlayPosition | "dock-bottom" | "dock-top";
+type AnchorOptions = {
+    element: HTMLElement;
+    position?: AnchorPosition;
+    inset?: string;
+    showOn?: string[] | ((state: AnchorState) => boolean);
+    fadeRange?: [number, number];
+    interactive?: boolean;
+    animation?: AnchorAnimationSpec;
+};
+
+type ScrimStageDef = {
+    id?: string;
+    for?: string | string[];
+    forRange?: [number, number];
+    element: HTMLElement;
+    position?: ScrimOverlayPosition;
+    inset?: string;
+    interactive?: boolean;
+    animation?: AnchorAnimationSpec;
+};
+type ScrimStagesOptions = {
+    stages: ScrimStageDef[];
+    position?: ScrimOverlayPosition;
+    inset?: string;
+    interactive?: boolean;
+    animation?: AnchorAnimationSpec;
+};
+
+type Listener<K extends keyof SheetEventMap> = (payload: SheetEventMap[K]) => void;
+declare class BottomSheetEngine {
+    private id;
+    private element;
+    private handle;
+    private scrollContainer?;
+    private backdrop?;
+    private screenComponent?;
+    private scrimParent;
+    private mode;
+    private flickVelocity;
+    private dragThreshold;
+    private rubberBandEnabled;
+    private scrim;
+    private aria;
+    private animation;
+    private lifecycle;
+    private closeOnBack;
+    private routedTo;
+    private persistent;
+    private disableCloseFlag;
+    private disableDragFlag;
+    private closeOnRouteChange;
+    private maxHeightCap;
+    private snapPointsRaw;
+    private snaps;
+    private activeId;
+    private size;
+    private gesture;
+    private rootEl;
+    private destroyed;
+    private currentViewTransition;
+    private currentAbort;
+    private sizeWriteSentinel;
+    private progressWriteSentinel;
+    private isTopSheet;
+    private opening;
+    private progressPayload;
+    private dragContextBuf;
+    private bus;
+    private persistKey;
+    private linkedSheets;
+    private scrollCache;
+    private teardowns;
+    private anchors;
+    private anchorHost;
+    private stackZ;
+    private detachScrimStages;
+    private stackEffectEnabled;
+    private stackEffectPrimed;
+    private transformTemplate;
+    constructor(opts: EngineOptions);
+    get state(): EngineState;
+    on<K extends keyof SheetEventMap>(event: K, fn: Listener<K>): () => void;
+    use(plugin: Plugin): this;
+    setLinkedSheets(sheets: BottomSheetEngine[]): void;
+    getAllowedIds(): string[];
+    snapTo(id: string, velocityOrOpts?: number | {
+        velocity?: number;
+        signal?: AbortSignal;
+    }, _skipBeforeSnap?: boolean): Promise<void>;
+    dragTo(targetSize: number, velocityOrOpts?: number | {
+        velocity?: number;
+        signal?: AbortSignal;
+    }): Promise<void>;
+    open(id?: string): Promise<void>;
+    close(reason?: CloseReason): Promise<void>;
+    canDismiss(): boolean;
+    isTop(): boolean;
+    depth(): number;
+    expand(): Promise<void>;
+    collapse(): Promise<void>;
+    setRadius(r: string | number): void;
+    setMaxHeight(h: string | number): void;
+    private clampToMaxHeight;
+    setAllowed(ids: string[], snap?: string): void;
+    setBackdropRange(range: [number, number]): void;
+    setScreenRange(range: [number, number]): void;
+    setScrimColor(color: string | undefined | null): void;
+    setScrimBlur(blur: string | undefined | null): void;
+    setScrimInteractive(interactive: boolean): void;
+    setScrim(opts: ScrimUpdate): void;
+    setScrimMode(mode: "full" | "above-sheet" | "off"): void;
+    setScrimTapToClose(enabled: boolean): void;
+    setScrimEnabled(enabled: boolean): void;
+    setScrimOverlay(opts: ScrimOverlayOptions): () => void;
+    addAnchor(opts: AnchorOptions): () => void;
+    setScrimStages(opts: ScrimStagesOptions | null): () => void;
+    getScrimState(): {
+        mode: "full" | "above-sheet" | "off";
+        enabled: boolean;
+    };
+    setSnapPoints(points: EngineOptions["snapPoints"], allowed?: string[]): void;
+    recompute(): void;
+    private measureFitSize;
+    private installFitObserver;
+    destroy(): void;
+    private emit;
+    private newCycle;
+    private emitBeforeSnap;
+    private emitBeforeClose;
+    private applyAutoAriaLabelledBy;
+    private recomputeSnaps;
+    private getAllowedRange;
+    private allowedIdsBySize;
+    private updateAriaSlider;
+    private registerInStack;
+    private applyStackDepth;
+    private attach;
+    private attachFeatures;
+    private settleAfterDrag;
+    private haptic;
+    private applySize;
+    private computeProgress;
+    private handleOpen;
+    private resyncAfterResize;
+    private handleClose;
+}
 
 /** @jsxImportSource solid-js */
 
@@ -36,4 +331,4 @@ type BottomSheetProps<TId extends string = string> = {
 };
 declare const BottomSheet: <TId extends string = string>(props: BottomSheetProps<TId>) => JSX.Element;
 
-export { BottomSheet, type BottomSheetProps, EngineState, SheetMode, SnapPointDef };
+export { BottomSheet, type BottomSheetProps, type EngineOptions, type EngineState, type SheetMode, type SnapPoint, type SnapPointDef };

package/dist/solid.d.ts

@@ -1,7 +1,302 @@
 import { JSX } from 'solid-js';
-import { S as SnapPointDef, a as SheetMode, E as EngineState, B as BottomSheetEngine } from './BottomSheetEngine-Df9MwBbm.js';
-export { b as EngineOptions, c as SnapPoint } from './BottomSheetEngine-Df9MwBbm.js';
-import './transform-jVfAikE9.js';
+
+type TransformAxis = "bottom" | "top" | "left" | "right";
+
+type SnapPoint = number | `${number}%` | "fit" | "content" | "full" | (string & {});
+type SnapPointDef<Id extends string = string> = {
+    id: Id;
+    size: SnapPoint;
+};
+type SheetMode = TransformAxis;
+type ScrimPreset = "subtle" | "standard" | "monitoring" | "cinematic";
+type ScrimUpdate = {
+    color?: string | null;
+    blur?: string | null;
+    interactive?: boolean;
+    range?: [number, number];
+    preset?: ScrimPreset;
+    mode?: "full" | "above-sheet" | "off";
+    tapToClose?: boolean;
+    enabled?: boolean;
+};
+type ScrimOverlayPosition = "top-left" | "top-center" | "top-right" | "center-left" | "center" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right" | "sheet-top-left" | "sheet-top-center" | "sheet-top-right";
+type ScrimOverlayOptions = {
+    children: HTMLElement | DocumentFragment;
+    position?: ScrimOverlayPosition;
+    interactive?: boolean;
+    inset?: string;
+};
+type SheetEventMap = {
+    "before-snap": {
+        id: string;
+        size: number;
+        cancel: () => void;
+        previousId: string;
+    };
+    "before-close": {
+        reason: "programmatic" | "backdrop" | "escape" | "back";
+        cancel: () => void;
+    };
+    snap: {
+        id: string;
+        size: number;
+        progress: number;
+    };
+    progress: {
+        value: number;
+        size: number;
+    };
+    dragstart: {
+        size: number;
+    };
+    drag: {
+        size: number;
+        delta: number;
+    };
+    dragend: {
+        size: number;
+        velocity: number;
+    };
+    close: void;
+    open: {
+        id: string;
+    };
+    opened: {
+        id: string;
+    };
+    closed: undefined;
+};
+type CloseReason = "programmatic" | "backdrop" | "escape" | "back";
+type EngineOptions = {
+    element: HTMLElement;
+    handle?: HTMLElement;
+    scrollContainer?: HTMLElement;
+    backdrop?: HTMLElement;
+    scrim?: HTMLElement;
+    screenComponent?: HTMLElement;
+    mode?: SheetMode;
+    snapPoints: SnapPointDef[];
+    allowed?: string[];
+    initial?: string;
+    duration?: number;
+    easing?: (t: number) => number;
+    respectReducedMotion?: boolean;
+    flickVelocity?: number;
+    dragThreshold?: number;
+    rubberBand?: boolean;
+    backdropRange?: [number, number];
+    screenRange?: [number, number];
+    scrimMode?: "full" | "above-sheet" | "off";
+    scrimColor?: string;
+    scrimBlur?: string;
+    scrimInteractive?: boolean;
+    scrimTapToClose?: boolean;
+    scrimPreset?: ScrimPreset;
+    animation?: "spring" | "tween" | "ios-spring" | "material-bounce" | "linear" | "snappy";
+    spring?: {
+        stiffness?: number;
+        damping?: number;
+        mass?: number;
+    };
+    focusTrap?: boolean;
+    initialFocus?: string | HTMLElement;
+    closeOnEscape?: boolean;
+    lockBodyScroll?: boolean;
+    closeOnBack?: boolean;
+    routedTo?: string;
+    inertSiblings?: boolean;
+    persistent?: boolean;
+    disableClose?: boolean;
+    disableDrag?: boolean;
+    closeOnRouteChange?: boolean;
+    radius?: string | number;
+    maxHeight?: string | number;
+    returnFocusTo?: HTMLElement | string | (() => HTMLElement | null);
+    persistKey?: string;
+    autoCollapseAfter?: number;
+    linkedSheets?: BottomSheetEngineLike[];
+    viewTransitions?: boolean;
+    stackEffect?: boolean;
+};
+
+type BottomSheetEngineLike = BottomSheetEngine;
+type TeardownScope = {
+    add: (fn: (() => void) | null | undefined) => void;
+};
+type Plugin = {
+    name: string;
+    install: (engine: BottomSheetEngine, scope: TeardownScope) => void | (() => void);
+};
+type EngineState = {
+    size: number;
+    activeId: string;
+    isDragging: boolean;
+    isAnimating: boolean;
+    progress: number;
+};
+
+type AnchorAnimationPreset = "fade" | "scale" | "slide" | "pop" | "none";
+type AnchorAnimationSpec = AnchorAnimationPreset | {
+    preset?: AnchorAnimationPreset;
+    enter?: Keyframe[];
+    exit?: Keyframe[];
+    duration?: number;
+    easing?: string;
+    respectReducedMotion?: boolean;
+};
+
+type AnchorState = {
+    activeId: string;
+    size: number;
+    progress: number;
+};
+type AnchorPosition = ScrimOverlayPosition | "dock-bottom" | "dock-top";
+type AnchorOptions = {
+    element: HTMLElement;
+    position?: AnchorPosition;
+    inset?: string;
+    showOn?: string[] | ((state: AnchorState) => boolean);
+    fadeRange?: [number, number];
+    interactive?: boolean;
+    animation?: AnchorAnimationSpec;
+};
+
+type ScrimStageDef = {
+    id?: string;
+    for?: string | string[];
+    forRange?: [number, number];
+    element: HTMLElement;
+    position?: ScrimOverlayPosition;
+    inset?: string;
+    interactive?: boolean;
+    animation?: AnchorAnimationSpec;
+};
+type ScrimStagesOptions = {
+    stages: ScrimStageDef[];
+    position?: ScrimOverlayPosition;
+    inset?: string;
+    interactive?: boolean;
+    animation?: AnchorAnimationSpec;
+};
+
+type Listener<K extends keyof SheetEventMap> = (payload: SheetEventMap[K]) => void;
+declare class BottomSheetEngine {
+    private id;
+    private element;
+    private handle;
+    private scrollContainer?;
+    private backdrop?;
+    private screenComponent?;
+    private scrimParent;
+    private mode;
+    private flickVelocity;
+    private dragThreshold;
+    private rubberBandEnabled;
+    private scrim;
+    private aria;
+    private animation;
+    private lifecycle;
+    private closeOnBack;
+    private routedTo;
+    private persistent;
+    private disableCloseFlag;
+    private disableDragFlag;
+    private closeOnRouteChange;
+    private maxHeightCap;
+    private snapPointsRaw;
+    private snaps;
+    private activeId;
+    private size;
+    private gesture;
+    private rootEl;
+    private destroyed;
+    private currentViewTransition;
+    private currentAbort;
+    private sizeWriteSentinel;
+    private progressWriteSentinel;
+    private isTopSheet;
+    private opening;
+    private progressPayload;
+    private dragContextBuf;
+    private bus;
+    private persistKey;
+    private linkedSheets;
+    private scrollCache;
+    private teardowns;
+    private anchors;
+    private anchorHost;
+    private stackZ;
+    private detachScrimStages;
+    private stackEffectEnabled;
+    private stackEffectPrimed;
+    private transformTemplate;
+    constructor(opts: EngineOptions);
+    get state(): EngineState;
+    on<K extends keyof SheetEventMap>(event: K, fn: Listener<K>): () => void;
+    use(plugin: Plugin): this;
+    setLinkedSheets(sheets: BottomSheetEngine[]): void;
+    getAllowedIds(): string[];
+    snapTo(id: string, velocityOrOpts?: number | {
+        velocity?: number;
+        signal?: AbortSignal;
+    }, _skipBeforeSnap?: boolean): Promise<void>;
+    dragTo(targetSize: number, velocityOrOpts?: number | {
+        velocity?: number;
+        signal?: AbortSignal;
+    }): Promise<void>;
+    open(id?: string): Promise<void>;
+    close(reason?: CloseReason): Promise<void>;
+    canDismiss(): boolean;
+    isTop(): boolean;
+    depth(): number;
+    expand(): Promise<void>;
+    collapse(): Promise<void>;
+    setRadius(r: string | number): void;
+    setMaxHeight(h: string | number): void;
+    private clampToMaxHeight;
+    setAllowed(ids: string[], snap?: string): void;
+    setBackdropRange(range: [number, number]): void;
+    setScreenRange(range: [number, number]): void;
+    setScrimColor(color: string | undefined | null): void;
+    setScrimBlur(blur: string | undefined | null): void;
+    setScrimInteractive(interactive: boolean): void;
+    setScrim(opts: ScrimUpdate): void;
+    setScrimMode(mode: "full" | "above-sheet" | "off"): void;
+    setScrimTapToClose(enabled: boolean): void;
+    setScrimEnabled(enabled: boolean): void;
+    setScrimOverlay(opts: ScrimOverlayOptions): () => void;
+    addAnchor(opts: AnchorOptions): () => void;
+    setScrimStages(opts: ScrimStagesOptions | null): () => void;
+    getScrimState(): {
+        mode: "full" | "above-sheet" | "off";
+        enabled: boolean;
+    };
+    setSnapPoints(points: EngineOptions["snapPoints"], allowed?: string[]): void;
+    recompute(): void;
+    private measureFitSize;
+    private installFitObserver;
+    destroy(): void;
+    private emit;
+    private newCycle;
+    private emitBeforeSnap;
+    private emitBeforeClose;
+    private applyAutoAriaLabelledBy;
+    private recomputeSnaps;
+    private getAllowedRange;
+    private allowedIdsBySize;
+    private updateAriaSlider;
+    private registerInStack;
+    private applyStackDepth;
+    private attach;
+    private attachFeatures;
+    private settleAfterDrag;
+    private haptic;
+    private applySize;
+    private computeProgress;
+    private handleOpen;
+    private resyncAfterResize;
+    private handleClose;
+}
 
 /** @jsxImportSource solid-js */
 
@@ -36,4 +331,4 @@ type BottomSheetProps<TId extends string = string> = {
 };
 declare const BottomSheet: <TId extends string = string>(props: BottomSheetProps<TId>) => JSX.Element;
 
-export { BottomSheet, type BottomSheetProps, EngineState, SheetMode, SnapPointDef };
+export { BottomSheet, type BottomSheetProps, type EngineOptions, type EngineState, type SheetMode, type SnapPoint, type SnapPointDef };