@studiometa/ui 0.2.12 → 0.2.14

package/atoms/Prefetch/AbstractPrefetch.cjs

@@ -21,19 +21,19 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 
-// packages/ui/atoms/Prefetch/AbstractPrefetch.js
+// packages/ui/atoms/Prefetch/AbstractPrefetch.ts
 var AbstractPrefetch_exports = {};
 __export(AbstractPrefetch_exports, {
-  default: () => AbstractPrefetch
+  AbstractPrefetch: () => AbstractPrefetch
 });
 module.exports = __toCommonJS(AbstractPrefetch_exports);
 var import_js_toolkit = require("@studiometa/js-toolkit");
 var _AbstractPrefetch = class extends import_js_toolkit.Base {
-  isPrefetchable(url, options) {
+  isPrefetchable(url) {
     if (!url || !url.href) {
       return false;
     }
-    if (!options.prefetch) {
+    if (!this.$options.prefetch) {
       return false;
     }
     if (url.origin !== window.location.origin) {
@@ -54,13 +54,13 @@ var _AbstractPrefetch = class extends import_js_toolkit.Base {
     if (_AbstractPrefetch.prefetchedUrls.has(url.href)) {
       return;
     }
-    if (!this.isPrefetchable(url, this.$options)) {
+    if (!this.isPrefetchable(url)) {
       return;
     }
     const prefetcher = document.createElement("link");
     prefetcher.rel = "prefetch";
     prefetcher.href = url.href;
-    document.head.appendChild(prefetcher);
+    document.head.append(prefetcher);
     _AbstractPrefetch.prefetchedUrls.add(url.href);
     this.$terminate();
   }

package/atoms/Prefetch/AbstractPrefetch.d.ts

@@ -1,52 +1,29 @@
-/**
- * @typedef {{ prefetch: boolean }} PrefetchOptions
- */
-/**
- * @typedef {AbstractPrefetch & {
- *   $options: PrefetchOptions
- * }} AbstractPrefetchInterface
- */
+import { Base } from '@studiometa/js-toolkit';
+import type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';
+export interface AbstractPrefetchProps extends BaseProps {
+    $el: HTMLAnchorElement;
+    $options: {
+        prefetch: boolean;
+    };
+}
 /**
  * AbstractPrefetch class.
  */
-export default class AbstractPrefetch extends Base {
+export declare class AbstractPrefetch<T extends BaseProps = BaseProps> extends Base<T & AbstractPrefetchProps> {
     /**
      * Config.
      */
-    static config: {
-        name: string;
-        options: {
-            prefetch: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-        };
-    };
+    static config: BaseConfig;
     /**
      * Store prefetched URL.
-     * @type {Set<string>}
      */
     static prefetchedUrls: Set<string>;
     /**
      * Is the given anchor prefetchable?
-     * @param   {URL}  url
-     * @param   {PrefetchOptions} options
-     * @returns {boolean}
      */
-    isPrefetchable(url: URL, options: PrefetchOptions): boolean;
+    isPrefetchable(url: URL): boolean;
     /**
      * Prefetch the given URL and terminate the component.
-     *
-     * @this  {AbstractPrefetchInterface}
-     * @param {URL} url
-     * @returns {void}
      */
-    prefetch(this: AbstractPrefetchInterface, url: URL): void;
+    prefetch(url: URL): void;
 }
-export type PrefetchOptions = {
-    prefetch: boolean;
-};
-export type AbstractPrefetchInterface = AbstractPrefetch & {
-    $options: PrefetchOptions;
-};
-import { Base } from "@studiometa/js-toolkit";

package/atoms/Prefetch/AbstractPrefetch.js

@@ -1 +1,58 @@
-import{Base as n}from"@studiometa/js-toolkit";class r extends n{static config={name:"AbstractPrefetch",options:{prefetch:{type:Boolean,default:!0}}};static prefetchedUrls=new Set;isPrefetchable(e,t){return!(!e||!e.href||!t.prefetch||e.origin!==window.location.origin||!["http:","https:"].includes(e.protocol)||e.protocol==="http:"&&window.location.protocol==="https:"||e.hash&&e.pathname+e.search===window.location.pathname+window.location.search)}prefetch(e){if(r.prefetchedUrls.has(e.href)||!this.isPrefetchable(e,this.$options))return;const t=document.createElement("link");t.rel="prefetch",t.href=e.href,document.head.appendChild(t),r.prefetchedUrls.add(e.href),this.$terminate()}}export{r as default};
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import { Base } from "@studiometa/js-toolkit";
+const _AbstractPrefetch = class extends Base {
+  isPrefetchable(url) {
+    if (!url || !url.href) {
+      return false;
+    }
+    if (!this.$options.prefetch) {
+      return false;
+    }
+    if (url.origin !== window.location.origin) {
+      return false;
+    }
+    if (!["http:", "https:"].includes(url.protocol)) {
+      return false;
+    }
+    if (url.protocol === "http:" && window.location.protocol === "https:") {
+      return false;
+    }
+    if (url.hash && url.pathname + url.search === window.location.pathname + window.location.search) {
+      return false;
+    }
+    return true;
+  }
+  prefetch(url) {
+    if (_AbstractPrefetch.prefetchedUrls.has(url.href)) {
+      return;
+    }
+    if (!this.isPrefetchable(url)) {
+      return;
+    }
+    const prefetcher = document.createElement("link");
+    prefetcher.rel = "prefetch";
+    prefetcher.href = url.href;
+    document.head.append(prefetcher);
+    _AbstractPrefetch.prefetchedUrls.add(url.href);
+    this.$terminate();
+  }
+};
+let AbstractPrefetch = _AbstractPrefetch;
+__publicField(AbstractPrefetch, "config", {
+  name: "AbstractPrefetch",
+  options: {
+    prefetch: {
+      type: Boolean,
+      default: true
+    }
+  }
+});
+__publicField(AbstractPrefetch, "prefetchedUrls", /* @__PURE__ */ new Set());
+export {
+  AbstractPrefetch
+};

package/atoms/Prefetch/PrefetchWhenOver.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,27 +15,26 @@ 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/Prefetch/PrefetchWhenOver.js
+// packages/ui/atoms/Prefetch/PrefetchWhenOver.ts
 var PrefetchWhenOver_exports = {};
 __export(PrefetchWhenOver_exports, {
-  default: () => PrefetchWhenOver
+  PrefetchWhenOver: () => PrefetchWhenOver
 });
 module.exports = __toCommonJS(PrefetchWhenOver_exports);
-var import_AbstractPrefetch = __toESM(require("./AbstractPrefetch.cjs"), 1);
-var PrefetchWhenOver = class extends import_AbstractPrefetch.default {
+var import_AbstractPrefetch = require("./AbstractPrefetch.cjs");
+var PrefetchWhenOver = class extends import_AbstractPrefetch.AbstractPrefetch {
   onMouseenter() {
     this.prefetch(new URL(this.$el.href));
   }
 };
 __publicField(PrefetchWhenOver, "config", {
-  ...import_AbstractPrefetch.default.config,
+  ...import_AbstractPrefetch.AbstractPrefetch.config,
   name: "PrefetchWhenOver"
 });
 if (module.exports.default) module.exports = module.exports.default;

package/atoms/Prefetch/PrefetchWhenOver.d.ts

@@ -1,21 +1,15 @@
-/**
- * @typedef {PrefetchWhenOver & {
- *   $el: HTMLAnchorElement
- * }} PrefetchWhenOverInterface
- */
+import type { BaseProps, BaseConfig } from '@studiometa/js-toolkit';
+import { AbstractPrefetch } from './AbstractPrefetch.js';
 /**
  * PrefetchWhenOver class.
  */
-export default class PrefetchWhenOver extends AbstractPrefetch {
+export declare class PrefetchWhenOver<T extends BaseProps = BaseProps> extends AbstractPrefetch<T> {
+    /**
+     * Config.
+     */
+    static config: BaseConfig;
     /**
      * Prefetch on mouseenter.
-     *
-     * @this    {PrefetchWhenOverInterface}
-     * @returns {void}
      */
-    onMouseenter(this: PrefetchWhenOverInterface): void;
+    onMouseenter(): void;
 }
-export type PrefetchWhenOverInterface = PrefetchWhenOver & {
-    $el: HTMLAnchorElement;
-};
-import AbstractPrefetch from "./AbstractPrefetch.js";

package/atoms/Prefetch/PrefetchWhenOver.js

@@ -1 +1,19 @@
-import e from"./AbstractPrefetch.js";class t extends e{static config={...e.config,name:"PrefetchWhenOver"};onMouseenter(){this.prefetch(new URL(this.$el.href))}}export{t as default};
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import { AbstractPrefetch } from "./AbstractPrefetch.js";
+class PrefetchWhenOver extends AbstractPrefetch {
+  onMouseenter() {
+    this.prefetch(new URL(this.$el.href));
+  }
+}
+__publicField(PrefetchWhenOver, "config", {
+  ...AbstractPrefetch.config,
+  name: "PrefetchWhenOver"
+});
+export {
+  PrefetchWhenOver
+};

package/atoms/Prefetch/PrefetchWhenVisible.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,28 +15,27 @@ 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/Prefetch/PrefetchWhenVisible.js
+// packages/ui/atoms/Prefetch/PrefetchWhenVisible.ts
 var PrefetchWhenVisible_exports = {};
 __export(PrefetchWhenVisible_exports, {
-  default: () => PrefetchWhenVisible
+  PrefetchWhenVisible: () => PrefetchWhenVisible
 });
 module.exports = __toCommonJS(PrefetchWhenVisible_exports);
 var import_js_toolkit = require("@studiometa/js-toolkit");
-var import_AbstractPrefetch = __toESM(require("./AbstractPrefetch.cjs"), 1);
-var PrefetchWhenVisible = class extends (0, import_js_toolkit.withMountWhenInView)(import_AbstractPrefetch.default) {
+var import_AbstractPrefetch = require("./AbstractPrefetch.cjs");
+var PrefetchWhenVisible = class extends (0, import_js_toolkit.withMountWhenInView)(import_AbstractPrefetch.AbstractPrefetch) {
   mounted() {
     this.prefetch(new URL(this.$el.href));
   }
 };
 __publicField(PrefetchWhenVisible, "config", {
-  ...import_AbstractPrefetch.default.config,
+  ...import_AbstractPrefetch.AbstractPrefetch.config,
   name: "PrefetchWhenVisible"
 });
 if (module.exports.default) module.exports = module.exports.default;

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,20 @@
-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};
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import { withMountWhenInView } from "@studiometa/js-toolkit";
+import { AbstractPrefetch } from "./AbstractPrefetch.js";
+class PrefetchWhenVisible extends withMountWhenInView(AbstractPrefetch) {
+  mounted() {
+    this.prefetch(new URL(this.$el.href));
+  }
+}
+__publicField(PrefetchWhenVisible, "config", {
+  ...AbstractPrefetch.config,
+  name: "PrefetchWhenVisible"
+});
+export {
+  PrefetchWhenVisible
+};

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,13 @@ 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;

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,3 @@
-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";

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: () => ({})

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,67 @@
-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};
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import { Base, withFreezedOptions } from "@studiometa/js-toolkit";
+import { map, clamp, animate } from "@studiometa/js-toolkit/utils";
+class AbstractScrollAnimation extends withFreezedOptions(Base) {
+  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);
+  }
+}
+__publicField(AbstractScrollAnimation, "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]
+    }
+  }
+});
+export {
+  AbstractScrollAnimation
+};