@studiometa/js-toolkit 2.0.0-alpha.1 → 2.0.0-alpha.10

package/components/Cursor.js

@@ -1,167 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-import Base from '../Base/index.js';
-import damp from '../utils/math/damp.js';
-import matrix from '../utils/css/matrix.js';
-
-var Cursor = function (_Base) {
-  _inherits(Cursor, _Base);
-
-  var _super = _createSuper(Cursor);
-
-  function Cursor() {
-    var _this;
-
-    _classCallCheck(this, Cursor);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _defineProperty(_assertThisInitialized(_this), "x", 0);
-
-    _defineProperty(_assertThisInitialized(_this), "y", 0);
-
-    _defineProperty(_assertThisInitialized(_this), "scale", 0);
-
-    _defineProperty(_assertThisInitialized(_this), "pointerX", 0);
-
-    _defineProperty(_assertThisInitialized(_this), "pointerY", 0);
-
-    _defineProperty(_assertThisInitialized(_this), "pointerScale", 0);
-
-    return _this;
-  }
-
-  _createClass(Cursor, [{
-    key: "mounted",
-    value: function mounted() {
-      this.x = 0;
-      this.y = 0;
-      this.scale = 0;
-      this.pointerX = 0;
-      this.pointerY = 0;
-      this.pointerScale = 0;
-      this.render({
-        x: this.x,
-        y: this.y,
-        scale: this.scale
-      });
-    }
-  }, {
-    key: "moved",
-    value: function moved(_ref) {
-      var event = _ref.event,
-          x = _ref.x,
-          y = _ref.y,
-          isDown = _ref.isDown;
-
-      if (!this.$services.has('ticked')) {
-        this.$services.enable('ticked');
-      }
-
-      this.pointerX = x;
-      this.pointerY = y;
-      var scale = 1;
-
-      if (!event) {
-        this.pointerScale = scale;
-        return;
-      }
-
-      var shouldGrow = event.target instanceof Element && event.target.matches(this.$options.growSelectors) || false;
-      var shouldReduce = isDown || event.target instanceof Element && event.target.matches(this.$options.shrinkSelectors) || false;
-
-      if (shouldGrow) {
-        scale = this.$options.growTo;
-      }
-
-      if (shouldReduce) {
-        scale = this.$options.shrinkTo;
-      }
-
-      this.pointerScale = scale;
-    }
-  }, {
-    key: "ticked",
-    value: function ticked() {
-      this.x = damp(this.pointerX, this.x, this.$options.translateDampFactor);
-      this.y = damp(this.pointerY, this.y, this.$options.translateDampFactor);
-      this.scale = damp(this.pointerScale, this.scale, this.pointerScale < this.scale ? this.$options.shrinkDampFactor : this.$options.growDampFactor);
-      this.render({
-        x: this.x,
-        y: this.y,
-        scale: this.scale
-      });
-
-      if (this.x === this.pointerX && this.y === this.pointerY && this.scale === this.pointerScale) {
-        this.$services.disable('ticked');
-      }
-    }
-  }, {
-    key: "render",
-    value: function render(_ref2) {
-      var x = _ref2.x,
-          y = _ref2.y,
-          scale = _ref2.scale;
-      var transform = matrix({
-        translateX: x,
-        translateY: y,
-        scaleX: scale,
-        scaleY: scale
-      });
-      this.$el.style.transform = "translateZ(0) ".concat(transform);
-    }
-  }]);
-
-  return Cursor;
-}(Base);
-
-_defineProperty(Cursor, "config", {
-  name: 'Cursor',
-  options: {
-    growSelectors: {
-      type: String,
-      default: 'a, a *, button, button *, [data-cursor-grow], [data-cursor-grow] *'
-    },
-    shrinkSelectors: {
-      type: String,
-      default: '[data-cursor-shrink], [data-cursor-shrink] *'
-    },
-    growTo: {
-      type: Number,
-      default: 2
-    },
-    shrinkTo: {
-      type: Number,
-      default: 0.5
-    },
-    translateDampFactor: {
-      type: Number,
-      default: 0.25
-    },
-    growDampFactor: {
-      type: Number,
-      default: 0.25
-    },
-    shrinkDampFactor: {
-      type: Number,
-      default: 0.25
-    }
-  }
-});
-
-export { Cursor as default };
-//# sourceMappingURL=Cursor.js.map

