wj-elements 0.1.46 → 0.1.48

package/dist/wje-aside.js

@@ -1,55 +0,0 @@
-var a = Object.defineProperty;
-var h = (t, e, i) => e in t ? a(t, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[e] = i;
-var s = (t, e, i) => (h(t, typeof e != "symbol" ? e + "" : e, i), i);
-import l from "./wje-element.js";
-const n = ':host{--wje-aside-width: "100px";--wje-aside-top: 0;--wje-aside-border-color: var(--wje-border-color);--wje-aside-border-width: 0 1px 0 0;--wje-aside-border-style: solid;box-sizing:border-box;flex-shrink:0;overflow:auto;border-color:var(--wje-aside-border-color);border-width:var(--wje-aside-border-width);border-style:var(--wje-aside-border-style)}:host(.open){display:block!important}@media (min-width: 768px){:host([fixed]){position:fixed;width:var(--wje-aside-width);top:var(--wje-aside-top);height:calc(100% - var(--wje-aside-top))}}@media (max-width: 768px){:host{display:none}:host([variant=top-start]){position:fixed;top:0;left:0;width:80%;height:100%;z-index:9999;background-color:#fff}}';
-class r extends l {
-  /**
-   * Constructor for the Aside class.
-   */
-  constructor() {
-    super();
-    /**
-     * The class name for the Aside element ddddd.
-     * @type {string}
-     */
-    s(this, "className", "Aside");
-  }
-  /**
-   * Getter for the CSS stylesheet.
-   * @return {Object} The styles for the Aside element.
-   */
-  static get cssStyleSheet() {
-    return n;
-  }
-  /**
-   * Getter for the observed attributes.
-   * @return {Array} An empty array as there are no observed attributes.
-   */
-  static get observedAttributes() {
-    return [];
-  }
-  /**
-   * Method to setup attributes for the Aside element.
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  /**
-   * Method to draw the Aside element.
-   * @param {Object} context - The context in which the element is drawn.
-   * @param {Object} store - The store containing the state of the element.
-   * @param {Object} params - The parameters for drawing the element.
-   * @return {Object} The document fragment containing the drawn element.
-   */
-  draw(i, w, p) {
-    let o = document.createDocumentFragment();
-    this.width && this.style.setProperty("--wje-aside-width", this.width), this.top && this.hasAttribute("fixed") && this.style.setProperty("--wje-aside-top", this.top);
-    let d = document.createElement("slot");
-    return o.appendChild(d), o;
-  }
-}
-r.define("wje-aside", r);
-export {
-  r as default
-};

package/dist/wje-avatar.js

@@ -1,77 +0,0 @@
-var w = Object.defineProperty;
-var u = (a, t, e) => t in a ? w(a, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[t] = e;
-var h = (a, t, e) => (u(a, typeof t != "symbol" ? t + "" : t, e), e);
-import c from "./wje-element.js";
-function j(a, t = 40, e = 65) {
-  let r = a, o = 0;
-  for (let i = 0; i < (r == null ? void 0 : r.length); i++)
-    o = r.charCodeAt(i) + ((o << 5) - o);
-  return "hsl(" + o % 360 + ", " + t + "%, " + e + "%)";
-}
-function p(a, t = 2) {
-  let e = a.split(" "), r = e[0].substring(0, 1).toUpperCase();
-  return e.length > 1 && t > 1 && (r += e[e.length - 1].substring(0, 1).toUpperCase()), r;
-}
-const z = ':host{display:inline-block;font-size:var(--wje-avatar-font-size);font-weight:var(--wje-avatar-font-weight);color:var(--wje-avatar-color)}:host .native-avatar{position:relative;display:flex;align-items:center;justify-content:center;width:var(--wje-avatar-size);height:var(--wje-avatar-size);border-radius:var(--wje-avatar-border-radius);background-color:var(--wje-avatar-background-color)}::slotted(wje-img),::slotted(img){border-radius:var(--wje-avatar-border-radius);width:100%;height:100%;object-fit:cover;overflow:hidden}:host(.wje-avatar-border){border-color:var(--wje-avatar-border-color);border-width:var(--wje-avatar-border-width);border-style:var(--wje-avatar-border-style)}:host([size="small"]){--wje-avatar-size: var(--wje-size-small);--wje-avatar-font-size: var(--wje-font-size-2x-small)}:host([size="medium"]){--wje-avatar-size: var(--wje-size-medium);--wje-avatar-font-size: var(--wje-font-size-2x-small)}:host([size="normal"]){--wje-avatar-size: var(--wje-size)}:host([size="large"]){--wje-avatar-size: var(--wje-size-large)}:host([size="x-large"]){--wje-avatar-size: var(--wje-size-x-large)}:host([size="2x-large"]){--wje-avatar-size: var(--wje-size-2x-large);--wje-avatar-font-size: var(--wje-font-size-small)}:host([size="3x-large"]){--wje-avatar-size: var(--wje-size-3x-large);--wje-avatar-font-size: var(--wje-font-size-medium)}:host([size="4x-large"]){--wje-avatar-size: var(--wje-size-4x-large);--wje-avatar-font-size: var(--wje-font-size-x-large)}:host([size="5x-large"]){--wje-avatar-size: var(--wje-size-5x-large);--wje-avatar-font-size: var(--wje-font-size-3x-large)}:host slot[name=status]{display:block;position:absolute}:host([status-placement=top-start]) slot[name=status]{top:-4px;left:-4px}:host([status-placement=top-end]) slot[name=status]{top:-4px;right:-4px}:host([status-placement=bottom-start]) slot[name=status]{bottom:-4px;left:-4px}:host([status-placement=bottom-end]) slot[name=status]{bottom:-4px;right:-4px}';
-class m extends c {
-  /**
-   * Avatar class constructor
-   */
-  constructor() {
-    super();
-    /**
-     * Class name
-     */
-    h(this, "className", "Avatar");
-  }
-  /**
-   * Getter for cssStyleSheet
-   * @returns {string} styles
-   */
-  static get cssStyleSheet() {
-    return z;
-  }
-  /**
-   * Method to setup attributes
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  /**
-   * Method to draw the avatar
-   * @param {object} context - The context
-   * @param {object} store - The store
-   * @param {object} params - The parameters
-   * @returns {object} fragment - The document fragment
-   */
-  draw(e, r, o) {
-    let n = document.createDocumentFragment(), s = document.createElement("div");
-    s.setAttribute("part", "native"), s.classList.add("native-avatar");
-    let i = document.createElement("slot");
-    if (s.appendChild(i), this.hasAttribute("initials")) {
-      let l = p(this.label);
-      this.setAttribute("style", `--wje-avatar-background-color: ${j(l)}`), s.innerText = l;
-    } else {
-      let l = document.createElement("slot");
-      l.setAttribute("name", "icon"), s.appendChild(l);
-    }
-    let v = document.createElement("slot");
-    v.setAttribute("name", "status"), v.setAttribute("part", "status");
-    let d = document.createElement("slot");
-    return d.setAttribute("name", "secondary"), d.setAttribute("part", "secondary"), s.appendChild(v), s.appendChild(d), n.appendChild(s), n;
-  }
-  /**
-   * Method to check if the avatar is an image
-   * @returns {boolean} - True if the avatar is an image, false otherwise
-   */
-  isImage() {
-    return this.getElementsByTagName("wje-img").length > 0;
-  }
-  dispatchEvent(e) {
-    return !1;
-  }
-}
-m.define("wje-avatar", m);
-export {
-  m as default
-};

package/dist/wje-badge.js

@@ -1,50 +0,0 @@
-var s = Object.defineProperty;
-var d = (e, o, r) => o in e ? s(e, o, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[o] = r;
-var c = (e, o, r) => (d(e, typeof o != "symbol" ? o + "" : o, r), r);
-import i from "./wje-element.js";
-const w = ".native-badge{display:flex;align-items:center;justify-content:center;text-shadow:none;font-family:var(--wje-font-family);font-size:var(--wje-font-size-x-small);line-height:1;padding:0;padding-block:0;padding-inline:var(--wje-spacing-2x-small);border-radius:var(--wje-badge-border-radius);border-width:1px;border-style:solid;border-color:transparent;height:18px}.wje-color-primary{background-color:var(--wje-color-primary-2);color:var(--wje-color-primary-9)}.wje-color-complete{background-color:var(--wje-color-complete-2);color:var(--wje-color-complete-9)}.wje-color-success{background-color:var(--wje-color-success-2);color:var(--wje-color-success-9)}.wje-color-warning{background-color:var(--wje-color-warning-2);color:var(--wje-color-warning-11)}.wje-color-danger{background-color:var(--wje-color-danger-2);color:var(--wje-color-danger-9)}.wje-color-info{background-color:var(--wje-color-contrast-0);color:var(--wje-color-info-11);border-color:var(--wje-color-contrast-2)}.wje-color-default{background-color:var(--wje-color-contrast-3);color:var(--wje-color-contrast-11)}";
-class l extends i {
-  /**
-   * Badge constructor
-   * @constructor
-   */
-  constructor() {
-    super();
-    /**
-     * Class name
-     * @type {string}
-     */
-    c(this, "className", "Badge");
-  }
-  /**
-   * Get CSS stylesheet
-   * @static
-   * @returns {Object} styles - The CSS styles
-   */
-  static get cssStyleSheet() {
-    return w;
-  }
-  /**
-   * Setup attributes
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  /**
-   * Draw method
-   * @param {Object} context - The context
-   * @param {Object} store - The store
-   * @param {Object} params - The parameters
-   * @returns {Object} fragment - The document fragment
-   */
-  draw(r, j, g) {
-    let t = document.createDocumentFragment(), a = document.createElement("div");
-    a.setAttribute("part", "native"), a.classList.add("native-badge"), this.hasAttribute("color") ? a.classList.add("wje-color-" + this.color, "wje-color") : a.classList.add("wje-color-default", "wje-color");
-    let n = document.createElement("slot");
-    return a.appendChild(n), t.appendChild(a), t;
-  }
-}
-l.define("wje-badge", l);
-export {
-  l as default
-};

package/dist/wje-breadcrumb.js

@@ -1,148 +0,0 @@
-var b = Object.defineProperty;
-var w = (s, r, e) => r in s ? b(s, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[r] = e;
-var m = (s, r, e) => (w(s, typeof r != "symbol" ? r + "" : r, e), e);
-import f, { WjElementUtils as l, event as g } from "./wje-element.js";
-const j = ':host{display:flex;flex:0 0 auto;align-items:center;line-height:1.5}:host(.collapsed){display:none}.native-breadcrumb{display:flex;align-items:center;width:100%;outline:none;background:inherit;padding:.25rem .75rem;color:var(--wje-breadcrumb-a);text-decoration:none}.native-breadcrumb.hidden{display:none}.native-breadcrumb.active{font-weight:700}.native-breadcrumb:hover{color:var(--wje-breadcrumb-a-hover)}button{margin-inline:.75rem;border:0 solid transparent;border-radius:3px;background-color:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer}.separator{display:inline-flex;align-items:center}::slotted([slot="start"]){margin-inline:0 .5rem}::slotted([slot="end"]){margin-inline:.5rem 0}';
-class u extends f {
-  /**
-   * Breadcrumb constructor
-   */
-  constructor() {
-    var e;
-    super();
-    /**
-     * Class name
-     * @type {string}
-     */
-    m(this, "className", "Breadcrumb");
-    this._showSeparator = !0, this._collapsedVariant = ((e = this.parentElement) == null ? void 0 : e.collapsedVariant) || "BUTTON";
-  }
-  /**
-   * Get show separator flag
-   * @returns {boolean} showSeparator - The show separator flag
-   */
-  get showSeparator() {
-    return this._showSeparator;
-  }
-  /**
-   * Set show separator flag
-   * @param {boolean} value - The value to set
-   */
-  set showSeparator(e) {
-    this._showSeparator = e;
-  }
-  /**
-   * Get collapsed variant
-   * @returns {string} collapsedVariant - The collapsed variant
-   */
-  get collapsedVariant() {
-    return this._collapsedVariant.toUpperCase();
-  }
-  /**
-   * Set collapsed variant
-   * @param {string} value - The value to set
-   */
-  set collapsedVariant(e) {
-    this._collapsedVariant = e || this.parentElement.collapsedVariant;
-  }
-  /**
-   * Get CSS stylesheet
-   * @static
-   * @returns {Object} styles - The CSS styles
-   */
-  static get cssStyleSheet() {
-    return j;
-  }
-  /**
-   * Get observed attributes
-   * @static
-   * @returns {Array<string>} observedAttributes - The observed attributes
-   */
-  static get observedAttributes() {
-    return ["show-collapsed-indicator", "collapsed", "last"];
-  }
-  /**
-   * Attribute changed callback
-   * @param {string} name - The attribute name
-   * @param {string} oldValue - The old value
-   * @param {string} newValue - The new value
-   * @returns {boolean} false - Always returns false
-   */
-  attributeChangedCallback(e, n, t) {
-    return e === "collapsed" ? l.stringToBoolean(t) && this.classList.add("collapsed") : e === "show-collapsed-indicator" ? l.stringToBoolean(t) && (this.showCollapsedIndicator = !0, this.refresh()) : e === "last" && (this.active = l.stringToBoolean(t), this.showSeparator = !l.stringToBoolean(t), this.refresh()), !1;
-  }
-  /**
-   * Setup attributes
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  /**
-   * Draw method
-   * @param {Object} context - The context
-   * @param {Object} store - The store
-   * @param {Object} params - The parameters
-   * @returns {Object} fragment - The document fragment
-   */
-  draw(e, n, t) {
-    let o = document.createDocumentFragment(), a = document.createElement("a");
-    a.classList.add("native-breadcrumb"), a.setAttribute("part", "native"), this.active && a.classList.add("active");
-    let h = document.createElement("slot"), d = document.createElement("slot");
-    d.setAttribute("name", "start");
-    let c = document.createElement("slot");
-    if (c.setAttribute("name", "end"), a.appendChild(d), a.appendChild(h), a.appendChild(c), o.appendChild(a), this.showCollapsedIndicator && (o.appendChild(this.drawCollapsedIndicator()), this.classList.remove("collapsed"), a.classList.add("hidden")), this.showSeparator) {
-      let i = document.createElement("span");
-      if (i.classList.add("separator"), i.setAttribute("part", "separator"), l.hasSlot(this, "separator")) {
-        let p = document.createElement("slot");
-        p.setAttribute("name", "separator"), i.appendChild(p);
-      } else
-        i.innerHTML = `<wje-icon name=${this.separator || "chevron-right"}></wje-icon>`;
-      o.appendChild(i);
-    }
-    return this.native = a, o;
-  }
-  /**
-   * Draw collapsed indicator
-   * @returns {Object} collapsedIndicator - The collapsed indicator
-   */
-  drawCollapsedIndicator() {
-    let e = null;
-    return this.collapsedVariant === "DROPDOWN" ? e = this.collapseDropdown() : e = this.collapseButton(), e;
-  }
-  /**
-   * Collapse dropdown
-   * @returns {Object} dropdown - The dropdown
-   */
-  collapseDropdown() {
-    let e = document.createElement("wje-dropdown");
-    e.setAttribute("placement", "bottom"), e.setAttribute("offset", "10");
-    let n = document.createElement("wje-button");
-    n.setAttribute("slot", "trigger"), n.setAttribute("fill", "link"), n.innerHTML = '<wje-icon name="dots"></wje-icon>';
-    let t = document.createElement("wje-menu");
-    return t.setAttribute("variant", "context"), e.appendChild(n), e.appendChild(t), e.innerHTML = `<wje-button slot="trigger" fill="link">
-            <wje-icon name="dots"></wje-icon>
-        </wje-button>
-        <wje-menu variant="context">
-            <wje-menu-item>Test 0</wje-menu-item>
-            <wje-menu-item>Test 1</wje-menu-item>
-            <wje-menu-item>Test 2</wje-menu-item>
-        </wje-menu>`, this.parentElement.querySelectorAll("wje-breadcrumb").forEach((o) => {
-    }), e;
-  }
-  /**
-   * Collapse button
-   * @returns {Object} button - The button
-   */
-  collapseButton() {
-    let e = document.createElement("button");
-    return e.setAttribute("aria-label", "Show more breadcrumbs"), e.setAttribute("part", "collapsed-indicator"), e.innerHTML = '<wje-icon name="dots"></wje-icon>', g.addListener(e, "click", null, (n) => {
-      this.native.classList.remove("hidden"), e.remove(), this.parentElement.querySelectorAll("wje-breadcrumb").forEach((t) => {
-        t.classList.remove("collapsed");
-      }), n.stopPropagation();
-    }), e;
-  }
-}
-u.define("wje-breadcrumb", u);
-export {
-  u as default
-};

package/dist/wje-breadcrumbs.js

@@ -1,67 +0,0 @@
-var n = Object.defineProperty;
-var d = (r, t, e) => t in r ? n(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
-var i = (r, t, e) => (d(r, typeof t != "symbol" ? t + "" : t, e), e);
-import f from "./wje-element.js";
-const p = ":host{display:flex;flex-wrap:wrap;align-items:center}";
-class c extends f {
-  /**
-   * Breadcrumbs constructor
-   * @constructor
-   */
-  constructor() {
-    super();
-    /**
-     * Class name
-     * @type {string}
-     */
-    i(this, "className", "Breadcrumbs");
-    this.last = !1;
-  }
-  /**
-   * Get CSS stylesheet
-   * @static
-   * @returns {Object} styles - The CSS styles
-   */
-  static get cssStyleSheet() {
-    return p;
-  }
-  /**
-   * Setup attributes
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  /**
-   * Draw method
-   * @param {Object} context - The context
-   * @param {Object} store - The store
-   * @param {Object} params - The parameters
-   * @returns {Object} fragment - The document fragment
-   */
-  draw(e, l, o) {
-    let s = document.createDocumentFragment(), u = document.createElement("slot");
-    return s.appendChild(u), s;
-  }
-  /**
-   * After draw method
-   */
-  afterDraw() {
-    let e = +this.maxItems || 0, l = +this.itemsBeforeCollapse || 1, o = +this.itemsAfterCollapse || 1, s = this.getBreadcrumbs();
-    if (s.length === 0)
-      return;
-    s.findLast((a) => a).setAttribute("last", !0), e !== void 0 && s.length > e && l + o <= e && s.forEach((a, m) => {
-      m === l && a.setAttribute("show-collapsed-indicator", !0), m >= l && m < s.length - o && a.setAttribute("collapsed", !0);
-    });
-  }
-  /**
-   * Get breadcrumbs
-   * @returns {Array} breadcrumbs - The breadcrumbs
-   */
-  getBreadcrumbs() {
-    return Array.from(this.querySelectorAll("wje-breadcrumb")) || [];
-  }
-}
-c.define("wje-breadcrumbs", c);
-export {
-  c as default
-};

package/dist/wje-button-group.js

@@ -1,78 +0,0 @@
-var d = Object.defineProperty;
-var p = (o, e, t) => e in o ? d(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
-var i = (o, e, t) => (p(o, typeof e != "symbol" ? e + "" : e, t), t);
-import u from "./wje-element.js";
-const g = ":host{display:inline-block}:host .native-button-group{display:flex;flex-wrap:nowrap;line-height:1}:host slot{display:contents}::slotted(wje-button){margin:0!important}";
-class m extends u {
-  /**
-   * ButtonGroup constructor
-   * @constructor
-   */
-  constructor() {
-    super();
-    /**
-     * Class name
-     * @type {string}
-     */
-    i(this, "className", "ButtonGroup");
-  }
-  /**
-   * Get CSS stylesheet
-   * @static
-   * @returns {Object} styles - The CSS styles
-   */
-  static get cssStyleSheet() {
-    return g;
-  }
-  /**
-   * Get observed attributes
-   * @static
-   * @returns {Array<string>} observedAttributes - The observed attributes
-   */
-  static get observedAttributes() {
-    return [];
-  }
-  /**
-   * Setup attributes
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  /**
-   * Draw method
-   * @param {Object} context - The context
-   * @param {Object} store - The store
-   * @param {Object} params - The parameters
-   * @returns {Object} fragment - The document fragment
-   */
-  draw(t, l, c) {
-    let s = document.createDocumentFragment(), n = document.createElement("div");
-    return n.classList.add("native-button-group"), n.setAttribute("part", "native"), this.slotElement = document.createElement("slot"), n.appendChild(this.slotElement), s.appendChild(n), s;
-  }
-  /**
-   * After draw method
-   * @param {Object} context - The context
-   * @param {Object} store - The store
-   * @param {Object} params - The parameters
-   */
-  afterDraw(t, l, c) {
-    const s = [...this.slotElement.assignedElements({ flatten: !0 })];
-    s.forEach((n) => {
-      let a = s.indexOf(n), r = this.findButton(n);
-      r && (r.classList.add("wje-button-group-button"), r.classList.toggle("wje-button-group-first", a === 0), r.classList.toggle("wje-button-group-inner", a > 0 && a < s.length - 1), r.classList.toggle("wje-button-group-last", a === s.length - 1));
-    });
-  }
-  /**
-   * Find button method
-   * @param {Object} el - The element
-   * @returns {Object} button - The button
-   */
-  findButton(t) {
-    const l = "wje-button";
-    return t.closest(l) ?? t.querySelector(l);
-  }
-}
-u.define("wje-button-group", m);
-export {
-  m as default
-};