@studiometa/ui 0.2.13 → 0.2.15

package/atoms/Figure/Figure.d.ts

@@ -1,72 +1,37 @@
-declare const Figure_base: typeof import("@studiometa/js-toolkit").Base & (new (...a: any[]) => {
-    readonly target: HTMLElement | HTMLElement[];
-    enter(target?: HTMLElement | HTMLElement[]): Promise<void | void[]>;
-    leave(target?: HTMLElement | HTMLElement[]): Promise<void | void[]>;
-});
-/**
- * @typedef {Figure & {
- *   $refs: {
- *     img: HTMLImageElement
- *   },
- *   $options: {
- *     lazy: boolean
- *   }
- * }} FigureInterface
- */
+import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';
+import { Transition } from '../../primitives/index.js';
+export interface FigureProps extends BaseProps {
+    $refs: {
+        img: HTMLImageElement;
+    };
+    $options: {
+        lazy: boolean;
+    };
+}
+declare const Figure_base: import("@studiometa/js-toolkit").BaseDecorator<import("@studiometa/js-toolkit").WithMountWhenInViewInterface, Transition<BaseProps>, import("@studiometa/js-toolkit").WithMountWhenInViewProps>;
 /**
  * Figure class.
- *
- * Manager lazyloading image sources.
  */
-export default class Figure extends Figure_base {
+export declare class Figure<T extends BaseProps = BaseProps> extends Figure_base<T & FigureProps> {
     /**
      * Config.
      */
-    static config: {
-        name: string;
-        refs: string[];
-        options: {
-            lazy: BooleanConstructor;
-        };
-        debug?: boolean;
-        log?: boolean;
-        emits?: string[];
-        components?: import("@studiometa/js-toolkit/Base/index.js").BaseConfigComponents;
-    };
+    static config: BaseConfig;
     /**
      * Get the transition target.
-     *
-     * @this {FigureInterface}
-     * @returns {HTMLImageElement}
      */
     get target(): HTMLImageElement;
-    /**
-     * Set the image source.
-     *
-     * @this {FigureInterface}
-     * @param   {string} value
-     * @returns {void}
-     */
-    set src(arg: string);
     /**
      * Get the image source.
-     *
-     * @this {FigureInterface}
-     * @returns {string}
      */
     get src(): string;
+    /**
+     * Set the image source.
+     */
+    set src(value: string);
     /**
      * Load on mount.
-     * @this {FigureInterface}
      */
-    mounted(this: FigureInterface): void;
+    mounted(): void;
 }
-export type FigureInterface = Figure & {
-    $refs: {
-        img: HTMLImageElement;
-    };
-    $options: {
-        lazy: boolean;
-    };
-};
 export {};

package/atoms/Figure/Figure.js

@@ -1 +1,51 @@
-import{withMountWhenInView as s}from"@studiometa/js-toolkit";import{Transition as i}from"../../primitives/index.js";class n extends s(i,{threshold:[0,1]}){static config={...i.config,name:"Figure",refs:["img"],options:{...i.config.options,lazy:Boolean}};get target(){return this.$refs.img}get src(){return this.$refs.img.src}set src(e){this.$refs.img.src=e}mounted(){const{img:e}=this.$refs;if(!e)throw new Error("[Figure] The `img` ref is required.");if(!(e instanceof HTMLImageElement))throw new Error("[Figure] The `img` ref must be an `<img>` element.");const t=e.getAttribute("data-src");if(this.$options.lazy&&t&&t!==this.src){let r=new Image;r.onload=()=>{this.enter(),this.src=t,r=null},r.src=t}}}export{n as default};
+import { withMountWhenInView } from "@studiometa/js-toolkit";
+import { Transition } from "../../primitives/index.js";
+class Figure extends withMountWhenInView(Transition, {
+  threshold: [0, 1]
+}) {
+  static config = {
+    ...Transition.config,
+    name: "Figure",
+    refs: ["img"],
+    options: {
+      ...Transition.config.options,
+      lazy: Boolean
+    }
+  };
+  get target() {
+    return this.$refs.img;
+  }
+  get src() {
+    return this.$refs.img.src;
+  }
+  set src(value) {
+    this.$refs.img.src = value;
+  }
+  mounted() {
+    const { img } = this.$refs;
+    if (!img) {
+      throw new Error("[Figure] The `img` ref is required.");
+    }
+    if (!(img instanceof HTMLImageElement)) {
+      throw new Error("[Figure] The `img` ref must be an `<img>` element.");
+    }
+    const { src } = img.dataset;
+    if (this.$options.lazy && src && src !== this.src) {
+      let tempImg = new Image();
+      tempImg.addEventListener(
+        "load",
+        async () => {
+          this.src = src;
+          tempImg = null;
+          this.enter();
+        },
+        { once: true }
+      );
+      tempImg.src = src;
+    }
+  }
+}
+export {
+  Figure
+};
+//# sourceMappingURL=Figure.js.map

package/atoms/Figure/Figure.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/Figure/Figure.ts"],
+  "sourcesContent": ["import { withMountWhenInView } from '@studiometa/js-toolkit';\nimport type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { Transition } from '../../primitives/index.js';\n\nexport interface FigureProps extends BaseProps {\n  $refs: {\n    img: HTMLImageElement;\n  };\n  $options: {\n    lazy: boolean;\n  };\n}\n\n/**\n * Figure class.\n */\nexport class Figure<T extends BaseProps = BaseProps> extends withMountWhenInView<Transition>(Transition, {\n  threshold: [0, 1],\n})<T & FigureProps> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    ...Transition.config,\n    name: 'Figure',\n    refs: ['img'],\n    options: {\n      ...Transition.config.options,\n      lazy: Boolean,\n    },\n  };\n\n  /**\n   * Get the transition target.\n   */\n  get target() {\n    return this.$refs.img;\n  }\n\n  /**\n   * Get the image source.\n   */\n  get src() {\n    return this.$refs.img.src;\n  }\n\n  /**\n   * Set the image source.\n   */\n  set src(value:string) {\n    this.$refs.img.src = value;\n  }\n\n  /**\n   * Load on mount.\n   */\n  mounted() {\n    const { img } = this.$refs;\n\n    if (!img) {\n      throw new Error('[Figure] The `img` ref is required.');\n    }\n\n    if (!(img instanceof HTMLImageElement)) {\n      throw new Error('[Figure] The `img` ref must be an `<img>` element.');\n    }\n\n    const { src } = img.dataset;\n\n    if (this.$options.lazy && src && src !== this.src) {\n      let tempImg = new Image();\n      tempImg.addEventListener(\n        'load',\n        async () => {\n          this.src = src;\n          tempImg = null;\n          this.enter();\n        },\n        { once: true },\n      );\n      tempImg.src = src;\n    }\n  }\n}\n"],
+  "mappings": "AAAA,SAAS,2BAA2B;AAEpC,SAAS,kBAAkB;AAcpB,MAAM,eAAgD,oBAAgC,YAAY;AAAA,EACvG,WAAW,CAAC,GAAG,CAAC;AAClB,CAAC,EAAmB;AAAA,EAIlB,OAAO,SAAqB;AAAA,IAC1B,GAAG,WAAW;AAAA,IACd,MAAM;AAAA,IACN,MAAM,CAAC,KAAK;AAAA,IACZ,SAAS;AAAA,MACP,GAAG,WAAW,OAAO;AAAA,MACrB,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EAKA,IAAI,SAAS;AACX,WAAO,KAAK,MAAM;AAAA,EACpB;AAAA,EAKA,IAAI,MAAM;AACR,WAAO,KAAK,MAAM,IAAI;AAAA,EACxB;AAAA,EAKA,IAAI,IAAI,OAAc;AACpB,SAAK,MAAM,IAAI,MAAM;AAAA,EACvB;AAAA,EAKA,UAAU;AACR,UAAM,EAAE,IAAI,IAAI,KAAK;AAErB,QAAI,CAAC,KAAK;AACR,YAAM,IAAI,MAAM,qCAAqC;AAAA,IACvD;AAEA,QAAI,EAAE,eAAe,mBAAmB;AACtC,YAAM,IAAI,MAAM,oDAAoD;AAAA,IACtE;AAEA,UAAM,EAAE,IAAI,IAAI,IAAI;AAEpB,QAAI,KAAK,SAAS,QAAQ,OAAO,QAAQ,KAAK,KAAK;AACjD,UAAI,UAAU,IAAI,MAAM;AACxB,cAAQ;AAAA,QACN;AAAA,QACA,YAAY;AACV,eAAK,MAAM;AACX,oBAAU;AACV,eAAK,MAAM;AAAA,QACb;AAAA,QACA,EAAE,MAAM,KAAK;AAAA,MACf;AACA,cAAQ,MAAM;AAAA,IAChB;AAAA,EACF;AACF;",
+  "names": []
+}