package/components/Cursor.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../packages/js-toolkit/components/Cursor.js"],"names":["Base","damp","matrix","Cursor","x","y","scale","pointerX","pointerY","pointerScale","render","event","isDown","$services","has","enable","shouldGrow","target","Element","matches","$options","growSelectors","shouldReduce","shrinkSelectors","growTo","shrinkTo","translateDampFactor","shrinkDampFactor","growDampFactor","disable","transform","translateX","translateY","scaleX","scaleY","$el","style","name","options","type","String","default","Number"],"mappings":"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","sourcesContent":["import Base from '../Base/index.js';\nimport damp from '../utils/math/damp.js';\nimport matrix from '../utils/css/matrix.js';\n\n/**\n * @typedef {import('../services/pointer').PointerServiceProps} PointerServiceProps\n * @typedef {import('../Base').BaseOptions} BaseOptions\n */\n\n/**\n * @typedef {Object} CursorOptions\n * @property {string} growSelectors\n * @property {string} shrinkSelectors\n * @property {number} growTo\n * @property {number} shrinkTo\n * @property {number} translateDampFactor\n * @property {number} growDampFactor\n * @property {number} shrinkDampFactor\n */\n\n/**\n * @typedef {Object} CursorPrivateInterface\n * @property {BaseOptions & CursorOptions} $options\n */\n\n/**\n * @typedef {Cursor & CursorPrivateInterface} CursorInterface\n */\n\n/**\n * Custom cursor component.\n */\nexport default class Cursor extends Base {\n  /**\n   * Class config.\n   */\n  static config = {\n    name: 'Cursor',\n    options: {\n      growSelectors: {\n        type: String,\n        default: 'a, a *, button, button *, [data-cursor-grow], [data-cursor-grow] *',\n      },\n      shrinkSelectors: {\n        type: String,\n        default: '[data-cursor-shrink], [data-cursor-shrink] *',\n      },\n      growTo: {\n        type: Number,\n        default: 2,\n      },\n      shrinkTo: {\n        type: Number,\n        default: 0.5,\n      },\n      translateDampFactor: {\n        type: Number,\n        default: 0.25,\n      },\n      growDampFactor: {\n        type: Number,\n        default: 0.25,\n      },\n      shrinkDampFactor: {\n        type: Number,\n        default: 0.25,\n      },\n    },\n  };\n\n  /**\n   * @type {Number}\n   */\n  x = 0;\n\n  /**\n   * @type {Number}\n   */\n  y = 0;\n\n  /**\n   * @type {Number}\n   */\n  scale = 0;\n\n  /**\n   * @type {Number}\n   */\n  pointerX = 0;\n\n  /**\n   * @type {Number}\n   */\n  pointerY = 0;\n\n  /**\n   * @type {Number}\n   */\n  pointerScale = 0;\n\n  /**\n   * Mounted hook.\n   * @return {void}\n   */\n  mounted() {\n    this.x = 0;\n    this.y = 0;\n    this.scale = 0;\n    this.pointerX = 0;\n    this.pointerY = 0;\n    this.pointerScale = 0;\n    this.render({ x: this.x, y: this.y, scale: this.scale });\n  }\n\n  /**\n   * Moved hook.\n   *\n   * @this {CursorInterface}\n   *\n   * @param {PointerServiceProps} options\n   * @return {void}\n   */\n  moved({ event, x, y, isDown }) {\n    if (!this.$services.has('ticked')) {\n      this.$services.enable('ticked');\n    }\n\n    this.pointerX = x;\n    this.pointerY = y;\n\n    let scale = 1;\n\n    if (!event) {\n      this.pointerScale = scale;\n      return;\n    }\n\n    const shouldGrow =\n      (event.target instanceof Element && event.target.matches(this.$options.growSelectors)) ||\n      false;\n    const shouldReduce =\n      isDown ||\n      (event.target instanceof Element && event.target.matches(this.$options.shrinkSelectors)) ||\n      false;\n\n    if (shouldGrow) {\n      scale = this.$options.growTo;\n    }\n\n    if (shouldReduce) {\n      scale = this.$options.shrinkTo;\n    }\n\n    this.pointerScale = scale;\n  }\n\n  /**\n   * RequestAnimationFrame hook.\n   *\n   * @this {CursorInterface}\n   *\n   * @return {void}\n   */\n  ticked() {\n    this.x = damp(this.pointerX, this.x, this.$options.translateDampFactor);\n    this.y = damp(this.pointerY, this.y, this.$options.translateDampFactor);\n    this.scale = damp(\n      this.pointerScale,\n      this.scale,\n      this.pointerScale < this.scale ? this.$options.shrinkDampFactor : this.$options.growDampFactor\n    );\n\n    this.render({ x: this.x, y: this.y, scale: this.scale });\n\n    if (this.x === this.pointerX && this.y === this.pointerY && this.scale === this.pointerScale) {\n      this.$services.disable('ticked');\n    }\n  }\n\n  /**\n   * Render the cursor.\n   *\n   * @param  {Object} options\n   * @param  {Number} options.x\n   * @param  {Number} options.y\n   * @param  {Number} options.scale\n   * @return {void}\n   */\n  render({ x, y, scale }) {\n    const transform = matrix({\n      translateX: x,\n      translateY: y,\n      scaleX: scale,\n      scaleY: scale,\n    });\n    this.$el.style.transform = `translateZ(0) ${transform}`;\n  }\n}\n"],"file":"Cursor.js"}

