@studiometa/js-toolkit 2.0.0-beta.0 → 2.0.0-beta.12

package/services/key.js

@@ -1,89 +1,70 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-import Service from './Service.js';
-import keyCodes from '../utils/keyCodes.js';
-
+import Service from "./Service.js";
+import keyCodes from "../utils/keyCodes.js";
 class Key extends Service {
-  constructor() {
-    super(...arguments);
-
-    _defineProperty(this, "event", {});
-
-    _defineProperty(this, "triggered", 0);
-
-    _defineProperty(this, "previousEvent", {});
-  }
-
+  previousEvent;
+  props = {
+    event: null,
+    triggered: 0,
+    isUp: false,
+    isDown: false,
+    ENTER: false,
+    SPACE: false,
+    TAB: false,
+    ESC: false,
+    LEFT: false,
+    UP: false,
+    RIGHT: false,
+    DOWN: false,
+    direction: "none"
+  };
   init() {
-    this.handler = event => {
-      this.event = event;
-      this.trigger(this.props);
-    };
-
-    document.addEventListener('keydown', this.handler, {
-      passive: false
-    });
-    document.addEventListener('keyup', this.handler, {
-      passive: false
-    });
-    return this;
+    document.addEventListener("keydown", this);
+    document.addEventListener("keyup", this);
+  }
+  handleEvent(event) {
+    this.updateProps(event);
+    this.trigger(this.props);
   }
-
   kill() {
-    document.removeEventListener('keydown', this.handler);
-    document.removeEventListener('keyup', this.handler);
-    return this;
+    document.removeEventListener("keydown", this);
+    document.removeEventListener("keyup", this);
   }
-
-  get props() {
-    var keys = Object.entries(keyCodes).reduce((acc, _ref) => {
-      var [name, code] = _ref;
-      acc[name] = code === this.event.keyCode;
-      return acc;
-    }, {});
-
-    if (!this.previousEvent.type) {
-      this.triggered = 0;
+  updateProps(event) {
+    this.props.event = event;
+    Object.entries(keyCodes).forEach(([name, code]) => {
+      this.props[name] = code === event.keyCode;
+    });
+    if (!this.previousEvent) {
+      this.props.triggered = 0;
     }
-
-    if (this.event.type === 'keydown' && this.previousEvent.type === 'keydown') {
-      this.triggered += 1;
+    if (this.props.event.type === "keydown" && this.previousEvent?.type === "keydown") {
+      this.props.triggered += 1;
     } else {
-      this.triggered = 1;
+      this.props.triggered = 1;
     }
-
-    this.previousEvent = this.event;
-    return _objectSpread({
-      event: this.event,
-      triggered: this.triggered,
-      direction: this.event.type === 'keydown' ? 'down' : 'up',
-      isUp: this.event.type === 'keyup',
-      isDown: this.event.type === 'keydown'
-    }, keys);
+    this.previousEvent = this.props.event;
+    this.props.direction = this.props.event.type === "keydown" ? "down" : "up";
+    this.props.isUp = this.props.event.type === "keyup";
+    this.props.isDown = this.props.event.type === "keydown";
+    return this.props;
   }
-
 }
-
-var key = null;
-export default function useKey() {
+let instance;
+let key;
+function useKey() {
   if (!key) {
-    key = new Key();
+    if (!instance) {
+      instance = new Key();
+    }
+    key = {
+      add: instance.add.bind(instance),
+      remove: instance.remove.bind(instance),
+      has: instance.has.bind(instance),
+      props: instance.updateProps.bind(instance)
+    };
   }
-
-  var add = key.add.bind(key);
-  var remove = key.remove.bind(key);
-  var has = key.has.bind(key);
-
-  var props = () => key.props;
-
-  return {
-    add,
-    remove,
-    has,
-    props
-  };
-}
+  return key;
+}
+export {
+  useKey as default
+};

package/services/load.cjs

@@ -0,0 +1,68 @@
+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 __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 });
+  }
+  return target;
+};
+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 load_exports = {};
+__export(load_exports, {
+  default: () => useLoad
+});
+var import_Service = __toESM(require("./Service.js"), 1);
+class Load extends import_Service.default {
+  props = {
+    time: window.performance.now()
+  };
+  init() {
+    window.addEventListener("load", this);
+  }
+  handleEvent() {
+    this.updateProps();
+    this.trigger(this.props);
+  }
+  kill() {
+    window.removeEventListener("load", this);
+  }
+  updateProps() {
+    this.props.time = window.performance.now();
+    return this.props;
+  }
+}
+let instance;
+let load;
+function useLoad() {
+  if (!load) {
+    if (!instance) {
+      instance = new Load();
+    }
+    load = {
+      add: instance.add.bind(instance),
+      remove: instance.remove.bind(instance),
+      has: instance.has.bind(instance),
+      props: instance.updateProps.bind(instance)
+    };
+  }
+  return load;
+}
+module.exports = __toCommonJS(load_exports);

