@studiometa/ui 0.2.1 → 0.2.4

package/primitives/Draggable/Draggable.js

@@ -1,38 +1 @@
-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 { animate } from "motion";
-import { Base, withDrag } from "@studiometa/js-toolkit";
-const _Draggable = class extends withDrag(Base) {
-  constructor() {
-    super(...arguments);
-    __publicField(this, "x", 0);
-    __publicField(this, "y", 0);
-    __publicField(this, "originX", 0);
-    __publicField(this, "originY", 0);
-  }
-  dragged(props) {
-    if (props.mode === "start") {
-      this.originX = this.x;
-      this.originY = this.y;
-      return;
-    }
-    this.x = this.originX + props.x - props.origin.x;
-    this.y = this.originY + props.y - props.origin.y;
-    animate(this.$el, { x: this.x, y: this.y }, _Draggable.animateOptions);
-  }
-};
-let Draggable = _Draggable;
-__publicField(Draggable, "config", {
-  name: "DraggableElement"
-});
-__publicField(Draggable, "animateOptions", {
-  easing: "linear",
-  duration: 0
-});
-export {
-  Draggable as default
-};
+import{Base as t,withDrag as r}from"@studiometa/js-toolkit";import{matrix as a}from"@studiometa/js-toolkit/utils";class e extends r(t){static config={name:"DraggableElement"};x=0;y=0;originX=0;originY=0;dragged(i){if(i.mode==="start"){this.originX=this.x,this.originY=this.y;return}this.x=this.originX+i.x-i.origin.x,this.y=this.originY+i.y-i.origin.y,this.$el.style.transform=a({translateX:this.x,translateY:this.y})}}export{e as default};

package/primitives/Sentinel/Sentinel.cjs

@@ -3,24 +3,19 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 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 __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
+  return to;
 };
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
@@ -31,11 +26,11 @@ var Sentinel_exports = {};
 __export(Sentinel_exports, {
   default: () => Sentinel
 });
+module.exports = __toCommonJS(Sentinel_exports);
 var import_js_toolkit = require("@studiometa/js-toolkit");
 var Sentinel = class extends (0, import_js_toolkit.withIntersectionObserver)(import_js_toolkit.Base, { threshold: [0, 1] }) {
 };
 __publicField(Sentinel, "config", {
   name: "Sentinel"
 });
-module.exports = __toCommonJS(Sentinel_exports);
 if (module.exports.default) module.exports = module.exports.default;

package/primitives/Sentinel/Sentinel.js

@@ -1,15 +1 @@
-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, withIntersectionObserver } from "@studiometa/js-toolkit";
-class Sentinel extends withIntersectionObserver(Base, { threshold: [0, 1] }) {
-}
-__publicField(Sentinel, "config", {
-  name: "Sentinel"
-});
-export {
-  Sentinel as default
-};
+import{Base as e,withIntersectionObserver as t}from"@studiometa/js-toolkit";class n extends t(e,{threshold:[0,1]}){static config={name:"Sentinel"}}export{n as default};

package/primitives/Transition/Transition.cjs

@@ -0,0 +1,66 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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) => {
+  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))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+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/primitives/Transition/Transition.js
+var Transition_exports = {};
+__export(Transition_exports, {
+  default: () => Transition
+});
+module.exports = __toCommonJS(Transition_exports);
+var import_js_toolkit = require("@studiometa/js-toolkit");
+var import_utils = require("@studiometa/js-toolkit/utils");
+var Transition = class extends import_js_toolkit.Base {
+  get target() {
+    return this.$el;
+  }
+  enter() {
+    const { enterFrom, enterActive, enterTo, enterKeep, leaveTo } = this.$options;
+    return (0, import_utils.transition)(this.target, {
+      from: (leaveTo + " " + enterFrom).trim(),
+      active: enterActive,
+      to: enterTo
+    }, enterKeep && "keep");
+  }
+  leave() {
+    const { leaveFrom, leaveActive, leaveTo, leaveKeep, enterTo } = this.$options;
+    return (0, import_utils.transition)(this.target, {
+      from: (enterTo + " " + leaveFrom).trim(),
+      active: leaveActive,
+      to: leaveTo
+    }, leaveKeep && "keep");
+  }
+};
+__publicField(Transition, "config", {
+  name: "Transition",
+  options: {
+    enterFrom: String,
+    enterActive: String,
+    enterTo: String,
+    enterKeep: Boolean,
+    leaveFrom: String,
+    leaveActive: String,
+    leaveTo: String,
+    leaveKeep: Boolean
+  }
+});
+if (module.exports.default) module.exports = module.exports.default;