package/components/Draggable.d.ts

@@ -1,49 +0,0 @@
-/**
- * @typedef {import('stylefire').Styler} Styler
- * @typedef {import('../services/drag.js').DragServiceProps} DragServiceProps
- */
-/**
- * @typedef {Draggable} DraggableInterface
- */
-/**
- * Draggable class.
- *
- * @link https://jsfiddle.net/soulwire/znj683b9/
- */
-export default class Draggable extends Base {
-    static config: {
-        name: string;
-    };
-    /**
-     * The origin of the element.
-     * @type {{ x: number, y: number }}
-     */
-    elementOrigin: {
-        x: number;
-        y: number;
-    };
-    /**
-     * The element styler for performant style update.
-     * @type {Styler}
-     */
-    styler: Styler;
-    /**
-     * Mounted hook.
-     * @return {void}
-     */
-    mounted(): void;
-    /**
-     * Destroyed hook.
-     * @return {void}
-     */
-    destroyed(): void;
-    /**
-     * Drag service hook.
-     * @param {DragServiceProps} props
-     */
-    dragged(props: DragServiceProps): void;
-}
-export type Styler = import('stylefire').Styler;
-export type DragServiceProps = import('../services/drag.js').DragServiceProps;
-export type DraggableInterface = Draggable;
-import Base from "../Base/index.js";

package/components/Draggable.js

