wj-elements 0.0.5 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/localize-762a9f0f.js +43 -0
- package/dist/style.css +2 -2
- package/dist/wj-animation.js +65 -0
- package/dist/wj-aside.js +8 -10
- package/dist/wj-avatar.js +19 -21
- package/dist/wj-badge.js +16 -16
- package/dist/wj-breadcrumb.js +7 -11
- package/dist/wj-breadcrumbs.js +5 -7
- package/dist/wj-button-group.js +11 -13
- package/dist/wj-button.js +36 -39
- package/dist/wj-card-content.js +11 -13
- package/dist/wj-card-controls.js +6 -8
- package/dist/wj-card-header.js +11 -13
- package/dist/wj-card-subtitle.js +9 -11
- package/dist/wj-card-title.js +7 -9
- package/dist/wj-card.js +13 -15
- package/dist/wj-carousel-item.js +32 -0
- package/dist/wj-carousel.js +178 -0
- package/dist/wj-checkbox.js +11 -11
- package/dist/wj-chip.js +17 -17
- package/dist/wj-col.js +11 -12
- package/dist/wj-color-picker.js +192 -179
- package/dist/wj-container.js +7 -9
- package/dist/wj-copy-button.js +1 -3
- package/dist/wj-dialog.js +20 -22
- package/dist/wj-divider.js +7 -9
- package/dist/wj-dropdown.js +10 -14
- package/dist/wj-element.js +9 -9
- package/dist/wj-fetchAndParseCSS.js +43 -0
- package/dist/wj-file-upload-item.js +63 -0
- package/dist/wj-file-upload.js +221 -0
- package/dist/wj-footer.js +9 -11
- package/dist/wj-form.js +6 -8
- package/dist/wj-format-digital.js +51 -0
- package/dist/wj-grid.js +9 -10
- package/dist/wj-header.js +9 -11
- package/dist/wj-icon-picker.js +78 -58
- package/dist/wj-icon.js +45 -48
- package/dist/wj-img-comparer.js +12 -14
- package/dist/wj-img.js +14 -16
- package/dist/wj-infinite-scroll.js +27 -22
- package/dist/wj-input-file.js +47 -0
- package/dist/wj-input.js +30 -23
- package/dist/wj-item.js +1 -3
- package/dist/wj-label.js +10 -10
- package/dist/wj-list.js +1 -3
- package/dist/wj-main.js +1 -3
- package/dist/wj-masonry.js +133 -0
- package/dist/wj-master.js +284 -249
- package/dist/wj-menu-button.js +10 -12
- package/dist/wj-menu-item.js +49 -46
- package/dist/wj-menu-label.js +2 -2
- package/dist/wj-menu.js +8 -10
- package/dist/wj-popup.js +89 -88
- package/dist/wj-progress-bar.js +14 -16
- package/dist/wj-radio-group.js +5 -7
- package/dist/wj-radio.js +13 -15
- package/dist/wj-rate.js +127 -0
- package/dist/wj-relative-time.js +50 -0
- package/dist/wj-router-link.js +11 -13
- package/dist/wj-row.js +11 -12
- package/dist/wj-slider.js +6 -6
- package/dist/wj-split-view.js +1 -3
- package/dist/wj-textarea.js +17 -19
- package/dist/wj-thumbnail.js +12 -14
- package/dist/wj-toast.js +1 -1
- package/dist/wj-toggle.js +9 -9
- package/dist/wj-toolbar.js +13 -15
- package/dist/wj-tooltip.js +16 -18
- package/dist/wj-visually-hidden.js +6 -8
- package/package.json +1 -1
package/dist/wj-checkbox.js
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var
|
|
4
|
-
import h, { event as
|
|
1
|
+
var l = Object.defineProperty;
|
|
2
|
+
var b = (c, t, e) => t in c ? l(c, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[t] = e;
|
|
3
|
+
var i = (c, t, e) => (b(c, typeof t != "symbol" ? t + "" : t, e), e);
|
|
4
|
+
import h, { event as n } from "./wj-element.js";
|
|
5
5
|
import "./wj-store.js";
|
|
6
6
|
const s = `/*!
|
|
7
7
|
* direction.scss
|
|
8
|
-
*/:host{--wj-checkbox-margin-top: 0;--wj-checkbox-margin-bottom: .5rem;--wj-checkbox-margin-inline: 0;--wj-checkbox-width: 16px;--wj-checkbox-height: 16px;display:block;margin-top:var(--wj-checkbox-margin-top);margin-bottom:var(--wj-checkbox-margin-bottom);margin-inline:var(--wj-checkbox-margin-inline);line-height:100%;padding-left:0}:host label{display:inline-block;cursor:pointer;position:relative;padding-left:25px;min-width:var(--wj-checkbox-width);min-height:var(--wj-checkbox-height);margin-bottom:0;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host label:before{content:"";position:absolute;width:16px;height:16px;left:0;-webkit-box-sizing:inherit;box-sizing:border-box;background-color
|
|
8
|
+
*/:host{--wj-grey-check-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAAAQAgMAAADsa5zLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTHBwcG9vb3BwcBFjhIYAAAAEdFJOUwBG9tQE3MceAAAAVUlEQVQoz2NgGLKA0QGIDwDxBSCeAMEYgAWI2YCK2CagYgwgDcRSDhgYbAkKzsSKGdgakCyY6ADES7BiiCkgJ4PYyybgxAhQAsRZDrgxCpDEg4cAAAAp2ibhZRGLHgAAAABJRU5ErkJggg==) left center;--wj-white-check-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAAAQAgMAAADsa5zLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTP///////////waf0AoAAAAEdFJOUwBG9tQE3MceAAAAVUlEQVQoz2NgGLKA0QGIDwDxBSCeAMEYgAWI2YCK2CagYgwgDcRSDhgYbAkKzsSKGdgakCyY6ADES7BiiCkgJ4PYyybgxAhQAsRZDrgxCpDEg4cAAAAp2ibhZRGLHgAAAABJRU5ErkJggg==) left center;--wj-checkbox-margin-top: 0;--wj-checkbox-margin-bottom: .5rem;--wj-checkbox-margin-inline: 0;--wj-checkbox-width: 16px;--wj-checkbox-height: 16px;display:block;margin-top:var(--wj-checkbox-margin-top);margin-bottom:var(--wj-checkbox-margin-bottom);margin-inline:var(--wj-checkbox-margin-inline);line-height:100%;padding-left:0}:host label{display:inline-block;cursor:pointer;position:relative;padding-left:25px;min-width:var(--wj-checkbox-width);min-height:var(--wj-checkbox-height);margin-bottom:0;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host label:before{content:"";position:absolute;width:16px;height:16px;left:0;-webkit-box-sizing:inherit;box-sizing:border-box;background-color:var(--wj-color-contrast-lowest);border:1px solid var(--wj-border-color)}.native-checkbox label{transition:border .14s linear 0s,color .14s linear 0s,background-color .14s linear 0s}.native-checkbox label:hover{color:var(--wj-color-contrast-higher)}.native-checkbox label:before{border-radius:3px;transition:border .14s linear 0s,color .14s linear 0s,background-color .14s linear 0s}.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:16px;height:16px;overflow:hidden}.native-checkbox.checkbox-circle label:after{border-radius:99px}.native-checkbox.checkbox-circle label:before{border-radius:99px}.native-checkbox input[type=checkbox]:checked+label:after{content:"";background:var(--wj-grey-check-icon);background-size:160px 16px;background-repeat:no-repeat;animation-name:checkbox-check;animation-duration:.32s;animation-timing-function:steps(9);animation-fill-mode:forwards;animation-iteration-count:1}.native-checkbox input[type=checkbox]:hover:active:not(:checked)+label:before{background-color:#00000014}.native-checkbox input[type=checkbox]:focus+label{color:var(--wj-color-contrast-higher)}.native-checkbox input[type=checkbox]:focus+label:before{outline:none!important;box-shadow:0 0 #78c8fe}.native-checkbox input[type=checkbox][disabled]+label{cursor:not-allowed!important;color:var(--wj-color-contrast-high);opacity:.58}.native-checkbox input[type=checkbox][disabled]+label:before{cursor:not-allowed!important;background:#ececec}.native-checkbox input[type=checkbox]:indeterminate+label:after{background:none;background-color:var(--wj-color-contrast-high);width:10px;height:2px;top:6px;margin:3px;border-radius:2px}.native-checkbox.right label{padding-left:0;padding-right:26px}.native-checkbox.right label:before{right:0;left:auto}.native-checkbox.right input[type=checkbox]:checked+label{position:relative}.native-checkbox.right input[type=checkbox]:checked+label:after{position:absolute;right:0;left:auto}.success input[type=checkbox]:checked+label:before,.success input[type=checkbox]:indeterminate+label:before{border-color:var(--wj-color-success);background-color:var(--wj-color-success)}.primary input[type=checkbox]:checked+label:before,.primary input[type=checkbox]:indeterminate+label:before{border-color:var(--wj-color-primary);background-color:var(--wj-color-primary)}.complete input[type=checkbox]:checked+label:before,.complete input[type=checkbox]:indeterminate+label:before{border-color:var(--wj-color-complete);background-color:var(--wj-color-complete)}.warning input[type=checkbox]:checked+label:before,.warning input[type=checkbox]:indeterminate+label:before{border-color:var(--wj-color-warning);background-color:var(--wj-color-warning)}.danger input[type=checkbox]:checked+label:before,.danger input[type=checkbox]:indeterminate+label:before{border-color:var(--wj-color-danger);background-color:var(--wj-color-danger)}.info input[type=checkbox]:checked+label:before,.info input[type=checkbox]:indeterminate+label:before{border-color:var(--wj-color-info);background-color:var(--wj-color-info)}.info input[type=checkbox]:checked+label:after,.danger input[type=checkbox]:checked+label:after,.complete input[type=checkbox]:checked+label:after,.primary input[type=checkbox]:checked+label:after,.success input[type=checkbox]:checked+label:after{background:var(--wj-white-check-icon)}.info input[type=checkbox]:indeterminate+label:after,.danger input[type=checkbox]:indeterminate+label:after,.complete input[type=checkbox]:indeterminate+label:after,.primary input[type=checkbox]:indeterminate+label:after,.success input[type=checkbox]:indeterminate+label:after{background-color:var(--wj-color-contrast-lowest)}@keyframes shrink-bounce{0%{transform:scale(1)}33%{transform:scale(.85)}to{transform:scale(1)}}@keyframes checkbox-check{0%{background-position:0}to{background-position:-144px}}.js-focus-visible .native-checkbox input[type=checkbox]:focus:not(.focus-visible)+label:before{box-shadow:none}input[type=checkbox]{accent-color:var(--wj-color-primary)!important;font-size:50px}
|
|
9
9
|
`;
|
|
10
10
|
class d extends h {
|
|
11
11
|
constructor() {
|
|
12
12
|
super();
|
|
13
|
-
|
|
14
|
-
|
|
13
|
+
i(this, "className", "Checkbox");
|
|
14
|
+
i(this, "inputEvent", (e) => {
|
|
15
15
|
this.checked = e.target.checked;
|
|
16
16
|
});
|
|
17
17
|
this._checked = !1;
|
|
@@ -34,14 +34,14 @@ class d extends h {
|
|
|
34
34
|
draw(e, p, k) {
|
|
35
35
|
let a = document.createDocumentFragment(), o = document.createElement("div");
|
|
36
36
|
o.classList.add("native-checkbox"), this.variant === "circle" && o.classList.add("checkbox-circle"), this.color && o.classList.add(this.color), this.input = document.createElement("input"), this.input.type = "checkbox", this.input.id = "checkbox", this.input.name = this.name = "checkbox", this.input.checked = this.hasAttribute("checked"), this.input.disabled = this.hasAttribute("disabled"), this.input.indeterminate = this.hasAttribute("indeterminate");
|
|
37
|
-
let
|
|
38
|
-
return
|
|
37
|
+
let r = document.createElement("label");
|
|
38
|
+
return r.htmlFor = "checkbox", r.innerHTML = "<slot></slot>", o.appendChild(this.input), o.appendChild(r), a.appendChild(o), a;
|
|
39
39
|
}
|
|
40
40
|
afterDraw() {
|
|
41
|
-
|
|
41
|
+
n.addListener(this, "click", "wj:checkbox:change"), n.addListener(this, "click", "wj:checkbox:input");
|
|
42
42
|
}
|
|
43
43
|
disconnectedCallback() {
|
|
44
|
-
|
|
44
|
+
n.removeElement(this);
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
customElements.get("wj-checkbox") || window.customElements.define("wj-checkbox", d);
|
package/dist/wj-chip.js
CHANGED
|
@@ -1,36 +1,36 @@
|
|
|
1
1
|
var l = Object.defineProperty;
|
|
2
|
-
var d = (o, t
|
|
3
|
-
var
|
|
4
|
-
import
|
|
2
|
+
var d = (r, o, t) => o in r ? l(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
|
|
3
|
+
var n = (r, o, t) => (d(r, typeof o != "symbol" ? o + "" : o, t), t);
|
|
4
|
+
import w, { event as h } from "./wj-element.js";
|
|
5
5
|
import "./wj-store.js";
|
|
6
|
-
const
|
|
6
|
+
const j = `/*!
|
|
7
7
|
* direction.scss
|
|
8
|
-
*/:host
|
|
8
|
+
*/:host{--wj-chip-border-radius: 100px;--wj-chip-background: var();--wj-chip-color: #4b4b4b;--wj-chip-margin: 0;--wj-card-background: var(--wj-color-contrast-2);--wj-card-color: var(--wj-color);margin:var(--wj-chip-margin)}:host(.wj-color-primary){--wj-card-background: var(--wj-color-primary)}:host(.wj-color-complete){--wj-card-background: var(--wj-color-complete)}:host(.wj-color-success){--wj-card-background: var(--wj-color-success)}:host(.wj-color-warning){--wj-card-background: var(--wj-color-warning)}:host(.wj-color-danger){--wj-card-background: var(--wj-color-danger)}:host(.wj-color-info){--wj-card-background: var(--wj-color-info)}:host(.wj-color-menu){--wj-card-background: var(--wj-color-menu)}:host(.wj-color-primary){--wj-card-color: var(--wj-color-white)}:host(.wj-color-complete){--wj-card-color: var(--wj-color-white)}:host(.wj-color-success){--wj-card-color: var(--wj-color-white)}:host(.wj-color-warning){--wj-card-color: var(--wj-color)}:host(.wj-color-danger){--wj-card-color: var(--wj-color-white)}:host(.wj-color-info){--wj-card-color: var(--wj-color-white)}:host(.wj-color-menu){--wj-card-color: var(--wj-color-white) !important}.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;background:var(--wj-chip-background);color:var(--wj-chip-color);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(--wj-chip-border-radius);overflow:hidden;vertical-align:middle;box-sizing:border-box}:host(.focus){box-shadow:none}:host(:hover:not(.wj-active)) .native-chip{background:var(--wj-color-contrast-3);color:var(--wj-color)}:host(.wj-active) .native-chip{border:1px solid rgba(33,33,33,.2)}:host(:focus,:active:focus,.wj-active:focus){outline:none!important;box-shadow:0 0 #78c8fe}.check{display:none}:host([active]) .check{display:block;margin-inline:4px 0}:host(.wj-disabled){background:#f4f4f4;color:#757575;border:0;pointer-events:none;cursor:not-allowed}::slotted(wj-avatar){width:22px;height:22px}::slotted(wj-avatar:first-child){margin-inline:-8px 8px;margin-top:-4px;margin-bottom:-4px}:host .native-chip{background-color:var(--wj-card-background, #fff);color:var(--wj-card-color)}::slotted(wj-icon:first-child){margin:-4px 8px -4px -4px}::slotted(wj-icon:last-child){margin:-4px -4px -4px 8px}wj-button{--wj-button-border-radius: 50%;--wj-button-margin-inline: .25rem -.5rem;--wj-padding-top: .15rem;--wj-padding-start: .15rem;--wj-padding-end: .15rem;--wj-padding-bottom: .15rem}
|
|
9
9
|
`;
|
|
10
|
-
class
|
|
10
|
+
class p extends w {
|
|
11
11
|
constructor() {
|
|
12
12
|
super();
|
|
13
|
-
|
|
13
|
+
n(this, "className", "Chip");
|
|
14
14
|
}
|
|
15
15
|
static get cssStyleSheet() {
|
|
16
|
-
return
|
|
16
|
+
return j;
|
|
17
17
|
}
|
|
18
18
|
setupAttributes() {
|
|
19
19
|
this.isShadowRoot = "open";
|
|
20
20
|
}
|
|
21
|
-
draw(
|
|
22
|
-
let a = document.createDocumentFragment(),
|
|
23
|
-
|
|
24
|
-
let s = document.createElement("slot"),
|
|
25
|
-
|
|
26
|
-
let
|
|
27
|
-
return
|
|
21
|
+
draw(t, m, u) {
|
|
22
|
+
let a = document.createDocumentFragment(), e = document.createElement("div");
|
|
23
|
+
e.classList.add("native-chip");
|
|
24
|
+
let s = document.createElement("slot"), c = document.createElement("wj-button");
|
|
25
|
+
c.setAttribute("part", "remove"), c.setAttribute("fill", "link"), c.innerHTML = '<wj-icon name="x"></wj-icon>';
|
|
26
|
+
let i = document.createElement("wj-icon");
|
|
27
|
+
return i.setAttribute("name", "check"), i.classList.add("check"), this.color && this.classList.add("wj-color-" + this.color, "wj-color"), this.disabled && this.classList.add("wj-disabled"), this.outline && this.classList.add("wj-outline"), e.appendChild(s), e.appendChild(i), this.hasAttribute("removable") && e.appendChild(c), a.appendChild(e), this.remove = c, a;
|
|
28
28
|
}
|
|
29
29
|
afterDraw() {
|
|
30
30
|
h.addListener(this.remove, "click", "wj:chip-remove", null, { stopPropagation: !0 });
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
|
-
customElements.get("wj-chip") || window.customElements.define("wj-chip",
|
|
33
|
+
customElements.get("wj-chip") || window.customElements.define("wj-chip", p);
|
|
34
34
|
export {
|
|
35
|
-
|
|
35
|
+
p as Chip
|
|
36
36
|
};
|
package/dist/wj-col.js
CHANGED
|
@@ -1,29 +1,28 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var r = (e, t, o) => (
|
|
4
|
-
import
|
|
1
|
+
var h = Object.defineProperty;
|
|
2
|
+
var f = (e, t, o) => t in e ? h(e, t, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[t] = o;
|
|
3
|
+
var r = (e, t, o) => (f(e, typeof t != "symbol" ? t + "" : t, o), o);
|
|
4
|
+
import g from "./wj-element.js";
|
|
5
5
|
import "./wj-store.js";
|
|
6
|
-
const
|
|
6
|
+
const m = `/*!
|
|
7
7
|
* direction.scss
|
|
8
8
|
*/:host{display:block;flex-grow:1;width:100%;max-width:100%;padding-right:calc(var(--wj-gutter-x) * .5);padding-left:calc(var(--wj-gutter-x) * .5);margin-top:var(--wj-gutter-y)}:host(.wj-col){flex:1 0 0%}:host(.wj-row-cols-auto)>*{flex:0 0 auto;width:auto}:host(.wj-row-cols-1)>*{flex:0 0 auto;width:100%}:host(.wj-row-cols-2)>*{flex:0 0 auto;width:50%}:host(.wj-row-cols-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wj-row-cols-4)>*{flex:0 0 auto;width:25%}:host(.wj-row-cols-5)>*{flex:0 0 auto;width:20%}:host(.wj-row-cols-6)>*{flex:0 0 auto;width:16.6666666667%}@media (min-width: 576px){:host(.wj-col-sm){flex:1 0 0%}:host(.wj-row-cols-sm-auto)>*{flex:0 0 auto;width:auto}:host(.wj-row-cols-sm-1)>*{flex:0 0 auto;width:100%}:host(.wj-row-cols-sm-2)>*{flex:0 0 auto;width:50%}:host(.wj-row-cols-sm-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wj-row-cols-sm-4)>*{flex:0 0 auto;width:25%}:host(.wj-row-cols-sm-5)>*{flex:0 0 auto;width:20%}:host(.wj-row-cols-sm-6)>*{flex:0 0 auto;width:16.6666666667%}}@media (min-width: 768px){:host(.wj-col-md){flex:1 0 0%}:host(.wj-row-cols-md-auto)>*{flex:0 0 auto;width:auto}:host(.wj-row-cols-md-1)>*{flex:0 0 auto;width:100%}:host(.wj-row-cols-md-2)>*{flex:0 0 auto;width:50%}:host(.wj-row-cols-md-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wj-row-cols-md-4)>*{flex:0 0 auto;width:25%}:host(.wj-row-cols-md-5)>*{flex:0 0 auto;width:20%}:host(.wj-row-cols-md-6)>*{flex:0 0 auto;width:16.6666666667%}}@media (min-width: 992px){:host(.wj-col-lg){flex:1 0 0%}:host(.wj-row-cols-lg-auto)>*{flex:0 0 auto;width:auto}:host(.wj-row-cols-lg-1)>*{flex:0 0 auto;width:100%}:host(.wj-row-cols-lg-2)>*{flex:0 0 auto;width:50%}:host(.wj-row-cols-lg-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wj-row-cols-lg-4)>*{flex:0 0 auto;width:25%}:host(.wj-row-cols-lg-5)>*{flex:0 0 auto;width:20%}:host(.wj-row-cols-lg-6)>*{flex:0 0 auto;width:16.6666666667%}}@media (min-width: 1200px){:host(.wj-col-xl){flex:1 0 0%}:host(.wj-row-cols-xl-auto)>*{flex:0 0 auto;width:auto}:host(.wj-row-cols-xl-1)>*{flex:0 0 auto;width:100%}:host(.wj-row-cols-xl-2)>*{flex:0 0 auto;width:50%}:host(.wj-row-cols-xl-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wj-row-cols-xl-4)>*{flex:0 0 auto;width:25%}:host(.wj-row-cols-xl-5)>*{flex:0 0 auto;width:20%}:host(.wj-row-cols-xl-6)>*{flex:0 0 auto;width:16.6666666667%}}@media (min-width: 1400px){:host(.wj-col-xxl){flex:1 0 0%}:host(.wj-row-cols-xxl-auto)>*{flex:0 0 auto;width:auto}:host(.wj-row-cols-xxl-1)>*{flex:0 0 auto;width:100%}:host(.wj-row-cols-xxl-2)>*{flex:0 0 auto;width:50%}:host(.wj-row-cols-xxl-3)>*{flex:0 0 auto;width:33.3333333333%}:host(.wj-row-cols-xxl-4)>*{flex:0 0 auto;width:25%}:host(.wj-row-cols-xxl-5)>*{flex:0 0 auto;width:20%}:host(.wj-row-cols-xxl-6)>*{flex:0 0 auto;width:16.6666666667%}}:host(.wj-col-auto){flex:0 0 auto;width:auto}:host(.wj-col-1){flex:0 0 auto;width:8.33333333%}:host(.wj-col-2){flex:0 0 auto;width:16.66666667%}:host(.wj-col-3){flex:0 0 auto;width:25%}:host(.wj-col-4){flex:0 0 auto;width:33.33333333%}:host(.wj-col-5){flex:0 0 auto;width:41.66666667%}:host(.wj-col-6){flex:0 0 auto;width:50%}:host(.wj-col-7){flex:0 0 auto;width:58.33333333%}:host(.wj-col-8){flex:0 0 auto;width:66.66666667%}:host(.wj-col-9){flex:0 0 auto;width:75%}:host(.wj-col-10){flex:0 0 auto;width:83.33333333%}:host(.wj-col-11){flex:0 0 auto;width:91.66666667%}:host(.wj-col-12){flex:0 0 auto;width:100%}:host(.wj-offset-1){margin-left:8.33333333%}:host(.wj-offset-2){margin-left:16.66666667%}:host(.wj-offset-3){margin-left:25%}:host(.wj-offset-4){margin-left:33.33333333%}:host(.wj-offset-5){margin-left:41.66666667%}:host(.wj-offset-6){margin-left:50%}:host(.wj-offset-7){margin-left:58.33333333%}:host(.wj-offset-8){margin-left:66.66666667%}:host(.wj-offset-9){margin-left:75%}:host(.wj-offset-10){margin-left:83.33333333%}:host(.wj-offset-11){margin-left:91.66666667%}.g-0,.gx-0{--wj-gutter-x: 0}.g-0,.gy-0{--wj-gutter-y: 0}.g-1,.gx-1{--wj-gutter-x: .25rem}.g-1,.gy-1{--wj-gutter-y: .25rem}.g-2,.gx-2{--wj-gutter-x: .5rem}.g-2,.gy-2{--wj-gutter-y: .5rem}.g-3,.gx-3{--wj-gutter-x: 1rem}.g-3,.gy-3{--wj-gutter-y: 1rem}.g-4,.gx-4{--wj-gutter-x: 1.5rem}.g-4,.gy-4{--wj-gutter-y: 1.5rem}.g-5,.gx-5{--wj-gutter-x: 3rem}.g-5,.gy-5{--wj-gutter-y: 3rem}@media (min-width: 576px){:host(.wj-col-sm-auto){flex:0 0 auto;width:auto}:host(.wj-col-sm-1){flex:0 0 auto;width:8.33333333%}:host(.wj-col-sm-2){flex:0 0 auto;width:16.66666667%}:host(.wj-col-sm-3){flex:0 0 auto;width:25%}:host(.wj-col-sm-4){flex:0 0 auto;width:33.33333333%}:host(.wj-col-sm-5){flex:0 0 auto;width:41.66666667%}:host(.wj-col-sm-6){flex:0 0 auto;width:50%}:host(.wj-col-sm-7){flex:0 0 auto;width:58.33333333%}:host(.wj-col-sm-8){flex:0 0 auto;width:66.66666667%}:host(.wj-col-sm-9){flex:0 0 auto;width:75%}:host(.wj-col-sm-10){flex:0 0 auto;width:83.33333333%}:host(.wj-col-sm-11){flex:0 0 auto;width:91.66666667%}:host(.wj-col-sm-12){flex:0 0 auto;width:100%}:host(.wj-offset-sm-0){margin-left:0}:host(.wj-offset-sm-1){margin-left:8.33333333%}:host(.wj-offset-sm-2){margin-left:16.66666667%}:host(.wj-offset-sm-3){margin-left:25%}:host(.wj-offset-sm-4){margin-left:33.33333333%}:host(.wj-offset-sm-5){margin-left:41.66666667%}:host(.wj-offset-sm-6){margin-left:50%}:host(.wj-offset-sm-7){margin-left:58.33333333%}:host(.wj-offset-sm-8){margin-left:66.66666667%}:host(.wj-offset-sm-9){margin-left:75%}:host(.wj-offset-sm-10){margin-left:83.33333333%}:host(.wj-offset-sm-11){margin-left:91.66666667%}.g-sm-0,.gx-sm-0{--wj-gutter-x: 0}.g-sm-0,.gy-sm-0{--wj-gutter-y: 0}.g-sm-1,.gx-sm-1{--wj-gutter-x: .25rem}.g-sm-1,.gy-sm-1{--wj-gutter-y: .25rem}.g-sm-2,.gx-sm-2{--wj-gutter-x: .5rem}.g-sm-2,.gy-sm-2{--wj-gutter-y: .5rem}.g-sm-3,.gx-sm-3{--wj-gutter-x: 1rem}.g-sm-3,.gy-sm-3{--wj-gutter-y: 1rem}.g-sm-4,.gx-sm-4{--wj-gutter-x: 1.5rem}.g-sm-4,.gy-sm-4{--wj-gutter-y: 1.5rem}.g-sm-5,.gx-sm-5{--wj-gutter-x: 3rem}.g-sm-5,.gy-sm-5{--wj-gutter-y: 3rem}}@media (min-width: 768px){:host(.wj-col-md-auto){flex:0 0 auto;width:auto}:host(.wj-col-md-1){flex:0 0 auto;width:8.33333333%}:host(.wj-col-md-2){flex:0 0 auto;width:16.66666667%}:host(.wj-col-md-3){flex:0 0 auto;width:25%}:host(.wj-col-md-4){flex:0 0 auto;width:33.33333333%}:host(.wj-col-md-5){flex:0 0 auto;width:41.66666667%}:host(.wj-col-md-6){flex:0 0 auto;width:50%}:host(.wj-col-md-7){flex:0 0 auto;width:58.33333333%}:host(.wj-col-md-8){flex:0 0 auto;width:66.66666667%}:host(.wj-col-md-9){flex:0 0 auto;width:75%}:host(.wj-col-md-10){flex:0 0 auto;width:83.33333333%}:host(.wj-col-md-11){flex:0 0 auto;width:91.66666667%}:host(.wj-col-md-12){flex:0 0 auto;width:100%}:host(.wj-offset-md-0){margin-left:0}:host(.wj-offset-md-1){margin-left:8.33333333%}:host(.wj-offset-md-2){margin-left:16.66666667%}:host(.wj-offset-md-3){margin-left:25%}:host(.wj-offset-md-4){margin-left:33.33333333%}:host(.wj-offset-md-5){margin-left:41.66666667%}:host(.wj-offset-md-6){margin-left:50%}:host(.wj-offset-md-7){margin-left:58.33333333%}:host(.wj-offset-md-8){margin-left:66.66666667%}:host(.wj-offset-md-9){margin-left:75%}:host(.wj-offset-md-10){margin-left:83.33333333%}:host(.wj-offset-md-11){margin-left:91.66666667%}.g-md-0,.gx-md-0{--wj-gutter-x: 0}.g-md-0,.gy-md-0{--wj-gutter-y: 0}.g-md-1,.gx-md-1{--wj-gutter-x: .25rem}.g-md-1,.gy-md-1{--wj-gutter-y: .25rem}.g-md-2,.gx-md-2{--wj-gutter-x: .5rem}.g-md-2,.gy-md-2{--wj-gutter-y: .5rem}.g-md-3,.gx-md-3{--wj-gutter-x: 1rem}.g-md-3,.gy-md-3{--wj-gutter-y: 1rem}.g-md-4,.gx-md-4{--wj-gutter-x: 1.5rem}.g-md-4,.gy-md-4{--wj-gutter-y: 1.5rem}.g-md-5,.gx-md-5{--wj-gutter-x: 3rem}.g-md-5,.gy-md-5{--wj-gutter-y: 3rem}}@media (min-width: 992px){:host(.wj-col-lg-auto){flex:0 0 auto;width:auto}:host(.wj-col-lg-1){flex:0 0 auto;width:8.33333333%}:host(.wj-col-lg-2){flex:0 0 auto;width:16.66666667%}:host(.wj-col-lg-3){flex:0 0 auto;width:25%}:host(.wj-col-lg-4){flex:0 0 auto;width:33.33333333%}:host(.wj-col-lg-5){flex:0 0 auto;width:41.66666667%}:host(.wj-col-lg-6){flex:0 0 auto;width:50%}:host(.wj-col-lg-7){flex:0 0 auto;width:58.33333333%}:host(.wj-col-lg-8){flex:0 0 auto;width:66.66666667%}:host(.wj-col-lg-9){flex:0 0 auto;width:75%}:host(.wj-col-lg-10){flex:0 0 auto;width:83.33333333%}:host(.wj-col-lg-11){flex:0 0 auto;width:91.66666667%}:host(.wj-col-lg-12){flex:0 0 auto;width:100%}:host(.wj-offset-lg-0){margin-left:0}:host(.wj-offset-lg-1){margin-left:8.33333333%}:host(.wj-offset-lg-2){margin-left:16.66666667%}:host(.wj-offset-lg-3){margin-left:25%}:host(.wj-offset-lg-4){margin-left:33.33333333%}:host(.wj-offset-lg-5){margin-left:41.66666667%}:host(.wj-offset-lg-6){margin-left:50%}:host(.wj-offset-lg-7){margin-left:58.33333333%}:host(.wj-offset-lg-8){margin-left:66.66666667%}:host(.wj-offset-lg-9){margin-left:75%}:host(.wj-offset-lg-10){margin-left:83.33333333%}:host(.wj-offset-lg-11){margin-left:91.66666667%}.g-lg-0,.gx-lg-0{--wj-gutter-x: 0}.g-lg-0,.gy-lg-0{--wj-gutter-y: 0}.g-lg-1,.gx-lg-1{--wj-gutter-x: .25rem}.g-lg-1,.gy-lg-1{--wj-gutter-y: .25rem}.g-lg-2,.gx-lg-2{--wj-gutter-x: .5rem}.g-lg-2,.gy-lg-2{--wj-gutter-y: .5rem}.g-lg-3,.gx-lg-3{--wj-gutter-x: 1rem}.g-lg-3,.gy-lg-3{--wj-gutter-y: 1rem}.g-lg-4,.gx-lg-4{--wj-gutter-x: 1.5rem}.g-lg-4,.gy-lg-4{--wj-gutter-y: 1.5rem}.g-lg-5,.gx-lg-5{--wj-gutter-x: 3rem}.g-lg-5,.gy-lg-5{--wj-gutter-y: 3rem}}@media (min-width: 1200px){:host(.wj-col-xl-auto){flex:0 0 auto;width:auto}:host(.wj-col-xl-1){flex:0 0 auto;width:8.33333333%}:host(.wj-col-xl-2){flex:0 0 auto;width:16.66666667%}:host(.wj-col-xl-3){flex:0 0 auto;width:25%}:host(.wj-col-xl-4){flex:0 0 auto;width:33.33333333%}:host(.wj-col-xl-5){flex:0 0 auto;width:41.66666667%}:host(.wj-col-xl-6){flex:0 0 auto;width:50%}:host(.wj-col-xl-7){flex:0 0 auto;width:58.33333333%}:host(.wj-col-xl-8){flex:0 0 auto;width:66.66666667%}:host(.wj-col-xl-9){flex:0 0 auto;width:75%}:host(.wj-col-xl-10){flex:0 0 auto;width:83.33333333%}:host(.wj-col-xl-11){flex:0 0 auto;width:91.66666667%}:host(.wj-col-xl-12){flex:0 0 auto;width:100%}:host(.wj-offset-xl-0){margin-left:0}:host(.wj-offset-xl-1){margin-left:8.33333333%}:host(.wj-offset-xl-2){margin-left:16.66666667%}:host(.wj-offset-xl-3){margin-left:25%}:host(.wj-offset-xl-4){margin-left:33.33333333%}:host(.wj-offset-xl-5){margin-left:41.66666667%}:host(.wj-offset-xl-6){margin-left:50%}:host(.wj-offset-xl-7){margin-left:58.33333333%}:host(.wj-offset-xl-8){margin-left:66.66666667%}:host(.wj-offset-xl-9){margin-left:75%}:host(.wj-offset-xl-10){margin-left:83.33333333%}:host(.wj-offset-xl-11){margin-left:91.66666667%}.g-xl-0,.gx-xl-0{--wj-gutter-x: 0}.g-xl-0,.gy-xl-0{--wj-gutter-y: 0}.g-xl-1,.gx-xl-1{--wj-gutter-x: .25rem}.g-xl-1,.gy-xl-1{--wj-gutter-y: .25rem}.g-xl-2,.gx-xl-2{--wj-gutter-x: .5rem}.g-xl-2,.gy-xl-2{--wj-gutter-y: .5rem}.g-xl-3,.gx-xl-3{--wj-gutter-x: 1rem}.g-xl-3,.gy-xl-3{--wj-gutter-y: 1rem}.g-xl-4,.gx-xl-4{--wj-gutter-x: 1.5rem}.g-xl-4,.gy-xl-4{--wj-gutter-y: 1.5rem}.g-xl-5,.gx-xl-5{--wj-gutter-x: 3rem}.g-xl-5,.gy-xl-5{--wj-gutter-y: 3rem}}@media (min-width: 1400px){:host(.wj-col-xxl-auto){flex:0 0 auto;width:auto}:host(.wj-col-xxl-1){flex:0 0 auto;width:8.33333333%}:host(.wj-col-xxl-2){flex:0 0 auto;width:16.66666667%}:host(.wj-col-xxl-3){flex:0 0 auto;width:25%}:host(.wj-col-xxl-4){flex:0 0 auto;width:33.33333333%}:host(.wj-col-xxl-5){flex:0 0 auto;width:41.66666667%}:host(.wj-col-xxl-6){flex:0 0 auto;width:50%}:host(.wj-col-xxl-7){flex:0 0 auto;width:58.33333333%}:host(.wj-col-xxl-8){flex:0 0 auto;width:66.66666667%}:host(.wj-col-xxl-9){flex:0 0 auto;width:75%}:host(.wj-col-xxl-10){flex:0 0 auto;width:83.33333333%}:host(.wj-col-xxl-11){flex:0 0 auto;width:91.66666667%}:host(.wj-col-xxl-12){flex:0 0 auto;width:100%}:host(.wj-offset-xxl-0){margin-left:0}:host(.wj-offset-xxl-1){margin-left:8.33333333%}:host(.wj-offset-xxl-2){margin-left:16.66666667%}:host(.wj-offset-xxl-3){margin-left:25%}:host(.wj-offset-xxl-4){margin-left:33.33333333%}:host(.wj-offset-xxl-5){margin-left:41.66666667%}:host(.wj-offset-xxl-6){margin-left:50%}:host(.wj-offset-xxl-7){margin-left:58.33333333%}:host(.wj-offset-xxl-8){margin-left:66.66666667%}:host(.wj-offset-xxl-9){margin-left:75%}:host(.wj-offset-xxl-10){margin-left:83.33333333%}:host(.wj-offset-xxl-11){margin-left:91.66666667%}.g-xxl-0,.gx-xxl-0{--wj-gutter-x: 0}.g-xxl-0,.gy-xxl-0{--wj-gutter-y: 0}.g-xxl-1,.gx-xxl-1{--wj-gutter-x: .25rem}.g-xxl-1,.gy-xxl-1{--wj-gutter-y: .25rem}.g-xxl-2,.gx-xxl-2{--wj-gutter-x: .5rem}.g-xxl-2,.gy-xxl-2{--wj-gutter-y: .5rem}.g-xxl-3,.gx-xxl-3{--wj-gutter-x: 1rem}.g-xxl-3,.gy-xxl-3{--wj-gutter-y: 1rem}.g-xxl-4,.gx-xxl-4{--wj-gutter-x: 1.5rem}.g-xxl-4,.gy-xxl-4{--wj-gutter-y: 1.5rem}.g-xxl-5,.gx-xxl-5{--wj-gutter-x: 3rem}.g-xxl-5,.gy-xxl-5{--wj-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}
|
|
9
9
|
`;
|
|
10
|
-
|
|
11
|
-
class d extends m {
|
|
10
|
+
class d extends g {
|
|
12
11
|
constructor() {
|
|
13
12
|
super();
|
|
14
13
|
r(this, "className", "Col");
|
|
15
14
|
}
|
|
16
15
|
static get cssStyleSheet() {
|
|
17
|
-
return
|
|
16
|
+
return m;
|
|
18
17
|
}
|
|
19
18
|
setupAttributes() {
|
|
20
19
|
this.isShadowRoot = "open";
|
|
21
20
|
}
|
|
22
|
-
beforeDraw(o,
|
|
21
|
+
beforeDraw(o, s, w) {
|
|
23
22
|
}
|
|
24
|
-
draw(o,
|
|
25
|
-
let l = document.createDocumentFragment(),
|
|
26
|
-
return this.order && this.classList.add("order-" + this.order), this.size && this.classList.add("wj-col-" + this.size), this.sizeSm && this.classList.add("wj-col-sm-" + this.sizeSm), this.sizeMd && this.classList.add("wj-col-md-" + this.sizeMd), this.offset && this.classList.add("wj-offset-" + this.offset), this.offsetSm && this.classList.add("wj-offset-sm-" + this.offsetSm), l.appendChild(
|
|
23
|
+
draw(o, s, w) {
|
|
24
|
+
let l = document.createDocumentFragment(), x = document.createElement("slot");
|
|
25
|
+
return this.order && this.classList.add("order-" + this.order), this.size && this.classList.add("wj-col-" + this.size), this.sizeSm && this.classList.add("wj-col-sm-" + this.sizeSm), this.sizeMd && this.classList.add("wj-col-md-" + this.sizeMd), this.offset && this.classList.add("wj-offset-" + this.offset), this.offsetSm && this.classList.add("wj-offset-sm-" + this.offsetSm), l.appendChild(x), l;
|
|
27
26
|
}
|
|
28
27
|
}
|
|
29
28
|
customElements.get("wj-col") || window.customElements.define("wj-col", d);
|