package/atoms/Figure/FigureTwicPics.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,25 +15,24 @@ 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/Figure/FigureTwicPics.js
+// packages/ui/atoms/Figure/FigureTwicPics.ts
 var FigureTwicPics_exports = {};
 __export(FigureTwicPics_exports, {
-  default: () => FigureTwicPics
+  FigureTwicPics: () => FigureTwicPics
 });
 module.exports = __toCommonJS(FigureTwicPics_exports);
-var import_Figure = __toESM(require("./Figure.cjs"), 1);
+var import_Figure = require("./Figure.cjs");
 function normalizeSize(that, prop) {
   const { step } = that.$options;
   return Math.ceil(that.$refs.img[prop] / step) * step;
 }
-var FigureTwicPics = class extends import_Figure.default {
+var FigureTwicPics = class extends import_Figure.Figure {
   get domain() {
     const url = new URL(this.$refs.img.dataset.src);
     return url.host;
@@ -45,7 +42,10 @@ var FigureTwicPics = class extends import_Figure.default {
     url.host = this.domain;
     const width = normalizeSize(this, "offsetWidth");
     const height = normalizeSize(this, "offsetHeight");
-    url.searchParams.set("twic", ["v1", this.$options.transform, `${this.$options.mode}=${width}x${height}`].filter(Boolean).join("/"));
+    url.searchParams.set(
+      "twic",
+      ["v1", this.$options.transform, `${this.$options.mode}=${width}x${height}`].filter(Boolean).join("/")
+    );
     url.search = decodeURIComponent(url.search);
     super.src = url.toString();
   }
@@ -54,10 +54,10 @@ var FigureTwicPics = class extends import_Figure.default {
   }
 };
 __publicField(FigureTwicPics, "config", {
-  ...import_Figure.default.config,
+  ...import_Figure.Figure.config,
   name: "FigureTwicPics",
   options: {
-    ...import_Figure.default.config.options,
+    ...import_Figure.Figure.config.options,
     transform: String,
     step: {
       type: Number,
@@ -70,3 +70,4 @@ __publicField(FigureTwicPics, "config", {
   }
 });
 if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=FigureTwicPics.cjs.map

package/atoms/Figure/FigureTwicPics.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/Figure/FigureTwicPics.ts"],
+  "sourcesContent": ["import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { Figure } from './Figure.js';\n\nexport interface FigureTwicPicsProps extends BaseProps {\n  $options: {\n    transform: string;\n    step: number;\n    mode: string;\n  };\n}\n\n/**\n * Normalize the given size to the step option.\n */\n// eslint-disable-next-line no-use-before-define\nfunction normalizeSize(that:FigureTwicPics, prop:string):number {\n  const { step } = that.$options;\n  return Math.ceil(that.$refs.img[prop] / step) * step;\n}\n\n/**\n * Figure class.\n *\n * Manager lazyloading image sources.\n */\nexport class FigureTwicPics<T extends BaseProps = BaseProps> extends Figure<T & FigureTwicPicsProps> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    ...Figure.config,\n    name: 'FigureTwicPics',\n    options: {\n      ...Figure.config.options,\n      transform: String,\n      step: {\n        type: Number,\n        default: 50,\n      },\n      mode: {\n        type: String,\n        default: 'cover',\n      },\n    },\n  };\n\n  /**\n   * Get the TwicPics domain.\n   */\n  get domain():string {\n    const url = new URL(this.$refs.img.dataset.src);\n    return url.host;\n  }\n\n  /**\n   * Add TwicPics transforms and domain to the URL.\n   */\n  set src(value:string) {\n    const url = new URL(value, window.location.origin);\n    url.host = this.domain;\n\n    const width = normalizeSize(this, 'offsetWidth');\n    const height = normalizeSize(this, 'offsetHeight');\n\n    url.searchParams.set(\n      'twic',\n      ['v1', this.$options.transform, `${this.$options.mode}=${width}x${height}`]\n        .filter(Boolean)\n        .join('/'),\n    );\n\n    url.search = decodeURIComponent(url.search);\n\n    super.src = url.toString();\n  }\n\n  /**\n   * Reassign the source from the original on resized.\n   */\n  resized() {\n    this.src = this.$refs.img.dataset.src;\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,oBAAuB;AAcvB,SAAS,cAAc,MAAqB,MAAoB;AAC9D,QAAM,EAAE,KAAK,IAAI,KAAK;AACtB,SAAO,KAAK,KAAK,KAAK,MAAM,IAAI,QAAQ,IAAI,IAAI;AAClD;AAOO,IAAM,iBAAN,cAA8D,qBAAgC;AAAA,EAwBnG,IAAI,SAAgB;AAClB,UAAM,MAAM,IAAI,IAAI,KAAK,MAAM,IAAI,QAAQ,GAAG;AAC9C,WAAO,IAAI;AAAA,EACb;AAAA,EAKA,IAAI,IAAI,OAAc;AACpB,UAAM,MAAM,IAAI,IAAI,OAAO,OAAO,SAAS,MAAM;AACjD,QAAI,OAAO,KAAK;AAEhB,UAAM,QAAQ,cAAc,MAAM,aAAa;AAC/C,UAAM,SAAS,cAAc,MAAM,cAAc;AAEjD,QAAI,aAAa;AAAA,MACf;AAAA,MACA,CAAC,MAAM,KAAK,SAAS,WAAW,GAAG,KAAK,SAAS,QAAQ,SAAS,QAAQ,EACvE,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,IACb;AAEA,QAAI,SAAS,mBAAmB,IAAI,MAAM;AAE1C,UAAM,MAAM,IAAI,SAAS;AAAA,EAC3B;AAAA,EAKA,UAAU;AACR,SAAK,MAAM,KAAK,MAAM,IAAI,QAAQ;AAAA,EACpC;AACF;AArDE,cAJW,gBAIJ,UAAqB;AAAA,EAC1B,GAAG,qBAAO;AAAA,EACV,MAAM;AAAA,EACN,SAAS;AAAA,IACP,GAAG,qBAAO,OAAO;AAAA,IACjB,WAAW;AAAA,IACX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;",
+  "names": []
+}

package/atoms/Figure/FigureTwicPics.d.ts

@@ -1,53 +1,32 @@
+import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';
+import { Figure } from './Figure.js';
+export interface FigureTwicPicsProps extends BaseProps {
+    $options: {
+        transform: string;
+        step: number;
+        mode: string;
+    };
+}
 /**
  * Figure class.
  *
  * Manager lazyloading image sources.
  */
-export default class FigureTwicPics extends Figure {
+export declare class FigureTwicPics<T extends BaseProps = BaseProps> extends Figure<T & FigureTwicPicsProps> {
     /**
      * Config.
      */
-    static config: {
-        name: string;
-        options: {
-            transform: StringConstructor;
-            step: {
-                type: NumberConstructor;
-                default: number;
-            };
-            mode: {
-                type: StringConstructor;
-                default: string;
-            };
-            lazy: BooleanConstructor;
-        };
-        refs: string[];
-        debug?: boolean;
-        log?: boolean;
-        emits?: string[];
-        components?: import("@studiometa/js-toolkit/Base/index.js").BaseConfigComponents;
-    };
+    static config: BaseConfig;
     /**
      * Get the TwicPics domain.
-     *
-     * @this {FigureTwicPicsInterface}
-     * @returns {string}
      */
     get domain(): string;
+    /**
+     * Add TwicPics transforms and domain to the URL.
+     */
+    set src(value: string);
     /**
      * Reassign the source from the original on resized.
-     *
-     * @this {FigureTwicPicsInterface}
-     * @returns {void}
      */
-    resized(this: FigureTwicPicsInterface): void;
+    resized(): void;
 }
-export type FigureInterface = import('./Figure.js').FigureInterface;
-export type FigureTwicPicsInterface = FigureTwicPics & FigureInterface & {
-    $options: {
-        transform: string;
-        step: number;
-        mode: string;
-    };
-};
-import Figure from "./Figure.js";

package/atoms/Figure/FigureTwicPics.js

@@ -1 +1,46 @@
-import e from"./Figure.js";function o(i,s){const{step:t}=i.$options;return Math.ceil(i.$refs.img[s]/t)*t}class c extends e{static config={...e.config,name:"FigureTwicPics",options:{...e.config.options,transform:String,step:{type:Number,default:50},mode:{type:String,default:"cover"}}};get domain(){return new URL(this.$refs.img.dataset.src).host}set src(s){const t=new URL(s,window.location.origin);t.host=this.domain;const r=o(this,"offsetWidth"),n=o(this,"offsetHeight");t.searchParams.set("twic",["v1",this.$options.transform,`${this.$options.mode}=${r}x${n}`].filter(Boolean).join("/")),t.search=decodeURIComponent(t.search),super.src=t.toString()}resized(){this.src=this.$refs.img.dataset.src}}export{c as default};
+import { Figure } from "./Figure.js";
+function normalizeSize(that, prop) {
+  const { step } = that.$options;
+  return Math.ceil(that.$refs.img[prop] / step) * step;
+}
+class FigureTwicPics extends Figure {
+  static config = {
+    ...Figure.config,
+    name: "FigureTwicPics",
+    options: {
+      ...Figure.config.options,
+      transform: String,
+      step: {
+        type: Number,
+        default: 50
+      },
+      mode: {
+        type: String,
+        default: "cover"
+      }
+    }
+  };
+  get domain() {
+    const url = new URL(this.$refs.img.dataset.src);
+    return url.host;
+  }
+  set src(value) {
+    const url = new URL(value, window.location.origin);
+    url.host = this.domain;
+    const width = normalizeSize(this, "offsetWidth");
+    const height = normalizeSize(this, "offsetHeight");
+    url.searchParams.set(
+      "twic",
+      ["v1", this.$options.transform, `${this.$options.mode}=${width}x${height}`].filter(Boolean).join("/")
+    );
+    url.search = decodeURIComponent(url.search);
+    super.src = url.toString();
+  }
+  resized() {
+    this.src = this.$refs.img.dataset.src;
+  }
+}
+export {
+  FigureTwicPics
+};
+//# sourceMappingURL=FigureTwicPics.js.map

package/atoms/Figure/FigureTwicPics.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/Figure/FigureTwicPics.ts"],
+  "sourcesContent": ["import type { BaseConfig, BaseProps } from '@studiometa/js-toolkit';\nimport { Figure } from './Figure.js';\n\nexport interface FigureTwicPicsProps extends BaseProps {\n  $options: {\n    transform: string;\n    step: number;\n    mode: string;\n  };\n}\n\n/**\n * Normalize the given size to the step option.\n */\n// eslint-disable-next-line no-use-before-define\nfunction normalizeSize(that:FigureTwicPics, prop:string):number {\n  const { step } = that.$options;\n  return Math.ceil(that.$refs.img[prop] / step) * step;\n}\n\n/**\n * Figure class.\n *\n * Manager lazyloading image sources.\n */\nexport class FigureTwicPics<T extends BaseProps = BaseProps> extends Figure<T & FigureTwicPicsProps> {\n  /**\n   * Config.\n   */\n  static config: BaseConfig = {\n    ...Figure.config,\n    name: 'FigureTwicPics',\n    options: {\n      ...Figure.config.options,\n      transform: String,\n      step: {\n        type: Number,\n        default: 50,\n      },\n      mode: {\n        type: String,\n        default: 'cover',\n      },\n    },\n  };\n\n  /**\n   * Get the TwicPics domain.\n   */\n  get domain():string {\n    const url = new URL(this.$refs.img.dataset.src);\n    return url.host;\n  }\n\n  /**\n   * Add TwicPics transforms and domain to the URL.\n   */\n  set src(value:string) {\n    const url = new URL(value, window.location.origin);\n    url.host = this.domain;\n\n    const width = normalizeSize(this, 'offsetWidth');\n    const height = normalizeSize(this, 'offsetHeight');\n\n    url.searchParams.set(\n      'twic',\n      ['v1', this.$options.transform, `${this.$options.mode}=${width}x${height}`]\n        .filter(Boolean)\n        .join('/'),\n    );\n\n    url.search = decodeURIComponent(url.search);\n\n    super.src = url.toString();\n  }\n\n  /**\n   * Reassign the source from the original on resized.\n   */\n  resized() {\n    this.src = this.$refs.img.dataset.src;\n  }\n}\n"],
+  "mappings": "AACA,SAAS,cAAc;AAcvB,SAAS,cAAc,MAAqB,MAAoB;AAC9D,QAAM,EAAE,KAAK,IAAI,KAAK;AACtB,SAAO,KAAK,KAAK,KAAK,MAAM,IAAI,QAAQ,IAAI,IAAI;AAClD;AAOO,MAAM,uBAAwD,OAAgC;AAAA,EAInG,OAAO,SAAqB;AAAA,IAC1B,GAAG,OAAO;AAAA,IACV,MAAM;AAAA,IACN,SAAS;AAAA,MACP,GAAG,OAAO,OAAO;AAAA,MACjB,WAAW;AAAA,MACX,MAAM;AAAA,QACJ,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,MACA,MAAM;AAAA,QACJ,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA,EAKA,IAAI,SAAgB;AAClB,UAAM,MAAM,IAAI,IAAI,KAAK,MAAM,IAAI,QAAQ,GAAG;AAC9C,WAAO,IAAI;AAAA,EACb;AAAA,EAKA,IAAI,IAAI,OAAc;AACpB,UAAM,MAAM,IAAI,IAAI,OAAO,OAAO,SAAS,MAAM;AACjD,QAAI,OAAO,KAAK;AAEhB,UAAM,QAAQ,cAAc,MAAM,aAAa;AAC/C,UAAM,SAAS,cAAc,MAAM,cAAc;AAEjD,QAAI,aAAa;AAAA,MACf;AAAA,MACA,CAAC,MAAM,KAAK,SAAS,WAAW,GAAG,KAAK,SAAS,QAAQ,SAAS,QAAQ,EACvE,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,IACb;AAEA,QAAI,SAAS,mBAAmB,IAAI,MAAM;AAE1C,UAAM,MAAM,IAAI,SAAS;AAAA,EAC3B;AAAA,EAKA,UAAU;AACR,SAAK,MAAM,KAAK,MAAM,IAAI,QAAQ;AAAA,EACpC;AACF;",
+  "names": []
+}

package/atoms/Figure/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,16 +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/Figure/index.js
+// packages/ui/atoms/Figure/index.ts
 var Figure_exports = {};
-__export(Figure_exports, {
-  Figure: () => import_Figure.default,
-  FigureTwicPics: () => import_FigureTwicPics.default
-});
 module.exports = __toCommonJS(Figure_exports);
-var import_Figure = __toESM(require("./Figure.cjs"), 1);
-var import_FigureTwicPics = __toESM(require("./FigureTwicPics.cjs"), 1);
+__reExport(Figure_exports, require("./Figure.cjs"), module.exports);
+__reExport(Figure_exports, require("./FigureTwicPics.cjs"), module.exports);
 if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=index.cjs.map

package/atoms/Figure/index.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/Figure/index.ts"],
+  "sourcesContent": ["export * from './Figure.js';\nexport * from './FigureTwicPics.js';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,2BAAc,yBAAd;AACA,2BAAc,iCADd;",
+  "names": []
+}

package/atoms/Figure/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Figure } from "./Figure.js";
-export { default as FigureTwicPics } from "./FigureTwicPics.js";
+export * from './Figure.js';
+export * from './FigureTwicPics.js';

package/atoms/Figure/index.js

@@ -1 +1,3 @@
-import{default as a}from"./Figure.js";import{default as i}from"./FigureTwicPics.js";export{a as Figure,i as FigureTwicPics};
+export * from "./Figure.js";
+export * from "./FigureTwicPics.js";
+//# sourceMappingURL=index.js.map

package/atoms/Figure/index.js.map

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

package/atoms/LargeText/LargeText.cjs

@@ -21,10 +21,10 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 
-// packages/ui/atoms/LargeText/LargeText.js
+// packages/ui/atoms/LargeText/LargeText.ts
 var LargeText_exports = {};
 __export(LargeText_exports, {
-  default: () => LargeText
+  LargeText: () => LargeText
 });
 module.exports = __toCommonJS(LargeText_exports);
 var import_js_toolkit = require("@studiometa/js-toolkit");
@@ -50,7 +50,11 @@ var LargeText = class extends (0, import_js_toolkit.withMountWhenInView)(import_
     this.x -= (Math.abs(this.deltaY) + 1) * this.$options.sensitivity;
     this.transform.x = (0, import_utils.damp)(this.x, this.transform.x, 0.25);
     if (this.$options.skew) {
-      this.transform.skewX = (0, import_utils.damp)((0, import_utils.clamp)(this.deltaY * -1, -50, 50) * this.$options.skewSensitivity, this.transform.skewX, 0.25);
+      this.transform.skewX = (0, import_utils.damp)(
+        (0, import_utils.clamp)(this.deltaY * -1, -50, 50) * this.$options.skewSensitivity,
+        this.transform.skewX,
+        0.25
+      );
     }
     if (this.x <= this.width * -1) {
       this.x = 0;
@@ -80,3 +84,4 @@ __publicField(LargeText, "config", {
   }
 });
 if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=LargeText.cjs.map

package/atoms/LargeText/LargeText.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/LargeText/LargeText.ts"],
+  "sourcesContent": ["import { Base, withMountWhenInView } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseInterface, ScrollServiceProps } from '@studiometa/js-toolkit';\nimport { damp, clamp, transform } from '@studiometa/js-toolkit/utils';\n\nexport interface LargeTextProps extends BaseProps {\n  $refs: {\n    target: HTMLElement;\n  };\n  $options: {\n    skew: boolean;\n    sensitivity: number;\n    skewSensitivity: number;\n  };\n}\n\n/**\n * Large text class.\n */\nexport class LargeText<T extends BaseProps = BaseProps>\n  extends withMountWhenInView(Base, { rootMargin: '50%' })<T & LargeTextProps>\n  implements BaseInterface {\n  /**\n   * Config.\n   */\n  static config = {\n    name: 'LargeText',\n    refs: ['target'],\n    options: {\n      skew: Boolean,\n      sensitivity: {\n        type: Number,\n        default: 1,\n      },\n      skewSensitivity: {\n        type: Number,\n        default: 1,\n      },\n    },\n  };\n\n  /**\n   * Translate X.\n   */\n  x = 0;\n\n  /**\n   * Scroll delta Y.\n   */\n  deltaY = 0;\n\n  /**\n   * Transform values.\n   */\n  transform = {\n    skewX: 0,\n    x: 0,\n  };\n\n  /**\n   * Target width.\n   */\n  width = 0;\n\n  /**\n   * Set width on mount.\n   */\n  mounted() {\n    this.width = this.$refs.target.clientWidth;\n  }\n\n  /**\n   * Set width on resize.\n   */\n  resized() {\n    this.width = this.$refs.target.clientWidth;\n  }\n\n  /**\n   * Update delta scroll on scroll.\n   */\n  scrolled(props: ScrollServiceProps) {\n    this.deltaY = props.delta.y;\n  }\n\n  /**\n   * Update values on raf.\n   */\n  ticked() {\n    this.x -= (Math.abs(this.deltaY) + 1) * this.$options.sensitivity;\n\n    this.transform.x = damp(this.x, this.transform.x, 0.25);\n\n    if (this.$options.skew) {\n      this.transform.skewX = damp(\n        clamp(this.deltaY * -1, -50, 50) * this.$options.skewSensitivity,\n        this.transform.skewX,\n        0.25,\n      );\n    }\n\n    if (this.x <= this.width * -1) {\n      this.x = 0;\n      this.transform.x += this.width;\n    } else if (this.$options.sensitivity < 0 && this.x >= this.width) {\n      this.x = 0;\n      this.transform.x -= this.width;\n    }\n\n    return () => {\n      transform(this.$refs.target, this.transform);\n    };\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAA0C;AAE1C,mBAAuC;AAgBhC,IAAM,YAAN,kBACG,uCAAoB,wBAAM,EAAE,YAAY,MAAM,CAAC,EAC9B;AAAA,EAuBzB,IAAI;AAAA,EAKJ,SAAS;AAAA,EAKT,YAAY;AAAA,IACV,OAAO;AAAA,IACP,GAAG;AAAA,EACL;AAAA,EAKA,QAAQ;AAAA,EAKR,UAAU;AACR,SAAK,QAAQ,KAAK,MAAM,OAAO;AAAA,EACjC;AAAA,EAKA,UAAU;AACR,SAAK,QAAQ,KAAK,MAAM,OAAO;AAAA,EACjC;AAAA,EAKA,SAAS,OAA2B;AAClC,SAAK,SAAS,MAAM,MAAM;AAAA,EAC5B;AAAA,EAKA,SAAS;AACP,SAAK,MAAM,KAAK,IAAI,KAAK,MAAM,IAAI,KAAK,KAAK,SAAS;AAEtD,SAAK,UAAU,QAAI,mBAAK,KAAK,GAAG,KAAK,UAAU,GAAG,IAAI;AAEtD,QAAI,KAAK,SAAS,MAAM;AACtB,WAAK,UAAU,YAAQ;AAAA,YACrB,oBAAM,KAAK,SAAS,IAAI,KAAK,EAAE,IAAI,KAAK,SAAS;AAAA,QACjD,KAAK,UAAU;AAAA,QACf;AAAA,MACF;AAAA,IACF;AAEA,QAAI,KAAK,KAAK,KAAK,QAAQ,IAAI;AAC7B,WAAK,IAAI;AACT,WAAK,UAAU,KAAK,KAAK;AAAA,IAC3B,WAAW,KAAK,SAAS,cAAc,KAAK,KAAK,KAAK,KAAK,OAAO;AAChE,WAAK,IAAI;AACT,WAAK,UAAU,KAAK,KAAK;AAAA,IAC3B;AAEA,WAAO,MAAM;AACX,kCAAU,KAAK,MAAM,QAAQ,KAAK,SAAS;AAAA,IAC7C;AAAA,EACF;AACF;AAxFE,cANW,WAMJ,UAAS;AAAA,EACd,MAAM;AAAA,EACN,MAAM,CAAC,QAAQ;AAAA,EACf,SAAS;AAAA,IACP,MAAM;AAAA,IACN,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AACF;",
+  "names": []
+}

package/atoms/LargeText/LargeText.d.ts

@@ -1,17 +1,20 @@
-/**
- * @typedef {LargeText & {
- *   $refs: { target: HTMLElement },
- *   $options: {
- *     skew: boolean,
- *     sensitivity: number,
- *     skewSensitivity: number,
- *   }
- * }} LargeTextInterface
- */
+import { Base } from '@studiometa/js-toolkit';
+import type { BaseProps, BaseInterface, ScrollServiceProps } from '@studiometa/js-toolkit';
+export interface LargeTextProps extends BaseProps {
+    $refs: {
+        target: HTMLElement;
+    };
+    $options: {
+        skew: boolean;
+        sensitivity: number;
+        skewSensitivity: number;
+    };
+}
+declare const LargeText_base: import("@studiometa/js-toolkit").BaseDecorator<import("@studiometa/js-toolkit").WithMountWhenInViewInterface, Base<BaseProps>, import("@studiometa/js-toolkit").WithMountWhenInViewProps>;
 /**
  * Large text class.
  */
-export default class LargeText extends Base {
+export declare class LargeText<T extends BaseProps = BaseProps> extends LargeText_base<T & LargeTextProps> implements BaseInterface {
     /**
      * Config.
      */
@@ -32,12 +35,10 @@ export default class LargeText extends Base {
     };
     /**
      * Translate X.
-     * @type {number}
      */
     x: number;
     /**
      * Scroll delta Y.
-     * @type {number}
      */
     deltaY: number;
     /**
@@ -49,45 +50,23 @@ export default class LargeText extends Base {
     };
     /**
      * Target width.
-     * @type {number}
      */
     width: number;
     /**
      * Set width on mount.
-     *
-     * @this    {LargeTextInterface}
-     * @returns {void}
      */
-    mounted(this: LargeTextInterface): void;
+    mounted(): void;
     /**
      * Set width on resize.
-     *
-     * @this    {LargeTextInterface}
-     * @returns {void}
      */
-    resized(this: LargeTextInterface): void;
+    resized(): void;
     /**
      * Update delta scroll on scroll.
-     *
-     * @param   {import('@studiometa/js-toolkit/services/scroll').ScrollServiceProps} props
-     * @returns {void}
      */
-    scrolled(props: import('@studiometa/js-toolkit/services/scroll').ScrollServiceProps): void;
+    scrolled(props: ScrollServiceProps): void;
     /**
      * Update values on raf.
-     *
-     * @this    {LargeTextInterface}
      */
-    ticked(this: LargeTextInterface): () => void;
+    ticked(): () => void;
 }
-export type LargeTextInterface = LargeText & {
-    $refs: {
-        target: HTMLElement;
-    };
-    $options: {
-        skew: boolean;
-        sensitivity: number;
-        skewSensitivity: number;
-    };
-};
-import { Base } from "@studiometa/js-toolkit";
+export {};

package/atoms/LargeText/LargeText.js

@@ -1 +1,60 @@
-import{Base as s,withMountWhenInView as e}from"@studiometa/js-toolkit";import{damp as t,clamp as h,transform as r}from"@studiometa/js-toolkit/utils";class a extends e(s,{rootMargin:"50%"}){static config={name:"LargeText",refs:["target"],options:{skew:Boolean,sensitivity:{type:Number,default:1},skewSensitivity:{type:Number,default:1}}};x=0;deltaY=0;transform={skewX:0,x:0};width=0;mounted(){this.width=this.$refs.target.clientWidth}resized(){this.width=this.$refs.target.clientWidth}scrolled(i){this.deltaY=i.delta.y}ticked(){return this.x-=(Math.abs(this.deltaY)+1)*this.$options.sensitivity,this.transform.x=t(this.x,this.transform.x,.25),this.$options.skew&&(this.transform.skewX=t(h(this.deltaY*-1,-50,50)*this.$options.skewSensitivity,this.transform.skewX,.25)),this.x<=this.width*-1?(this.x=0,this.transform.x+=this.width):this.$options.sensitivity<0&&this.x>=this.width&&(this.x=0,this.transform.x-=this.width),()=>{r(this.$refs.target,this.transform)}}}export{a as default};
+import { Base, withMountWhenInView } from "@studiometa/js-toolkit";
+import { damp, clamp, transform } from "@studiometa/js-toolkit/utils";
+class LargeText extends withMountWhenInView(Base, { rootMargin: "50%" }) {
+  static config = {
+    name: "LargeText",
+    refs: ["target"],
+    options: {
+      skew: Boolean,
+      sensitivity: {
+        type: Number,
+        default: 1
+      },
+      skewSensitivity: {
+        type: Number,
+        default: 1
+      }
+    }
+  };
+  x = 0;
+  deltaY = 0;
+  transform = {
+    skewX: 0,
+    x: 0
+  };
+  width = 0;
+  mounted() {
+    this.width = this.$refs.target.clientWidth;
+  }
+  resized() {
+    this.width = this.$refs.target.clientWidth;
+  }
+  scrolled(props) {
+    this.deltaY = props.delta.y;
+  }
+  ticked() {
+    this.x -= (Math.abs(this.deltaY) + 1) * this.$options.sensitivity;
+    this.transform.x = damp(this.x, this.transform.x, 0.25);
+    if (this.$options.skew) {
+      this.transform.skewX = damp(
+        clamp(this.deltaY * -1, -50, 50) * this.$options.skewSensitivity,
+        this.transform.skewX,
+        0.25
+      );
+    }
+    if (this.x <= this.width * -1) {
+      this.x = 0;
+      this.transform.x += this.width;
+    } else if (this.$options.sensitivity < 0 && this.x >= this.width) {
+      this.x = 0;
+      this.transform.x -= this.width;
+    }
+    return () => {
+      transform(this.$refs.target, this.transform);
+    };
+  }
+}
+export {
+  LargeText
+};
+//# sourceMappingURL=LargeText.js.map

package/atoms/LargeText/LargeText.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../packages/ui/atoms/LargeText/LargeText.ts"],
+  "sourcesContent": ["import { Base, withMountWhenInView } from '@studiometa/js-toolkit';\nimport type { BaseProps, BaseInterface, ScrollServiceProps } from '@studiometa/js-toolkit';\nimport { damp, clamp, transform } from '@studiometa/js-toolkit/utils';\n\nexport interface LargeTextProps extends BaseProps {\n  $refs: {\n    target: HTMLElement;\n  };\n  $options: {\n    skew: boolean;\n    sensitivity: number;\n    skewSensitivity: number;\n  };\n}\n\n/**\n * Large text class.\n */\nexport class LargeText<T extends BaseProps = BaseProps>\n  extends withMountWhenInView(Base, { rootMargin: '50%' })<T & LargeTextProps>\n  implements BaseInterface {\n  /**\n   * Config.\n   */\n  static config = {\n    name: 'LargeText',\n    refs: ['target'],\n    options: {\n      skew: Boolean,\n      sensitivity: {\n        type: Number,\n        default: 1,\n      },\n      skewSensitivity: {\n        type: Number,\n        default: 1,\n      },\n    },\n  };\n\n  /**\n   * Translate X.\n   */\n  x = 0;\n\n  /**\n   * Scroll delta Y.\n   */\n  deltaY = 0;\n\n  /**\n   * Transform values.\n   */\n  transform = {\n    skewX: 0,\n    x: 0,\n  };\n\n  /**\n   * Target width.\n   */\n  width = 0;\n\n  /**\n   * Set width on mount.\n   */\n  mounted() {\n    this.width = this.$refs.target.clientWidth;\n  }\n\n  /**\n   * Set width on resize.\n   */\n  resized() {\n    this.width = this.$refs.target.clientWidth;\n  }\n\n  /**\n   * Update delta scroll on scroll.\n   */\n  scrolled(props: ScrollServiceProps) {\n    this.deltaY = props.delta.y;\n  }\n\n  /**\n   * Update values on raf.\n   */\n  ticked() {\n    this.x -= (Math.abs(this.deltaY) + 1) * this.$options.sensitivity;\n\n    this.transform.x = damp(this.x, this.transform.x, 0.25);\n\n    if (this.$options.skew) {\n      this.transform.skewX = damp(\n        clamp(this.deltaY * -1, -50, 50) * this.$options.skewSensitivity,\n        this.transform.skewX,\n        0.25,\n      );\n    }\n\n    if (this.x <= this.width * -1) {\n      this.x = 0;\n      this.transform.x += this.width;\n    } else if (this.$options.sensitivity < 0 && this.x >= this.width) {\n      this.x = 0;\n      this.transform.x -= this.width;\n    }\n\n    return () => {\n      transform(this.$refs.target, this.transform);\n    };\n  }\n}\n"],
+  "mappings": "AAAA,SAAS,MAAM,2BAA2B;AAE1C,SAAS,MAAM,OAAO,iBAAiB;AAgBhC,MAAM,kBACH,oBAAoB,MAAM,EAAE,YAAY,MAAM,CAAC,EAC9B;AAAA,EAIzB,OAAO,SAAS;AAAA,IACd,MAAM;AAAA,IACN,MAAM,CAAC,QAAQ;AAAA,IACf,SAAS;AAAA,MACP,MAAM;AAAA,MACN,aAAa;AAAA,QACX,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,MACA,iBAAiB;AAAA,QACf,MAAM;AAAA,QACN,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA,EAKA,IAAI;AAAA,EAKJ,SAAS;AAAA,EAKT,YAAY;AAAA,IACV,OAAO;AAAA,IACP,GAAG;AAAA,EACL;AAAA,EAKA,QAAQ;AAAA,EAKR,UAAU;AACR,SAAK,QAAQ,KAAK,MAAM,OAAO;AAAA,EACjC;AAAA,EAKA,UAAU;AACR,SAAK,QAAQ,KAAK,MAAM,OAAO;AAAA,EACjC;AAAA,EAKA,SAAS,OAA2B;AAClC,SAAK,SAAS,MAAM,MAAM;AAAA,EAC5B;AAAA,EAKA,SAAS;AACP,SAAK,MAAM,KAAK,IAAI,KAAK,MAAM,IAAI,KAAK,KAAK,SAAS;AAEtD,SAAK,UAAU,IAAI,KAAK,KAAK,GAAG,KAAK,UAAU,GAAG,IAAI;AAEtD,QAAI,KAAK,SAAS,MAAM;AACtB,WAAK,UAAU,QAAQ;AAAA,QACrB,MAAM,KAAK,SAAS,IAAI,KAAK,EAAE,IAAI,KAAK,SAAS;AAAA,QACjD,KAAK,UAAU;AAAA,QACf;AAAA,MACF;AAAA,IACF;AAEA,QAAI,KAAK,KAAK,KAAK,QAAQ,IAAI;AAC7B,WAAK,IAAI;AACT,WAAK,UAAU,KAAK,KAAK;AAAA,IAC3B,WAAW,KAAK,SAAS,cAAc,KAAK,KAAK,KAAK,KAAK,OAAO;AAChE,WAAK,IAAI;AACT,WAAK,UAAU,KAAK,KAAK;AAAA,IAC3B;AAEA,WAAO,MAAM;AACX,gBAAU,KAAK,MAAM,QAAQ,KAAK,SAAS;AAAA,IAC7C;AAAA,EACF;AACF;",
+  "names": []
+}