react-ui-animate 4.3.1-alpha.1 → 4.3.2

package/dist/animation/{AnimationConfig.d.ts → Config.d.ts}

@@ -1,5 +1,5 @@
 import { Easing } from '@raidipesh78/re-motion';
-export declare const AnimationConfig: {
+export declare const Config: {
     Timing: {
         BOUNCE: {
             duration: number;
@@ -41,23 +41,23 @@ export declare const AnimationConfig: {
     Spring: {
         ELASTIC: {
             mass: number;
-            friction: number;
-            tension: number;
+            damping: number;
+            stiffness: number;
         };
         EASE: {
             mass: number;
-            friction: number;
-            tension: number;
+            damping: number;
+            stiffness: number;
         };
         STIFF: {
             mass: number;
-            friction: number;
-            tension: number;
+            damping: number;
+            stiffness: number;
         };
         WOBBLE: {
             mass: number;
-            friction: number;
-            tension: number;
+            damping: number;
+            stiffness: number;
         };
     };
 };

package/dist/animation/descriptors.d.ts

@@ -0,0 +1,7 @@
+import { Callbacks, DecayOptions, Descriptor, SpringOptions, TimingOptions } from './types';
+export declare const withSpring: (to: Descriptor["to"], opts?: SpringOptions & Callbacks) => Descriptor;
+export declare const withTiming: (to: Descriptor["to"], opts?: TimingOptions & Callbacks) => Descriptor;
+export declare const withDecay: (velocity: number, opts?: DecayOptions & Callbacks) => Descriptor;
+export declare const withDelay: (ms: number) => Descriptor;
+export declare const withSequence: (animations: Descriptor[], opts?: Omit<Callbacks, "onChange">) => Descriptor;
+export declare const withLoop: (animation: Descriptor, iterations?: number, opts?: Omit<Callbacks, "onChange">) => Descriptor;

package/dist/animation/drivers.d.ts

@@ -0,0 +1,4 @@
+import { MotionValue } from '@raidipesh78/re-motion';
+import type { Primitive, Descriptor } from './types';
+export declare function buildAnimation(mv: MotionValue<Primitive>, { type, to, options }: Descriptor): import("@raidipesh78/re-motion/dist/drivers/AnimationController").AnimationController;
+export declare function buildParallel(mvMap: Record<string, MotionValue<Primitive>>, step: Descriptor): import("@raidipesh78/re-motion/dist/drivers/AnimationController").AnimationController;

package/dist/animation/helpers.d.ts

@@ -0,0 +1,3 @@
+import type { Descriptor } from './types';
+export declare function filterCallbackOptions(options: Record<string, any> | undefined, attach: boolean): Record<string, any>;
+export declare function isDescriptor(x: unknown): x is Descriptor;

package/dist/animation/hooks/index.d.ts

@@ -1,2 +1,2 @@
-export * from './useValue';
-export * from './useMount';
+export { useValue } from './useValue';
+export { useMount } from './useMount';

package/dist/animation/hooks/useMount.d.ts

@@ -1,10 +1,16 @@
 import { MotionValue } from '@raidipesh78/re-motion';
-import { DriverConfig } from '../types';
-export interface UseMountConfig {
-    from?: number;
-    enter?: DriverConfig;
-    exit?: DriverConfig;
-}
-export declare const useMount: (state: boolean, config?: UseMountConfig) => (fn: (animation: {
-    value: MotionValue;
-}, mounted: boolean) => React.ReactNode) => import("react").ReactNode;
+import type { Primitive, Descriptor } from '../types';
+export type ConfigSingle<T extends Primitive> = {
+    from?: T;
+    enter?: T | Descriptor;
+    exit?: T | Descriptor;
+};
+export type ConfigMulti<I extends Record<string, Primitive>> = {
+    from: I;
+    enter?: I | Descriptor;
+    exit?: I | Descriptor;
+};
+export declare function useMount<T extends Primitive = number>(isOpen: boolean, config?: ConfigSingle<T>): (fn: (value: MotionValue<T>, mounted: boolean) => React.ReactNode) => React.ReactNode;
+export declare function useMount<I extends Record<string, Primitive>>(isOpen: boolean, config: ConfigMulti<I>): (fn: (values: {
+    [K in keyof I]: MotionValue<I[K]>;
+}, mounted: boolean) => React.ReactNode) => React.ReactNode;

package/dist/animation/hooks/useValue.d.ts

@@ -1,7 +1,9 @@
 import { MotionValue } from '@raidipesh78/re-motion';
-import { ToValue } from '../types';
-export declare function useValue<V extends number | string>(initialValue: V): {
-    get value(): MotionValue<V>;
-    set value(u: MotionValue<V> | ToValue<V>);
-    readonly currentValue: V;
+import type { Primitive, Descriptor, Controls } from '../types';
+type Widen<T> = T extends number ? number : T extends string ? string : T;
+type ValueReturn<T> = T extends Primitive ? MotionValue<Widen<T>> : T extends Primitive[] ? MotionValue<Widen<Primitive>>[] : {
+    [K in keyof T]: MotionValue<Widen<T[K]>>;
 };
+type Base = Primitive | Primitive[] | Record<string, Primitive>;
+export declare function useValue<T extends Base>(initial: T): [ValueReturn<T>, (to: Base | Descriptor) => void, Controls];
+export {};

package/dist/animation/index.d.ts

@@ -1,5 +1,5 @@
-export { MountedBlock, ScrollableBlock } from './modules';
-export { useValue, useMount, type UseMountConfig } from './hooks';
-export { withSpring, withTiming, withSequence, withDelay, withDecay, withLoop, withEase, } from './controllers';
-export { AnimationConfig } from './AnimationConfig';
-export { interpolateNumbers } from './interpolation';
+export * from './hooks';
+export * from './modules';
+export * from './descriptors';
+export * from './Config';
+export * from './to';

package/dist/animation/modules/Mount.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+import type { MotionValue } from '@raidipesh78/re-motion';
+import type { Primitive } from '../types';
+import { type ConfigMulti, type ConfigSingle } from '../hooks/useMount';
+interface MountPropsSingle<T extends Primitive> extends Partial<ConfigSingle<T>> {
+    state: boolean;
+    children: (animation: MotionValue<T>) => ReactNode;
+}
+interface MountPropsMulti<I extends Record<string, Primitive>> extends ConfigMulti<I> {
+    state: boolean;
+    children: (animation: {
+        [K in keyof I]: MotionValue<I[K]>;
+    }) => ReactNode;
+}
+export declare function Mount<T extends Primitive = number>(props: MountPropsSingle<T>): JSX.Element;
+export declare function Mount<I extends Record<string, Primitive>>(props: MountPropsMulti<I>): JSX.Element;
+export {};

package/dist/animation/modules/index.d.ts

@@ -1,2 +1 @@
-export * from './MountedBlock';
-export * from './ScrollableBlock';
+export { Mount } from './Mount';

package/dist/animation/to.d.ts

@@ -0,0 +1,9 @@
+type ExtrapolateType = 'identity' | 'extend' | 'clamp';
+interface ExtrapolateConfig {
+    extrapolate?: ExtrapolateType;
+    extrapolateRight?: ExtrapolateType;
+    extrapolateLeft?: ExtrapolateType;
+    easing?: (t: number) => number;
+}
+export declare function to(input: number, inRange: number[], outRange: (number | string)[], config?: ExtrapolateConfig): number | string;
+export {};

package/dist/animation/types.d.ts

@@ -1,25 +1,42 @@
-export interface WithCallbacks {
-    onStart?: (value: number | string) => void;
-    onChange?: (value: number | string) => void;
-    onRest?: (value: number | string) => void;
-}
-export type DriverConfig = {
-    type: 'spring' | 'timing' | 'decay' | 'sequence' | 'delay' | 'loop';
-    to?: number;
-    options?: {
-        controller?: DriverConfig;
-        iterations?: number;
-        delay?: number;
-        duration?: number;
-        easing?: (t: number) => number;
-        stiffness?: number;
-        damping?: number;
-        mass?: number;
-        velocity?: number;
-        steps?: DriverConfig[];
-        onStart?: () => void;
-        onChange?: (v: string | number) => void;
-        onComplete?: () => void;
-    };
-};
-export type ToValue<V> = DriverConfig | V;
+export type Primitive = number | string;
+export interface Callbacks {
+    onStart?: () => void;
+    onChange?: (v: number) => void;
+    onComplete?: () => void;
+}
+export interface SpringOptions {
+    stiffness?: number;
+    damping?: number;
+    mass?: number;
+}
+export interface TimingOptions {
+    duration?: number;
+    easing?: (t: number) => number;
+}
+export interface DecayOptions {
+    velocity?: number;
+    clamp?: [number, number];
+}
+export interface SequenceOptions {
+    animations?: Descriptor[];
+}
+export interface DelayOptions {
+    delay?: number;
+}
+export interface LoopOptions {
+    iterations?: number;
+    animation?: Descriptor;
+}
+export type DriverType = 'spring' | 'timing' | 'decay' | 'delay' | 'sequence' | 'loop';
+export interface Descriptor {
+    type: DriverType;
+    to?: Primitive | Primitive[] | Record<string, Primitive>;
+    options?: SpringOptions & TimingOptions & DecayOptions & SequenceOptions & DelayOptions & LoopOptions & Callbacks;
+}
+export interface Controls {
+    start(): void;
+    pause(): void;
+    resume(): void;
+    cancel(): void;
+    reset(): void;
+}

package/dist/gestures/controllers/DragGesture.d.ts

@@ -1,17 +1,47 @@
 import { Gesture } from './Gesture';
-import type { Vector2 } from '../types';
-export declare class DragGesture extends Gesture {
-    movementStart: Vector2;
-    initialMovement: Vector2;
-    movement: Vector2;
-    previousMovement: Vector2;
-    translation: Vector2;
-    offset: Vector2;
-    velocity: Vector2;
-    _initEvents(): void;
-    _cancelEvents(): void;
-    _handleCallback(): void;
-    pointerDown(e: any): void;
-    pointerMove(e: any): void;
-    pointerUp(): void;
+export interface DragEvent {
+    down: boolean;
+    movement: {
+        x: number;
+        y: number;
+    };
+    offset: {
+        x: number;
+        y: number;
+    };
+    velocity: {
+        x: number;
+        y: number;
+    };
+    event: PointerEvent;
+    cancel: () => void;
+}
+export interface DragConfig {
+    threshold?: number;
+    axis?: 'x' | 'y';
+    initial?: () => {
+        x: number;
+        y: number;
+    };
+}
+export declare class DragGesture extends Gesture<DragEvent> {
+    private config;
+    private prev;
+    private lastTime;
+    private movement;
+    private velocity;
+    private start;
+    private offset;
+    private pointerCaptured;
+    private activePointerId;
+    private attachedEls;
+    private activeEl;
+    private pointerDownPos;
+    private thresholdPassed;
+    constructor(config?: DragConfig);
+    attach(elements: HTMLElement | HTMLElement[] | Window): () => void;
+    private onDown;
+    private onMove;
+    private onUp;
+    cancel(): void;
 }

package/dist/gestures/controllers/Gesture.d.ts

@@ -1,20 +1,13 @@
-export declare class Gesture {
-    currentIndex?: number;
-    lastTimeStamp: number;
-    isActive: boolean;
-    targetElement?: HTMLElement;
-    targetElements: Array<HTMLElement>;
-    config?: any;
-    callback?: <T>(event: T) => void;
-    _subscribe?: (eventKeys?: Array<string>) => void;
-    static _VELOCITY_LIMIT: number;
-    _initEvents(): void;
-    _cancelEvents(): void;
-    applyCallback(callback: <T>(event: T) => void): void;
-    applyGesture({ targetElement, targetElements, callback, config, }: {
-        targetElement?: any;
-        targetElements?: any;
-        callback: <T>(event: T) => void;
-        config?: any;
-    }): () => void | undefined;
+type Listener<E> = (event: E) => void;
+export declare abstract class Gesture<E> {
+    static readonly VELOCITY_LIMIT = 20;
+    private changeListeners;
+    private endListeners;
+    onChange(listener: Listener<E>): this;
+    onEnd(listener: Listener<E>): this;
+    protected emitChange(event: E): void;
+    protected emitEnd(event: E): void;
+    abstract attach(elements: HTMLElement | HTMLElement | Window): () => void;
+    abstract cancel(): void;
 }
+export {};

package/dist/gestures/controllers/MoveGesture.d.ts

@@ -0,0 +1,30 @@
+import { Gesture } from './Gesture';
+export interface MoveEvent {
+    movement: {
+        x: number;
+        y: number;
+    };
+    offset: {
+        x: number;
+        y: number;
+    };
+    velocity: {
+        x: number;
+        y: number;
+    };
+    event: PointerEvent;
+    cancel?: () => void;
+}
+export declare class MoveGesture extends Gesture<MoveEvent> {
+    private attachedEls;
+    private prev;
+    private lastTime;
+    private movement;
+    private offset;
+    private velocity;
+    private startPos;
+    attach(elements: HTMLElement | HTMLElement[] | Window): () => void;
+    cancel(): void;
+    private onMove;
+    private onLeave;
+}

package/dist/gestures/controllers/ScrollGesture.d.ts

@@ -1,14 +1,29 @@
-import { Vector2 } from '../types';
 import { Gesture } from './Gesture';
-export declare class ScrollGesture extends Gesture {
-    isActiveID?: any;
-    movement: Vector2;
-    previousMovement: Vector2;
-    direction: Vector2;
-    velocity: Vector2;
-    _initEvents(): void;
-    _handleCallback(): void;
-    onScroll({ x, y }: Vector2): void;
-    scrollListener(): void;
-    scrollElementListener(): void;
+export interface ScrollEvent {
+    movement: {
+        x: number;
+        y: number;
+    };
+    offset: {
+        x: number;
+        y: number;
+    };
+    velocity: {
+        x: number;
+        y: number;
+    };
+    event: Event;
+    cancel?: () => void;
+}
+export declare class ScrollGesture extends Gesture<ScrollEvent> {
+    private attachedEls;
+    private movement;
+    private offset;
+    private velocity;
+    private prevScroll;
+    private lastTime;
+    private endTimeout?;
+    attach(elements: HTMLElement | HTMLElement[] | Window): () => void;
+    cancel(): void;
+    private onScroll;
 }

package/dist/gestures/controllers/WheelGesture.d.ts

@@ -1,15 +1,28 @@
-import { Vector2 } from '../types';
 import { Gesture } from './Gesture';
-export declare class WheelGesture extends Gesture {
-    isActiveID?: any;
-    movement: Vector2;
-    previousMovement: Vector2;
-    direction: Vector2;
-    velocity: Vector2;
-    delta: Vector2;
-    offset: Vector2;
-    translation: Vector2;
-    _initEvents(): void;
-    _handleCallback(): void;
-    onWheel(event: WheelEvent): void;
+export interface WheelEvent {
+    movement: {
+        x: number;
+        y: number;
+    };
+    offset: {
+        x: number;
+        y: number;
+    };
+    velocity: {
+        x: number;
+        y: number;
+    };
+    event: globalThis.WheelEvent;
+    cancel?: () => void;
+}
+export declare class WheelGesture extends Gesture<WheelEvent> {
+    private attachedEls;
+    private movement;
+    private offset;
+    private velocity;
+    private lastTime;
+    private endTimeout?;
+    attach(elements: HTMLElement | HTMLElement[] | Window): () => void;
+    cancel(): void;
+    private onWheel;
 }

package/dist/gestures/hooks/index.d.ts

@@ -1,5 +1,4 @@
-export * from './useDrag';
-export * from './useMouseMove';
-export * from './useScroll';
-export * from './useWheel';
-export * from './useGesture';
+export { useDrag } from './useDrag';
+export { useMove } from './useMove';
+export { useScroll } from './useScroll';
+export { useWheel } from './useWheel';

package/dist/gestures/hooks/useDrag.d.ts

@@ -1,4 +1,5 @@
-import { DragEventType, UseDragConfig } from '../types';
-export declare function useDrag(callback: (event: DragEventType) => void, config?: UseDragConfig): (index?: number) => {
-    ref: any;
-};
+import { RefObject } from 'react';
+import { type DragConfig, type DragEvent } from '../controllers/DragGesture';
+export declare function useDrag<T extends HTMLElement>(refs: RefObject<T> | Array<RefObject<T>>, onDrag: (e: DragEvent & {
+    index: number;
+}) => void, config?: DragConfig): void;

package/dist/gestures/hooks/useMove.d.ts

@@ -0,0 +1,8 @@
+import { RefObject } from 'react';
+import { type MoveEvent } from '../controllers/MoveGesture';
+export declare function useMove(refs: Window, onMove: (e: MoveEvent & {
+    index: 0;
+}) => void): void;
+export declare function useMove<T extends HTMLElement>(refs: RefObject<T> | Array<RefObject<T>>, onMove: (e: MoveEvent & {
+    index: number;
+}) => void): void;

package/dist/gestures/hooks/useRecognizer.d.ts

@@ -1,10 +1,13 @@
-type UseRecognizerHandlerType = Array<[
-    key: 'drag' | 'wheel' | 'move' | 'scroll',
-    gesture: any,
-    callback: any,
-    config?: any
-]>;
-export declare const useRecognizer: (handlers: UseRecognizerHandlerType) => (index?: number) => {
-    ref: any;
-};
+import { RefObject } from 'react';
+interface GestureInstance<E> {
+    onChange(handler: (event: E) => void): this;
+    onEnd(handler: (event: E) => void): this;
+    attach(target: Window | HTMLElement): () => void;
+}
+interface GestureConstructor<C, E> {
+    new (config?: C): GestureInstance<E>;
+}
+export declare function useRecognizer<T extends HTMLElement, C, E>(GestureClass: GestureConstructor<C, E>, refs: Window | RefObject<T> | Array<RefObject<T>>, onEvent: (e: E & {
+    index: number;
+}) => void, config?: C): void;
 export {};

package/dist/gestures/hooks/useScroll.d.ts

@@ -1,4 +1,8 @@
-import { ScrollEventType } from '../types';
-export declare function useScroll(callback: (event: ScrollEventType) => void): (index?: number) => {
-    ref: any;
-};
+import { RefObject } from 'react';
+import { type ScrollEvent } from '../controllers/ScrollGesture';
+export declare function useScroll(refs: Window, onScroll: (e: ScrollEvent & {
+    index: 0;
+}) => void): void;
+export declare function useScroll<T extends HTMLElement>(refs: RefObject<T> | Array<RefObject<T>>, onScroll: (e: ScrollEvent & {
+    index: number;
+}) => void): void;

package/dist/gestures/hooks/useWheel.d.ts

@@ -1,4 +1,8 @@
-import { WheelEventType } from '../types';
-export declare function useWheel(callback: (event: WheelEventType) => void): (index?: number) => {
-    ref: any;
-};
+import { RefObject } from 'react';
+import { type WheelEvent } from '../controllers/WheelGesture';
+export declare function useWheel(refs: Window, onWheel: (e: WheelEvent & {
+    index: 0;
+}) => void): void;
+export declare function useWheel<T extends HTMLElement>(refs: RefObject<T> | Array<RefObject<T>>, onWheel: (e: WheelEvent & {
+    index: number;
+}) => void): void;

package/dist/gestures/index.d.ts

@@ -0,0 +1 @@
+export * from './hooks';

package/dist/hooks/index.d.ts

@@ -1,3 +1 @@
-export * from "./useOutsideClick";
-export * from "./useMeasure";
-export * from "./useWindowDimension";
+export { useOutsideClick } from './useOutsideClick';

package/dist/hooks/useOutsideClick.d.ts

@@ -1,2 +1,2 @@
 import { RefObject, DependencyList } from 'react';
-export declare function useOutsideClick(elementRef: RefObject<HTMLElement>, callback: (event: MouseEvent) => void, deps?: DependencyList): void;
+export declare function useOutsideClick(ref: RefObject<HTMLElement>, callback: (event: MouseEvent | TouchEvent) => void, deps?: DependencyList): void;

package/dist/index.d.ts

@@ -1,9 +1,5 @@
-export { Easing, makeMotion as makeAnimated, motion as animate, } from '@raidipesh78/re-motion';
-export { AnimationConfig, MountedBlock, ScrollableBlock } from './animation';
-export { useValue, useMount } from './animation';
-export { withSpring, withTiming, withSequence, withDelay, withDecay, withLoop, withEase, } from './animation';
-export { useMeasure, useOutsideClick, useWindowDimension } from './hooks';
-export { interpolateNumbers } from './animation';
-export { useDrag, useGesture, useMouseMove, useScroll, useWheel, } from './gestures/hooks';
-export { bin, clamp, mix, rubberClamp, move, snapTo } from './gestures/helpers';
-export type { UseMountConfig } from './animation';
+export { combine, Easing, makeMotion as makeAnimated, motion as animate, } from '@raidipesh78/re-motion';
+export * from './animation';
+export * from './hooks';
+export * from './gestures';
+export * from './utils';