wj-elements 0.1.48 → 0.1.49

package/dist/wje-toolbar.js

@@ -0,0 +1,61 @@
+var s = Object.defineProperty;
+var b = (e, t, o) => t in e ? s(e, t, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[t] = o;
+var d = (e, t, o) => (b(e, typeof t != "symbol" ? t + "" : t, o), o);
+import p from "./wje-element.js";
+import { w as c } from "./router-links-FtZbFUto.js";
+const m = ':host{--wje-toolbar-background: var(--wje-background);--wje-toolbar-height: auto;--wje-toolbar-min-height: 70px;--wje-toolbar-padding-top: 1rem;--wje-toolbar-padding-bottom: 1rem;--wje-toolbar-padding-inline: 1.5rem;--wje-toolbar-border-color: var(--wje-border-color);--wje-toolbar-top: 0;width:100%;height:var(--wje-toolbar-height)}.native-toolbar{background-color:var(--wje-toolbar-background);display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;border-bottom:1px solid var(--wje-toolbar-border-color);padding-inline:var(--wje-toolbar-padding-inline);padding-top:var(--wje-toolbar-padding-top);padding-bottom:var(--wje-toolbar-padding-bottom);box-shadow:0 10px 30px #523f690d}::slotted{grid-column:span 4}::slotted([slot="start"]){margin-right:auto}:host([sticky]){position:sticky;top:var(--wje-toolbar-top);z-index:99}';
+class l extends c(p) {
+  /**
+   * @constructor
+   * @summary Toolbar constructor
+   */
+  constructor() {
+    super();
+    /**
+     * @summary Class name
+     * @type {string}
+     */
+    d(this, "className", "Toolbar");
+  }
+  /**
+   * @summary Get CSS stylesheet
+   * @static
+   * @returns {Object} styles
+   */
+  static get cssStyleSheet() {
+    return m;
+  }
+  /**
+   * @summary Get observed attributes
+   * @static
+   * @returns {Array} An empty array
+   */
+  static get observedAttributes() {
+    return [];
+  }
+  /**
+   * @summary Setup attributes
+   */
+  setupAttributes() {
+    this.isShadowRoot = "open";
+  }
+  /**
+   * @summary Draw method
+   * @param {Object} context - The context
+   * @param {Object} store - The store
+   * @param {Object} params - The parameters
+   * @returns {Object} Document fragment
+   */
+  draw(o, u, w) {
+    let a = document.createDocumentFragment(), r = document.createElement("div");
+    r.setAttribute("part", "native"), r.classList.add("native-toolbar");
+    let n = document.createElement("slot");
+    n.setAttribute("name", "start");
+    let i = document.createElement("slot");
+    return i.setAttribute("name", "end"), r.appendChild(n), r.appendChild(i), a.appendChild(r), a;
+  }
+}
+l.define("wje-toolbar", l);
+export {
+  l as default
+};

package/dist/wje-tooltip.js

@@ -0,0 +1,116 @@
+var w = Object.defineProperty;
+var v = (s, o, t) => o in s ? w(s, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[o] = t;
+var a = (s, o, t) => (v(s, typeof o != "symbol" ? o + "" : o, t), t);
+import f, { event as n } from "./wje-element.js";
+const b = '.native-tooltip{display:flex;align-items:center;padding:var(--wje-tooltip-spacing);color:var(--wje-tooltip-color);background-color:var(--wje-tooltip-background);font-weight:var(--wje-tooltip-font-weight);font-size:var(--wje-tooltip-font-size);border-radius:var(--wje-tooltip-border-radius);line-height:var(--wje-tooltip-line-height);box-sizing:border-box;box-shadow:var(--wje-tooltip-shadow)}::slotted([slot="start"]){margin:0 .3rem 0 0}::slotted([slot="end"]){margin:0 0 0 .3rem}.arrow{position:absolute;width:10px;height:10px;background:var(--wje-tooltip-arrow-color);transform:rotate(45deg)}';
+class m extends f {
+  /**
+   * @constructor
+   * @summary Tooltip constructor
+   */
+  constructor() {
+    super();
+    /**
+     * @summary Class name
+     * @type {string}
+     */
+    a(this, "className", "Tooltip");
+    /**
+     * @summary Show tooltip
+     */
+    a(this, "onShow", () => {
+      var t;
+      this.classList.add("active"), !((t = this.querySelector("wje-dropdown")) != null && t.classList.contains("active")) && Promise.resolve(this.beforeShow(this)).then((e) => {
+        if (!this.classList.contains("active") || !e || typeof e != "string")
+          throw new Error("beforeShow method returned false or not string");
+        this.native.innerHTML = e, this.popup.show(), Promise.resolve(this.afterShow(this));
+      }).catch((e) => {
+        this.classList.remove("active"), this.popup.hide();
+      });
+    });
+    /**
+     * @summary Hide tooltip
+     */
+    a(this, "onHide", () => {
+      this.classList.remove("active"), this.popup.hide();
+    });
+  }
+  set content(t) {
+    this.setAttribute("content", t);
+  }
+  get content() {
+    return this.hasAttribute("content") ? this.getAttribute("content") : "";
+  }
+  /**
+   * @summary Get CSS stylesheet
+   * @static
+   * @returns {Object} styles
+   */
+  static get cssStyleSheet() {
+    return b;
+  }
+  /**
+   * @summary Get observed attributes
+   * @static
+   * @returns {Array} An array of observed attributes
+   */
+  static get observedAttributes() {
+    return ["active"];
+  }
+  /**
+   * @summary Setup attributes
+   */
+  setupAttributes() {
+    this.isShadowRoot = "open";
+  }
+  /**
+   * @summary Draw method
+   * @param {Object} context - The context
+   * @param {Object} store - The store
+   * @param {Object} params - The parameters
+   * @returns {Object} Document fragment
+   */
+  draw(t, e, g) {
+    let c = document.createDocumentFragment(), r = document.createElement("wje-popup");
+    r.setAttribute("placement", this.placement || "top"), r.setAttribute("offset", this.offset || "0");
+    let l = document.createElement("slot");
+    l.setAttribute("slot", "anchor");
+    let d = document.createElement("div");
+    d.classList.add("arrow"), d.setAttribute("slot", "arrow");
+    let h = document.createElement("slot");
+    h.setAttribute("name", "start");
+    let p = document.createElement("slot");
+    p.setAttribute("name", "end");
+    let u = document.createElement("div");
+    u.innerHTML = this.content;
+    let i = document.createElement("div");
+    return i.setAttribute("part", "native"), i.classList.add("native-tooltip"), i.appendChild(h), i.appendChild(u), i.appendChild(p), r.appendChild(l), r.appendChild(d), r.appendChild(i), this.mySlot = l, this.popup = r, this.native = i, c.appendChild(r), c;
+  }
+  /**
+   * @summary After draw method
+   */
+  afterDraw() {
+    let t = this.mySlot.assignedElements()[0];
+    this.selector && (t = this.checkSelector(t)), t && (n.addListener(t, "mouseenter", null, this.onShow), n.addListener(t, "mouseleave", null, this.onHide), n.addListener(this, "wje-dropdown:open", null, this.onHide), n.addListener(this, "wje-dropdown:close", null, this.onShow));
+  }
+  dispatch(t) {
+    return new Promise((e) => {
+      n.dispatchCustomEvent(this, t, {
+        resolve: e
+      });
+    });
+  }
+  beforeShow() {
+    return this.native.innerHTML;
+  }
+  afterShow() {
+  }
+  checkSelector(t) {
+    const e = t.querySelector(this.selector);
+    return e === null && console.error("Selector not found:", this.selector), e;
+  }
+}
+m.define("wje-tooltip", m);
+export {
+  m as default
+};

package/dist/wje-visually-hidden.js

@@ -0,0 +1,56 @@
+var a = Object.defineProperty;
+var p = (e, t, n) => t in e ? a(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
+var i = (e, t, n) => (p(e, typeof t != "symbol" ? t + "" : t, n), n);
+import d from "./wje-element.js";
+const l = ":host(:not(:focus-within)){position:absolute!important;width:1px!important;height:1px!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;border:none!important;overflow:hidden!important;white-space:nowrap!important;padding:0!important}";
+class r extends d {
+  /**
+   * @constructor
+   * @summary VisuallyHidden constructor
+   */
+  constructor() {
+    super();
+    /**
+     * @summary Class name
+     * @type {string}
+     */
+    i(this, "className", "VisuallyHidden");
+  }
+  /**
+   * @summary Get CSS stylesheet
+   * @static
+   * @returns {Object} styles
+   */
+  static get cssStyleSheet() {
+    return l;
+  }
+  /**
+   * @summary Get observed attributes
+   * @static
+   * @returns {Array} An empty array
+   */
+  static get observedAttributes() {
+    return [];
+  }
+  /**
+   * @summary Setup attributes
+   */
+  setupAttributes() {
+    this.isShadowRoot = "open";
+  }
+  /**
+   * @summary Draw method
+   * @param {Object} context - The context
+   * @param {Object} store - The store
+   * @param {Object} params - The parameters
+   * @returns {Object} Document fragment
+   */
+  draw(n, m, c) {
+    let o = document.createDocumentFragment(), s = document.createElement("slot");
+    return o.appendChild(s), o;
+  }
+}
+r.define("wje-visually-hidden", r);
+export {
+  r as default
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wj-elements",
   "description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
-  "version": "0.1.48",
+  "version": "0.1.49",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",