@studiometa/ui 0.2.13 → 0.2.15

package/atoms/Prefetch/PrefetchWhenVisible.d.ts

@@ -1,21 +1,17 @@
-/**
- * @typedef {PrefetchWhenVisible & {
- *   $el: HTMLAnchorElement
- * }} PrefetchWhenVisibleInterface
- */
+import type { BaseConfig } from '@studiometa/js-toolkit';
+import { AbstractPrefetch } from './AbstractPrefetch.js';
+declare const PrefetchWhenVisible_base: import("@studiometa/js-toolkit").BaseDecorator<import("@studiometa/js-toolkit").WithMountWhenInViewInterface, AbstractPrefetch<import("@studiometa/js-toolkit").BaseProps>, import("@studiometa/js-toolkit").WithMountWhenInViewProps>;
 /**
  * PrefetchWhenVisible class.
  */
-export default class PrefetchWhenVisible extends AbstractPrefetch {
+export declare class PrefetchWhenVisible extends PrefetchWhenVisible_base {
+    /**
+     * Config.
+     */
+    static config: BaseConfig;
     /**
      * Prefetch on mount.
-     *
-     * @this    {PrefetchWhenVisibleInterface}
-     * @returns {void}
      */
-    mounted(this: PrefetchWhenVisibleInterface): void;
+    mounted(): void;
 }
-export type PrefetchWhenVisibleInterface = PrefetchWhenVisible & {
-    $el: HTMLAnchorElement;
-};
-import AbstractPrefetch from "./AbstractPrefetch.js";
+export {};

package/atoms/Prefetch/PrefetchWhenVisible.js

@@ -1 +1,15 @@
-import{withMountWhenInView as t}from"@studiometa/js-toolkit";import e from"./AbstractPrefetch.js";class i extends t(e){static config={...e.config,name:"PrefetchWhenVisible"};mounted(){this.prefetch(new URL(this.$el.href))}}export{i as default};
+import { withMountWhenInView } from "@studiometa/js-toolkit";
+import { AbstractPrefetch } from "./AbstractPrefetch.js";
+class PrefetchWhenVisible extends withMountWhenInView(AbstractPrefetch) {
+  static config = {
+    ...AbstractPrefetch.config,
+    name: "PrefetchWhenVisible"
+  };
+  mounted() {
+    this.prefetch(new URL(this.$el.href));
+  }
+}
+export {
+  PrefetchWhenVisible
+};
+//# sourceMappingURL=PrefetchWhenVisible.js.map

package/atoms/Prefetch/PrefetchWhenVisible.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/Prefetch/PrefetchWhenVisible.ts"],
+  "sourcesContent": ["import { withMountWhenInView } from '@studiometa/js-toolkit';\nimport type { BaseConfig } from '@studiometa/js-toolkit';\nimport { AbstractPrefetch } from './AbstractPrefetch.js';\n\n/**\n * PrefetchWhenVisible class.\n */\nexport class PrefetchWhenVisible extends withMountWhenInView<AbstractPrefetch>(AbstractPrefetch) {\n  /**\n   * Config.\n   */\n  static config:BaseConfig = {\n    ...AbstractPrefetch.config,\n    name: 'PrefetchWhenVisible',\n  };\n\n  /**\n   * Prefetch on mount.\n   */\n  mounted() {\n    this.prefetch(new URL(this.$el.href));\n  }\n}\n"],
+  "mappings": "AAAA,SAAS,2BAA2B;AAEpC,SAAS,wBAAwB;AAK1B,MAAM,4BAA4B,oBAAsC,gBAAgB,EAAE;AAAA,EAI/F,OAAO,SAAoB;AAAA,IACzB,GAAG,iBAAiB;AAAA,IACpB,MAAM;AAAA,EACR;AAAA,EAKA,UAAU;AACR,SAAK,SAAS,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC;AAAA,EACtC;AACF;",
+  "names": []
+}

package/atoms/Prefetch/index.cjs

