@ssgoi/core 0.0.3 → 2.1.0

package/dist/presets/index.d.ts

@@ -0,0 +1,16 @@
+import { SpringConfig } from '../types';
+export declare const defaultSpring: SpringConfig;
+export declare const gentle: SpringConfig;
+export declare const wobbly: SpringConfig;
+export declare const stiff: SpringConfig;
+export declare const slow: SpringConfig;
+export declare const molasses: SpringConfig;
+export declare const config: {
+    readonly default: SpringConfig;
+    readonly gentle: SpringConfig;
+    readonly wobbly: SpringConfig;
+    readonly stiff: SpringConfig;
+    readonly slow: SpringConfig;
+    readonly molasses: SpringConfig;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/presets/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/presets/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,eAAO,MAAM,aAAa,EAAE,YAG3B,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,YAGpB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,YAGpB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,YAGnB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,YAGlB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,YAGtB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;CAOT,CAAC"}

package/dist/presets/index.js

@@ -0,0 +1,35 @@
+const s = {
+  stiffness: 170,
+  damping: 26
+}, n = {
+  stiffness: 120,
+  damping: 14
+}, t = {
+  stiffness: 180,
+  damping: 12
+}, f = {
+  stiffness: 210,
+  damping: 20
+}, i = {
+  stiffness: 280,
+  damping: 60
+}, e = {
+  stiffness: 280,
+  damping: 120
+}, o = {
+  default: s,
+  gentle: n,
+  wobbly: t,
+  stiff: f,
+  slow: i,
+  molasses: e
+};
+export {
+  o as config,
+  s as defaultSpring,
+  n as gentle,
+  e as molasses,
+  i as slow,
+  f as stiff,
+  t as wobbly
+};

package/dist/transition-strategy.d.ts

@@ -0,0 +1,60 @@
+import { TransitionConfig } from './types';
+import { Animator } from './animator';
+export declare const TRANSITION_STRATEGY: unique symbol;
+export interface StrategyContext<TAnimationValue = number> {
+    currentAnimation: {
+        animator: Animator<TAnimationValue>;
+        direction: "in" | "out";
+    } | null;
+}
+export interface AnimationSetup<TAnimationValue = number> {
+    config?: TransitionConfig<TAnimationValue>;
+    state: {
+        position: TAnimationValue;
+        velocity: TAnimationValue extends number ? number : Record<string, number>;
+    };
+    from: TAnimationValue;
+    to: TAnimationValue;
+    direction: "forward" | "backward";
+}
+export interface TransitionConfigs<TAnimationValue = number> {
+    in?: Promise<TransitionConfig<TAnimationValue>>;
+    out?: Promise<TransitionConfig<TAnimationValue>>;
+}
+export interface TransitionStrategy<TAnimationValue = number> {
+    runIn: (configs: TransitionConfigs<TAnimationValue>) => Promise<AnimationSetup<TAnimationValue>>;
+    runOut: (configs: TransitionConfigs<TAnimationValue>) => Promise<AnimationSetup<TAnimationValue>>;
+}
+/**
+ * Creates a transition callback that can be used with framework-specific implementations
+ * This is the core logic that frameworks can wrap with their own APIs
+ *
+ * UX Animation Behavior - 4 Main Scenarios:
+ *
+ * 1. No animation running + IN trigger:
+ *    - Start entrance animation (0 → 1)
+ *    - Return cleanup function for exit
+ *
+ * 2. No animation running + OUT trigger:
+ *    - Clone element, start exit animation (1 → 0)
+ *    - Remove clone when complete
+ *
+ * 3. IN animation running + OUT trigger:
+ *    - Stop current IN animation (DOM is disappearing)
+ *    - Clone element for exit animation
+ *    - Create REVERSED IN animation (not OUT animation) with current state
+ *    - This gives natural backward motion instead of jumping to OUT definition
+ *
+ * 4. OUT animation running + IN trigger:
+ *    - Stop current OUT animation (cleanup any cloned elements)
+ *    - Create REVERSED OUT animation (not IN animation) with current state
+ *    - This gives natural backward motion instead of jumping to IN definition
+ *    - Switch to entrance mode
+ *
+ * Closure Structure:
+ * - Outer function: Returns entrance callback
+ * - Inner function (entrance callback): Returns cleanup callback (exit)
+ * - Cleanup callback: Handles exit transitions
+ */
+export declare const createDefaultStrategy: <TAnimationValue = number>(context: StrategyContext<TAnimationValue>) => TransitionStrategy<TAnimationValue>;
+//# sourceMappingURL=transition-strategy.d.ts.map

package/dist/transition-strategy.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transition-strategy.d.ts","sourceRoot":"","sources":["../src/lib/transition-strategy.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAE3C,eAAO,MAAM,mBAAmB,eAAoC,CAAC;AAErE,MAAM,WAAW,eAAe,CAAC,eAAe,GAAG,MAAM;IAEvD,gBAAgB,EAAE;QAChB,QAAQ,EAAE,QAAQ,CAAC,eAAe,CAAC,CAAC;QACpC,SAAS,EAAE,IAAI,GAAG,KAAK,CAAC;KACzB,GAAG,IAAI,CAAC;CACV;AAED,MAAM,WAAW,cAAc,CAAC,eAAe,GAAG,MAAM;IACtD,MAAM,CAAC,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAC;IAC3C,KAAK,EAAE;QACL,QAAQ,EAAE,eAAe,CAAC;QAC1B,QAAQ,EAAE,eAAe,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;KAC5E,CAAC;IACF,IAAI,EAAE,eAAe,CAAC;IACtB,EAAE,EAAE,eAAe,CAAC;IACpB,SAAS,EAAE,SAAS,GAAG,UAAU,CAAC;CACnC;AAED,MAAM,WAAW,iBAAiB,CAAC,eAAe,GAAG,MAAM;IACzD,EAAE,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC,CAAC;IAChD,GAAG,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC,CAAC;CAClD;AAED,MAAM,WAAW,kBAAkB,CAAC,eAAe,GAAG,MAAM;IAC1D,KAAK,EAAE,CACL,OAAO,EAAE,iBAAiB,CAAC,eAAe,CAAC,KACxC,OAAO,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,CAAC;IAC9C,MAAM,EAAE,CACN,OAAO,EAAE,iBAAiB,CAAC,eAAe,CAAC,KACxC,OAAO,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,CAAC;CAC/C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAEH,eAAO,MAAM,qBAAqB,GAAI,eAAe,GAAG,MAAM,EAC5D,SAAS,eAAe,CAAC,eAAe,CAAC,KACxC,kBAAkB,CAAC,eAAe,CA0HpC,CAAC"}

package/dist/transition.d.ts

@@ -1,16 +1,60 @@
-import { Transition, TransitionCallback } from './types';
-/**
- * Key type for transitions - can be string or symbol
- */
-type TransitionKey = string | symbol;
+import { StrategyContext, TRANSITION_STRATEGY, TransitionStrategy } from './transition-strategy';
+import { TransitionCallback, TransitionOptions, TransitionKey } from './types';
+export declare function generateAutoKey(): TransitionKey;
 /**
  * Framework-agnostic transition function that can be used as a ref
- * Usage: <div ref={transition({ key: 'fade', in, out })} />
+ *
+ * @description
+ * Creates a transition that can be attached to DOM elements via ref.
+ * Manages entrance and exit animations with a complete lifecycle system.
+ *
+ * **IN Animation Lifecycle (Element Entering):**
+ * 1. `prepare` - Setup element's initial state (e.g., opacity: 0)
+ * 2. `wait` - Optional async delay before animation starts
+ * 3. `onStart` - Called when animation begins
+ * 4. `tick` - Called on each animation frame with progress value (0 → 1)
+ * 5. `onEnd` - Called when animation completes
+ *
+ * **OUT Animation Lifecycle (Element Exiting):**
+ * 1. `prepare` - Setup element's initial state for exit
+ * 2. `wait` - Optional async delay before animation starts
+ * 3. `onStart` - Called when animation begins
+ * 4. `tick` - Called on each animation frame with progress value (1 → 0)
+ * 5. `onEnd` - Called when animation completes and element is removed
+ *
+ * The `key` parameter is crucial for transition management - it uniquely identifies
+ * each transition instance, allowing the system to track, cleanup, and prevent
+ * conflicts between multiple transitions on the same element.
+ *
+ * @param {object} options - Configuration object
+ * @param {TransitionKey} options.key - Unique identifier for this transition instance.
+ *                                      Can be string or symbol. Used to manage and cleanup
+ *                                      transitions internally.
+ * @param {Function} options.in - Configuration for entrance animation.
+ *                                Returns TransitionConfig with lifecycle hooks.
+ * @param {Function} options.out - Configuration for exit animation.
+ *                                 Returns TransitionConfig with lifecycle hooks.
+ *
+ * @template TAnimationValue - The type of value being animated (number | object)
+ *
+ * @returns {TransitionCallback} A callback function to be used as a ref
+ *
+ * @example
+ * ```tsx
+ * // Simple fade transition
+ * <div ref={transition({
+ *   key: 'hero-fade',
+ *   in: (element) => ({
+ *     prepare: (el) => el.style.opacity = '0',
+ *     tick: (progress) => el.style.opacity = progress.toString(),
+ *   }),
+ *   out: (element) => ({
+ *     tick: (progress) => el.style.opacity = progress.toString(),
+ *   })
+ * })} />
+ * ```
  */
-export declare function transition(options: {
-    key: TransitionKey;
-    in?: Transition["in"];
-    out?: Transition["out"];
+export declare function transition<TAnimationValue = number>(options: TransitionOptions<undefined, TAnimationValue> & {
+    [TRANSITION_STRATEGY]?: (context: StrategyContext<TAnimationValue>) => TransitionStrategy<TAnimationValue>;
 }): TransitionCallback;
-export {};
 //# sourceMappingURL=transition.d.ts.map

package/dist/transition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../src/lib/transition.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE9D;;GAEG;AACH,KAAK,aAAa,GAAG,MAAM,GAAG,MAAM,CAAC;AAuDrC;;;GAGG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE;IAClC,GAAG,EAAE,aAAa,CAAC;IACnB,EAAE,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IACtB,GAAG,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,CAAC;CACzB,GAAG,kBAAkB,CAMrB"}
+{"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../src/lib/transition.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AACjG,OAAO,KAAK,EAAc,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AACjF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AA+D7C,wBAAgB,eAAe,IAAI,aAAa,CAY/C;AAcD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,wBAAgB,UAAU,CAAC,eAAe,GAAG,MAAM,EACjD,OAAO,EAAE,iBAAiB,CAAC,SAAS,EAAE,eAAe,CAAC,GAAG;IACvD,CAAC,mBAAmB,CAAC,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,CAAC,eAAe,CAAC,KAAK,kBAAkB,CAAC,eAAe,CAAC,CAAC;CAC5G,GACA,kBAAkB,CAmBpB"}

package/dist/transitions/blur.d.ts

@@ -1,13 +1,17 @@
+import { TransitionKey } from '../types';
 interface BlurOptions {
-    amount?: number;
+    amount?: number | string;
+    opacity?: number;
     scale?: boolean;
     fade?: boolean;
     spring?: {
         stiffness?: number;
         damping?: number;
     };
+    key?: TransitionKey;
 }
 export declare const blur: (options?: BlurOptions) => {
+    key?: TransitionKey | undefined;
     in: (element: HTMLElement) => {
         spring: {
             stiffness?: number;

package/dist/transitions/blur.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"blur.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/blur.ts"],"names":[],"mappings":"AAAA,UAAU,WAAW;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AAED,eAAO,MAAM,IAAI,GAAI,UAAS,WAAgB;kBAS5B,WAAW;;wBAdb,MAAM;sBACR,MAAM;;yBAeG,MAAM;;mBAeV,WAAW;;wBA/Bd,MAAM;sBACR,MAAM;;yBAgCG,MAAM;;CAgB5B,CAAC"}
+{"version":3,"file":"blur.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/blur.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAE9C,UAAU,WAAW;IACnB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;IACF,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB;AAED,eAAO,MAAM,IAAI,GAAI,UAAS,WAAgB;;kBAe5B,WAAW;;wBArBb,MAAM;sBACR,MAAM;;yBAsBG,MAAM;;mBAmBV,WAAW;;wBA1Cd,MAAM;sBACR,MAAM;;yBA2CG,MAAM;;CAqB5B,CAAC"}

package/dist/transitions/bounce.d.ts

@@ -1,13 +1,18 @@
+import { TransitionKey } from '../types';
 interface BounceOptions {
     height?: number;
+    intensity?: number;
     scale?: boolean;
     fade?: boolean;
+    direction?: 'up' | 'down';
     spring?: {
         stiffness?: number;
         damping?: number;
     };
+    key?: TransitionKey;
 }
 export declare const bounce: (options?: BounceOptions) => {
+    key?: TransitionKey | undefined;
     in: (element: HTMLElement) => {
         spring: {
             stiffness?: number;

package/dist/transitions/bounce.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"bounce.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/bounce.ts"],"names":[],"mappings":"AAAA,UAAU,aAAa;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AAED,eAAO,MAAM,MAAM,GAAI,UAAS,aAAkB;kBAShC,WAAW;;wBAdb,MAAM;sBACR,MAAM;;yBAeG,MAAM;;mBAkBV,WAAW;;wBAlCd,MAAM;sBACR,MAAM;;yBAmCG,MAAM;;CAmB5B,CAAC"}
+{"version":3,"file":"bounce.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/bounce.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAE9C,UAAU,aAAa;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC1B,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;IACF,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB;AAED,eAAO,MAAM,MAAM,GAAI,UAAS,aAAkB;;kBAYhC,WAAW;;wBAlBb,MAAM;sBACR,MAAM;;yBAmBG,MAAM;;mBA0BV,WAAW;;wBA9Cd,MAAM;sBACR,MAAM;;yBA+CG,MAAM;;CA4B5B,CAAC"}

package/dist/transitions/fade.d.ts

@@ -1,3 +1,4 @@
+import { TransitionKey } from '../types';
 interface FadeOptions {
     from?: number;
     to?: number;
@@ -5,8 +6,10 @@ interface FadeOptions {
         stiffness?: number;
         damping?: number;
     };
+    key?: TransitionKey;
 }
 export declare const fade: (options?: FadeOptions) => {
+    key?: TransitionKey | undefined;
     in: (element: HTMLElement) => {
         spring: {
             stiffness?: number;

package/dist/transitions/fade.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fade.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/fade.ts"],"names":[],"mappings":"AAAA,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AAED,eAAO,MAAM,IAAI,GAAI,UAAS,WAAgB;kBAQ5B,WAAW;;wBAbb,MAAM;sBACR,MAAM;;yBAcG,MAAM;;mBAKV,WAAW;;wBApBd,MAAM;sBACR,MAAM;;yBAqBG,MAAM;;CAM5B,CAAC"}
+{"version":3,"file":"fade.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/fade.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAE9C,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;IACF,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB;AAED,eAAO,MAAM,IAAI,GAAI,UAAS,WAAgB;;kBAS5B,WAAW;;wBAfb,MAAM;sBACR,MAAM;;yBAgBG,MAAM;;mBAKV,WAAW;;wBAtBd,MAAM;sBACR,MAAM;;yBAuBG,MAAM;;CAO5B,CAAC"}

package/dist/transitions/fly.d.ts

@@ -0,0 +1,30 @@
+import { TransitionKey } from '../types';
+interface FlyOptions {
+    x?: number | string;
+    y?: number | string;
+    opacity?: number;
+    spring?: {
+        stiffness?: number;
+        damping?: number;
+    };
+    key?: TransitionKey;
+}
+export declare const fly: (options?: FlyOptions) => {
+    key?: TransitionKey | undefined;
+    in: (element: HTMLElement) => {
+        spring: {
+            stiffness?: number;
+            damping?: number;
+        };
+        tick: (progress: number) => void;
+    };
+    out: (element: HTMLElement) => {
+        spring: {
+            stiffness?: number;
+            damping?: number;
+        };
+        tick: (progress: number) => void;
+    };
+};
+export {};
+//# sourceMappingURL=fly.d.ts.map

package/dist/transitions/fly.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fly.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/fly.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAE9C,UAAU,UAAU;IAClB,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;IACF,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB;AAED,eAAO,MAAM,GAAG,GAAI,UAAS,UAAe;;kBAkB1B,WAAW;;wBAxBb,MAAM;sBACR,MAAM;;yBAyBG,MAAM;;mBAQV,WAAW;;wBAlCd,MAAM;sBACR,MAAM;;yBAmCG,MAAM;;CAU5B,CAAC"}

package/dist/transitions/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=(r={})=>{const{from:i=0,to:c=1,spring:a={stiffness:300,damping:30}}=r;return{in:o=>({spring:a,tick:s=>{const t=i+(c-i)*s;o.style.opacity=t.toString()}}),out:o=>({spring:a,tick:s=>{const t=i+(c-i)*s;o.style.opacity=t.toString()}})}},u=(r={})=>{const{from:i=0,to:c=1,spring:a={stiffness:300,damping:30}}=r;return{in:o=>({spring:a,tick:s=>{const t=i+(c-i)*s;o.style.transform=`scale(${t})`}}),out:o=>({spring:a,tick:s=>{const t=i+(c-i)*s;o.style.transform=`scale(${t})`}})}},y=(r={})=>{const{direction:i="left",distance:c=100,fade:a=!0,spring:o={stiffness:400,damping:35}}=r,s=t=>{const n=(1-t)*c;switch(i){case"left":return`translateX(${-n}px)`;case"right":return`translateX(${n}px)`;case"up":return`translateY(${-n}px)`;case"down":return`translateY(${n}px)`}};return{in:t=>({spring:o,tick:n=>{t.style.transform=s(n),a&&(t.style.opacity=n.toString())}}),out:t=>({spring:o,tick:n=>{t.style.transform=s(n),a&&(t.style.opacity=n.toString())}})}},p=(r={})=>{const{degrees:i=360,clockwise:c=!0,scale:a=!1,fade:o=!1,spring:s={stiffness:500,damping:25}}=r,t=c?i:-i;return{in:n=>({spring:s,tick:e=>{const f=[`rotate(${e*t}deg)`];a&&f.push(`scale(${e})`),n.style.transform=f.join(" "),o&&(n.style.opacity=e.toString())}}),out:n=>({spring:s,tick:e=>{const f=[`rotate(${e*t}deg)`];a&&f.push(`scale(${e})`),n.style.transform=f.join(" "),o&&(n.style.opacity=e.toString())}})}},d=(r={})=>{const{height:i=20,scale:c=!0,fade:a=!1,spring:o={stiffness:800,damping:15}}=r;return{in:s=>({spring:o,tick:t=>{const n=[],e=Math.sin(t*Math.PI)*i*(1-t);n.push(`translateY(${-e}px)`),c&&n.push(`scale(${.8+t*.2})`),s.style.transform=n.join(" "),a&&(s.style.opacity=t.toString())}}),out:s=>({spring:o,tick:t=>{const n=[],e=Math.sin(t*Math.PI)*i*(1-t);n.push(`translateY(${-e}px)`),c&&n.push(`scale(${.8+t*.2})`),s.style.transform=n.join(" "),a&&(s.style.opacity=t.toString())}})}},g=(r={})=>{const{amount:i=10,scale:c=!1,fade:a=!0,spring:o={stiffness:300,damping:30}}=r;return{in:s=>({spring:o,tick:t=>{const e=[`blur(${(1-t)*i}px)`];s.style.filter=e.join(" "),c&&(s.style.transform=`scale(${.8+t*.2})`),a&&(s.style.opacity=t.toString())}}),out:s=>({spring:o,tick:t=>{const e=[`blur(${(1-t)*i}px)`];s.style.filter=e.join(" "),c&&(s.style.transform=`scale(${.8+t*.2})`),a&&(s.style.opacity=t.toString())}})}},m=(r={})=>{const{spring:i={stiffness:1e3,damping:100}}=r;return{in:c=>({spring:i,tick:a=>{}}),out:c=>({spring:i,tick:a=>{}})}};exports.blur=g;exports.bounce=d;exports.fade=l;exports.none=m;exports.rotate=p;exports.scale=u;exports.slide=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=($={})=>{const{from:n=0,to:s=1,spring:r={stiffness:300,damping:30},key:u}=$;return{in:l=>({spring:r,tick:y=>{const c=n+(s-n)*y;l.style.opacity=c.toString()}}),out:l=>({spring:r,tick:y=>{const c=n+(s-n)*y;l.style.opacity=c.toString()}}),...u&&{key:u}}},m=($={})=>{const{start:n=0,opacity:s=0,axis:r="both",spring:u={stiffness:300,damping:30},key:l}=$,y=c=>{switch(r){case"x":return`scaleX(${c})`;case"y":return`scaleY(${c})`;case"both":default:return`scale(${c})`}};return{in:c=>({spring:u,tick:t=>{const e=n+(1-n)*t;c.style.transform=y(e),c.style.opacity=(s+(1-s)*t).toString()}}),out:c=>({spring:u,tick:t=>{const e=n+(1-n)*t;c.style.transform=y(e),c.style.opacity=(s+(1-s)*t).toString()}}),...l&&{key:l}}},d=($={})=>{const{direction:n,distance:s=100,opacity:r=0,fade:u=!0,axis:l,spring:y={stiffness:400,damping:35},key:c}=$,e=n||(l==="x"?"left":l==="y"?"up":"left"),o=a=>typeof a=="number"?`${a}px`:a,f=a=>{const i=1-a,p=typeof s=="number"?i*s:`calc(${o(s)} * ${i})`;switch(e){case"left":return typeof s=="number"?`translateX(${-p}px)`:`translateX(calc(-1 * ${p}))`;case"right":return typeof s=="number"?`translateX(${p}px)`:`translateX(${p})`;case"up":return typeof s=="number"?`translateY(${-p}px)`:`translateY(calc(-1 * ${p}))`;case"down":return typeof s=="number"?`translateY(${p}px)`:`translateY(${p})`}};return{in:a=>({spring:y,tick:i=>{a.style.transform=f(i),u&&(a.style.opacity=(r+(1-r)*i).toString())}}),out:a=>({spring:y,tick:i=>{a.style.transform=f(i),u&&(a.style.opacity=(r+(1-r)*i).toString())}}),...c&&{key:c}}},g=($={})=>{const{degrees:n=360,clockwise:s=!0,scale:r=!1,fade:u=!0,origin:l="center",axis:y="2d",perspective:c=800,spring:t={stiffness:500,damping:25},key:e}=$,o=s?n:-n,f=a=>{const i=(1-a)*o;switch(y){case"x":return`perspective(${c}px) rotateX(${i}deg)`;case"y":return`perspective(${c}px) rotateY(${i}deg)`;case"z":return`rotateZ(${i}deg)`;case"2d":default:return`rotate(${i}deg)`}};return{in:a=>({spring:t,tick:i=>{const p=[f(i)];r&&p.push(`scale(${i})`),a.style.transform=p.join(" "),a.style.transformOrigin=l,u&&(a.style.opacity=i.toString())}}),out:a=>({spring:t,tick:i=>{const p=[f(i)];r&&p.push(`scale(${i})`),a.style.transform=p.join(" "),a.style.transformOrigin=l,u&&(a.style.opacity=i.toString())}}),...e&&{key:e}}},x=($={})=>{const{height:n=20,intensity:s=1,scale:r=!0,fade:u=!0,direction:l="up",spring:y={stiffness:800,damping:15},key:c}=$;return{in:t=>({spring:y,tick:e=>{const o=[],f=Math.sin(e*Math.PI*(1+s)),a=1-e,i=f*n*a;if(l==="up"?o.push(`translateY(${-Math.abs(i)}px)`):o.push(`translateY(${Math.abs(i)}px)`),r){const p=.8+e*.2+f*.05*a;o.push(`scale(${p})`)}t.style.transform=o.join(" "),u&&(t.style.opacity=e.toString())}}),out:t=>({spring:y,tick:e=>{const o=[],f=Math.sin(e*Math.PI*(1+s)),a=1-e,i=f*n*a;if(l==="up"?o.push(`translateY(${-Math.abs(i)}px)`):o.push(`translateY(${Math.abs(i)}px)`),r){const p=.8+e*.2+f*.05*a;o.push(`scale(${p})`)}t.style.transform=o.join(" "),u&&(t.style.opacity=e.toString())}}),...c&&{key:c}}},k=($={})=>{const{amount:n=10,opacity:s=0,scale:r=!1,fade:u=!0,spring:l={stiffness:300,damping:30},key:y}=$,c=t=>typeof t=="number"?`${t}px`:t;return{in:t=>({spring:l,tick:e=>{const o=1-e,f=typeof n=="number"?o*n:`calc(${c(n)} * ${o})`;t.style.filter=typeof n=="number"?`blur(${f}px)`:`blur(${f})`,r&&(t.style.transform=`scale(${.8+e*.2})`),u&&(t.style.opacity=(s+(1-s)*e).toString())}}),out:t=>({spring:l,tick:e=>{const o=1-e,f=typeof n=="number"?o*n:`calc(${c(n)} * ${o})`;t.style.filter=typeof n=="number"?`blur(${f}px)`:`blur(${f})`,r&&(t.style.transform=`scale(${.8+e*.2})`),u&&(t.style.opacity=(s+(1-s)*e).toString())}}),...y&&{key:y}}},h=($={})=>{const{x:n=0,y:s=-100,opacity:r=0,spring:u={stiffness:400,damping:35},key:l}=$,y=t=>typeof t=="number"?`${t}px`:t,c=t=>typeof t=="number"?`${t}px`:t;return{in:t=>({spring:u,tick:e=>{const o=typeof n=="number"?(1-e)*n:`calc(${y(n)} * ${1-e})`,f=typeof s=="number"?(1-e)*s:`calc(${c(s)} * ${1-e})`;t.style.transform=`translate(${typeof n=="number"?o+"px":o}, ${typeof s=="number"?f+"px":f})`,t.style.opacity=(r+(1-r)*e).toString()}}),out:t=>({spring:u,tick:e=>{const o=typeof n=="number"?(1-e)*n:`calc(${y(n)} * ${1-e})`,f=typeof s=="number"?(1-e)*s:`calc(${c(s)} * ${1-e})`;t.style.transform=`translate(${typeof n=="number"?o+"px":o}, ${typeof s=="number"?f+"px":f})`,t.style.opacity=(r+(1-r)*e).toString()}}),...l&&{key:l}}},S=($={})=>{const{spring:n={stiffness:1e3,damping:100},key:s}=$;return{in:r=>({spring:n,tick:u=>{}}),out:r=>({spring:n,tick:u=>{}}),...s&&{key:s}}};exports.blur=k;exports.bounce=x;exports.fade=b;exports.fly=h;exports.none=S;exports.rotate=g;exports.scale=m;exports.slide=d;

package/dist/transitions/index.d.ts

@@ -4,5 +4,6 @@ export * from './slide';
 export * from './rotate';
 export * from './bounce';
 export * from './blur';
+export * from './fly';
 export * from './none';
 //# sourceMappingURL=index.d.ts.map

package/dist/transitions/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/transitions/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,QAAQ,CAAC"}