package/services/load.d.ts

@@ -9,20 +9,10 @@
  * props();
  * ```
  *
- * @return {ServiceInterface & LoadService}
+ * @return {LoadService}
  */
-export default function useLoad(): ServiceInterface & LoadService;
-export type ServiceInterface = import('./index').ServiceInterface;
+export default function useLoad(): LoadService;
+export type LoadService = import('./index').ServiceInterface<LoadServiceProps>;
 export type LoadServiceProps = {
     time: DOMHighResTimeStamp;
 };
-export type LoadService = {
-    /**
-     *   Add a function to the resize service. The key must be uniq.
-     */
-    add: (key: string, callback: (props: LoadServiceProps) => void) => void;
-    /**
-     *   Get the current values of the resize service props.
-     */
-    props: () => LoadServiceProps;
-};

package/services/load.js

@@ -1,44 +1,39 @@
-import Service from './Service.js';
-
+import Service from "./Service.js";
 class Load extends Service {
+  props = {
+    time: window.performance.now()
+  };
   init() {
-    this.handler = () => {
-      this.trigger(this.props);
-    };
-
-    window.addEventListener('load', this.handler);
-    return this;
+    window.addEventListener("load", this);
+  }
+  handleEvent() {
+    this.updateProps();
+    this.trigger(this.props);
   }
-
   kill() {
-    window.removeEventListener('load', this.handler);
-    return this;
+    window.removeEventListener("load", this);
   }
-
-  get props() {
-    return {};
+  updateProps() {
+    this.props.time = window.performance.now();
+    return this.props;
   }
-
 }
-
-var instance = null;
-export default function useLoad() {
-  if (!instance) {
-    instance = new Load();
-  }
-
-  var add = instance.add.bind(instance);
-  var remove = instance.remove.bind(instance);
-  var has = instance.has.bind(instance);
-
-  function props() {
-    return instance.props;
+let instance;
+let load;
+function useLoad() {
+  if (!load) {
+    if (!instance) {
+      instance = new Load();
+    }
+    load = {
+      add: instance.add.bind(instance),
+      remove: instance.remove.bind(instance),
+      has: instance.has.bind(instance),
+      props: instance.updateProps.bind(instance)
+    };
   }
-
-  return {
-    add,
-    remove,
-    has,
-    props
-  };
-}
+  return load;
+}
+export {
+  useLoad as default
+};

package/services/pointer.cjs

@@ -0,0 +1,157 @@
+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 __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 });
+  }
+  return target;
+};
+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 pointer_exports = {};
+__export(pointer_exports, {
+  default: () => usePointer
+});
+var import_Service = __toESM(require("./Service.js"), 1);
+function isTouchEvent(event) {
+  return typeof TouchEvent !== "undefined" && event instanceof TouchEvent;
+}
+class Pointer extends import_Service.default {
+  props = {
+    event: null,
+    isDown: false,
+    x: window.innerWidth / 2,
+    y: window.innerHeight / 2,
+    changed: {
+      x: false,
+      y: false
+    },
+    last: {
+      x: window.innerWidth / 2,
+      y: window.innerHeight / 2
+    },
+    delta: {
+      x: 0,
+      y: 0
+    },
+    progress: {
+      x: 0.5,
+      y: 0.5
+    },
+    max: {
+      x: window.innerWidth,
+      y: window.innerHeight
+    }
+  };
+  hasRaf = false;
+  init() {
+    document.documentElement.addEventListener("mouseenter", this, {
+      once: true,
+      capture: true
+    });
+    const options = { passive: true, capture: true };
+    document.addEventListener("mousemove", this, options);
+    document.addEventListener("touchmove", this, options);
+    document.addEventListener("mousedown", this, options);
+    document.addEventListener("touchstart", this, options);
+    document.addEventListener("mouseup", this, options);
+    document.addEventListener("touchend", this, options);
+    return this;
+  }
+  handleEvent(event) {
+    switch (event.type) {
+      case "mouseenter":
+      case "mousemove":
+      case "touchmove":
+        this.handler(event);
+        break;
+      case "mousedown":
+      case "touchstart":
+        this.downHandler();
+        break;
+      case "mouseup":
+      case "touchend":
+        this.upHandler();
+        break;
+    }
+  }
+  kill() {
+    document.removeEventListener("mousemove", this);
+    document.removeEventListener("touchmove", this);
+    document.removeEventListener("mousedown", this);
+    document.removeEventListener("touchstart", this);
+    document.removeEventListener("mouseup", this);
+    document.removeEventListener("touchend", this);
+    return this;
+  }
+  handler(event) {
+    this.updateProps(event);
+    this.trigger(this.props);
+  }
+  downHandler() {
+    this.props.isDown = true;
+    this.trigger(this.props);
+  }
+  upHandler() {
+    this.props.isDown = false;
+    this.trigger(this.props);
+  }
+  updateProps(event) {
+    this.props.event = event;
+    const yLast = this.props.y;
+    const xLast = this.props.x;
+    const y = isTouchEvent(event) ? event.touches[0]?.clientY : event.clientY;
+    if (y !== this.props.y) {
+      this.props.y = y;
+    }
+    const x = isTouchEvent(event) ? event.touches[0]?.clientX : event.clientX;
+    if (x !== this.props.x) {
+      this.props.x = x;
+    }
+    this.props.changed.x = this.props.x !== xLast;
+    this.props.changed.y = this.props.y !== yLast;
+    this.props.last.x = xLast;
+    this.props.last.y = yLast;
+    this.props.delta.x = this.props.x - xLast;
+    this.props.delta.y = this.props.y - yLast;
+    this.props.max.x = window.innerWidth;
+    this.props.max.y = window.innerHeight;
+    this.props.progress.x = this.props.x / this.props.max.x;
+    this.props.progress.y = this.props.y / this.props.max.y;
+    return this.props;
+  }
+}
+let instance;
+let pointer;
+function usePointer() {
+  if (!pointer) {
+    if (!instance) {
+      instance = new Pointer();
+    }
+    pointer = {
+      add: instance.add.bind(instance),
+      remove: instance.remove.bind(instance),
+      has: instance.has.bind(instance),
+      props: instance.updateProps.bind(instance)
+    };
+  }
+  return pointer;
+}
+module.exports = __toCommonJS(pointer_exports);

package/services/pointer.d.ts

@@ -9,10 +9,11 @@
  * props();
  * ```
  *
- * @return {ServiceInterface & PointerService}
+ * @todo Add element as parameter to get the pointer position relatively from.
+ * @return {PointerService}
  */
-export default function usePointer(): ServiceInterface & PointerService;
-export type ServiceInterface = import('./index').ServiceInterface;
+export default function usePointer(): PointerService;
+export type PointerService = import('./index').ServiceInterface<PointerServiceProps>;
 export type PointerServiceProps = {
     event: MouseEvent | TouchEvent;
     isDown: boolean;
@@ -39,13 +40,3 @@ export type PointerServiceProps = {
         y: number;
     };
 };
-export type PointerService = {
-    /**
-     *   Add a function to the resize service. The key must be uniq.
-     */
-    add: (key: string, callback: (props: PointerServiceProps) => void) => void;
-    /**
-     *   Get the current values of the resize service props.
-     */
-    props: () => PointerServiceProps;
-};