@@ -1,13 +1,7 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
 var __copyProps = (to, from, except, desc) => {
   if (from && typeof from === "object" || typeof from === "function") {
     for (let key of __getOwnPropNames(from))
@@ -16,18 +10,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// packages/ui/atoms/Prefetch/index.js
+// packages/ui/atoms/Prefetch/index.ts
 var Prefetch_exports = {};
-__export(Prefetch_exports, {
-  AbstractPrefetch: () => import_AbstractPrefetch.default,
-  PrefetchWhenOver: () => import_PrefetchWhenOver.default,
-  PrefetchWhenVisible: () => import_PrefetchWhenVisible.default
-});
 module.exports = __toCommonJS(Prefetch_exports);
-var import_AbstractPrefetch = __toESM(require("./AbstractPrefetch.cjs"), 1);
-var import_PrefetchWhenOver = __toESM(require("./PrefetchWhenOver.cjs"), 1);
-var import_PrefetchWhenVisible = __toESM(require("./PrefetchWhenVisible.cjs"), 1);
+__reExport(Prefetch_exports, require("./AbstractPrefetch.cjs"), module.exports);
+__reExport(Prefetch_exports, require("./PrefetchWhenOver.cjs"), module.exports);
+__reExport(Prefetch_exports, require("./PrefetchWhenVisible.cjs"), module.exports);
 if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=index.cjs.map

package/atoms/Prefetch/index.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/Prefetch/index.ts"],
+  "sourcesContent": ["export * from './AbstractPrefetch.js';\nexport * from './PrefetchWhenOver.js';\nexport * from './PrefetchWhenVisible.js';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,6BAAc,mCAAd;AACA,6BAAc,mCADd;AAEA,6BAAc,sCAFd;",
+  "names": []
+}

package/atoms/Prefetch/index.d.ts

@@ -1,3 +1,3 @@
-export { default as AbstractPrefetch } from "./AbstractPrefetch.js";
-export { default as PrefetchWhenOver } from "./PrefetchWhenOver.js";
-export { default as PrefetchWhenVisible } from "./PrefetchWhenVisible.js";
+export * from './AbstractPrefetch.js';
+export * from './PrefetchWhenOver.js';
+export * from './PrefetchWhenVisible.js';

package/atoms/Prefetch/index.js

@@ -1 +1,4 @@
-import{default as t}from"./AbstractPrefetch.js";import{default as a}from"./PrefetchWhenOver.js";import{default as h}from"./PrefetchWhenVisible.js";export{t as AbstractPrefetch,a as PrefetchWhenOver,h as PrefetchWhenVisible};
+export * from "./AbstractPrefetch.js";
+export * from "./PrefetchWhenOver.js";
+export * from "./PrefetchWhenVisible.js";
+//# sourceMappingURL=index.js.map

package/atoms/Prefetch/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/Prefetch/index.ts"],
+  "sourcesContent": ["export * from './AbstractPrefetch.js';\nexport * from './PrefetchWhenOver.js';\nexport * from './PrefetchWhenVisible.js';\n"],
+  "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;",
+  "names": []
+}

package/atoms/ScrollAnimation/AbstractScrollAnimation.cjs

@@ -21,10 +21,10 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 
-// packages/ui/atoms/ScrollAnimation/AbstractScrollAnimation.js
+// packages/ui/atoms/ScrollAnimation/AbstractScrollAnimation.ts
 var AbstractScrollAnimation_exports = {};
 __export(AbstractScrollAnimation_exports, {
-  default: () => AbstractScrollAnimation
+  AbstractScrollAnimation: () => AbstractScrollAnimation
 });
 module.exports = __toCommonJS(AbstractScrollAnimation_exports);
 var import_js_toolkit = require("@studiometa/js-toolkit");
@@ -33,17 +33,28 @@ var AbstractScrollAnimation = class extends (0, import_js_toolkit.withFreezedOpt
   get target() {
     return this.$el;
   }
-  animation;
-  mounted() {
+  get animation() {
     let { keyframes } = this.$options;
     const { from, to } = this.$options;
     if (keyframes.length <= 0 && from && to) {
       keyframes = [from, to];
     }
-    this.animation = (0, import_utils.animate)(this.target, keyframes, { easing: this.$options.easing });
+    const animation = (0, import_utils.animate)(this.target, keyframes, { easing: this.$options.easing });
+    Object.defineProperty(this, "animation", {
+      value: animation,
+      configurable: true
+    });
+    return animation;
   }
   scrolledInView(props) {
-    const progress = (0, import_utils.map)((0, import_utils.clamp)(props.dampedProgress.y, this.$options.playRange[0], this.$options.playRange[1]), this.$options.playRange[0], this.$options.playRange[1], 0, 1);
+    const progress = (0, import_utils.map)(
+      (0, import_utils.clamp)(props.dampedProgress.y, this.$options.playRange[0], this.$options.playRange[1]),
+      this.$options.playRange[0],
+      this.$options.playRange[1],
+      0,
+      1
+    );
+    this.$options.playRange = [0, 0];
     this.render(progress);
   }
   render(progress) {
@@ -57,14 +68,6 @@ __publicField(AbstractScrollAnimation, "config", {
       type: Array,
       default: () => [0, 1]
     },
-    dampFactor: {
-      type: Number,
-      default: 0.5
-    },
-    dampPrecision: {
-      type: Number,
-      default: 1e-3
-    },
     from: {
       type: Object,
       default: () => ({})
@@ -83,3 +86,4 @@ __publicField(AbstractScrollAnimation, "config", {
   }
 });
 if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=AbstractScrollAnimation.cjs.map

package/atoms/ScrollAnimation/AbstractScrollAnimation.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/ScrollAnimation/AbstractScrollAnimation.ts"],
+  "sourcesContent": ["import { Base, withFreezedOptions } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseConfig, ScrollInViewProps } from '@studiometa/js-toolkit';\nimport { map, clamp, animate } from '@studiometa/js-toolkit/utils';\nimport type { Keyframe } from '@studiometa/js-toolkit/utils';\n\nexport interface AbstractScrollAnimationProps extends BaseProps {\n  $options: {\n    playRange: [number, number];\n    from: Keyframe;\n    to: Keyframe;\n    keyframes: Keyframe[];\n  };\n}\n\n/**\n * AbstractScrollAnimation class.\n */\nexport class AbstractScrollAnimation<T extends BaseProps = BaseProps> extends withFreezedOptions<Base>(Base)<T & AbstractScrollAnimationProps> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    name: 'AbstractScrollAnimation',\n    options: {\n      playRange: {\n        type: Array,\n        default: () => [0, 1],\n      },\n      from: {\n        type: Object,\n        default: () => ({}),\n      },\n      to: {\n        type: Object,\n        default: () => ({}),\n      },\n      keyframes: {\n        type: Array,\n      },\n      easing: {\n        type: Array,\n        default: () => [0, 0, 1, 1],\n      },\n    },\n  };\n\n  /**\n   * Get the target element for the animation.\n   */\n  get target() {\n    return this.$el as HTMLElement;\n  }\n\n  /**\n   * Lazily get animation.\n   */\n  get animation():ReturnType<typeof animate> {\n    let { keyframes } = this.$options;\n    const { from, to } = this.$options;\n\n    if (keyframes.length <= 0 && from && to) {\n      keyframes = [from, to];\n    }\n\n    const animation = animate(this.target, keyframes, { easing: this.$options.easing });\n\n    Object.defineProperty(this, 'animation', {\n      value: animation,\n      configurable: true,\n    });\n\n    return animation;\n  }\n\n  scrolledInView(props:ScrollInViewProps) {\n    const progress = map(\n      clamp(props.dampedProgress.y, this.$options.playRange[0], this.$options.playRange[1]),\n      this.$options.playRange[0],\n      this.$options.playRange[1],\n      0,\n      1,\n    );\n\n    this.$options.playRange = [0, 0];\n\n    this.render(progress);\n  }\n\n  /**\n   * Render the animation for the given progress.\n   */\n  render(progress:number) {\n    this.animation.progress(progress);\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAyC;AAEzC,mBAAoC;AAe7B,IAAM,0BAAN,kBAAuE,sCAAyB,sBAAI,EAAoC;AAAA,EAgC7I,IAAI,SAAS;AACX,WAAO,KAAK;AAAA,EACd;AAAA,EAKA,IAAI,YAAuC;AACzC,QAAI,EAAE,UAAU,IAAI,KAAK;AACzB,UAAM,EAAE,MAAM,GAAG,IAAI,KAAK;AAE1B,QAAI,UAAU,UAAU,KAAK,QAAQ,IAAI;AACvC,kBAAY,CAAC,MAAM,EAAE;AAAA,IACvB;AAEA,UAAM,gBAAY,sBAAQ,KAAK,QAAQ,WAAW,EAAE,QAAQ,KAAK,SAAS,OAAO,CAAC;AAElF,WAAO,eAAe,MAAM,aAAa;AAAA,MACvC,OAAO;AAAA,MACP,cAAc;AAAA,IAChB,CAAC;AAED,WAAO;AAAA,EACT;AAAA,EAEA,eAAe,OAAyB;AACtC,UAAM,eAAW;AAAA,UACf,oBAAM,MAAM,eAAe,GAAG,KAAK,SAAS,UAAU,IAAI,KAAK,SAAS,UAAU,EAAE;AAAA,MACpF,KAAK,SAAS,UAAU;AAAA,MACxB,KAAK,SAAS,UAAU;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AAEA,SAAK,SAAS,YAAY,CAAC,GAAG,CAAC;AAE/B,SAAK,OAAO,QAAQ;AAAA,EACtB;AAAA,EAKA,OAAO,UAAiB;AACtB,SAAK,UAAU,SAAS,QAAQ;AAAA,EAClC;AACF;AAzEE,cAJW,yBAIJ,UAAqB;AAAA,EAC1B,MAAM;AAAA,EACN,SAAS;AAAA,IACP,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS,MAAM,CAAC,GAAG,CAAC;AAAA,IACtB;AAAA,IACA,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS,OAAO,CAAC;AAAA,IACnB;AAAA,IACA,IAAI;AAAA,MACF,MAAM;AAAA,MACN,SAAS,OAAO,CAAC;AAAA,IACnB;AAAA,IACA,WAAW;AAAA,MACT,MAAM;AAAA,IACR;AAAA,IACA,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS,MAAM,CAAC,GAAG,GAAG,GAAG,CAAC;AAAA,IAC5B;AAAA,EACF;AACF;",
+  "names": []
+}

package/atoms/ScrollAnimation/AbstractScrollAnimation.d.ts

@@ -1,106 +1,36 @@
-/**
- * @typedef {typeof AbstractScrollAnimation} AbstractScrollAnimationConstructor
- * @typedef {import('@studiometa/js-toolkit/utils/css/animate.js').Keyframe} Keyframe
- */
-/**
- * @typedef {AbstractScrollAnimation & {
- *   $options: {
- *     playRange: string,
- *     dampFactor: number,
- *     dampPrecision: number,
- *     from: Keyframe,
- *     to: Keyframe,
- *     keyframes: Keyframe[],
- *   },
- * }} ScrollAnimationChildInterface
- */
+import { Base } from '@studiometa/js-toolkit';
+import type { BaseProps, BaseConfig, ScrollInViewProps } from '@studiometa/js-toolkit';
+import { animate } from '@studiometa/js-toolkit/utils';
+import type { Keyframe } from '@studiometa/js-toolkit/utils';
+export interface AbstractScrollAnimationProps extends BaseProps {
+    $options: {
+        playRange: [number, number];
+        from: Keyframe;
+        to: Keyframe;
+        keyframes: Keyframe[];
+    };
+}
+declare const AbstractScrollAnimation_base: import("@studiometa/js-toolkit").BaseDecorator<import("@studiometa/js-toolkit").WithFreezedOptionsInterface, Base<BaseProps>, BaseProps>;
 /**
  * AbstractScrollAnimation class.
- *
- * @todo add support for magic values in options to access key values:
- * - viewport size
- * - target size
- * - root element size
- * - etc.
- *
- * ```
- * data-option-to="{ x: 100%, y: innerWidth / 2 }"
- * ```
  */
-export default class AbstractScrollAnimation extends Base {
+export declare class AbstractScrollAnimation<T extends BaseProps = BaseProps> extends AbstractScrollAnimation_base<T & AbstractScrollAnimationProps> {
     /**
      * Config.
      */
-    static config: {
-        name: string;
-        options: {
-            playRange: {
-                type: ArrayConstructor;
-                default: () => number[];
-            };
-            dampFactor: {
-                type: NumberConstructor;
-                default: number;
-            };
-            dampPrecision: {
-                type: NumberConstructor;
-                default: number;
-            };
-            from: {
-                type: ObjectConstructor;
-                default: () => {};
-            };
-            to: {
-                type: ObjectConstructor;
-                default: () => {};
-            };
-            keyframes: {
-                type: ArrayConstructor;
-            };
-            easing: {
-                type: ArrayConstructor;
-                default: () => number[];
-            };
-        };
-    };
+    static config: BaseConfig;
     /**
      * Get the target element for the animation.
-     *
-     * @returns {HTMLElement}
      */
     get target(): HTMLElement;
     /**
-     * @type {ReturnType<animate>}
-     */
-    animation: ReturnType<typeof animate>;
-    /**
-     * @this {ScrollAnimationChildInterface}
-     * @returns {void}
-     */
-    mounted(this: ScrollAnimationChildInterface): void;
-    /**
-     * @todo do not add unnecessary styles
+     * Lazily get animation.
      */
-    scrolledInView(props: any): void;
+    get animation(): ReturnType<typeof animate>;
+    scrolledInView(props: ScrollInViewProps): void;
     /**
      * Render the animation for the given progress.
-     *
-     * @param   {number} progress
-     * @returns {void}
      */
     render(progress: number): void;
 }
-export type AbstractScrollAnimationConstructor = typeof AbstractScrollAnimation;
-export type Keyframe = import('@studiometa/js-toolkit/utils/css/animate.js').Keyframe;
-export type ScrollAnimationChildInterface = AbstractScrollAnimation & {
-    $options: {
-        playRange: string;
-        dampFactor: number;
-        dampPrecision: number;
-        from: Keyframe;
-        to: Keyframe;
-        keyframes: Keyframe[];
-    };
-};
-import { Base } from "@studiometa/js-toolkit";
-import { animate } from "@studiometa/js-toolkit/utils/css/animate.js";
+export {};

package/atoms/ScrollAnimation/AbstractScrollAnimation.js

@@ -1 +1,62 @@
-import{Base as i,withFreezedOptions as o}from"@studiometa/js-toolkit";import{map as s,clamp as n,animate as r}from"@studiometa/js-toolkit/utils";class p extends o(i){static config={name:"AbstractScrollAnimation",options:{playRange:{type:Array,default:()=>[0,1]},dampFactor:{type:Number,default:.5},dampPrecision:{type:Number,default:.001},from:{type:Object,default:()=>({})},to:{type:Object,default:()=>({})},keyframes:{type:Array},easing:{type:Array,default:()=>[0,0,1,1]}}};get target(){return this.$el}animation;mounted(){let{keyframes:t}=this.$options;const{from:e,to:a}=this.$options;t.length<=0&&e&&a&&(t=[e,a]),this.animation=r(this.target,t,{easing:this.$options.easing})}scrolledInView(t){const e=s(n(t.dampedProgress.y,this.$options.playRange[0],this.$options.playRange[1]),this.$options.playRange[0],this.$options.playRange[1],0,1);this.render(e)}render(t){this.animation.progress(t)}}export{p as default};
+import { Base, withFreezedOptions } from "@studiometa/js-toolkit";
+import { map, clamp, animate } from "@studiometa/js-toolkit/utils";
+class AbstractScrollAnimation extends withFreezedOptions(Base) {
+  static config = {
+    name: "AbstractScrollAnimation",
+    options: {
+      playRange: {
+        type: Array,
+        default: () => [0, 1]
+      },
+      from: {
+        type: Object,
+        default: () => ({})
+      },
+      to: {
+        type: Object,
+        default: () => ({})
+      },
+      keyframes: {
+        type: Array
+      },
+      easing: {
+        type: Array,
+        default: () => [0, 0, 1, 1]
+      }
+    }
+  };
+  get target() {
+    return this.$el;
+  }
+  get animation() {
+    let { keyframes } = this.$options;
+    const { from, to } = this.$options;
+    if (keyframes.length <= 0 && from && to) {
+      keyframes = [from, to];
+    }
+    const animation = animate(this.target, keyframes, { easing: this.$options.easing });
+    Object.defineProperty(this, "animation", {
+      value: animation,
+      configurable: true
+    });
+    return animation;
+  }
+  scrolledInView(props) {
+    const progress = map(
+      clamp(props.dampedProgress.y, this.$options.playRange[0], this.$options.playRange[1]),
+      this.$options.playRange[0],
+      this.$options.playRange[1],
+      0,
+      1
+    );
+    this.$options.playRange = [0, 0];
+    this.render(progress);
+  }
+  render(progress) {
+    this.animation.progress(progress);
+  }
+}
+export {
+  AbstractScrollAnimation
+};
+//# sourceMappingURL=AbstractScrollAnimation.js.map

package/atoms/ScrollAnimation/AbstractScrollAnimation.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/ScrollAnimation/AbstractScrollAnimation.ts"],
+  "sourcesContent": ["import { Base, withFreezedOptions } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseConfig, ScrollInViewProps } from '@studiometa/js-toolkit';\nimport { map, clamp, animate } from '@studiometa/js-toolkit/utils';\nimport type { Keyframe } from '@studiometa/js-toolkit/utils';\n\nexport interface AbstractScrollAnimationProps extends BaseProps {\n  $options: {\n    playRange: [number, number];\n    from: Keyframe;\n    to: Keyframe;\n    keyframes: Keyframe[];\n  };\n}\n\n/**\n * AbstractScrollAnimation class.\n */\nexport class AbstractScrollAnimation<T extends BaseProps = BaseProps> extends withFreezedOptions<Base>(Base)<T & AbstractScrollAnimationProps> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    name: 'AbstractScrollAnimation',\n    options: {\n      playRange: {\n        type: Array,\n        default: () => [0, 1],\n      },\n      from: {\n        type: Object,\n        default: () => ({}),\n      },\n      to: {\n        type: Object,\n        default: () => ({}),\n      },\n      keyframes: {\n        type: Array,\n      },\n      easing: {\n        type: Array,\n        default: () => [0, 0, 1, 1],\n      },\n    },\n  };\n\n  /**\n   * Get the target element for the animation.\n   */\n  get target() {\n    return this.$el as HTMLElement;\n  }\n\n  /**\n   * Lazily get animation.\n   */\n  get animation():ReturnType<typeof animate> {\n    let { keyframes } = this.$options;\n    const { from, to } = this.$options;\n\n    if (keyframes.length <= 0 && from && to) {\n      keyframes = [from, to];\n    }\n\n    const animation = animate(this.target, keyframes, { easing: this.$options.easing });\n\n    Object.defineProperty(this, 'animation', {\n      value: animation,\n      configurable: true,\n    });\n\n    return animation;\n  }\n\n  scrolledInView(props:ScrollInViewProps) {\n    const progress = map(\n      clamp(props.dampedProgress.y, this.$options.playRange[0], this.$options.playRange[1]),\n      this.$options.playRange[0],\n      this.$options.playRange[1],\n      0,\n      1,\n    );\n\n    this.$options.playRange = [0, 0];\n\n    this.render(progress);\n  }\n\n  /**\n   * Render the animation for the given progress.\n   */\n  render(progress:number) {\n    this.animation.progress(progress);\n  }\n}\n"],
+  "mappings": "AAAA,SAAS,MAAM,0BAA0B;AAEzC,SAAS,KAAK,OAAO,eAAe;AAe7B,MAAM,gCAAiE,mBAAyB,IAAI,EAAoC;AAAA,EAI7I,OAAO,SAAqB;AAAA,IAC1B,MAAM;AAAA,IACN,SAAS;AAAA,MACP,WAAW;AAAA,QACT,MAAM;AAAA,QACN,SAAS,MAAM,CAAC,GAAG,CAAC;AAAA,MACtB;AAAA,MACA,MAAM;AAAA,QACJ,MAAM;AAAA,QACN,SAAS,OAAO,CAAC;AAAA,MACnB;AAAA,MACA,IAAI;AAAA,QACF,MAAM;AAAA,QACN,SAAS,OAAO,CAAC;AAAA,MACnB;AAAA,MACA,WAAW;AAAA,QACT,MAAM;AAAA,MACR;AAAA,MACA,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,SAAS,MAAM,CAAC,GAAG,GAAG,GAAG,CAAC;AAAA,MAC5B;AAAA,IACF;AAAA,EACF;AAAA,EAKA,IAAI,SAAS;AACX,WAAO,KAAK;AAAA,EACd;AAAA,EAKA,IAAI,YAAuC;AACzC,QAAI,EAAE,UAAU,IAAI,KAAK;AACzB,UAAM,EAAE,MAAM,GAAG,IAAI,KAAK;AAE1B,QAAI,UAAU,UAAU,KAAK,QAAQ,IAAI;AACvC,kBAAY,CAAC,MAAM,EAAE;AAAA,IACvB;AAEA,UAAM,YAAY,QAAQ,KAAK,QAAQ,WAAW,EAAE,QAAQ,KAAK,SAAS,OAAO,CAAC;AAElF,WAAO,eAAe,MAAM,aAAa;AAAA,MACvC,OAAO;AAAA,MACP,cAAc;AAAA,IAChB,CAAC;AAED,WAAO;AAAA,EACT;AAAA,EAEA,eAAe,OAAyB;AACtC,UAAM,WAAW;AAAA,MACf,MAAM,MAAM,eAAe,GAAG,KAAK,SAAS,UAAU,IAAI,KAAK,SAAS,UAAU,EAAE;AAAA,MACpF,KAAK,SAAS,UAAU;AAAA,MACxB,KAAK,SAAS,UAAU;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AAEA,SAAK,SAAS,YAAY,CAAC,GAAG,CAAC;AAE/B,SAAK,OAAO,QAAQ;AAAA,EACtB;AAAA,EAKA,OAAO,UAAiB;AACtB,SAAK,UAAU,SAAS,QAAQ;AAAA,EAClC;AACF;",
+  "names": []
+}

package/atoms/ScrollAnimation/ScrollAnimation.cjs

@@ -1,8 +1,6 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __export = (target, all) => {
@@ -17,35 +15,29 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
 
-// packages/ui/atoms/ScrollAnimation/ScrollAnimation.js
+// packages/ui/atoms/ScrollAnimation/ScrollAnimation.ts
 var ScrollAnimation_exports = {};
 __export(ScrollAnimation_exports, {
-  default: () => ScrollAnimation
+  ScrollAnimation: () => ScrollAnimation
 });
 module.exports = __toCommonJS(ScrollAnimation_exports);
 var import_js_toolkit = require("@studiometa/js-toolkit");
-var import_AbstractScrollAnimation = __toESM(require("./AbstractScrollAnimation.cjs"), 1);
-var ScrollAnimation = class extends (0, import_js_toolkit.withScrolledInView)(import_AbstractScrollAnimation.default, {}) {
+var import_AbstractScrollAnimation = require("./AbstractScrollAnimation.cjs");
+var ScrollAnimation = class extends (0, import_js_toolkit.withScrolledInView)(import_AbstractScrollAnimation.AbstractScrollAnimation, {}) {
   get target() {
     return this.$refs.target;
   }
-  get dampFactor() {
-    return this.$options.dampFactor;
-  }
-  get dampPrecision() {
-    return this.$options.dampPrecision;
-  }
 };
 __publicField(ScrollAnimation, "config", {
-  ...import_AbstractScrollAnimation.default.config,
+  ...import_AbstractScrollAnimation.AbstractScrollAnimation.config,
   name: "ScrollAnimation",
   refs: ["target"]
 });
 if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=ScrollAnimation.cjs.map

package/atoms/ScrollAnimation/ScrollAnimation.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/ScrollAnimation/ScrollAnimation.ts"],
+  "sourcesContent": ["import { withScrolledInView } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { AbstractScrollAnimation } from './AbstractScrollAnimation.js';\n\nexport interface ScrollAnimationProps extends BaseProps {\n  $refs: {\n    target: HTMLElement;\n  };\n}\n\n/**\n * ScrollAnimation class.\n */\nexport class ScrollAnimation<\n  T extends BaseProps = BaseProps,\n> extends withScrolledInView<AbstractScrollAnimation>(AbstractScrollAnimation, {})<\n  T & ScrollAnimationProps\n> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    ...AbstractScrollAnimation.config,\n    name: 'ScrollAnimation',\n    refs: ['target'],\n  };\n\n  /**\n   * Use the `target` ref as animation target.\n   */\n  get target(): HTMLElement {\n    return this.$refs.target;\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAmC;AAEnC,qCAAwC;AAWjC,IAAM,kBAAN,kBAEG,sCAA4C,wDAAyB,CAAC,CAAC,EAE/E;AAAA,EAaA,IAAI,SAAsB;AACxB,WAAO,KAAK,MAAM;AAAA,EACpB;AACF;AAZE,cARW,iBAQJ,UAAqB;AAAA,EAC1B,GAAG,uDAAwB;AAAA,EAC3B,MAAM;AAAA,EACN,MAAM,CAAC,QAAQ;AACjB;",
+  "names": []
+}

package/atoms/ScrollAnimation/ScrollAnimation.d.ts

@@ -1,60 +1,22 @@
-/**
- * @typedef {ScrollAnimation & { $refs: { target: HTMLElement }}} ScrollAnimationInterface
- */
+import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';
+import { AbstractScrollAnimation } from './AbstractScrollAnimation.js';
+export interface ScrollAnimationProps extends BaseProps {
+    $refs: {
+        target: HTMLElement;
+    };
+}
+declare const ScrollAnimation_base: import("@studiometa/js-toolkit").BaseDecorator<import("@studiometa/js-toolkit").WithScrolledInViewInterface, AbstractScrollAnimation<BaseProps>, import("@studiometa/js-toolkit").WithScrolledInViewProps>;
 /**
  * ScrollAnimation class.
  */
-export default class ScrollAnimation extends AbstractScrollAnimation {
+export declare class ScrollAnimation<T extends BaseProps = BaseProps> extends ScrollAnimation_base<T & ScrollAnimationProps> {
     /**
      * Config.
      */
-    static config: {
-        name: string;
-        refs: string[];
-        options: {
-            playRange: {
-                type: ArrayConstructor;
-                default: () => number[];
-            };
-            dampFactor: {
-                type: NumberConstructor;
-                default: number;
-            };
-            dampPrecision: {
-                type: NumberConstructor;
-                default: number;
-            };
-            from: {
-                type: ObjectConstructor;
-                default: () => {};
-            };
-            to: {
-                type: ObjectConstructor;
-                default: () => {};
-            };
-            keyframes: {
-                type: ArrayConstructor;
-            };
-            easing: {
-                type: ArrayConstructor;
-                default: () => number[];
-            };
-        };
-    };
-    /**
-     * Get the damp factor from the freezed options.
-     * @returns {number}
-     */
-    get dampFactor(): number;
+    static config: BaseConfig;
     /**
-     * Get the damp precision from the freezed options.
-     * @returns {number}
+     * Use the `target` ref as animation target.
      */
-    get dampPrecision(): number;
+    get target(): HTMLElement;
 }
-export type ScrollAnimationInterface = ScrollAnimation & {
-    $refs: {
-        target: HTMLElement;
-    };
-};
-import AbstractScrollAnimation from "./AbstractScrollAnimation.js";
+export {};

package/atoms/ScrollAnimation/ScrollAnimation.js

@@ -1 +1,16 @@
-import{withScrolledInView as r}from"@studiometa/js-toolkit";import t from"./AbstractScrollAnimation.js";class i extends r(t,{}){static config={...t.config,name:"ScrollAnimation",refs:["target"]};get target(){return this.$refs.target}get dampFactor(){return this.$options.dampFactor}get dampPrecision(){return this.$options.dampPrecision}}export{i as default};
+import { withScrolledInView } from "@studiometa/js-toolkit";
+import { AbstractScrollAnimation } from "./AbstractScrollAnimation.js";
+class ScrollAnimation extends withScrolledInView(AbstractScrollAnimation, {}) {
+  static config = {
+    ...AbstractScrollAnimation.config,
+    name: "ScrollAnimation",
+    refs: ["target"]
+  };
+  get target() {
+    return this.$refs.target;
+  }
+}
+export {
+  ScrollAnimation
+};
+//# sourceMappingURL=ScrollAnimation.js.map

package/atoms/ScrollAnimation/ScrollAnimation.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/ScrollAnimation/ScrollAnimation.ts"],
+  "sourcesContent": ["import { withScrolledInView } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { AbstractScrollAnimation } from './AbstractScrollAnimation.js';\n\nexport interface ScrollAnimationProps extends BaseProps {\n  $refs: {\n    target: HTMLElement;\n  };\n}\n\n/**\n * ScrollAnimation class.\n */\nexport class ScrollAnimation<\n  T extends BaseProps = BaseProps,\n> extends withScrolledInView<AbstractScrollAnimation>(AbstractScrollAnimation, {})<\n  T & ScrollAnimationProps\n> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    ...AbstractScrollAnimation.config,\n    name: 'ScrollAnimation',\n    refs: ['target'],\n  };\n\n  /**\n   * Use the `target` ref as animation target.\n   */\n  get target(): HTMLElement {\n    return this.$refs.target;\n  }\n}\n"],
+  "mappings": "AAAA,SAAS,0BAA0B;AAEnC,SAAS,+BAA+B;AAWjC,MAAM,wBAEH,mBAA4C,yBAAyB,CAAC,CAAC,EAE/E;AAAA,EAIA,OAAO,SAAqB;AAAA,IAC1B,GAAG,wBAAwB;AAAA,IAC3B,MAAM;AAAA,IACN,MAAM,CAAC,QAAQ;AAAA,EACjB;AAAA,EAKA,IAAI,SAAsB;AACxB,WAAO,KAAK,MAAM;AAAA,EACpB;AACF;",
+  "names": []
+}