wj-elements 0.1.46 → 0.1.48

package/dist/wje-reorder.js

@@ -1,138 +0,0 @@
-var f = Object.defineProperty;
-var E = (a, l, e) => l in a ? f(a, l, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[l] = e;
-var g = (a, l, e) => (E(a, typeof l != "symbol" ? l + "" : l, e), e);
-import m from "./wje-element.js";
-const p = ".container{position:relative;display:flex;align-items:center;justify-content:center;margin:auto;flex-direction:var(--flex-direction)}.container-w-dropzones{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:row}.reversed{--flex-direction: column-reverse}.basic{--flex-direction: column}.dragging{position:absolute;pointer-events:none;z-index:1000}.reorder-item{transition:top .3s ease,left .3s ease}";
-class u extends m {
-  /**
-   * Creates an instance of Select.
-   *
-   * @constructor
-   */
-  constructor() {
-    super();
-    g(this, "className", "Select");
-    this.dragEl = null, this.items = [], this.originalIndex = null, this.isDragging = !1, this.offsetX = 0, this.offsetY = 0, this.cloneEl = null;
-  }
-  /**
-   * Returns the CSS styles for the component.
-   *
-   * @static
-   * @returns {CSSStyleSheet}
-   */
-  static get cssStyleSheet() {
-    return p;
-  }
-  /**
-   * Returns the list of attributes to observe for changes.
-   *
-   * @static
-   * @returns {Array<string>}
-   */
-  static get observedAttributes() {
-    return [];
-  }
-  /**
-   * Sets up the attributes for the component.
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  draw(e, t, i) {
-    const s = document.createDocumentFragment(), n = document.createElement("div");
-    n.classList.add("container"), n.setAttribute("part", "native");
-    const o = document.createElement("slot");
-    return o.classList.add("reorder-items"), n.appendChild(o), s.appendChild(n), this.container = n, s;
-  }
-  afterDraw(e, t, i) {
-    const s = this.querySelectorAll("wje-reorder-item"), n = this.querySelectorAll("wje-reorder-dropzone");
-    this.container.classList.add(this.hasAttribute("reverse") ? "reversed" : "basic"), n && n.forEach((o) => {
-      this.container.classList.remove("container"), this.container.classList.add("container-w-dropzones");
-    }), s && s.forEach((o) => {
-      const d = o.querySelectorAll("[slot=handle]");
-      (d.length > 0 ? d : [o]).forEach((c) => {
-        this.attachEventListeners(c);
-      });
-    });
-  }
-  attachEventListeners(e) {
-    e.addEventListener("mousedown", this.onMouseDown.bind(this), !1), e.addEventListener("touchstart", this.onTouchStart.bind(this), !1), e.addEventListener("dragstart", this.onDragStart.bind(this), !1);
-  }
-  /*Initialization of dragging
-  **********************************************************************************/
-  onMouseDown(e) {
-    this.startDragging(e.clientX, e.clientY, e.currentTarget), document.addEventListener("mousemove", this.onMouseMove.bind(this), !1), document.addEventListener("mouseup", this.onMouseUp.bind(this), !1), document.body.style.userSelect = "none";
-  }
-  onTouchStart(e) {
-    const t = e.touches[0];
-    this.startDragging(t.clientX, t.clientY, e.currentTarget), document.addEventListener("touchmove", this.onTouchMove.bind(this), !1), document.addEventListener("touchend", this.onTouchEnd.bind(this), !1), document.body.style.userSelect = "none";
-  }
-  startDragging(e, t, i) {
-    if (this.hasAttribute("disabled"))
-      return;
-    this.isDragging = !0, this.dragEl = i.closest("wje-reorder-item"), this.createClone(), this.dragEl.style.opacity = "0.3";
-    const s = this.dragEl.getBoundingClientRect();
-    this.offsetX = e - s.left, this.offsetY = t - s.top, this.dragEl.classList.add("dragging"), this.originalIndex = [...this.dragEl.parentNode.children].indexOf(this.dragEl), this.originalParent = this.dragEl.parentNode;
-  }
-  /*Initialization of movement
-  **********************************************************************************/
-  onMouseMove(e) {
-    this.isDragging && (this.moveElement(e.pageX, e.pageY), this.cloneEl && (this.cloneEl.style.left = `${e.pageX - this.offsetX}px`, this.cloneEl.style.top = `${e.pageY - this.offsetY}px`));
-  }
-  onTouchMove(e) {
-    if (!this.isDragging)
-      return;
-    const t = e.touches[0];
-    this.moveElement(t.pageX, t.pageY);
-  }
-  moveElement(e, t) {
-    const i = window.scrollX || document.documentElement.scrollLeft, s = window.scrollY || document.documentElement.scrollTop, n = e - i, o = t - s;
-    this.dragEl.style.left = `${n}px`, this.dragEl.style.top = `${o}px`, this.cloneEl && (this.cloneEl.style.left = `${n}px`, this.cloneEl.style.top = `${o}px`), this.querySelectorAll("wje-reorder-item").forEach((r) => {
-      if (r === this.dragEl)
-        return;
-      const c = r.getBoundingClientRect(), h = (o - c.top) / c.height * 100;
-      h > 30 && this.isMovingDown(r) ? r.parentNode.insertBefore(this.dragEl, r.nextSibling) : h < 30 && !this.isMovingDown(r) && r.parentNode.insertBefore(this.dragEl, r);
-    });
-  }
-  /*End of dragging
-  **********************************************************************************/
-  onMouseUp() {
-    this.stopDragging(), document.removeEventListener("mousemove", this.onMouseMove.bind(this), !1), document.removeEventListener("mouseup", this.onMouseUp.bind(this), !1), this.cloneEl && (this.cloneEl.remove(), this.cloneEl = null), this.dragEl && (this.dragEl.style.opacity = "1");
-  }
-  onTouchEnd() {
-    this.stopDragging(), document.removeEventListener("touchmove", this.onTouchMove.bind(this), !1), document.removeEventListener("touchend", this.onTouchEnd.bind(this), !1);
-  }
-  stopDragging() {
-    if (!this.isDragging)
-      return;
-    this.isDragging = !1, this.dragEl.classList.remove("dragging"), this.dragEl.style.left = "", this.dragEl.style.top = "";
-    const e = this.dragEl.parentNode, t = Array.from(e.children).indexOf(this.dragEl), i = Array.from(e.children).map((s) => {
-      const n = s.cloneNode(!0), o = n.querySelector(".handle");
-      return o && o.remove(), n.innerText.trim();
-    });
-    this.dispatchChange(this.originalIndex, t, i), document.body.style.userSelect = "";
-  }
-  onDragStart(e) {
-    e.preventDefault();
-  }
-  /*Helpers
-  **********************************************************************************/
-  createClone() {
-    this.cloneEl = this.dragEl.cloneNode(!0), this.cloneEl.style.position = "absolute", this.cloneEl.style.pointerEvents = "none", this.cloneEl.style.visibility = "visible", document.body.appendChild(this.cloneEl);
-  }
-  isMovingDown(e) {
-    const t = e.parentNode, i = Array.from(t.children).indexOf(this.dragEl), s = Array.from(t.children).indexOf(e);
-    return i < s;
-  }
-  dispatchChange(e, t, i) {
-    console.log("FROM:", e), console.log("TO:", t), console.log("ORDER:", i), this.dispatchEvent(
-      new CustomEvent("wje-reorder:change", {
-        detail: { from: e, to: t, order: i }
-      })
-    );
-  }
-}
-u.define("wje-reorder", u);
-export {
-  u as default
-};

package/dist/wje-route.js

@@ -1,46 +0,0 @@
-var u = Object.defineProperty;
-var c = (t, e, r) => e in t ? u(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r;
-var s = (t, e, r) => (c(t, typeof e != "symbol" ? e + "" : e, r), r);
-import m from "./wje-element.js";
-class a extends m {
-  /**
-   * Creates an instance of Route.
-   *
-   * @constructor
-   */
-  constructor() {
-    super();
-    s(this, "className", "Route");
-  }
-  /**
-   * Returns the list of attributes to observe for changes.
-   *
-   * @static
-   * @returns {Array<string>}
-   */
-  static get observedAttributes() {
-    return [];
-  }
-  /**
-   * Sets up the attributes for the component.
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  /**
-   * Draws the component.
-   *
-   * @param {Object} context - The context for drawing.
-   * @param {Object} store - The store for drawing.
-   * @param {Object} params - The parameters for drawing.
-   * @returns {DocumentFragment}
-   */
-  draw(r, d, l) {
-    let o = document.createDocumentFragment(), n = document.createElement("slot");
-    return o.appendChild(n), o;
-  }
-}
-a.define("wje-route", a);
-export {
-  a as default
-};

package/dist/wje-router-link.js

@@ -1,64 +0,0 @@
-var a = Object.defineProperty;
-var c = (e, t, s) => t in e ? a(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s;
-var n = (e, t, s) => (c(e, typeof t != "symbol" ? t + "" : t, s), s);
-import u from "./wje-element.js";
-import { b as l } from "./router-links-FtZbFUto.js";
-const d = ":host{display:block;background:transparent!important}:host(.active){cursor:pointer;font-weight:700}";
-class o extends u {
-  /**
-   * Creates an instance of RouterLink.
-   *
-   * @constructor
-   */
-  constructor() {
-    super();
-    n(this, "className", "RouterLink");
-    this.unbindRouterLinks = l(this, { selector: !1 });
-  }
-  /**
-   * Returns the CSS styles for the component.
-   *
-   * @static
-   * @returns {CSSStyleSheet}
-   */
-  static get cssStyleSheet() {
-    return d;
-  }
-  /**
-   * Returns the list of attributes to observe for changes.
-   *
-   * @static
-   * @returns {Array<string>}
-   */
-  static get observedAttributes() {
-    return [];
-  }
-  /**
-   * Sets up the attributes for the component.
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open", this.setAttribute("active-class", "active");
-  }
-  /**
-   * Draws the component.
-   *
-   * @param {Object} context - The context for drawing.
-   * @param {Object} store - The store for drawing.
-   * @param {Object} params - The parameters for drawing.
-   * @returns {DocumentFragment}
-   */
-  draw(s, m, p) {
-    let r = document.createDocumentFragment(), i = document.createElement("slot");
-    return r.appendChild(i), r;
-  }
-  /**
-   * Cleans up before the component is disconnected.
-   */
-  beforeDisconnect() {
-    this.unbindRouterLinks();
-  }
-}
-o.define("wje-router-link", o);
-export {
-  o as default
-};

package/dist/wje-router-outlet.js

@@ -1,127 +0,0 @@
-var C = Object.defineProperty;
-var E = (i, t, n) => t in i ? C(i, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : i[t] = n;
-var m = (i, t, n) => (E(i, typeof t != "symbol" ? t + "" : t, n), n);
-import b from "./wje-element.js";
-class $ {
-  constructor(t = {}) {
-    this.options = t;
-  }
-  getOption(t, n) {
-    return t.hasAttribute(n) ? t.getAttribute(n) : this.options[n];
-  }
-  hasOption(t, n) {
-    return t.hasAttribute(n) || this.options[n];
-  }
-  runParallel(t) {
-    return this.hasOption(t, "parallel");
-  }
-  beforeEnter(t, n) {
-  }
-  enter(t, n) {
-  }
-  leave(t, n, e) {
-    e();
-  }
-}
-var p = window.requestAnimationFrame, v = "transition", L = "animation", d = "transition", N = "transitionend", c = "animation", D = "animationend";
-function O(i) {
-  window.scrollTo(0, 0), p(function() {
-    window.scrollTo(0, 0), p(i);
-  });
-}
-function x(i, t) {
-  var n = k(i), e = n.type, r = n.timeout, l = n.propCount;
-  if (!e)
-    return t();
-  var s = e === v ? N : D, u = 0, o = function() {
-    i.removeEventListener(s, a), t();
-  }, a = function(h) {
-    h.target === i && ++u >= l && o();
-  };
-  setTimeout(function() {
-    u < l && o();
-  }, r + 1), i.addEventListener(s, a);
-}
-function k(i) {
-  var t = window.getComputedStyle(i), n = (t[d + "Delay"] || "").split(", "), e = (t[d + "Duration"] || "").split(", "), r = f(n, e), l = (t[c + "Delay"] || "").split(", "), s = (t[c + "Duration"] || "").split(", "), u = f(l, s), o, a = 0, h = 0;
-  return a = Math.max(r, u), o = a > 0 ? r > u ? v : L : null, h = o ? o === v ? e.length : s.length : 0, {
-    type: o,
-    timeout: a,
-    propCount: h
-  };
-}
-function f(i, t) {
-  for (; i.length < t.length; )
-    i = i.concat(i);
-  return Math.max.apply(null, t.map(function(n, e) {
-    return g(n) + g(i[e]);
-  }));
-}
-function g(i) {
-  return Number(i.slice(0, -1).replace(",", ".")) * 1e3;
-}
-function A(i, t, n, e) {
-  i.classList.add(`${t}-${n}-active`), O(function() {
-    window.scrollTo(0, 0), i.classList.remove(`${t}-${n}`), i.classList.add(`${t}-${n}-to`), x(i, function() {
-      i.classList.remove(`${t}-${n}-active`, `${t}-${n}-to`), e && e();
-    });
-  });
-}
-class y extends $ {
-  beforeEnter(t, n) {
-    const e = t.getAttribute("animation") || "outlet";
-    n.classList.add(`${e}-enter`);
-  }
-  enter(t, n) {
-    const e = t.getAttribute("animation") || "outlet";
-    A(n, e, "enter");
-  }
-  leave(t, n, e) {
-    const r = t.getAttribute("animation") || "outlet";
-    n.classList.add(`${r}-leave`), n.style.display = "none", A(n, r, "leave", e);
-  }
-}
-const I = {};
-let w;
-function T(i) {
-  return I[i] || w || (w = new y());
-}
-class M extends HTMLElement {
-  appendChild(t) {
-    if (!this.hasAttribute("animation")) {
-      super.appendChild(t);
-      return;
-    }
-    const n = T(this.getAttribute("animation")), e = n.runParallel(this);
-    n.beforeEnter(this, t), super.appendChild(t), !e && this.removing ? this.appending = t : n.enter(this, t);
-  }
-  removeChild(t) {
-    if (!this.hasAttribute("animation")) {
-      super.removeChild(t);
-      return;
-    }
-    const n = T(this.getAttribute("animation"));
-    if (this.removing && this.removing.parentNode === this && super.removeChild(this.removing), t === this.appending) {
-      t.parentNode === this && super.removeChild(t), this.removing = null;
-      return;
-    }
-    this.removing = t, n.leave(this, t, () => {
-      this.removing && this.removing.parentNode === this && super.removeChild(this.removing), this.appending && n.enter(this, this.appending), this.appending = null, this.removing = null;
-    });
-  }
-}
-class P extends M {
-  /**
-   * Creates an instance of Route.
-   *
-   * @constructor
-   */
-  constructor() {
-    super();
-    m(this, "className", "RouterOutlet");
-  }
-}
-b.define("wje-router-outlet", P);
-export {
-  P as default
-};