package/primitives/Transition/Transition.d.ts

@@ -0,0 +1,67 @@
+/**
+ * @typedef {Object} TransitionOptions
+ * @property {string} enterFrom
+ * @property {string} enterActive
+ * @property {string} enterTo
+ * @property {boolean} enterKeep
+ * @property {string} leaveFrom
+ * @property {string} leaveActive
+ * @property {string} leaveTo
+ * @property {boolean} leaveKeep
+ */
+/**
+ * Transition class.
+ * @typedef {Transition & { $options: TransitionOptions }} TransitionInterface
+ */
+export default class Transition extends Base {
+    static config: {
+        name: string;
+        options: {
+            enterFrom: StringConstructor;
+            enterActive: StringConstructor;
+            enterTo: StringConstructor;
+            enterKeep: BooleanConstructor;
+            leaveFrom: StringConstructor;
+            leaveActive: StringConstructor;
+            leaveTo: StringConstructor;
+            leaveKeep: BooleanConstructor;
+        };
+    };
+    /**
+     * Get the transition target.
+     *
+     * @returns {HTMLElement}
+     */
+    get target(): HTMLElement;
+    /**
+     * Trigger the enter transition.
+     *
+     * @this {TransitionInterface}
+     * @returns {Promise<void>}
+     */
+    enter(this: TransitionInterface): Promise<void>;
+    /**
+     * Trigger the leave transition.
+     *
+     * @this {TransitionInterface}
+     * @returns {Promise<void>}
+     */
+    leave(this: TransitionInterface): Promise<void>;
+}
+export type TransitionOptions = {
+    enterFrom: string;
+    enterActive: string;
+    enterTo: string;
+    enterKeep: boolean;
+    leaveFrom: string;
+    leaveActive: string;
+    leaveTo: string;
+    leaveKeep: boolean;
+};
+/**
+ * Transition class.
+ */
+export type TransitionInterface = Transition & {
+    $options: TransitionOptions;
+};
+import { Base } from "@studiometa/js-toolkit";

package/primitives/Transition/Transition.js

@@ -0,0 +1 @@
+import{Base as a}from"@studiometa/js-toolkit";import{transition as i}from"@studiometa/js-toolkit/utils";class s extends a{static config={name:"Transition",options:{enterFrom:String,enterActive:String,enterTo:String,enterKeep:Boolean,leaveFrom:String,leaveActive:String,leaveTo:String,leaveKeep:Boolean}};get target(){return this.$el}enter(){const{enterFrom:e,enterActive:t,enterTo:r,enterKeep:n,leaveTo:o}=this.$options;return i(this.target,{from:(o+" "+e).trim(),active:t,to:r},n&&"keep")}leave(){const{leaveFrom:e,leaveActive:t,leaveTo:r,leaveKeep:n,enterTo:o}=this.$options;return i(this.target,{from:(o+" "+e).trim(),active:t,to:r},n&&"keep")}}export{s as default};

package/primitives/index.cjs

@@ -4,35 +4,30 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
+  return to;
 };
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+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);
 
 // packages/ui/primitives/index.js
 var primitives_exports = {};
 __export(primitives_exports, {
   Draggable: () => import_Draggable.default,
-  Sentinel: () => import_Sentinel.default
+  Sentinel: () => import_Sentinel.default,
+  Transition: () => import_Transition.default
 });
+module.exports = __toCommonJS(primitives_exports);
 var import_Draggable = __toESM(require("./Draggable/Draggable.cjs"), 1);
 var import_Sentinel = __toESM(require("./Sentinel/Sentinel.cjs"), 1);
-module.exports = __toCommonJS(primitives_exports);
+var import_Transition = __toESM(require("./Transition/Transition.cjs"), 1);
 if (module.exports.default) module.exports = module.exports.default;

package/primitives/index.d.ts

@@ -1,2 +1,3 @@
 export { default as Draggable } from "./Draggable/Draggable.js";
 export { default as Sentinel } from "./Sentinel/Sentinel.js";
+export { default as Transition } from "./Transition/Transition.js";

package/primitives/index.js

@@ -1,6 +1 @@
-import { default as default2 } from "./Draggable/Draggable.js";
-import { default as default3 } from "./Sentinel/Sentinel.js";
-export {
-  default2 as Draggable,
-  default3 as Sentinel
-};
+import{default as r}from"./Draggable/Draggable.js";import{default as o}from"./Sentinel/Sentinel.js";import{default as l}from"./Transition/Transition.js";export{r as Draggable,o as Sentinel,l as Transition};