wj-elements 0.1.46 → 0.1.48

package/dist/wje-carousel.js

@@ -1,177 +0,0 @@
-var v = Object.defineProperty;
-var p = (o, a, e) => a in o ? v(o, a, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[a] = e;
-var u = (o, a, e) => (p(o, typeof a != "symbol" ? a + "" : a, e), e);
-import m from "./wje-element.js";
-const b = ".native-carousel{position:relative;width:var(--wje-carousel-width, 100%);height:var(--wje-carousel-height, 300px);scroll-behavior:smooth}.carousel-slides{display:flex;transition:transform .5s ease;align-items:center;justify-items:center;overflow:auto;overscroll-behavior-x:contain;scrollbar-width:none;-ms-overflow-style:none;aspect-ratio:var(--wje-aspect-ratio, 4 / 3);scroll-snap-type:x mandatory;scroll-padding-inline:0;overflow-y:hidden;padding-inline:var(--wje-spacing-inline, 0);gap:.5rem}.carousel-slides::-webkit-scrollbar{display:none}::slotted(wje-carousel-item){flex:0 0 var(--wje-carousel-size);height:100%}wje-button{position:absolute;top:50%;border:none;cursor:pointer;z-index:2}.prev{left:-1rem;transform:translate(-100%,-50%)}.next{right:-1rem;transform:translate(100%,-50%)}.pagination{position:relative;bottom:-.5rem;left:50%;transform:translate(-50%,100%);display:flex;z-index:2;justify-content:center}.pagination-item{cursor:pointer;height:15px;width:15px;margin:0 2px;background-color:var(--wje-color-contrast-4);display:inline-block;border-radius:50%}.pagination-item.active{background-color:var(--wje-color)}.thumbnails{display:flex;justify-content:center;align-items:center;overflow-x:auto;gap:.5rem;padding:0 .5rem;margin-top:.5rem;margin-bottom:.5rem;box-sizing:border-box;overflow-y:hidden}.thumbnails wje-thumbnail{--wje-thumbnail-width: 48px;--wje-thumbnail-height: 48px;--wje-thumbnail-border-radius: 0;cursor:pointer;border:1px solid transparent}.thumbnails .active{border:1px solid var(--wje-color-primary-11)}";
-class f extends m {
-  constructor() {
-    super();
-    u(this, "className", "Carousel");
-    this.slidePerPage = 1;
-  }
-  set activeSlide(e) {
-    this.setAttribute("active-slide", e);
-  }
-  get activeSlide() {
-    return +this.getAttribute("active-slide") || 0;
-  }
-  get pagination() {
-    return this.hasAttribute("pagination");
-  }
-  get navigation() {
-    return this.hasAttribute("navigation");
-  }
-  get thumbnails() {
-    return this.hasAttribute("thumbnails");
-  }
-  get loop() {
-    return this.hasAttribute("loop");
-  }
-  static get cssStyleSheet() {
-    return b;
-  }
-  static get observedAttributes() {
-    return ["active-slide"];
-  }
-  attributeChangedCallback(e, i, n) {
-    e === "active-slide" && (this.pagination && this.changePagination(), this.thumbnails && this.changeThumbnails());
-  }
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  beforeDraw(e, i, n) {
-    this.cloneFirstAndLastItems();
-  }
-  draw(e, i, n) {
-    let r = document.createDocumentFragment(), t = document.createElement("div");
-    t.classList.add("native-carousel");
-    let s = document.createElement("div");
-    s.classList.add("carousel-slides");
-    let l = document.createElement("slot");
-    return s.appendChild(l), t.appendChild(s), this.navigation && (this.prevButton = this.createPreviousButton(), this.nextButton = this.createNextButton(), t.appendChild(this.prevButton), t.appendChild(this.nextButton)), this.pagination && t.appendChild(this.createPagination()), this.thumbnails && t.appendChild(this.createThumbnails()), r.appendChild(t), this.slides = s, r;
-  }
-  afterDraw() {
-    this.setIntersectionObserver(), this.getSlidesWithClones().forEach((i, n) => {
-      this.intersectionObserver.observe(i);
-    }), this.slidePerPage = this.getAttribute("slide-per-page") || 1;
-    let e = 100 / +this.slidePerPage;
-    this.style.setProperty("--wje-carousel-size", e + "%"), this.goToSlide(this.activeSlide, "auto"), this.slides.addEventListener("scrollend", (i) => {
-      const n = this.getSlides(), t = [...this.entriesMap.values()].find((s) => s.isIntersecting);
-      if (t != null && t.target.classList.contains("clone")) {
-        const s = +t.target.getAttribute("clone-index");
-        this.goToSlide(s, "auto"), this.activeSlide = s;
-      } else if (t) {
-        let s = n.indexOf(t.target);
-        this.activeSlide = s;
-      }
-    });
-  }
-  setIntersectionObserver() {
-    this.intersectionObserver = new IntersectionObserver((e) => {
-      e.forEach((i) => {
-        this.entriesMap.set(i.target, i);
-      });
-    }, {
-      root: this.context.querySelector(".carousel-slides"),
-      threshold: 0.5
-    }), this.entriesMap = /* @__PURE__ */ new Map(), this.records = this.intersectionObserver.takeRecords(), this.records.forEach((e) => {
-      this.entriesMap.set(e.target, e);
-    });
-  }
-  goToSlide(e, i = "smooth", n = !0) {
-    const r = this.getSlides(), t = this.getSlidesWithClones();
-    t.forEach((g, S) => {
-      g.classList.remove("active");
-    });
-    let s = this.loop ? (e + r.length) % r.length : Math.min(Math.max(e, 0), r.length - 1);
-    this.activeSlide = s;
-    const l = Math.min(Math.max(e + (this.loop ? this.slidePerPage : 0), 0), t.length - 1), c = this.getSlidesWithClones()[l];
-    c.classList.add("active");
-    let d = c.getBoundingClientRect(), h = this.slides.getBoundingClientRect();
-    this.slides.scrollTo({
-      left: d.left - h.left + this.slides.scrollLeft,
-      top: d.top - h.top + this.slides.scrollTop,
-      behavior: i === "smooth" ? "smooth" : "auto"
-    }), this.navigation && !this.loop && (this.nextButton.removeAttribute("disabled"), this.prevButton.removeAttribute("disabled"), this.activeSlide === r.length - 1 && this.nextButton.setAttribute("disabled", ""), this.activeSlide === 0 && this.prevButton.setAttribute("disabled", ""));
-  }
-  cloneFirstAndLastItems() {
-    const e = this.getSlides();
-    if (e.length && this.loop) {
-      const i = e[0].cloneNode(!0);
-      i.classList.add("clone"), i.setAttribute("clone-index", 0), this.appendChild(i);
-      const n = e[e.length - 1].cloneNode(!0);
-      n.classList.add("clone"), n.setAttribute("clone-index", e.length - 1), this.insertBefore(n, this.firstChild);
-    }
-  }
-  removeActiveSlide() {
-    this.getSlidesWithClones().forEach((e, i) => {
-      e.classList.remove("active");
-    }), this.pagination && this.context.querySelectorAll(".pagination-item").forEach((e) => {
-      e.classList.remove("active");
-    }), this.thumbnails && this.context.querySelectorAll("wje-thumbnail").forEach((e) => {
-      e.classList.remove("active");
-    });
-  }
-  changePagination() {
-    this.pagination && (this.removeActiveSlide(), this.context.querySelectorAll(".pagination-item").forEach((e, i) => {
-      i === this.activeSlide && e.classList.add("active");
-    }));
-  }
-  changeThumbnails() {
-    this.thumbnails && (this.removeActiveSlide(), this.context.querySelectorAll("wje-thumbnail").forEach((e, i) => {
-      i === this.activeSlide && e.classList.add("active");
-    }));
-  }
-  createNextButton() {
-    const e = document.createElement("wje-button");
-    return e.classList.add("next"), e.innerHTML = '<wje-icon name="chevron-right" size="large"></wje-icon>', e.setAttribute("circle", ""), e.setAttribute("fill", "link"), e.addEventListener("click", (i) => {
-      this.nextSlide();
-    }), e;
-  }
-  createPreviousButton() {
-    const e = document.createElement("wje-button");
-    return e.classList.add("prev"), e.innerHTML = '<wje-icon name="chevron-left" size="large"></wje-icon>', e.setAttribute("circle", ""), e.setAttribute("fill", "link"), e.addEventListener("click", (i) => {
-      this.previousSlide();
-    }), e;
-  }
-  createPagination() {
-    const e = document.createElement("div");
-    return e.classList.add("pagination"), this.getSlides().forEach((n, r) => {
-      const t = document.createElement("div");
-      t.classList.add("pagination-item"), t.addEventListener("click", (s) => {
-        this.removeActiveSlide(), s.target.classList.add("active"), this.goToSlide(r);
-      }), e.appendChild(t);
-    }), e;
-  }
-  createThumbnails() {
-    const e = document.createElement("div");
-    return e.classList.add("thumbnails"), this.getSlides().forEach((n, r) => {
-      const t = document.createElement("wje-thumbnail");
-      t.innerHTML = `<img src="${n.querySelector("wje-img").getAttribute("src")}"></img>`, t.addEventListener("click", (s) => {
-        this.removeActiveSlide(), s.target.closest("wje-thumbnail").classList.add("active"), this.goToSlide(r);
-      }), e.appendChild(t);
-    }), e;
-  }
-  nextSlide() {
-    this.goToSlide(this.activeSlide + this.slidePerPage);
-  }
-  previousSlide() {
-    this.goToSlide(this.activeSlide - this.slidePerPage);
-  }
-  getSlides() {
-    return Array.from(this.querySelectorAll("wje-carousel-item:not(.clone)"));
-  }
-  getSlidesWithClones() {
-    return Array.from(this.querySelectorAll("wje-carousel-item"));
-  }
-  canGoNext() {
-    return this.querySelector(".native-carousel").scrollLeft < this.querySelector(".native-carousel").scrollWidth;
-  }
-  canGoPrevious() {
-    return this.querySelector(".native-carousel").scrollLeft > 0;
-  }
-}
-m.define("wje-carousel", f);
-export {
-  f as default
-};

package/dist/wje-checkbox.js

@@ -1,96 +0,0 @@
-var s = Object.defineProperty;
-var h = (c, t, e) => t in c ? s(c, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[t] = e;
-var l = (c, t, e) => (h(c, typeof t != "symbol" ? t + "" : t, e), e);
-import b, { event as i } from "./wje-element.js";
-const d = ':host{display:block;margin-top:var(--wje-checkbox-margin-top);margin-bottom:var(--wje-checkbox-margin-bottom);margin-inline:var(--wje-checkbox-margin-inline);line-height:100%;padding-left:0}:host label{display:flex;align-items:center;cursor:pointer;position:relative;padding-left:calc(var(--wje-checkbox-size) + .5rem);min-width:var(--wje-checkbox-size);min-height:var(--wje-checkbox-size);margin-bottom:0}:host label:before{content:"";position:absolute;width:var(--wje-checkbox-size);height:var(--wje-checkbox-size);left:0;-webkit-box-sizing:inherit;box-sizing:border-box;background-color:var(--wje-color-contrast-0);border-width:1px;border-style:solid;border-color:var(--wje-color-contrast-3)}.native-checkbox label:hover{color:var(--wje-color-contrast-11)}.native-checkbox label:before{border-radius:var(--wje-checkbox-border-radius)}.native-checkbox input[type=checkbox]{position:absolute;margin:0;z-index:-1;width:16px;height:16px;opacity:0;display:none}.native-checkbox input[type=checkbox]+label:after{content:"";position:absolute;left:0;border-right:0 solid transparent;border-bottom:0 solid transparent;width:var(--wje-checkbox-size);height:var(--wje-checkbox-size);overflow:hidden}.native-checkbox input[type=checkbox]:checked+label:after{content:"";-webkit-mask-image:var(--wje-checkbox-checkmark);mask-image:var(--wje-checkbox-checkmark);-webkit-mask-size:var(--wje-checkbox-size);mask-size:var(--wje-checkbox-size);background-color:var(--wje-color-primary-9)}.native-checkbox input[type=checkbox][disabled]+label{cursor:not-allowed!important;color:var(--wje-color-contrast-8);opacity:.58}.native-checkbox input[type=checkbox][disabled]+label:before{background:var(--wje-color-contrast-2)}.native-checkbox input[type=checkbox][disabled]+label:after{background:transparent}.native-checkbox input[type=checkbox]:checked[disabled]+label{cursor:not-allowed!important;color:var(--wje-color-contrast-8);opacity:.58}.native-checkbox input[type=checkbox]:checked[disabled]+label:before{background:var(--wje-color-contrast-2)}.native-checkbox input[type=checkbox]:checked[disabled]+label:after{background:var(--wje-color-contrast-5)}.native-checkbox input[type=checkbox]:not(:checked):indeterminate+label:after{content:"";-webkit-mask-image:var(--wje-checkbox-interminate);mask-image:var(--wje-checkbox-interminate);-webkit-mask-size:var(--wje-checkbox-size);mask-size:var(--wje-checkbox-size);background-color:var(--wje-color-primary-9)}:host([variant=circle]) label:after{border-radius:99px}:host([variant=circle]) label:before{border-radius:99px}:host([placement=end]) label{padding-left:0;padding-right:26px}:host([placement=end]) label:before{right:0;left:auto}:host([placement=end]) input[type=checkbox]:checked+label{position:relative}:host([placement=end]) input[type=checkbox]:checked+label:after{position:absolute;right:0;left:auto}:host([color=primary]) input[type=checkbox]:checked+label:after,:host([color=primary]) input[type=checkbox]:indeterminate+label:after{background-color:var(--wje-color-contrast-0)}:host([color=primary]) :is(input[type=checkbox]:checked+label):before,:host([color=primary]) :is(input[type=checkbox]:indeterminate+label):before{border-color:var(--wje-color-primary-9);background-color:var(--wje-color-primary-9)}:host([color=complete]) input[type=checkbox]:checked+label:after,:host([color=complete]) input[type=checkbox]:indeterminate+label:after{background-color:var(--wje-color-contrast-0)}:host([color=complete]) :is(input[type=checkbox]:checked+label):before,:host([color=complete]) :is(input[type=checkbox]:indeterminate+label):before{border-color:var(--wje-color-complete-9);background-color:var(--wje-color-complete-9)}:host([color=success]) input[type=checkbox]:checked+label:after,:host([color=success]) input[type=checkbox]:indeterminate+label:after{background-color:var(--wje-color-contrast-0)}:host([color=success]) :is(input[type=checkbox]:checked+label):before,:host([color=success]) :is(input[type=checkbox]:indeterminate+label):before{border-color:var(--wje-color-success-9);background-color:var(--wje-color-success-9)}:host([color=warning]) input[type=checkbox]:checked+label:after,:host([color=warning]) input[type=checkbox]:indeterminate+label:after{background-color:var(--wje-color-contrast-0)}:host([color=warning]) :is(input[type=checkbox]:checked+label):before,:host([color=warning]) :is(input[type=checkbox]:indeterminate+label):before{border-color:var(--wje-color-warning-9);background-color:var(--wje-color-warning-9)}:host([color=danger]) input[type=checkbox]:checked+label:after,:host([color=danger]) input[type=checkbox]:indeterminate+label:after{background-color:var(--wje-color-contrast-0)}:host([color=danger]) :is(input[type=checkbox]:checked+label):before,:host([color=danger]) :is(input[type=checkbox]:indeterminate+label):before{border-color:var(--wje-color-danger-9);background-color:var(--wje-color-danger-9)}:host([color=info]) input[type=checkbox]:checked+label:after,:host([color=info]) input[type=checkbox]:indeterminate+label:after{background-color:var(--wje-color-contrast-0)}:host([color=info]) :is(input[type=checkbox]:checked+label):before,:host([color=info]) :is(input[type=checkbox]:indeterminate+label):before{border-color:var(--wje-color-info-9);background-color:var(--wje-color-info-9)}';
-class k extends b {
-  /**
-   * Checkbox constructor.
-   */
-  constructor() {
-    super();
-    /**
-     * The class name.
-     */
-    l(this, "className", "Checkbox");
-  }
-  /**
-   * @summary Set checked attribute
-   * @returns {boolean} true if the toggle is checked, false otherwise
-   */
-  set disabled(e) {
-    e ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
-  }
-  /**
-   * @summary Get disabled attribute
-   * @returns {boolean} true if the toggle is disabled, false otherwise
-   */
-  get disabled() {
-    return this.hasAttribute("disabled");
-  }
-  /**
-  * @summary Set checked attribute
-  * @returns {boolean} true if the toggle is checked, false otherwise
-  */
-  set checked(e) {
-    e ? this.setAttribute("checked", "") : this.removeAttribute("checked");
-  }
-  /**
-   * @summary Get checked attribute
-   * @returns {boolean} true if the toggle is checked, false otherwise
-   */
-  get checked() {
-    return this.hasAttribute("checked");
-  }
-  /**
-   * Getter for the CSS stylesheet.
-   * @returns {string} The CSS stylesheet.
-   */
-  static get cssStyleSheet() {
-    return d;
-  }
-  static get observedAttributes() {
-    return ["checked", "disabled"];
-  }
-  /**
-   * Sets up the attributes for the checkbox.
-   */
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  /**
-   * Draws the checkbox.
-   * @param {object} context - The context.
-   * @param {object} store - The store.
-   * @param {object} params - The parameters.
-   * @returns {DocumentFragment} The created fragment.
-   */
-  draw(e, p, u) {
-    let n = document.createDocumentFragment(), r = document.createElement("div");
-    r.setAttribute("part", "native"), r.classList.add("native-checkbox");
-    let o = document.createElement("input");
-    o.type = "checkbox", o.id = "checkbox", o.name = this.name || "checkbox", o.checked = this.hasAttribute("checked"), o.disabled = this.hasAttribute("disabled"), o.indeterminate = this.hasAttribute("indeterminate");
-    let a = document.createElement("label");
-    return a.htmlFor = "checkbox", a.innerHTML = "<slot></slot>", r.appendChild(o), r.appendChild(a), this.input = o, n.appendChild(r), n;
-  }
-  /**
-   * Adds an event listener after drawing the checkbox.
-   */
-  afterDraw() {
-    this.disabled || (this.input.addEventListener("input", (e) => {
-      this.checked = e.target.checked, i.dispatchCustomEvent(this, "wje-toggle:input");
-    }), this.input.addEventListener("change", (e) => {
-      this.checked = e.target.checked, i.dispatchCustomEvent(this, "wje-toggle:change");
-    }));
-  }
-  /**
-   * Removes the event listener when the checkbox is disconnected.
-   */
-  disconnectedCallback() {
-    i.removeElement(this.input);
-  }
-}
-b.define("wje-checkbox", k);
-export {
-  k as default
-};

package/dist/wje-chip.js

@@ -1,32 +0,0 @@
-var d = Object.defineProperty;
-var w = (r, o, t) => o in r ? d(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
-var n = (r, o, t) => (w(r, typeof o != "symbol" ? o + "" : o, t), t);
-import l, { event as p } from "./wje-element.js";
-const h = ".native-chip{display:inline-flex;justify-content:center;align-items:center;font-size:14px;letter-spacing:-.006em;margin:0;padding:.5rem .75rem;text-align:center;cursor:pointer;white-space:nowrap;text-shadow:none;box-shadow:none;border:0 none;line-height:14px;min-height:28px;height:28px;width:100%;max-width:fit-content;min-width:28px;position:relative;transition:width .15s cubic-bezier(.4,0,.2,1);border-radius:var(--wje-border-radius-pill);overflow:hidden;vertical-align:middle;box-sizing:border-box}:host(.focus){box-shadow:none}:host(.wje-active) .native-chip{border:1px solid var(--wje-color-primary-11);background-color:var(--wje-color-contrast-3);color:var(--wje-color)}:host(:focus,:active:focus,.wje-active:focus){outline:none!important}.check{display:none}:host([active]) .check{display:block;margin-inline:4px 0}:host([disabled]){opacity:.5;border:0;pointer-events:none;cursor:not-allowed}::slotted(wje-avatar){width:22px;height:22px}::slotted(wje-avatar:first-child){margin-inline:-8px 8px;margin-top:-4px;margin-bottom:-4px}::slotted(wje-icon:first-child){margin:-4px 8px -4px -4px}::slotted(wje-icon:last-child){margin:-4px -4px -4px 8px}wje-button{--wje-button-border-radius: 50%;--wje-button-margin-inline: .25rem -.5rem;--wje-padding-top: .15rem;--wje-padding-start: .15rem;--wje-padding-end: .15rem;--wje-padding-bottom: .15rem}.native-chip.wje-color-primary{background-color:var(--wje-color-primary-1);color:var(--wje-color-primary-9)}.native-chip.wje-color-complete{background-color:var(--wje-color-complete-1);color:var(--wje-color-complete-9)}.native-chip.wje-color-success{background-color:var(--wje-color-success-1);color:var(--wje-color-success-9)}.native-chip.wje-color-warning{background-color:var(--wje-color-warning-2);color:var(--wje-color-warning-11)}.native-chip.wje-color-danger{background-color:var(--wje-color-danger-1);color:var(--wje-color-danger-9)}.native-chip.wje-color-info{background-color:var(--wje-color-info-1);color:var(--wje-color-info-9)}.native-chip.wje-color-default{background-color:var(--wje-color-contrast-3);color:var(--wje-color-contrast-11)}@media (any-hover: hover){.native-chip.wje-color-primary:hover{background-color:var(--wje-color-primary-4);color:var(--wje-color-primary-10)}.native-chip.wje-color-complete:hover{background-color:var(--wje-color-complete-4);color:var(--wje-color-complete-10)}.native-chip.wje-color-success:hover{background-color:var(--wje-color-success-4);color:var(--wje-color-success-10)}.native-chip.wje-color-warning:hover{background-color:var(--wje-color-warning-4);color:var(--wje-color-warning-11)}.native-chip.wje-color-danger:hover{background-color:var(--wje-color-danger-4);color:var(--wje-color-danger-10)}.native-chip.wje-color-info:hover{background-color:var(--wje-color-info-4);color:var(--wje-color-info-10)}.native-chip.wje-color-default:hover{background-color:var(--wje-color-contrast-4);color:var(--wje-color-contrast-11)}}";
-class v extends l {
-  constructor() {
-    super();
-    n(this, "className", "Chip");
-  }
-  static get cssStyleSheet() {
-    return h;
-  }
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  draw(t, j, m) {
-    let i = document.createDocumentFragment(), e = document.createElement("div");
-    e.classList.add("native-chip");
-    let s = document.createElement("slot"), c = document.createElement("wje-button");
-    c.setAttribute("part", "remove"), c.setAttribute("fill", "link"), c.innerHTML = '<wje-icon name="x"></wje-icon>';
-    let a = document.createElement("wje-icon");
-    return a.setAttribute("name", "check"), a.classList.add("check"), this.hasAttribute("color") ? e.classList.add("wje-color-" + this.color, "wje-color") : e.classList.add("wje-color-default", "wje-color"), this.disabled && this.classList.add("wje-disabled"), this.outline && this.classList.add("wje-outline"), e.appendChild(s), e.appendChild(a), this.hasAttribute("removable") && e.appendChild(c), i.appendChild(e), this.remove = c, i;
-  }
-  afterDraw() {
-    p.addListener(this.remove, "click", "wje:chip-remove", null, { stopPropagation: !0 });
-  }
-}
-l.define("wje-chip", v);
-export {
-  v as default
-};

package/dist/wje-col.js

@@ -1,27 +0,0 @@
-var f = Object.defineProperty;
-var g = (o, t, e) => t in o ? f(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e;
-var r = (o, t, e) => (g(o, typeof t != "symbol" ? t + "" : t, e), e);
-import s from "./wje-element.js";
-const m = ":host{display:block;flex-grow:1;width:100%;max-width:100%;padding-right:calc(var(--wje-gutter-x) * .5);padding-left:calc(var(--wje-gutter-x) * .5);margin-top:var(--wje-gutter-y)}:host(.wje-col){flex:1 0 0%}:host(.wje-row-cols-auto)>*{flex:0 0 auto;width:auto}:host(.wje-row-cols-1)>*{flex:0 0 auto;width:100%}:host(.wje-row-cols-2)>*{flex:0 0 auto;width:50%}:host(.wje-row-cols-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wje-row-cols-4)>*{flex:0 0 auto;width:25%}:host(.wje-row-cols-5)>*{flex:0 0 auto;width:20%}:host(.wje-row-cols-6)>*{flex:0 0 auto;width:16.6666666667%}@media (min-width: 576px){:host(.wje-col-sm){flex:1 0 0%}:host(.wje-row-cols-sm-auto)>*{flex:0 0 auto;width:auto}:host(.wje-row-cols-sm-1)>*{flex:0 0 auto;width:100%}:host(.wje-row-cols-sm-2)>*{flex:0 0 auto;width:50%}:host(.wje-row-cols-sm-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wje-row-cols-sm-4)>*{flex:0 0 auto;width:25%}:host(.wje-row-cols-sm-5)>*{flex:0 0 auto;width:20%}:host(.wje-row-cols-sm-6)>*{flex:0 0 auto;width:16.6666666667%}}@media (min-width: 768px){:host(.wje-col-md){flex:1 0 0%}:host(.wje-row-cols-md-auto)>*{flex:0 0 auto;width:auto}:host(.wje-row-cols-md-1)>*{flex:0 0 auto;width:100%}:host(.wje-row-cols-md-2)>*{flex:0 0 auto;width:50%}:host(.wje-row-cols-md-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wje-row-cols-md-4)>*{flex:0 0 auto;width:25%}:host(.wje-row-cols-md-5)>*{flex:0 0 auto;width:20%}:host(.wje-row-cols-md-6)>*{flex:0 0 auto;width:16.6666666667%}}@media (min-width: 992px){:host(.wje-col-lg){flex:1 0 0%}:host(.wje-row-cols-lg-auto)>*{flex:0 0 auto;width:auto}:host(.wje-row-cols-lg-1)>*{flex:0 0 auto;width:100%}:host(.wje-row-cols-lg-2)>*{flex:0 0 auto;width:50%}:host(.wje-row-cols-lg-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wje-row-cols-lg-4)>*{flex:0 0 auto;width:25%}:host(.wje-row-cols-lg-5)>*{flex:0 0 auto;width:20%}:host(.wje-row-cols-lg-6)>*{flex:0 0 auto;width:16.6666666667%}}@media (min-width: 1200px){:host(.wje-col-xl){flex:1 0 0%}:host(.wje-row-cols-xl-auto)>*{flex:0 0 auto;width:auto}:host(.wje-row-cols-xl-1)>*{flex:0 0 auto;width:100%}:host(.wje-row-cols-xl-2)>*{flex:0 0 auto;width:50%}:host(.wje-row-cols-xl-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wje-row-cols-xl-4)>*{flex:0 0 auto;width:25%}:host(.wje-row-cols-xl-5)>*{flex:0 0 auto;width:20%}:host(.wje-row-cols-xl-6)>*{flex:0 0 auto;width:16.6666666667%}}@media (min-width: 1400px){:host(.wje-col-xxl){flex:1 0 0%}:host(.wje-row-cols-xxl-auto)>*{flex:0 0 auto;width:auto}:host(.wje-row-cols-xxl-1)>*{flex:0 0 auto;width:100%}:host(.wje-row-cols-xxl-2)>*{flex:0 0 auto;width:50%}:host(.wje-row-cols-xxl-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wje-row-cols-xxl-4)>*{flex:0 0 auto;width:25%}:host(.wje-row-cols-xxl-5)>*{flex:0 0 auto;width:20%}:host(.wje-row-cols-xxl-6)>*{flex:0 0 auto;width:16.6666666667%}}:host(.wje-col-auto){flex:0 0 auto;width:auto}:host(.wje-col-1){flex:0 0 auto;width:8.33333333%}:host(.wje-col-2){flex:0 0 auto;width:16.66666667%}:host(.wje-col-3){flex:0 0 auto;width:25%}:host(.wje-col-4){flex:0 0 auto;width:33.33333333%}:host(.wje-col-5){flex:0 0 auto;width:41.66666667%}:host(.wje-col-6){flex:0 0 auto;width:50%}:host(.wje-col-7){flex:0 0 auto;width:58.33333333%}:host(.wje-col-8){flex:0 0 auto;width:66.66666667%}:host(.wje-col-9){flex:0 0 auto;width:75%}:host(.wje-col-10){flex:0 0 auto;width:83.33333333%}:host(.wje-col-11){flex:0 0 auto;width:91.66666667%}:host(.wje-col-12){flex:0 0 auto;width:100%}:host(.wje-offset-1){margin-left:8.33333333%}:host(.wje-offset-2){margin-left:16.66666667%}:host(.wje-offset-3){margin-left:25%}:host(.wje-offset-4){margin-left:33.33333333%}:host(.wje-offset-5){margin-left:41.66666667%}:host(.wje-offset-6){margin-left:50%}:host(.wje-offset-7){margin-left:58.33333333%}:host(.wje-offset-8){margin-left:66.66666667%}:host(.wje-offset-9){margin-left:75%}:host(.wje-offset-10){margin-left:83.33333333%}:host(.wje-offset-11){margin-left:91.66666667%}.g-0,.gx-0{--wje-gutter-x: 0}.g-0,.gy-0{--wje-gutter-y: 0}.g-1,.gx-1{--wje-gutter-x: .25rem}.g-1,.gy-1{--wje-gutter-y: .25rem}.g-2,.gx-2{--wje-gutter-x: .5rem}.g-2,.gy-2{--wje-gutter-y: .5rem}.g-3,.gx-3{--wje-gutter-x: 1rem}.g-3,.gy-3{--wje-gutter-y: 1rem}.g-4,.gx-4{--wje-gutter-x: 1.5rem}.g-4,.gy-4{--wje-gutter-y: 1.5rem}.g-5,.gx-5{--wje-gutter-x: 3rem}.g-5,.gy-5{--wje-gutter-y: 3rem}@media (min-width: 576px){:host(.wje-col-sm-auto){flex:0 0 auto;width:auto}:host(.wje-col-sm-1){flex:0 0 auto;width:8.33333333%}:host(.wje-col-sm-2){flex:0 0 auto;width:16.66666667%}:host(.wje-col-sm-3){flex:0 0 auto;width:25%}:host(.wje-col-sm-4){flex:0 0 auto;width:33.33333333%}:host(.wje-col-sm-5){flex:0 0 auto;width:41.66666667%}:host(.wje-col-sm-6){flex:0 0 auto;width:50%}:host(.wje-col-sm-7){flex:0 0 auto;width:58.33333333%}:host(.wje-col-sm-8){flex:0 0 auto;width:66.66666667%}:host(.wje-col-sm-9){flex:0 0 auto;width:75%}:host(.wje-col-sm-10){flex:0 0 auto;width:83.33333333%}:host(.wje-col-sm-11){flex:0 0 auto;width:91.66666667%}:host(.wje-col-sm-12){flex:0 0 auto;width:100%}:host(.wje-offset-sm-0){margin-left:0}:host(.wje-offset-sm-1){margin-left:8.33333333%}:host(.wje-offset-sm-2){margin-left:16.66666667%}:host(.wje-offset-sm-3){margin-left:25%}:host(.wje-offset-sm-4){margin-left:33.33333333%}:host(.wje-offset-sm-5){margin-left:41.66666667%}:host(.wje-offset-sm-6){margin-left:50%}:host(.wje-offset-sm-7){margin-left:58.33333333%}:host(.wje-offset-sm-8){margin-left:66.66666667%}:host(.wje-offset-sm-9){margin-left:75%}:host(.wje-offset-sm-10){margin-left:83.33333333%}:host(.wje-offset-sm-11){margin-left:91.66666667%}.g-sm-0,.gx-sm-0{--wje-gutter-x: 0}.g-sm-0,.gy-sm-0{--wje-gutter-y: 0}.g-sm-1,.gx-sm-1{--wje-gutter-x: .25rem}.g-sm-1,.gy-sm-1{--wje-gutter-y: .25rem}.g-sm-2,.gx-sm-2{--wje-gutter-x: .5rem}.g-sm-2,.gy-sm-2{--wje-gutter-y: .5rem}.g-sm-3,.gx-sm-3{--wje-gutter-x: 1rem}.g-sm-3,.gy-sm-3{--wje-gutter-y: 1rem}.g-sm-4,.gx-sm-4{--wje-gutter-x: 1.5rem}.g-sm-4,.gy-sm-4{--wje-gutter-y: 1.5rem}.g-sm-5,.gx-sm-5{--wje-gutter-x: 3rem}.g-sm-5,.gy-sm-5{--wje-gutter-y: 3rem}}@media (min-width: 768px){:host(.wje-col-md-auto){flex:0 0 auto;width:auto}:host(.wje-col-md-1){flex:0 0 auto;width:8.33333333%}:host(.wje-col-md-2){flex:0 0 auto;width:16.66666667%}:host(.wje-col-md-3){flex:0 0 auto;width:25%}:host(.wje-col-md-4){flex:0 0 auto;width:33.33333333%}:host(.wje-col-md-5){flex:0 0 auto;width:41.66666667%}:host(.wje-col-md-6){flex:0 0 auto;width:50%}:host(.wje-col-md-7){flex:0 0 auto;width:58.33333333%}:host(.wje-col-md-8){flex:0 0 auto;width:66.66666667%}:host(.wje-col-md-9){flex:0 0 auto;width:75%}:host(.wje-col-md-10){flex:0 0 auto;width:83.33333333%}:host(.wje-col-md-11){flex:0 0 auto;width:91.66666667%}:host(.wje-col-md-12){flex:0 0 auto;width:100%}:host(.wje-offset-md-0){margin-left:0}:host(.wje-offset-md-1){margin-left:8.33333333%}:host(.wje-offset-md-2){margin-left:16.66666667%}:host(.wje-offset-md-3){margin-left:25%}:host(.wje-offset-md-4){margin-left:33.33333333%}:host(.wje-offset-md-5){margin-left:41.66666667%}:host(.wje-offset-md-6){margin-left:50%}:host(.wje-offset-md-7){margin-left:58.33333333%}:host(.wje-offset-md-8){margin-left:66.66666667%}:host(.wje-offset-md-9){margin-left:75%}:host(.wje-offset-md-10){margin-left:83.33333333%}:host(.wje-offset-md-11){margin-left:91.66666667%}.g-md-0,.gx-md-0{--wje-gutter-x: 0}.g-md-0,.gy-md-0{--wje-gutter-y: 0}.g-md-1,.gx-md-1{--wje-gutter-x: .25rem}.g-md-1,.gy-md-1{--wje-gutter-y: .25rem}.g-md-2,.gx-md-2{--wje-gutter-x: .5rem}.g-md-2,.gy-md-2{--wje-gutter-y: .5rem}.g-md-3,.gx-md-3{--wje-gutter-x: 1rem}.g-md-3,.gy-md-3{--wje-gutter-y: 1rem}.g-md-4,.gx-md-4{--wje-gutter-x: 1.5rem}.g-md-4,.gy-md-4{--wje-gutter-y: 1.5rem}.g-md-5,.gx-md-5{--wje-gutter-x: 3rem}.g-md-5,.gy-md-5{--wje-gutter-y: 3rem}}@media (min-width: 992px){:host(.wje-col-lg-auto){flex:0 0 auto;width:auto}:host(.wje-col-lg-1){flex:0 0 auto;width:8.33333333%}:host(.wje-col-lg-2){flex:0 0 auto;width:16.66666667%}:host(.wje-col-lg-3){flex:0 0 auto;width:25%}:host(.wje-col-lg-4){flex:0 0 auto;width:33.33333333%}:host(.wje-col-lg-5){flex:0 0 auto;width:41.66666667%}:host(.wje-col-lg-6){flex:0 0 auto;width:50%}:host(.wje-col-lg-7){flex:0 0 auto;width:58.33333333%}:host(.wje-col-lg-8){flex:0 0 auto;width:66.66666667%}:host(.wje-col-lg-9){flex:0 0 auto;width:75%}:host(.wje-col-lg-10){flex:0 0 auto;width:83.33333333%}:host(.wje-col-lg-11){flex:0 0 auto;width:91.66666667%}:host(.wje-col-lg-12){flex:0 0 auto;width:100%}:host(.wje-offset-lg-0){margin-left:0}:host(.wje-offset-lg-1){margin-left:8.33333333%}:host(.wje-offset-lg-2){margin-left:16.66666667%}:host(.wje-offset-lg-3){margin-left:25%}:host(.wje-offset-lg-4){margin-left:33.33333333%}:host(.wje-offset-lg-5){margin-left:41.66666667%}:host(.wje-offset-lg-6){margin-left:50%}:host(.wje-offset-lg-7){margin-left:58.33333333%}:host(.wje-offset-lg-8){margin-left:66.66666667%}:host(.wje-offset-lg-9){margin-left:75%}:host(.wje-offset-lg-10){margin-left:83.33333333%}:host(.wje-offset-lg-11){margin-left:91.66666667%}.g-lg-0,.gx-lg-0{--wje-gutter-x: 0}.g-lg-0,.gy-lg-0{--wje-gutter-y: 0}.g-lg-1,.gx-lg-1{--wje-gutter-x: .25rem}.g-lg-1,.gy-lg-1{--wje-gutter-y: .25rem}.g-lg-2,.gx-lg-2{--wje-gutter-x: .5rem}.g-lg-2,.gy-lg-2{--wje-gutter-y: .5rem}.g-lg-3,.gx-lg-3{--wje-gutter-x: 1rem}.g-lg-3,.gy-lg-3{--wje-gutter-y: 1rem}.g-lg-4,.gx-lg-4{--wje-gutter-x: 1.5rem}.g-lg-4,.gy-lg-4{--wje-gutter-y: 1.5rem}.g-lg-5,.gx-lg-5{--wje-gutter-x: 3rem}.g-lg-5,.gy-lg-5{--wje-gutter-y: 3rem}}@media (min-width: 1200px){:host(.wje-col-xl-auto){flex:0 0 auto;width:auto}:host(.wje-col-xl-1){flex:0 0 auto;width:8.33333333%}:host(.wje-col-xl-2){flex:0 0 auto;width:16.66666667%}:host(.wje-col-xl-3){flex:0 0 auto;width:25%}:host(.wje-col-xl-4){flex:0 0 auto;width:33.33333333%}:host(.wje-col-xl-5){flex:0 0 auto;width:41.66666667%}:host(.wje-col-xl-6){flex:0 0 auto;width:50%}:host(.wje-col-xl-7){flex:0 0 auto;width:58.33333333%}:host(.wje-col-xl-8){flex:0 0 auto;width:66.66666667%}:host(.wje-col-xl-9){flex:0 0 auto;width:75%}:host(.wje-col-xl-10){flex:0 0 auto;width:83.33333333%}:host(.wje-col-xl-11){flex:0 0 auto;width:91.66666667%}:host(.wje-col-xl-12){flex:0 0 auto;width:100%}:host(.wje-offset-xl-0){margin-left:0}:host(.wje-offset-xl-1){margin-left:8.33333333%}:host(.wje-offset-xl-2){margin-left:16.66666667%}:host(.wje-offset-xl-3){margin-left:25%}:host(.wje-offset-xl-4){margin-left:33.33333333%}:host(.wje-offset-xl-5){margin-left:41.66666667%}:host(.wje-offset-xl-6){margin-left:50%}:host(.wje-offset-xl-7){margin-left:58.33333333%}:host(.wje-offset-xl-8){margin-left:66.66666667%}:host(.wje-offset-xl-9){margin-left:75%}:host(.wje-offset-xl-10){margin-left:83.33333333%}:host(.wje-offset-xl-11){margin-left:91.66666667%}.g-xl-0,.gx-xl-0{--wje-gutter-x: 0}.g-xl-0,.gy-xl-0{--wje-gutter-y: 0}.g-xl-1,.gx-xl-1{--wje-gutter-x: .25rem}.g-xl-1,.gy-xl-1{--wje-gutter-y: .25rem}.g-xl-2,.gx-xl-2{--wje-gutter-x: .5rem}.g-xl-2,.gy-xl-2{--wje-gutter-y: .5rem}.g-xl-3,.gx-xl-3{--wje-gutter-x: 1rem}.g-xl-3,.gy-xl-3{--wje-gutter-y: 1rem}.g-xl-4,.gx-xl-4{--wje-gutter-x: 1.5rem}.g-xl-4,.gy-xl-4{--wje-gutter-y: 1.5rem}.g-xl-5,.gx-xl-5{--wje-gutter-x: 3rem}.g-xl-5,.gy-xl-5{--wje-gutter-y: 3rem}}@media (min-width: 1400px){:host(.wje-col-xxl-auto){flex:0 0 auto;width:auto}:host(.wje-col-xxl-1){flex:0 0 auto;width:8.33333333%}:host(.wje-col-xxl-2){flex:0 0 auto;width:16.66666667%}:host(.wje-col-xxl-3){flex:0 0 auto;width:25%}:host(.wje-col-xxl-4){flex:0 0 auto;width:33.33333333%}:host(.wje-col-xxl-5){flex:0 0 auto;width:41.66666667%}:host(.wje-col-xxl-6){flex:0 0 auto;width:50%}:host(.wje-col-xxl-7){flex:0 0 auto;width:58.33333333%}:host(.wje-col-xxl-8){flex:0 0 auto;width:66.66666667%}:host(.wje-col-xxl-9){flex:0 0 auto;width:75%}:host(.wje-col-xxl-10){flex:0 0 auto;width:83.33333333%}:host(.wje-col-xxl-11){flex:0 0 auto;width:91.66666667%}:host(.wje-col-xxl-12){flex:0 0 auto;width:100%}:host(.wje-offset-xxl-0){margin-left:0}:host(.wje-offset-xxl-1){margin-left:8.33333333%}:host(.wje-offset-xxl-2){margin-left:16.66666667%}:host(.wje-offset-xxl-3){margin-left:25%}:host(.wje-offset-xxl-4){margin-left:33.33333333%}:host(.wje-offset-xxl-5){margin-left:41.66666667%}:host(.wje-offset-xxl-6){margin-left:50%}:host(.wje-offset-xxl-7){margin-left:58.33333333%}:host(.wje-offset-xxl-8){margin-left:66.66666667%}:host(.wje-offset-xxl-9){margin-left:75%}:host(.wje-offset-xxl-10){margin-left:83.33333333%}:host(.wje-offset-xxl-11){margin-left:91.66666667%}.g-xxl-0,.gx-xxl-0{--wje-gutter-x: 0}.g-xxl-0,.gy-xxl-0{--wje-gutter-y: 0}.g-xxl-1,.gx-xxl-1{--wje-gutter-x: .25rem}.g-xxl-1,.gy-xxl-1{--wje-gutter-y: .25rem}.g-xxl-2,.gx-xxl-2{--wje-gutter-x: .5rem}.g-xxl-2,.gy-xxl-2{--wje-gutter-y: .5rem}.g-xxl-3,.gx-xxl-3{--wje-gutter-x: 1rem}.g-xxl-3,.gy-xxl-3{--wje-gutter-y: 1rem}.g-xxl-4,.gx-xxl-4{--wje-gutter-x: 1.5rem}.g-xxl-4,.gy-xxl-4{--wje-gutter-y: 1.5rem}.g-xxl-5,.gx-xxl-5{--wje-gutter-x: 3rem}.g-xxl-5,.gy-xxl-5{--wje-gutter-y: 3rem}}:host(.order-first){order:-1!important}:host(.order-0){order:0!important}:host(.order-1){order:1!important}:host(.order-2){order:2!important}:host(.order-3){order:3!important}:host(.order-4){order:4!important}:host(.order-5){order:5!important}:host(.order-last){order:6!important}:host(.order-sm-first){order:-1!important}:host(.order-sm-0){order:0!important}:host(.order-sm-1){order:1!important}:host(.order-sm-2){order:2!important}:host(.order-sm-3){order:3!important}:host(.order-sm-4){order:4!important}:host(.order-sm-5){order:5!important}:host(.order-sm-last){order:6!important}:host(.order-md-first){order:-1!important}:host(.order-md-0){order:0!important}:host(.order-md-1){order:1!important}:host(.order-md-2){order:2!important}:host(.order-md-3){order:3!important}:host(.order-md-4){order:4!important}:host(.order-md-5){order:5!important}:host(.order-md-last){order:6!important}:host(.order-lg-first){order:-1!important}:host(.order-lg-0){order:0!important}:host(.order-lg-1){order:1!important}:host(.order-lg-2){order:2!important}:host(.order-lg-3){order:3!important}:host(.order-lg-4){order:4!important}:host(.order-lg-5){order:5!important}:host(.order-lg-last){order:6!important}:host(.order-xl-first){order:-1!important}:host(.order-xl-0){order:0!important}:host(.order-xl-1){order:1!important}:host(.order-xl-2){order:2!important}:host(.order-xl-3){order:3!important}:host(.order-xl-4){order:4!important}:host(.order-xl-5){order:5!important}:host(.order-xl-last){order:6!important}:host(.order-xxl-first){order:-1!important}:host(.order-xxl-0){order:0!important}:host(.order-xxl-1){order:1!important}:host(.order-xxl-2){order:2!important}:host(.order-xxl-3){order:3!important}:host(.order-xxl-4){order:4!important}:host(.order-xxl-5){order:5!important}:host(.order-xxl-last){order:6!important}";
-class d extends s {
-  constructor() {
-    super();
-    r(this, "className", "Col");
-  }
-  static get cssStyleSheet() {
-    return m;
-  }
-  setupAttributes() {
-    this.isShadowRoot = "open";
-  }
-  beforeDraw(e, w, x) {
-  }
-  draw(e, w, x) {
-    let l = document.createDocumentFragment(), h = document.createElement("slot");
-    return this.order && this.classList.add("order-" + this.order), this.size && this.classList.add("wje-col-" + this.size), this.sizeSm && this.classList.add("wje-col-sm-" + this.sizeSm), this.sizeMd && this.classList.add("wje-col-md-" + this.sizeMd), this.offset && this.classList.add("wje-offset-" + this.offset), this.offsetSm && this.classList.add("wje-offset-sm-" + this.offsetSm), l.appendChild(h), l;
-  }
-}
-s.define("wje-col", d);
-export {
-  d as default
-};