@@ -1,77 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-import styler from 'stylefire';
-import Base from '../Base/index.js';
-import withDrag from '../decorators/withDrag.js';
-
-var Draggable = function (_withDrag) {
-  _inherits(Draggable, _withDrag);
-
-  var _super = _createSuper(Draggable);
-
-  function Draggable() {
-    var _this;
-
-    _classCallCheck(this, Draggable);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _defineProperty(_assertThisInitialized(_this), "elementOrigin", {
-      x: 0,
-      y: 0
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "styler", void 0);
-
-    return _this;
-  }
-
-  _createClass(Draggable, [{
-    key: "mounted",
-    value: function mounted() {
-      this.styler = styler(this.$el);
-    }
-  }, {
-    key: "destroyed",
-    value: function destroyed() {
-      this.styler = undefined;
-    }
-  }, {
-    key: "dragged",
-    value: function dragged(props) {
-      if (props.mode === 'start') {
-        this.elementOrigin.x = this.styler.get('x');
-        this.elementOrigin.y = this.styler.get('y');
-        return;
-      }
-
-      this.styler.set({
-        x: this.elementOrigin.x + props.x - props.origin.x,
-        y: this.elementOrigin.y + props.y - props.origin.y
-      });
-    }
-  }]);
-
-  return Draggable;
-}(withDrag(Base));
-
-_defineProperty(Draggable, "config", {
-  name: 'DraggableElement'
-});
-
-export { Draggable as default };
-//# sourceMappingURL=Draggable.js.map

package/components/Draggable.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../packages/js-toolkit/components/Draggable.js"],"names":["styler","Base","withDrag","Draggable","x","y","$el","undefined","props","mode","elementOrigin","get","set","origin","name"],"mappings":";;;;;;;;;;;;AAAA,OAAOA,MAAP,MAAmB,WAAnB;AACA,OAAOC,IAAP,MAAiB,kBAAjB;AACA,OAAOC,QAAP,MAAqB,2BAArB;;IAgBqBC,S;;;;;;;;;;;;;;;;oEASH;AACdC,MAAAA,CAAC,EAAE,CADW;AAEdC,MAAAA,CAAC,EAAE;AAFW,K;;;;;;;;;WAehB,mBAAU;AACR,WAAKL,MAAL,GAAcA,MAAM,CAAC,KAAKM,GAAN,CAApB;AACD;;;WAMD,qBAAY;AACV,WAAKN,MAAL,GAAcO,SAAd;AACD;;;WAMD,iBAAQC,KAAR,EAAe;AACb,UAAIA,KAAK,CAACC,IAAN,KAAe,OAAnB,EAA4B;AAC1B,aAAKC,aAAL,CAAmBN,CAAnB,GAAuB,KAAKJ,MAAL,CAAYW,GAAZ,CAAgB,GAAhB,CAAvB;AACA,aAAKD,aAAL,CAAmBL,CAAnB,GAAuB,KAAKL,MAAL,CAAYW,GAAZ,CAAgB,GAAhB,CAAvB;AACA;AACD;;AAED,WAAKX,MAAL,CAAYY,GAAZ,CAAgB;AACdR,QAAAA,CAAC,EAAE,KAAKM,aAAL,CAAmBN,CAAnB,GAAuBI,KAAK,CAACJ,CAA7B,GAAiCI,KAAK,CAACK,MAAN,CAAaT,CADnC;AAEdC,QAAAA,CAAC,EAAE,KAAKK,aAAL,CAAmBL,CAAnB,GAAuBG,KAAK,CAACH,CAA7B,GAAiCG,KAAK,CAACK,MAAN,CAAaR;AAFnC,OAAhB;AAID;;;;EAnDoCH,QAAQ,CAACD,IAAD,C;;gBAA1BE,S,YACH;AACdW,EAAAA,IAAI,EAAE;AADQ,C;;SADGX,S","sourcesContent":["import styler from 'stylefire';\nimport Base from '../Base/index.js';\nimport withDrag from '../decorators/withDrag.js';\n\n/**\n * @typedef {import('stylefire').Styler} Styler\n * @typedef {import('../services/drag.js').DragServiceProps} DragServiceProps\n */\n\n/**\n * @typedef {Draggable} DraggableInterface\n */\n\n/**\n * Draggable class.\n *\n * @link https://jsfiddle.net/soulwire/znj683b9/\n */\nexport default class Draggable extends withDrag(Base) {\n  static config = {\n    name: 'DraggableElement',\n  };\n\n  /**\n   * The origin of the element.\n   * @type {{ x: number, y: number }}\n   */\n  elementOrigin = {\n    x: 0,\n    y: 0,\n  };\n\n  /**\n   * The element styler for performant style update.\n   * @type {Styler}\n   */\n  styler;\n\n  /**\n   * Mounted hook.\n   * @return {void}\n   */\n  mounted() {\n    this.styler = styler(this.$el);\n  }\n\n  /**\n   * Destroyed hook.\n   * @return {void}\n   */\n  destroyed() {\n    this.styler = undefined;\n  }\n\n  /**\n   * Drag service hook.\n   * @param {DragServiceProps} props\n   */\n  dragged(props) {\n    if (props.mode === 'start') {\n      this.elementOrigin.x = this.styler.get('x');\n      this.elementOrigin.y = this.styler.get('y');\n      return;\n    }\n\n    this.styler.set({\n      x: this.elementOrigin.x + props.x - props.origin.x,\n      y: this.elementOrigin.y + props.y - props.origin.y,\n    });\n  }\n}\n"],"file":"Draggable.js"}

package/components/Modal.d.ts

@@ -1,158 +0,0 @@
-/**
- * @typedef {Object} ModalRefs
- * @property {HTMLElement} close
- * @property {HTMLElement} container
- * @property {HTMLElement} content
- * @property {HTMLElement} modal
- * @property {HTMLElement} open
- * @property {HTMLElement} overlay
- */
-/**
- * @typedef {import('../utils/css/styles.js').CssStyleObject} CssStyleObject
- * @typedef {Partial<Record<'open'|'active'|'closed', string|CssStyleObject>>} ModalStates
- * @typedef {Partial<Record<keyof ModalRefs, ModalStates>>} ModalStylesOption
- */
-/**
- * @typedef {Object} ModalOptions
- * @property {String}            move      A selector where to move the modal to.
- * @property {String}            autofocus A selector for the element to set the focus to when the modal opens.
- * @property {ModalStylesOption} styles    The styles for the different state of the modal.
- */
-/**
- * @typedef {Object} ModalPrivateInterface
- * @property {ModalRefs} $refs
- * @property {ModalOptions} $options
- * @property {Boolean} isOpen
- * @property {Comment} refModalPlaceholder
- * @property {HTMLElement} refModalParentBackup
- * @property {Function} refModalUnbindGetRefFilter
- */
-/**
- * @typedef {Modal & ModalPrivateInterface} ModalInterface
- */
-/**
- * Modal class.
- */
-export default class Modal extends Base {
-    /**
-     * Modal options.
-     */
-    static config: {
-        name: string;
-        refs: string[];
-        options: {
-            move: StringConstructor;
-            autofocus: {
-                type: StringConstructor;
-                default: string;
-            };
-            styles: {
-                type: ObjectConstructor;
-                /**
-                 * @return {ModalStylesOption}
-                 */
-                default: () => ModalStylesOption;
-            };
-        };
-    };
-    /**
-     * Open the modal on click on the `open` ref.
-     *
-     * @return {Function} The component's `open` method.
-     */
-    get onOpenClick(): Function;
-    /**
-     * Close the modal on click on the `close` ref.
-     *
-     * @return {Function} The component's `close` method.
-     */
-    get onCloseClick(): Function;
-    /**
-     * Close the modal on click on the `overlay` ref.
-     *
-     * @return {Function} The component's `close` method.
-     */
-    get onOverlayClick(): Function;
-    /**
-     * Initialize the component's behaviours.
-     *
-     * @this {ModalInterface}
-     */
-    mounted(): ModalInterface;
-    isOpen: boolean;
-    refModalPlaceholder: Comment;
-    refModalParentBackup: any;
-    refModalUnbindGetRefFilter: any;
-    /**
-     * Unbind all events on destroy.
-     *
-     * @this {ModalInterface}
-     * @return {Modal} The Modal instance.
-     */
-    destroyed(): Modal;
-    /**
-     * Close the modal on `ESC` and trap the tabulation.
-     *
-     * @this {ModalInterface}
-     * @param  {Object}        options
-     * @param  {KeyboardEvent} options.event  The original keyboard event
-     * @param  {Boolean}       options.isUp   Is it a keyup event?
-     * @param  {Boolean}       options.isDown Is it a keydown event?
-     * @param  {Boolean}       options.ESC    Is it the ESC key?
-     */
-    keyed({ event, isUp, isDown, ESC }: {
-        event: KeyboardEvent;
-        isUp: boolean;
-        isDown: boolean;
-        ESC: boolean;
-    }): void;
-    /**
-     * Open the modal.
-     *
-     * @this {ModalInterface}
-     * @return {Promise<ModalInterface>} The Modal instance.
-     */
-    open(): Promise<ModalInterface>;
-    /**
-     * Close the modal.
-     *
-     * @this {ModalInterface}
-     * @return {Promise<ModalInterface>} The Modal instance.
-     */
-    close(): Promise<ModalInterface>;
-}
-export type ModalRefs = {
-    close: HTMLElement;
-    container: HTMLElement;
-    content: HTMLElement;
-    modal: HTMLElement;
-    open: HTMLElement;
-    overlay: HTMLElement;
-};
-export type CssStyleObject = import('../utils/css/styles.js').CssStyleObject;
-export type ModalStates = Partial<Record<'open' | 'active' | 'closed', string | CssStyleObject>>;
-export type ModalStylesOption = Partial<Record<keyof ModalRefs, ModalStates>>;
-export type ModalOptions = {
-    /**
-     * A selector where to move the modal to.
-     */
-    move: string;
-    /**
-     * A selector for the element to set the focus to when the modal opens.
-     */
-    autofocus: string;
-    /**
-     * The styles for the different state of the modal.
-     */
-    styles: ModalStylesOption;
-};
-export type ModalPrivateInterface = {
-    $refs: ModalRefs;
-    $options: ModalOptions;
-    isOpen: boolean;
-    refModalPlaceholder: Comment;
-    refModalParentBackup: HTMLElement;
-    refModalUnbindGetRefFilter: Function;
-};
-export type ModalInterface = Modal & ModalPrivateInterface;
-import Base from "../Base/index.js";