wj-elements 0.1.127 → 0.1.128

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.
Files changed (98) hide show
  1. package/dist/{infinite-scroll.element-DEQ-AqTB.js → infinite-scroll.element-DcO1E5Es.js} +1 -4
  2. package/dist/{list.element-BkOOqBtW.js → list.element-TZXMx1rt.js} +1 -4
  3. package/dist/{popup.element-DvPGL_NN.js → popup.element-l8v-dMoK.js} +4 -10
  4. package/dist/{router-links-F7MJWhZi.js → router-links-I2vcmVCs.js} +8 -16
  5. package/dist/wje-accordion-item.js +1 -4
  6. package/dist/wje-accordion.js +1 -4
  7. package/dist/wje-animation.js +1 -4
  8. package/dist/wje-aside.js +1 -4
  9. package/dist/wje-avatar.js +1 -4
  10. package/dist/wje-badge.js +1 -4
  11. package/dist/wje-breadcrumb.js +1 -4
  12. package/dist/wje-breadcrumbs.js +1 -4
  13. package/dist/wje-button-group.js +1 -4
  14. package/dist/wje-button.js +1 -4
  15. package/dist/wje-card-content.js +1 -4
  16. package/dist/wje-card-controls.js +1 -4
  17. package/dist/wje-card-header.js +1 -4
  18. package/dist/wje-card-subtitle.js +1 -4
  19. package/dist/wje-card-title.js +1 -4
  20. package/dist/wje-card.js +1 -4
  21. package/dist/wje-carousel-item.js +1 -4
  22. package/dist/wje-carousel.js +1 -4
  23. package/dist/wje-checkbox.js +1 -4
  24. package/dist/wje-chip.js +1 -4
  25. package/dist/wje-col.js +1 -4
  26. package/dist/wje-color-picker.js +18 -38
  27. package/dist/wje-container.js +1 -4
  28. package/dist/wje-copy-button.js +1 -4
  29. package/dist/wje-dialog.js +1 -4
  30. package/dist/wje-divider.js +1 -4
  31. package/dist/wje-dropdown.js +2 -5
  32. package/dist/wje-element.js +73 -33
  33. package/dist/wje-file-upload-item.js +4 -6
  34. package/dist/wje-file-upload.js +1 -4
  35. package/dist/wje-footer.js +1 -4
  36. package/dist/wje-form.js +1 -4
  37. package/dist/wje-format-digital.js +2 -6
  38. package/dist/wje-grid.js +1 -4
  39. package/dist/wje-header.js +1 -4
  40. package/dist/wje-icon-picker.js +14 -6
  41. package/dist/wje-icon.js +1 -4
  42. package/dist/wje-img-comparer.js +1 -4
  43. package/dist/wje-img.js +9 -4
  44. package/dist/wje-infinite-scroll.js +1 -1
  45. package/dist/wje-input-file.js +1 -4
  46. package/dist/wje-input.js +5 -4
  47. package/dist/wje-item.js +1 -4
  48. package/dist/wje-kanban.js +2 -6
  49. package/dist/wje-label.js +1 -4
  50. package/dist/wje-list.js +1 -1
  51. package/dist/wje-main.js +1 -4
  52. package/dist/wje-masonry.js +2 -6
  53. package/dist/wje-master.js +5 -8
  54. package/dist/wje-menu-button.js +1 -4
  55. package/dist/wje-menu-item.js +4 -9
  56. package/dist/wje-menu-label.js +1 -4
  57. package/dist/wje-menu.js +1 -4
  58. package/dist/wje-option.js +2 -6
  59. package/dist/wje-options.js +3 -6
  60. package/dist/wje-orgchart-group.js +1 -4
  61. package/dist/wje-orgchart-item.js +2 -6
  62. package/dist/wje-orgchart.js +1 -4
  63. package/dist/wje-popup.js +1 -1
  64. package/dist/wje-progress-bar.js +1 -4
  65. package/dist/wje-qr-code.js +1 -4
  66. package/dist/wje-radio-group.js +1 -4
  67. package/dist/wje-radio.js +1 -4
  68. package/dist/wje-rate.js +1 -4
  69. package/dist/wje-relative-time.js +1 -4
  70. package/dist/wje-reorder-dropzone.js +1 -4
  71. package/dist/wje-reorder-handle.js +7 -16
  72. package/dist/wje-reorder-item.js +1 -4
  73. package/dist/wje-reorder.js +5 -12
  74. package/dist/wje-route.js +1 -4
  75. package/dist/wje-router-link.js +2 -5
  76. package/dist/wje-router-outlet.js +3 -8
  77. package/dist/wje-routerx.js +29 -59
  78. package/dist/wje-row.js +1 -4
  79. package/dist/wje-select.js +5 -11
  80. package/dist/wje-slider.js +2 -5
  81. package/dist/wje-sliding-container.js +1 -4
  82. package/dist/wje-split-view.js +1 -4
  83. package/dist/wje-status.js +1 -4
  84. package/dist/wje-step.js +1 -4
  85. package/dist/wje-stepper.js +122 -222
  86. package/dist/wje-store.js +1 -4
  87. package/dist/wje-tab-group.js +1 -4
  88. package/dist/wje-tab-panel.js +1 -4
  89. package/dist/wje-tab.js +1 -4
  90. package/dist/wje-textarea.js +1 -4
  91. package/dist/wje-thumbnail.js +1 -4
  92. package/dist/wje-toast.js +91 -17
  93. package/dist/wje-toggle.js +1 -4
  94. package/dist/wje-toolbar-action.js +1 -4
  95. package/dist/wje-toolbar.js +2 -5
  96. package/dist/wje-tooltip.js +1 -4
  97. package/dist/wje-visually-hidden.js +1 -4
  98. package/package.json +13 -6
package/dist/{infinite-scroll.element-DEQ-AqTB.js → infinite-scroll.element-DcO1E5Es.js} RENAMED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement, { WjElementUtils, event } from "./wje-element.js";
8
5
  const styles = "/*\n[ Wj infinite Scroll ]\n*/\n\n:host {\n overflow-x: auto;\n width: var(--wje-infinite-scroll-width);\n height: var(--wje-infinite-scroll-height);\n display: block;\n}\n\n.native {\n /*position: relative;*/\n}\n\n.loading {\n position: sticky;\n display: none;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: 9999;\n background-color: var(--wje-infinite-scroll-loading-bg);\n &.show {\n display: flex;\n }\n}\n\n[name=ending] {\n display: none;\n margin-top: 1rem;\n text-align: center;\n}\n\n[name=ending].show {\n display: block;\n}";
9
6
  class InfiniteScroll extends WJElement {
package/dist/{list.element-BkOOqBtW.js → list.element-TZXMx1rt.js} RENAMED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ List ]\n*/\n:host {\n margin: 0;\n padding: 0;\n display: block;\n contain: content;\n list-style-type: none;\n}\n\n:host(.wje-inset) {\n background: var(--wje-list-background);\n transform: translateZ(0);\n overflow: hidden;\n padding: var(--wje-list-inset-padding);\n border-radius: var(--wje-list-border-radius);\n}\n\n:host(.wje-lines-none) ::slotted(wje-item) {\n --wje-border-width: 0 !important;\n}";
9
6
  class List extends WJElement {
package/dist/{popup.element-DvPGL_NN.js → popup.element-l8v-dMoK.js} RENAMED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement, { event } from "./wje-element.js";
8
5
  const min = Math.min;
9
6
  const max = Math.max;
@@ -75,8 +72,7 @@ function getSideList(side, isStart, rtl) {
75
72
  switch (side) {
76
73
  case "top":
77
74
  case "bottom":
78
- if (rtl)
79
- return isStart ? rl : lr;
75
+ if (rtl) return isStart ? rl : lr;
80
76
  return isStart ? lr : rl;
81
77
  case "left":
82
78
  case "right":
@@ -667,8 +663,7 @@ function getContainingBlock(element) {
667
663
  return null;
668
664
  }
669
665
  function isWebKit() {
670
- if (typeof CSS === "undefined" || !CSS.supports)
671
- return false;
666
+ if (typeof CSS === "undefined" || !CSS.supports) return false;
672
667
  return CSS.supports("-webkit-backdrop-filter", "none");
673
668
  }
674
669
  function isLastTraversableNode(node) {
@@ -1390,8 +1385,7 @@ class Popup extends WJElement {
1390
1385
  }
1391
1386
  if (this.manual) {
1392
1387
  event.addListener(this.anchorEl, "click", null, (e) => {
1393
- if (this.hasAttribute("disabled"))
1394
- return;
1388
+ if (this.hasAttribute("disabled")) return;
1395
1389
  this.showHide();
1396
1390
  }, { stopPropagation: true });
1397
1391
  }
package/dist/{router-links-F7MJWhZi.js → router-links-I2vcmVCs.js} RENAMED
@@ -25,8 +25,7 @@ const undelegate = function(el, handler) {
25
25
  el.removeEventListener(eventName, handler, false);
26
26
  };
27
27
  const camelize = (str) => {
28
- if (str.indexOf("-") === -1)
29
- return str;
28
+ if (str.indexOf("-") === -1) return str;
30
29
  const words = str.split("-");
31
30
  let result = "";
32
31
  for (let i = 0; i < words.length; i++) {
@@ -45,8 +44,7 @@ function mutationHandler(mutations, observer) {
45
44
  } else {
46
45
  mutation.addedNodes.forEach((node) => {
47
46
  if (node.nodeType === 1) {
48
- if (node.getAttribute("route"))
49
- updateLink(node, observer.ownerEl);
47
+ if (node.getAttribute("route")) updateLink(node, observer.ownerEl);
50
48
  createLinks(observer.ownerEl, node);
51
49
  }
52
50
  });
@@ -67,8 +65,7 @@ function getAttributeValues(el, prefix, result) {
67
65
  }
68
66
  function getDefaults(ownerEl, routeName, propName, routeEl, options) {
69
67
  let result = options[propName];
70
- if (typeof result === "function")
71
- result = result.call(ownerEl, routeName, routeEl);
68
+ if (typeof result === "function") result = result.call(ownerEl, routeName, routeEl);
72
69
  return result || {};
73
70
  }
74
71
  function getRouteProp(ownerEl, routeName, routeEl, propName, attrPrefix) {
@@ -89,15 +86,13 @@ function updateActiveClass(el, routeName, params, query) {
89
86
  }
90
87
  function updateLink(el, ownerEl) {
91
88
  const routeName = el.getAttribute("route");
92
- if (!routeName)
93
- return;
89
+ if (!routeName) return;
94
90
  const params = getRouteProp(ownerEl, routeName, el, "params", "param-");
95
91
  const query = getRouteProp(ownerEl, routeName, el, "query", "query-");
96
92
  try {
97
93
  const href = router.generate(routeName, params, query);
98
94
  const anchorEl = el.tagName === "A" ? el : el.querySelector("a");
99
- if (anchorEl)
100
- anchorEl.setAttribute("href", href);
95
+ if (anchorEl) anchorEl.setAttribute("href", href);
101
96
  if (!router.state.activeTransition) {
102
97
  updateActiveClass(el, routeName, params, query);
103
98
  }
@@ -112,13 +107,11 @@ function createLinks(ownerEl, rootEl) {
112
107
  });
113
108
  }
114
109
  function linkClickHandler(e) {
115
- if (e.button !== 0 || isModifiedEvent(e))
116
- return;
110
+ if (e.button !== 0 || isModifiedEvent(e)) return;
117
111
  e.preventDefault();
118
112
  const el = e.selectorTarget;
119
113
  const routeName = el.getAttribute("route");
120
- if (!routeName)
121
- return;
114
+ if (!routeName) return;
122
115
  const params = getRouteProp(this, routeName, el, "params", "param-");
123
116
  const query = getRouteProp(this, routeName, el, "query", "query-");
124
117
  const method = el.hasAttribute("replace") ? "replaceWith" : "transitionTo";
@@ -185,8 +178,7 @@ function done() {
185
178
  const data = ownerEl[routerLinksData];
186
179
  data.rootEls.forEach((el) => {
187
180
  const routeName = el.getAttribute("route");
188
- if (!routeName)
189
- return;
181
+ if (!routeName) return;
190
182
  const params = getRouteProp(ownerEl, routeName, el, "params", "param-");
191
183
  const query = getRouteProp(ownerEl, routeName, el, "query", "query-");
192
184
  updateActiveClass(el, routeName, params, query);
package/dist/wje-accordion-item.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement, { event } from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Accordion Item ]\n*/\n\n:host {\n --wje-accordion-background: var(--wje-color-contrast-0);\n --wje-accordion-border: var(--wje-color-contrast-0);\n --wje-accordion-border-radius: var(--wje-border-radius-large);\n --wje-accordion-background-hover: var(--wje-color-contrast-1);\n --wje-accordion-border-hover: var(--wje-color-contrast-2);\n --wje-accordion-background-expanded: var(--wje-color-contrast-0);\n --wje-accordion-border-expanded: var(--wje-color-contrast-0);\n --wje-accordion-headline-color: var(--wje-color-contrast-11) !important;\n --wje-accordion-content-color: var(--wje-color-contrast-6);\n}\n\n:host([color=primary]) {\n --wje-accordion-background: var(--wje-color-primary-1);\n --wje-accordion-border: var(--wje-color-primary-1);\n --wje-accordion-background-hover: var(--wje-color-primary-2);\n --wje-accordion-border-hover: var(--wje-color-primary-2);\n --wje-accordion-background-expanded: transparent;\n --wje-accordion-border-expanded: var(--wje-color-primary-3);\n --wje-accordion-headline-color: var(--wje-color-contrast-11) !important;\n --wje-accordion-content-color: var(--wje-color-contrast-6);\n}\n\n:host([color=complete]) {\n --wje-accordion-background: var(--wje-color-complete-1);\n --wje-accordion-border: var(--wje-color-complete-1);\n --wje-accordion-background-hover: var(--wje-color-complete-2);\n --wje-accordion-border-hover: var(--wje-color-complete-2);\n --wje-accordion-background-expanded: transparent;\n --wje-accordion-border-expanded: var(--wje-color-complete-3);\n --wje-accordion-headline-color: var(--wje-color-contrast-11) !important;\n --wje-accordion-content-color: var(--wje-color-contrast-6);\n}\n\n:host([color=success]) {\n --wje-accordion-background: var(--wje-color-success-1);\n --wje-accordion-border: var(--wje-color-success-1);\n --wje-accordion-background-hover: var(--wje-color-success-2);\n --wje-accordion-border-hover: var(--wje-color-success-2);\n --wje-accordion-background-expanded: transparent;\n --wje-accordion-border-expanded: var(--wje-color-success-3);\n --wje-accordion-headline-color: var(--wje-color-contrast-11) !important;\n --wje-accordion-content-color: var(--wje-color-contrast-6);\n}\n\n:host([color=danger]) {\n --wje-accordion-background: var(--wje-color-danger-1);\n --wje-accordion-border: var(--wje-color-danger-1);\n --wje-accordion-background-hover: var(--wje-color-danger-2);\n --wje-accordion-border-hover: var(--wje-color-danger-2);\n --wje-accordion-background-expanded: transparent;\n --wje-accordion-border-expanded: var(--wje-color-danger-3);\n --wje-accordion-headline-color: var(--wje-color-contrast-11) !important;\n --wje-accordion-content-color: var(--wje-color-contrast-6);\n}\n\n:host([color=warning]) {\n --wje-accordion-background: var(--wje-color-warning-1);\n --wje-accordion-border: var(--wje-color-warning-1);\n --wje-accordion-background-hover: var(--wje-color-warning-2);\n --wje-accordion-border-hover: var(--wje-color-warning-2);\n --wje-accordion-background-expanded: transparent;\n --wje-accordion-border-expanded: var(--wje-color-warning-3);\n --wje-accordion-headline-color: var(--wje-color-contrast-11) !important;\n --wje-accordion-content-color: var(--wje-color-contrast-6);\n}\n\n:host([color=info]) {\n --wje-accordion-background: var(--wje-color-info-1);\n --wje-accordion-border: var(--wje-color-info-1);\n --wje-accordion-background-hover: var(--wje-color-info-2);\n --wje-accordion-border-hover: var(--wje-color-info-2);\n --wje-accordion-background-expanded: transparent;\n --wje-accordion-border-expanded: var(--wje-color-info-3);\n --wje-accordion-headline-color: var(--wje-color-contrast-11) !important;\n --wje-accordion-content-color: var(--wje-color-contrast-6);\n}\n\n:host {\n display: block;\n margin-bottom: .5rem;\n}\n\n/*:host(.expanding) #content {*/\n/* display: none;*/\n/*}*/\n\n/*:host(.collapsing) #content {*/\n/* max-height: 0;*/\n/*}*/\n\n.native-accordion-item {\n display: block;\n background-color: var(--wje-accordion-background);\n border-radius: var(--wje-accordion-border-radius);\n border-width: 1px;\n border-style: solid;\n border-color: var(--wje-accordion-border);\n transition: background-color 200ms ease-in-out;\n &:hover {\n background-color: var(--wje-accordion-background-hover);\n border-color: var(--wje-accordion-border-hover);\n }\n}\n\n:host(.expanded) .native-accordion-item {\n background-color: var(--wje-accordion-background-expanded);\n border-color: var(--wje-accordion-border-expanded);\n}\n\n.headline {\n display: grid;\n grid-template-columns: 1fr auto;\n align-items: center;\n font-size: var(--wje-font-size) !important;\n color: var(--wje-accordion-headline-color);\n line-height: normal !important;\n margin: 0 !important;\n padding: .75rem;\n}\n\n[name=description] {\n font-size: var(--wje-font-size-small);\n color: var(--wje-color-contrast-6);\n}\n\nwje-icon {\n margin-left: auto;\n transform: rotate(var(--wje-accordion-marker-rotate, 0deg));\n}\n\n#content {\n /*background: var(--wje-accordion-background);*/\n display: block;\n color: var(--wje-accordion-content-color);\n overflow: hidden;\n max-height: 0;\n transition: max-height 250ms ease-in-out;\n}\n\n#content slot{\n display: block;\n margin: 0 .75rem .75rem .75rem;\n}\n\n:host(.expanded) #content {\n /*display: block;*/\n /*padding: 0 .75rem .75rem .75rem;*/\n max-height: 100vh;\n\n}";
9
6
  class AccordionItem extends WJElement {
package/dist/wje-accordion.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Accordion ]\n*/\n\n:host {\n display: block;\n width: 100%;\n}";
9
6
  class Accordion extends WJElement {
package/dist/wje-animation.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  import { fetchAndParseCSS } from "./wje-fetchAndParseCSS.js";
9
6
  const styles = '/*\n[ Standard Element ]\n*/\n\nhtml {\n font-size: 100%;\n -ms-text-size-adjust: 100%;\n -webkit-text-size-adjust: 100%;\n}\nbody {\n color: var(--wje-color-contrast-8);\n font-family: var(--wje-font-family);\n font-size: var(--wje-font-size);\n font-weight: normal;\n letter-spacing: 0.01em;\n -webkit-font-smoothing: antialiased;\n -webkit-text-size-adjust: 100%;\n -ms-text-size-adjust: 100%;\n -webkit-font-feature-settings: "kern" 1;\n -moz-font-feature-settings: "kern" 1;\n margin: 0;\n padding: 0 !important;\n}\n/* Headings\n------------------------------------\n*/\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin: .625rem 0;\n font-family: var(--wje-font-family);\n -webkit-font-smoothing: antialiased;\n -webkit-text-size-adjust: 100%;\n -ms-text-size-adjust: 100%;\n font-weight: 500;\n color: inherit;\n display: inline-block;\n}\nh1 {\n font-size: var(--wje-font-size-2x-large);\n line-height: 44px;\n letter-spacing: -0.0141279em;\n}\nh2 {\n font-size: var(--wje-font-size-x-large);\n line-height: 34px;\n letter-spacing: -0.021em;\n}\nh3 {\n font-size: var(--wje-font-size-large);\n line-height: 28px;\n letter-spacing: -0.0114923em;\n}\nh4 {\n font-size: var(--wje-font-size-large);\n line-height: 26px;\n letter-spacing: -0.00865734em;\n}\nh5 {\n font-size: var(--wje-font-size-medium);\n line-height: 24px;\n letter-spacing: -0.00630069em;\n}\nh3 small,\nh4 small,\nh5 small {\n font-weight: 300;\n}\nh1.block,\nh2.block,\nh3.block,\nh4.block,\nh5.block,\nh6.block {\n padding-bottom: .625rem;\n}\n/* Lins and Others\n------------------------------------\n*/\na {\n text-shadow: none !important;\n color: var(--wje-color-primary-11);\n transition: color 0.1s linear 0s, background-color 0.1s linear 0s,\n opacity 0.2s linear 0s !important;\n font-weight: 500;\n}\na:focus,\na:hover,\na:active {\n color: var(--wje-color-primary);\n}\n\na,\na:focus,\na:hover,\na:active {\n outline: 0 !important;\n text-decoration: none;\n}\n\na.no-style{\n color: inherit;\n font-weight: normal;\n}\n\nbr {\n line-height: normal;\n clear: both;\n}\n\np {\n display: block;\n color: inherit;\n font-size: var(--wje-font-size);\n font-weight: normal;\n letter-spacing: 0.00177646em;\n line-height: 21px;\n margin: 0 0 .625rem 0;\n font-style: normal;\n white-space: normal;\n}\n\nsmall,\n.small {\n line-height: 18px;\n font-size: 85.714%;\n}\n\nlabel {\n &.inline {\n display: inline-block;\n position: relative;\n top: 0;\n font-size: 13px;\n }\n}\n\nul,\nol {\n margin-bottom: .625rem;\n & > li {\n padding-left: 3px;\n line-height: 24px;\n }\n &.lg-icon {\n & > li {\n font-size: 21px;\n & span {\n font-size: 14px;\n }\n }\n }\n &.no-style {\n list-style: none;\n padding-left: 5px;\n }\n}\n\naddress {\n margin-bottom: 0;\n a {\n color: var(--wje-color-contrast-8);\n }\n}\n\nblockquote {\n padding: 4px 0 0 18px;\n border-left: 0;\n &:before {\n content: "\\e95d";\n font-size: 20px;\n margin-right: 6px;\n float: left;\n position: relative;\n top: -12px;\n }\n p {\n font-size: 16px;\n margin-bottom: 4px;\n }\n small {\n line-height: 29px;\n color: var(--wje-color-contrast-8);\n &:before {\n content: "—";\n margin-right: 6px;\n }\n }\n &.pull-right {\n border-right: 0;\n &:before {\n float: right;\n content: "";\n margin-left: 6px;\n margin-right: 0;\n }\n small {\n padding-right: 30px;\n &:after {\n content: "";\n }\n }\n }\n}\nhr {\n border-color: var(--wje-border-color);\n &.double {\n border-width: 2px;\n }\n &.dotted {\n border-style: dotted none none;\n }\n}\n\n.ff-sup {\n font-feature-settings: "kern" 1, "sups" 1;\n -webkit-font-feature-settings: "kern" 1, "sups" 1;\n -moz-font-feature-settings: "kern" 1, "sups" 1;\n}\n\n.ff-sub {\n font-feature-settings: "kern" 1, "subs" 1;\n -webkit-font-feature-settings: "kern" 1, "subs" 1;\n -moz-font-feature-settings: "kern" 1, "subs" 1;\n}\n\n/* Standard HTML Typography tags\n------------------------------------\n*/\n\ncode {\n color: var(--wje-color-contrast-6);\n background-color: var(--wje-color);\n font-size: 97%;\n position: relative;\n line-height: inherit;\n border-radius: 3px;\n padding: 5px 7px;\n margin: 0;\n &:hover {\n color: var(--wje-color-complete);\n }\n &.code-sm{\n padding: 3px 6px;\n }\n}\n\nfigcaption {\n font-size: 13px;\n margin-top: .625rem;\n font-weight: 400;\n display: block;\n letter-spacing: 0.008em;\n text-align: center;\n color: var(--wje-color-contrast-6);\n line-height: 1.46;\n}\n\nem {\n font-style: italic !important;\n font-family: inherit;\n font-weight: inherit;\n}\n\nins {\n font-family: var(--wje-font-family);\n border-bottom: 1px solid #d0d0d0;\n text-decoration: none;\n color: var(--wje-color-contrast-8);\n font-weight: normal;\n font-size: 94%;\n}\n\ncite {\n font-family: var(--wje-font-family);\n font-weight: 300;\n color: var(--wje-color-contrast-6);\n text-decoration: none;\n font-style: normal;\n hanging-punctuation: first;\n}\n\nsup {\n top: -0.28em;\n font-size: 70%;\n}\n\nsub {\n bottom: 0.03em;\n}\n\nvar {\n font-family: var(--wje-font-family);\n font-feature-settings: "calt" 1, "tnum" 1, "frac" 1, "case" 1, "ss01" 1,\n "cv11" 1;\n}\n\nabbr {\n text-decoration: none;\n letter-spacing: 0.01em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\nq {\n font-family: var(--wje-font-family);\n font-weight: 500;\n font-size: 20px;\n hanging-punctuation: first;\n\n &:before {\n content: "\\201C";\n color: rgba(0, 0, 0, 0.44);\n font-size: 35px;\n }\n\n &:after {\n content: "\\201D";\n font-size: 35px;\n color: rgba(0, 0, 0, 0.44);\n }\n}\naudio {\n margin-top: 42px;\n}\nhr {\n clear: both;\n margin-bottom: 42px;\n margin-top: 42px;\n border: 0;\n border-bottom: 1px solid rgba(0, 0, 0, 0.13);\n}\naddress {\n font-family: var(--wje-font-family);\n font-style: normal;\n margin: 0 0 1.75em;\n font-size: 14px;\n line-height: 24px;\n margin-top: 24px;\n}\nabbr {\n text-decoration: none;\n letter-spacing: 0.01em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\nacronym {\n text-decoration: none;\n text-transform: uppercase;\n letter-spacing: 0.06em;\n background-color: transparent;\n border-bottom: 2px solid #ffba5a;\n transition-property: color, background, border;\n transition-duration: 0.15s;\n transition-timing-function: linear;\n color: var(--wje-color-contrast-8);\n}\n\npre {\n tab-size: 4;\n font-size: 85.714%;\n overflow-x: auto;\n font-family: monospace, monospace;\n line-height: 1.7;\n counter-reset: line;\n background-color: var(--wje-color-contrast-3)er;\n color: var(--wje-color-contrast-8);\n margin-inline: 0;\n padding: 1rem 1.25rem;\n border-radius: 3px;\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n\ndt {\n font-weight: 700;\n margin-bottom: 5px;\n}\n\ndd {\n margin: 0 0 1.75em;\n}\n\nkbd {\n font-size: 85.714%;\n font-family: var(--wje-font-family);\n position: relative;\n line-height: 34px;\n top: -3px;\n letter-spacing: 0.01em;\n padding: 5px 7px;\n margin: 0;\n color: rgba(0, 0, 0, 0.53);\n background-color: #fff;\n border-radius: 3px;\n box-shadow: 0 2px 0 1px #c7c7c7, 0 1px 0 1px rgba(0, 0, 0, 0.15),\n 0 0 0 1px #ececec;\n}\n\n/* Types\n------------------------------------\n*/\n\n.overline {\n text-transform: uppercase;\n display: inline-block;\n letter-spacing: 0.06em;\n font-size: 11px;\n}\n\n/* Font Sizes\n------------------------------------\n*/\n\n.small-text {\n font-size: 12px !important;\n letter-spacing: 0.00849077em;\n line-height: 18px;\n a {\n text-decoration: underline;\n }\n}\n.normal-text {\n font-size: 13px !important;\n}\n.large-text {\n font-size: 15px !important;\n}\n\n/* Font Weights\n------------------------------------\n */\n\n.normal {\n font-weight: normal !important;\n}\n.semi-bold {\n font-weight: 500 !important;\n}\n.bold {\n font-weight: 600 !important;\n}\n.light {\n font-weight: 300 !important;\n}\n\n/* Misc\n------------------------------------\n*/\n\n.all-caps {\n text-transform: uppercase;\n letter-spacing: 0.07em !important;\n}\n.text-uppercase {\n text-transform: uppercase !important;\n letter-spacing: 0.07em !important;\n}\n.muted {\n color: var(--wje-color-contrast-6);\n}\n.hint-text {\n opacity: 0.76 !important;\n}\n.no-decoration {\n text-decoration: none !important;\n}\n\n.text-ellipsis {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n/* Gradients\n------------------------------------\n*/\n.gradient-grey {\n background: -webkit-linear-gradient(\n top,\n rgba(0, 0, 0, 0) 0%,\n rgba(0, 0, 0, 0.8) 75%\n );\n background: linear-gradient(\n to bottom,\n rgba(0, 0, 0, 0) 0%,\n rgba(0, 0, 0, 0.8) 75%\n );\n}\n.gradient-black {\n background: -webkit-linear-gradient(\n top,\n rgba(0, 0, 0, 0) 0%,\n rgba(0, 0, 0, 0.8) 75%\n );\n background: linear-gradient(\n to bottom,\n rgba(0, 0, 0, 0) 0%,\n rgba(0, 0, 0, 0.8) 75%\n );\n}\n\n/* Other Colors\n------------------------------------\n*/\n.bg-black {\n background-color: var(--wje-color-black) !important;\n color: var(--wje-color-contrast-0);\n}\n.bg-white {\n background-color: var(--wje-color-contrast-0) !important;\n color: var(--wje-color-contrast-8);\n}\n.bg-transparent {\n background-color: transparent !important;\n}\n\n/* Text Colors */\n.link {\n opacity: 0.7;\n &:hover {\n opacity: 1;\n }\n}\n\n/* Text Aligngments\n------------------------------------\n*/\n\n.text-right {\n text-align: right !important;\n}\n.text-left {\n text-align: left !important;\n}\n.text-center {\n text-align: center !important;\n}\n\n/* Strokes\n------------------------------------\n*/\n\n.stroke-primary {\n stroke: var(--wje-color-primary) !important;\n}\n.stroke-complete {\n stroke: var(--wje-color-complete) !important;\n}\n.stroke-success {\n stroke: var(--wje-color-success) !important;\n}\n.stroke-info {\n stroke: var(--wje-color-info) !important;\n}\n.stroke-warning {\n stroke: var(--wje-color-warning) !important;\n}\n.stroke-danger {\n stroke: var(--wje-color-danger) !important;\n}\n\n/* Font Sizes\n------------------------------------\ntracking =a+b×e(c × z)\n\na, b and c are constants\na = -0.0223\nb = 0.185\nc = -0.1745\nz = font size\n\n*/\n.fs-x-small {\n font-size: var(--wje-font-size-x-small) !important;\n letter-spacing: 0.0180093em;\n line-height: 15px;\n}\n.fs-small {\n font-size: var(--wje-font-size-small) !important;\n letter-spacing: 0.00849077em;\n line-height: 18px;\n}\n.fs {\n font-size: var(--wje-font-size) !important;\n letter-spacing: 0.00177646em;\n line-height: 22px;\n}\n\n.fs-medium {\n font-size: var(--wje-font-size-medium) !important;\n letter-spacing: -0.00295978em;\n line-height: 24px;\n}\n\n.fs-large {\n font-size: var(--wje-font-size-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-x-large {\n font-size: var(--wje-font-size-x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-2x-large {\n font-size: var(--wje-font-size-2x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-3x-large {\n font-size: var(--wje-font-size-3x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n.fs-4x-large {\n font-size: var(--wje-font-size-4x-large) !important;\n letter-spacing: normal;\n line-height: normal;\n}\n\n/* Line-heights\n------------------------------------\n*/\n.lh-normal {\n line-height: normal;\n}\n.lh-10 {\n line-height: 10px;\n}\n.lh-11 {\n line-height: 11px;\n}\n.lh-12 {\n line-height: 12px;\n}\n.lh-13 {\n line-height: 13px;\n}\n.lh-14 {\n line-height: 14px;\n}\n.lh-15 {\n line-height: 15px;\n}\n.lh-16 {\n line-height: 16px;\n}\n\n/* Font Faces\n------------------------------------\n*/\n\n.font-arial {\n font-family: Arial, sans-serif !important;\n}\n.font-montserrat {\n font-family: var(--wje-font-family-secondary) !important;\n}\n.font-heading {\n font-family: var(--wje-font-family-secondary);\n}\n.font-secondary {\n font-family: var(--wje-font-family-secondary);\n}\n\n/* Wells\n------------------------------------\n*/\n.well {\n background-color: var(--wje-color-contrast-3);\n -webkit-border-radius: 3px;\n -moz-border-radius: 3px;\n border-radius: 3px;\n -webkit-box-shadow: none !important;\n -moz-box-shadow: none !important;\n box-shadow: none !important;\n border: none;\n background-image: none;\n &.well-large {\n padding: 24px;\n width: auto;\n }\n &.well-small {\n padding: 13px;\n width: auto;\n }\n &.green {\n background-color: var(--wje-color-complete);\n color: var(--wje-color-contrast-0);\n border: none;\n }\n}\n.overflow-ellipsis {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\n\n/* Responsive Handlers : Typo\n------------------------------------\n*/\n\n@media (max-width: 1024px) {\n body,\n p {\n font-size: var(--wje-font-size-small);\n line-height: 20px;\n }\n\n h1 {\n font-size: var(--wje-font-size-2x-large);\n line-height: 44px;\n letter-spacing: -0.08px;\n }\n h2 {\n font-size: var(--wje-font-size-x-large);\n line-height: 40px;\n }\n h3 {\n font-size: var(--wje-font-size-large);\n line-height: 35.88px;\n }\n h4 {\n font-size: var(--wje-font-size-large);\n line-height: 33.88px;\n }\n h5 {\n font-size: var(--wje-font-size-medium);\n line-height: 25.88px;\n }\n small,\n .small {\n font-size: 89%;\n line-height: 17px;\n }\n}\n\n.alert {\n & > p,\n & > ul {\n margin-bottom: 0;\n }\n}\n.table {\n & > tbody {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n & > tfoot {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n & > thead {\n & > tr {\n & > td,\n & > th {\n line-height: 1.42857143;\n }\n }\n }\n}\n\n/* For Windows : Fixes\n------------------------------------\n*/\n\n\n.line-clamp-2 {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.line-clamp-3 {\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.line-clamp-5 {\n display: -webkit-box;\n -webkit-line-clamp: 5;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.text-separator {\n display: block;\n text-align: center;\n margin: 1.5rem 0;\n width: 100%;\n background: linear-gradient(to top, transparent 0%, transparent calc(50% - 1px), var(--wje-border-color) calc(50% - 1px), var(--wje-border-color) calc(50% + 1px), transparent calc(50% + 1px), transparent 100%);\n}\n.text-separator::before {\n background: #fff;\n content: attr(data-text);\n padding: 0 1rem;\n text-transform: uppercase;\n}\n\n.wje-toast-stack {\n position: fixed;\n top: 0;\n margin: 0 .5rem;\n width: 300px;\n max-width: 100%;\n max-height: 100%;\n overflow: auto;\n z-index: 9999;\n}';
package/dist/wje-aside.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = '/*\n[ WJ Aside ]\n*/\n\n:host {\n --wje-aside-width: "100px";\n --wje-aside-top: 0;\n --wje-aside-border-color: var(--wje-border-color);\n --wje-aside-border-width: 0 1px 0 0;\n --wje-aside-border-style: solid;\n box-sizing: border-box;\n flex-shrink: 0;\n overflow: auto;\n border-color: var(--wje-aside-border-color);\n border-width: var(--wje-aside-border-width);\n border-style: var(--wje-aside-border-style);\n}\n\n:host(.open) {\n display: block !important;\n}\n\n@media (min-width: 768px) {\n :host([fixed]) {\n position: fixed;\n width: var(--wje-aside-width);\n top: var(--wje-aside-top);\n height: calc(100% - var(--wje-aside-top));\n }\n}\n\n@media (max-width: 768px) {\n :host {\n display: none;\n }\n\n :host([variant=top-start]) {\n position: fixed;\n top: 0;\n left: 0;\n width: 80%;\n height: 100%;\n z-index: 9999;\n background-color: #fff;\n }\n}\n\n';
9
6
  class Aside extends WJElement {
package/dist/wje-avatar.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  function getHsl(text, s = 40, l = 65) {
9
6
  let str = text, hash = 0;
package/dist/wje-badge.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Badge ]\n*/\n\n.native-badge {\n display: flex;\n align-items: center;\n justify-content: center;\n text-shadow: none;\n font-family: var(--wje-font-family);\n font-size: var(--wje-font-size-x-small);\n line-height: 1;\n padding: 0;\n padding-block: 0;\n padding-inline: var(--wje-spacing-2x-small);\n border-radius: var(--wje-badge-border-radius);\n border-width: 1px;\n border-style: solid;\n border-color: transparent;\n height: 18px;\n /*min-width: 18px;*/\n}\n\n.wje-color-primary {\n background-color: var(--wje-color-primary-2);\n color: var(--wje-color-primary-9);\n}\n\n.wje-color-complete {\n background-color: var(--wje-color-complete-2);\n color: var(--wje-color-complete-9);\n}\n\n.wje-color-success {\n background-color: var(--wje-color-success-2);\n color: var(--wje-color-success-9);\n}\n\n.wje-color-warning {\n background-color: var(--wje-color-warning-2);\n color: var(--wje-color-warning-11);\n}\n\n.wje-color-danger {\n background-color: var(--wje-color-danger-2);\n color: var(--wje-color-danger-9);\n}\n\n.wje-color-info {\n background-color: var(--wje-color-contrast-0);\n color: var(--wje-color-info-11);\n border-color: var(--wje-color-contrast-2);\n}\n\n.wje-color-default {\n background-color: var(--wje-color-contrast-3);\n color: var(--wje-color-contrast-11);\n}";
9
6
  class Badge extends WJElement {
package/dist/wje-breadcrumb.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement, { WjElementUtils, event } from "./wje-element.js";
8
5
  const styles = '/*\n[ WJ Breadcrumb ]\n*/\n\n:host {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n line-height: 1.5;\n}\n\n:host(.collapsed) {\n display: none;\n}\n.native-breadcrumb {\n display: flex;\n align-items: center;\n width: 100%;\n outline: none;\n background: inherit;\n padding: .25rem .75rem;\n color: var(--wje-breadcrumb-a);\n text-decoration: none;\n &.hidden {\n display: none;\n }\n &.active {\n font-weight: bold;\n }\n &:hover {\n color: var(--wje-breadcrumb-a-hover);\n }\n}\n\nbutton {\n margin-inline: .75rem;\n border: 0 solid transparent;\n border-radius: 3px;\n background-color: transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n}\n\n.separator {\n display: inline-flex;\n align-items: center;\n}\n\n::slotted([slot="start"]) {\n margin-inline: 0 .5rem;\n}\n\n::slotted([slot="end"]) {\n margin-inline: .5rem 0;\n}';
9
6
  class Breadcrumb extends WJElement {
package/dist/wje-breadcrumbs.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Breadcrumbs ]\n*/\n\n:host {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n}";
9
6
  class Breadcrumbs extends WJElement {
package/dist/wje-button-group.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Button Group ]\n*/\n\n:host {\n display: inline-block;\n .native-button-group {\n display: flex;\n flex-wrap: nowrap;\n line-height: 1;\n }\n\n slot {\n display: contents;\n }\n}\n\n::slotted(wje-button) {\n margin: 0 !important;\n}";
9
6
  class ButtonGroup extends WJElement {
package/dist/wje-button.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement, { WjElementUtils, event } from "./wje-element.js";
8
5
  import Icon from "./wje-icon.js";
9
6
  const bool = (v) => {
package/dist/wje-card-content.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Card - Content ]\n*/\n\n:host {\n display: block;\n padding: var(--wje-card-content-padding);\n &.no-padding {\n .row {\n margin-left: 0;\n margin-right: 0;\n }\n }\n &.no-bottom-padding {\n padding-bottom: 0;\n }\n &.no-top-padding {\n padding-top: 0;\n }\n .title {\n margin-top: 0;\n }\n &.scrollable {\n margin-bottom: 20px;\n }\n h3 {\n line-height: 34px;\n font-size: 26px;\n }\n}";
9
6
  class CardContent extends WJElement {
package/dist/wje-card-controls.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Card - Controls ]\n*/\n\n:host {\n font-family: var(--wje-card-controls-font-family);\n text-transform: uppercase;\n display: inline-block;\n letter-spacing: 0.06em;\n font-size: var(--wje-card-controls-font-size);\n font-weight: 500;\n margin: 0;\n padding: 0;\n line-height: normal;\n /*overflow: hidden;*/\n text-overflow: ellipsis;\n filter: alpha(opacity=40);\n transition: opacity 0.3s ease;\n position: absolute;\n right: 1rem;\n top: .5rem;\n}";
9
6
  class CardControls extends WJElement {
package/dist/wje-card-header.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = '/*\n[ WJ Card - Header ]\n*/\n\n:host {\n background: transparent;\n border-radius: 0;\n border-bottom: 0;\n padding: var(--wje-card-header-padding);\n position: relative;\n display: flex;\n flex-direction: column;\n}\n\n:host(.wje-separator):after {\n content: "";\n height: 1px;\n background: rgba(0, 0, 0, 0.08);\n margin-top: .5rem;\n}';
9
6
  class CardHeader extends WJElement {
package/dist/wje-card-subtitle.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Card - Subtitle ]\n*/\n\n:host {\n transition: opacity 0.3s ease;\n font-family: var(--wje-card-subtitle-font-family);\n font-size: var(--wje-card-subtitle-font-size);\n text-transform: uppercase;\n display: inline-block;\n letter-spacing: 0.06em;\n font-weight: 500;\n margin: 0;\n padding: var(--wje-card-subtitle-padding);\n line-height: normal;\n overflow: hidden;\n text-overflow: ellipsis;\n filter: alpha(opacity=40);\n}";
9
6
  class CardSubtitle extends WJElement {
package/dist/wje-card-title.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Card - Title ]\n*/\n\n:host {\n font-size: var(--wje-card-title-font-size);\n font-weight: var(--wje-card-title-font-weight);\n margin: var(--wje-card-title-margin);\n padding: var(--wje-card-title-padding);\n line-height: var(--wje-card-title-line-height);\n display: block;\n position: relative;\n}";
9
6
  class CardTitle extends WJElement {
package/dist/wje-card.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Card ]\n*/\n\n:host {\n width: 100%;\n}\n\n.native-card {\n background-color: transparent;\n margin: 0;\n box-shadow: var(--wje-card-shadow);\n border-color: var(--wje-border-color);\n border-style: var(--wje-border-style);\n border-width: var(--wje-border-width);\n border-radius: var(--wje-card-border-radius);\n font-family: var(--wje-font-family);\n font-size: var(--wje-font-size);\n line-height: var(--wje-line-height-normal);\n position: relative;\n width: 100%;\n word-wrap: normal;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n}\n\n/*BG - TEXT*/\n.native-card.wje-color-primary {\n background: var(--wje-color-primary-9);\n color: var(--wje-color-contrast-0);\n border-color: var(--wje-color-primary-9);\n}\n\n.native-card.wje-color-complete {\n background: var(--wje-color-complete-9);\n color: var(--wje-color-contrast-0);\n border-color: var(--wje-color-complete-9);\n}\n\n.native-card.wje-color-success {\n background: var(--wje-color-success-9);\n color: var(--wje-color-contrast-0);\n border-color: var(--wje-color-success-9);\n}\n\n.native-card.wje-color-warning {\n background: var(--wje-color-warning-9);\n color: var(--wje-color);\n border-color: var(--wje-color-warning-9);\n}\n\n.native-card.wje-color-danger {\n background: var(--wje-color-danger-9);\n color: var(--wje-color-contrast-0);\n border-color: var(--wje-color-danger-9);\n}\n\n.native-card.wje-color-info {\n background: var(--wje-color-info-9);\n color: var(--wje-color-contrast-0);\n border-color: var(--wje-color-info-9);\n}\n\n.native-card.wje-color-menu {\n background: var(--wje-color-contrast-9);\n color: var(--wje-color-contrast-0);\n border-color: var(--wje-color-contrast-9);\n}";
9
6
  class Card extends WJElement {
package/dist/wje-carousel-item.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement, { event } from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Carousel Item ]\n*/\n\n:host {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n width: var(--wje-carousel-size, 100%);\n max-height: 100%;\n aspect-ratio: var(--wje-carousel-item-aspect-ratio);\n scroll-snap-align: center;\n scroll-snap-stop: always;\n}\n\n.native-carousel-item {\n width: 100%;\n height: 100%;\n display: flex;\n}\n::slotted(wje-img) {\n width: 100% !important;\n height: 100% !important;\n object-fit: contain;\n display: flex;\n}\n";
9
6
  class CarouselItem extends WJElement {
package/dist/wje-carousel.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ Carousel ]\n*/\n\n.native-carousel {\n position: relative;\n width: var(--wje-carousel-width, 100%);\n height: var(--wje-carousel-height, 300px);\n scroll-behavior: smooth;\n}\n\n.carousel-slides {\n display: flex;\n transition: transform 0.5s ease;\n align-items: center;\n justify-items: center;\n overflow: auto;\n overscroll-behavior-x: contain;\n scrollbar-width: none;\n -ms-overflow-style: none;\n aspect-ratio: var(--wje-aspect-ratio, 4 / 3);\n scroll-snap-type: x mandatory;\n scroll-padding-inline: 0;\n overflow-y: hidden;\n padding-inline: var(--wje-spacing-inline, 0);\n gap: .5rem;\n}\n\n.carousel-slides::-webkit-scrollbar{\n display: none;\n}\n\n::slotted(wje-carousel-item) {\n flex: 0 0 var(--wje-carousel-size);\n height: 100%;\n}\n\n/*NAVIGATION*/\n\nwje-button {\n position: absolute;\n top: 50%;\n\n border: none;\n cursor: pointer;\n z-index: 2;\n}\n\n.prev {\n left: -1rem;\n transform: translate(-100%, -50%);\n}\n\n.next {\n right: -1rem;\n transform: translate(100%, -50%);\n}\n\n/*PAGINATION*/\n\n.pagination {\n position: relative;\n bottom: -.5rem;\n left: 50%;\n transform: translate(-50%, 100%);\n display: flex;\n z-index: 2;\n justify-content: center;\n}\n.pagination-item {\n cursor: pointer;\n height: 15px;\n width: 15px;\n margin: 0 2px;\n background-color: var(--wje-color-contrast-4);\n display: inline-block;\n border-radius: 50%;\n}\n.pagination-item.active {\n background-color: var(--wje-color);\n}\n\n/*THUMBNAILS*/\n\n.thumbnails {\n display: flex;\n justify-content: center;\n align-items: center;\n overflow-x: auto;\n gap: .5rem;\n padding: 0 .5rem;\n margin-top: .5rem;\n margin-bottom: .5rem;\n box-sizing: border-box;\n overflow-y: hidden;\n wje-thumbnail {\n --wje-thumbnail-width: 48px;\n --wje-thumbnail-height: 48px;\n --wje-thumbnail-border-radius: 0;\n cursor: pointer;\n border: 1px solid transparent;\n }\n .active {\n border: 1px solid var(--wje-color-primary-11);\n }\n}\n\n\n\n";
9
6
  class Carousel extends WJElement {
package/dist/wje-checkbox.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement, { event } from "./wje-element.js";
8
5
  const styles = '/*\n[ Checkbox ]\n*/\n\n:host {\n display: block;\n margin-top: var(--wje-checkbox-margin-top);\n margin-bottom: var(--wje-checkbox-margin-bottom);\n margin-inline: var(--wje-checkbox-margin-inline);\n line-height: 100%;\n padding-left: 0;\n\n label {\n display: flex;\n align-items: center;\n cursor: pointer;\n position: relative;\n padding-left: calc(var(--wje-checkbox-size) + .5rem);\n /*min-width: var(--wje-checkbox-size);*/\n min-height: var(--wje-checkbox-size);\n margin-bottom: 0;\n &:before {\n content: "";\n position: absolute;\n width: var(--wje-checkbox-size);\n height: var(--wje-checkbox-size);\n left: 0;\n -webkit-box-sizing: inherit;\n box-sizing: border-box;\n background-color: var(--wje-color-contrast-0);\n border-width: 1px;\n border-style: solid;\n border-color: var(--wje-color-contrast-3);\n }\n }\n}\n\n.native-checkbox {\n label {\n &:hover {\n color: var(--wje-color-contrast-11);\n }\n\n &:before {\n border-radius: var(--wje-checkbox-border-radius);\n }\n }\n\n input[type="checkbox"] {\n position: absolute;\n margin: 0;\n z-index: -1;\n width: 16px;\n height: 16px;\n opacity: 0;\n display: none;\n & + label {\n &::after {\n content: "";\n position: absolute;\n left: 0;\n border-right: 0 solid transparent;\n border-bottom: 0 solid transparent;\n width: var(--wje-checkbox-size);\n height: var(--wje-checkbox-size);\n overflow: hidden;\n }\n }\n }\n\n input[type="checkbox"]:checked + label::after {\n content: "";\n mask-image: var(--wje-checkbox-checkmark);\n mask-size: var(--wje-checkbox-size);\n background-color: var(--wje-color-primary-9);\n }\n\n /* Disabled */\n input[type="checkbox"][disabled] {\n & + label {\n cursor: not-allowed !important;\n color: var(--wje-color-contrast-8);\n opacity: 0.58;\n\n &:before {\n background: var(--wje-color-contrast-2);\n }\n &:after {\n background: transparent;\n }\n }\n }\n\n input[type="checkbox"]:checked[disabled] {\n & + label {\n cursor: not-allowed !important;\n color: var(--wje-color-contrast-8);\n opacity: 0.58;\n\n &:before {\n background: var(--wje-color-contrast-2);\n }\n &:after {\n background: var(--wje-color-contrast-5);\n }\n }\n }\n\n /* Indeterminate */\n input[type="checkbox"]:not(:checked):indeterminate {\n & + label {\n &:after {\n content: "";\n mask-image: var(--wje-checkbox-interminate);\n mask-size: var(--wje-checkbox-size);\n background-color: var(--wje-color-primary-9);\n }\n }\n }\n}\n\n:host([variant=circle]) {\n label {\n &:after {\n border-radius: 99px;\n }\n\n &:before {\n border-radius: 99px;\n }\n }\n}\n\n:host([placement=end]) {\n label {\n padding-left: 0;\n padding-right: 26px;\n\n &:before {\n right: 0;\n left: auto;\n }\n }\n\n input[type="checkbox"]:checked {\n & + label {\n position: relative;\n\n &::after {\n position: absolute;\n right: 0;\n left: auto;\n }\n }\n }\n}\n\n/*Colors*/\n\n:host([color=primary]) {\n input[type="checkbox"]:checked + label::after,\n input[type="checkbox"]:indeterminate + label:after {\n background-color: var(--wje-color-contrast-0);\n }\n :is(input[type="checkbox"]:checked + label)::before, :is(input[type="checkbox"]:indeterminate + label)::before {\n border-color: var(--wje-color-primary-9);\n background-color: var(--wje-color-primary-9);\n }\n}\n\n:host([color=complete]) {\n input[type="checkbox"]:checked + label::after,\n input[type="checkbox"]:indeterminate + label:after {\n background-color: var(--wje-color-contrast-0);\n }\n :is(input[type="checkbox"]:checked + label)::before, :is(input[type="checkbox"]:indeterminate + label)::before {\n border-color: var(--wje-color-complete-9);\n background-color: var(--wje-color-complete-9);\n }\n}\n\n:host([color=success]) {\n input[type="checkbox"]:checked + label::after,\n input[type="checkbox"]:indeterminate + label:after {\n background-color: var(--wje-color-contrast-0);\n }\n :is(input[type="checkbox"]:checked + label)::before, :is(input[type="checkbox"]:indeterminate + label)::before {\n border-color: var(--wje-color-success-9);\n background-color: var(--wje-color-success-9);\n }\n}\n\n:host([color=warning]) {\n input[type="checkbox"]:checked + label::after,\n input[type="checkbox"]:indeterminate + label:after {\n background-color: var(--wje-color-contrast-0);\n }\n :is(input[type="checkbox"]:checked + label)::before, :is(input[type="checkbox"]:indeterminate + label)::before {\n border-color: var(--wje-color-warning-9);\n background-color: var(--wje-color-warning-9);\n }\n}\n\n:host([color=danger]) {\n input[type="checkbox"]:checked + label::after,\n input[type="checkbox"]:indeterminate + label:after {\n background-color: var(--wje-color-contrast-0);\n }\n :is(input[type="checkbox"]:checked + label)::before, :is(input[type="checkbox"]:indeterminate + label)::before {\n border-color: var(--wje-color-danger-9);\n background-color: var(--wje-color-danger-9);\n }\n}\n\n:host([color=info]) {\n input[type="checkbox"]:checked + label::after,\n input[type="checkbox"]:indeterminate + label:after {\n background-color: var(--wje-color-contrast-0);\n }\n :is(input[type="checkbox"]:checked + label)::before, :is(input[type="checkbox"]:indeterminate + label)::before {\n border-color: var(--wje-color-info-9);\n background-color: var(--wje-color-info-9);\n }\n}\n\n/*input[type="checkbox"]:checked + label {*/\n/* .info > *::after,*/\n/* .danger > *::after,*/\n/* .complete > *::after,*/\n/* .primary > *::after,*/\n/* .success > *::after {*/\n/* background: var(--wje-white-check-icon);*/\n/* }*/\n/*}*/\n\n/*input[type="checkbox"]:indeterminate + label {*/\n/* .info > *::after,*/\n/* .danger > *::after,*/\n/* .complete > *::after,*/\n/* .primary > *::after,*/\n/* .success > *::after {*/\n/* background-color: var(--wje-color-contrast-0);*/\n/* }*/\n/*}*/\n\n/* hide focus style if not from keyboard navigation */\n/*.js-focus-visible .native-checkbox input[type="checkbox"]:focus:not(.focus-visible) + label:before {*/\n/* box-shadow: none;*/\n/*}*/\n\n/*input[type="checkbox"] {*/\n/* accent-color: var(--wje-color-primary) !important;*/\n/* font-size: 50px;*/\n/*}*/';
9
6
  class Checkbox extends WJElement {
package/dist/wje-chip.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement, { event } from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Chip ]\n*/\n\n.native-chip {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n font-size: 14px;\n letter-spacing: -0.006em;\n margin: 0;\n padding: .5rem .75rem;\n text-align: center;\n cursor: pointer;\n white-space: nowrap;\n text-shadow: none;\n box-shadow: none;\n border: 0 none;\n line-height: 14px;\n min-height: 28px;\n height: 28px;\n width: 100%;\n max-width: fit-content;\n min-width: 28px;\n position: relative;\n transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);\n border-radius: var(--wje-border-radius-pill);\n overflow: hidden;\n vertical-align: middle;\n box-sizing: border-box;\n}\n\n:host(.focus) {\n box-shadow: none;\n}\n\n:host(.wje-active) .native-chip {\n border: 1px solid var(--wje-color-primary-11);\n background-color: var(--wje-color-contrast-3);\n color: var(--wje-color);\n}\n\n:host(:focus, :active:focus, .wje-active:focus) {\n outline: none !important;\n}\n\n.check {\n display: none;\n}\n\n:host([active]) {\n .check {\n display: block;\n margin-inline: 4px 0;\n }\n}\n\n:host([disabled]) {\n opacity: .5;\n border: 0;\n pointer-events: none;\n cursor: not-allowed;\n}\n\n::slotted(wje-avatar) {\n width: 22px;\n height: 22px;\n}\n\n::slotted(wje-avatar:first-child) {\n margin-inline: -8px 8px;\n margin-top: -4px;\n margin-bottom: -4px;\n}\n\n::slotted(wje-icon:first-child) {\n margin: -4px 8px -4px -4px;\n}\n\n::slotted(wje-icon:last-child) {\n margin: -4px -4px -4px 8px;\n}\n\nwje-button {\n --wje-button-border-radius: 50%;\n --wje-button-margin-inline: .25rem -.5rem;\n --wje-padding-top: .15rem;\n --wje-padding-start: .15rem;\n --wje-padding-end: .15rem;\n --wje-padding-bottom: .15rem;\n}\n\n/*BG - TEXT*/\n.native-chip.wje-color-primary {\n background-color: var(--wje-color-primary-1);\n color: var(--wje-color-primary-9);\n}\n\n.native-chip.wje-color-complete {\n background-color: var(--wje-color-complete-1);\n color: var(--wje-color-complete-9);\n}\n\n.native-chip.wje-color-success {\n background-color: var(--wje-color-success-1);\n color: var(--wje-color-success-9);\n}\n\n.native-chip.wje-color-warning {\n background-color: var(--wje-color-warning-2);\n color: var(--wje-color-warning-11);\n}\n\n.native-chip.wje-color-danger {\n background-color: var(--wje-color-danger-1);\n color: var(--wje-color-danger-9);\n}\n\n.native-chip.wje-color-info {\n background-color: var(--wje-color-info-1);\n color: var(--wje-color-info-9);\n}\n\n.native-chip.wje-color-default {\n background-color: var(--wje-color-contrast-3);\n color: var(--wje-color-contrast-11);\n}\n\n/*HOVER*/\n@media (any-hover: hover) {\n .native-chip.wje-color-primary:hover {\n background-color: var(--wje-color-primary-4);\n color: var(--wje-color-primary-10);\n }\n\n .native-chip.wje-color-complete:hover {\n background-color: var(--wje-color-complete-4);\n color: var(--wje-color-complete-10);\n }\n\n .native-chip.wje-color-success:hover {\n background-color: var(--wje-color-success-4);\n color: var(--wje-color-success-10);\n }\n\n .native-chip.wje-color-warning:hover {\n background-color: var(--wje-color-warning-4);\n color: var(--wje-color-warning-11);\n }\n\n .native-chip.wje-color-danger:hover {\n background-color: var(--wje-color-danger-4);\n color: var(--wje-color-danger-10);\n }\n\n .native-chip.wje-color-info:hover {\n background-color: var(--wje-color-info-4);\n color: var(--wje-color-info-10);\n }\n\n .native-chip.wje-color-default:hover {\n background-color: var(--wje-color-contrast-4);\n color: var(--wje-color-contrast-11);\n }\n}";
9
6
  class Chip extends WJElement {
package/dist/wje-col.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import WJElement from "./wje-element.js";
8
5
  const styles = "/*\n[ WJ Col ]\n*/\n:host {\n display: block;\n flex-grow: 1;\n width: 100%;\n max-width: 100%;\n padding-right: calc(var(--wje-gutter-x) * 0.5);\n padding-left: calc(var(--wje-gutter-x) * 0.5);\n margin-top: var(--wje-gutter-y);\n}\n:host(.wje-col) {\n flex: 1 0 0%;\n}\n:host(.wje-row-cols-auto) > * {\n flex: 0 0 auto;\n width: auto;\n}\n:host(.wje-row-cols-1) > * {\n flex: 0 0 auto;\n width: 100%;\n}\n:host(.wje-row-cols-2) > * {\n flex: 0 0 auto;\n width: 50%;\n}\n:host(.wje-row-cols-3) > * {\n flex: 0 0 auto;\n width: 33.3333333333%;\n}\n:host(.wje-row-cols-4) > * {\n flex: 0 0 auto;\n width: 25%;\n}\n:host(.wje-row-cols-5) > * {\n flex: 0 0 auto;\n width: 20%;\n}\n:host(.wje-row-cols-6) > * {\n flex: 0 0 auto;\n width: 16.6666666667%;\n}\n@media (min-width: 576px) {\n :host(.wje-col-sm) {\n flex: 1 0 0%;\n }\n :host(.wje-row-cols-sm-auto) > * {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-row-cols-sm-1) > * {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-row-cols-sm-2) > * {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-row-cols-sm-3) > * {\n flex: 0 0 auto;\n width: 33.3333333333%;\n }\n :host(.wje-row-cols-sm-4) > * {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-row-cols-sm-5) > * {\n flex: 0 0 auto;\n width: 20%;\n }\n :host(.wje-row-cols-sm-6) > * {\n flex: 0 0 auto;\n width: 16.6666666667%;\n }\n}\n@media (min-width: 768px) {\n :host(.wje-col-md) {\n flex: 1 0 0%;\n }\n :host(.wje-row-cols-md-auto) > * {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-row-cols-md-1) > * {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-row-cols-md-2) > * {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-row-cols-md-3) > * {\n flex: 0 0 auto;\n width: 33.3333333333%;\n }\n :host(.wje-row-cols-md-4) > * {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-row-cols-md-5) > * {\n flex: 0 0 auto;\n width: 20%;\n }\n :host(.wje-row-cols-md-6) > * {\n flex: 0 0 auto;\n width: 16.6666666667%;\n }\n}\n@media (min-width: 992px) {\n :host(.wje-col-lg) {\n flex: 1 0 0%;\n }\n :host(.wje-row-cols-lg-auto) > * {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-row-cols-lg-1) > * {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-row-cols-lg-2) > * {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-row-cols-lg-3) > * {\n flex: 0 0 auto;\n width: 33.3333333333%;\n }\n :host(.wje-row-cols-lg-4) > * {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-row-cols-lg-5) > * {\n flex: 0 0 auto;\n width: 20%;\n }\n :host(.wje-row-cols-lg-6) > * {\n flex: 0 0 auto;\n width: 16.6666666667%;\n }\n}\n@media (min-width: 1200px) {\n :host(.wje-col-xl) {\n flex: 1 0 0%;\n }\n :host(.wje-row-cols-xl-auto) > * {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-row-cols-xl-1) > * {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-row-cols-xl-2) > * {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-row-cols-xl-3) > * {\n flex: 0 0 auto;\n width: 33.3333333333%;\n }\n :host(.wje-row-cols-xl-4) > * {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-row-cols-xl-5) > * {\n flex: 0 0 auto;\n width: 20%;\n }\n :host(.wje-row-cols-xl-6) > * {\n flex: 0 0 auto;\n width: 16.6666666667%;\n }\n}\n@media (min-width: 1400px) {\n :host(.wje-col-xxl) {\n flex: 1 0 0%;\n }\n :host(.wje-row-cols-xxl-auto) > * {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-row-cols-xxl-1) > * {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-row-cols-xxl-2) > * {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-row-cols-xxl-3) > * {\n flex: 0 0 auto;\n width: 33.3333333333%;\n }\n :host(.wje-row-cols-xxl-4) > * {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-row-cols-xxl-5) > * {\n flex: 0 0 auto;\n width: 20%;\n }\n :host(.wje-row-cols-xxl-6) > * {\n flex: 0 0 auto;\n width: 16.6666666667%;\n }\n}\n:host(.wje-col-auto) {\n flex: 0 0 auto;\n width: auto;\n}\n:host(.wje-col-1) {\n flex: 0 0 auto;\n width: 8.33333333%;\n}\n:host(.wje-col-2) {\n flex: 0 0 auto;\n width: 16.66666667%;\n}\n:host(.wje-col-3) {\n flex: 0 0 auto;\n width: 25%;\n}\n:host(.wje-col-4) {\n flex: 0 0 auto;\n width: 33.33333333%;\n}\n:host(.wje-col-5) {\n flex: 0 0 auto;\n width: 41.66666667%;\n}\n:host(.wje-col-6) {\n flex: 0 0 auto;\n width: 50%;\n}\n:host(.wje-col-7) {\n flex: 0 0 auto;\n width: 58.33333333%;\n}\n:host(.wje-col-8) {\n flex: 0 0 auto;\n width: 66.66666667%;\n}\n:host(.wje-col-9) {\n flex: 0 0 auto;\n width: 75%;\n}\n:host(.wje-col-10) {\n flex: 0 0 auto;\n width: 83.33333333%;\n}\n:host(.wje-col-11) {\n flex: 0 0 auto;\n width: 91.66666667%;\n}\n:host(.wje-col-12) {\n flex: 0 0 auto;\n width: 100%;\n}\n:host(.wje-offset-1) {\n margin-left: 8.33333333%;\n}\n:host(.wje-offset-2) {\n margin-left: 16.66666667%;\n}\n:host(.wje-offset-3) {\n margin-left: 25%;\n}\n:host(.wje-offset-4) {\n margin-left: 33.33333333%;\n}\n:host(.wje-offset-5) {\n margin-left: 41.66666667%;\n}\n:host(.wje-offset-6) {\n margin-left: 50%;\n}\n:host(.wje-offset-7) {\n margin-left: 58.33333333%;\n}\n:host(.wje-offset-8) {\n margin-left: 66.66666667%;\n}\n:host(.wje-offset-9) {\n margin-left: 75%;\n}\n:host(.wje-offset-10) {\n margin-left: 83.33333333%;\n}\n:host(.wje-offset-11) {\n margin-left: 91.66666667%;\n}\n.g-0,\n.gx-0 {\n --wje-gutter-x: 0;\n}\n.g-0,\n.gy-0 {\n --wje-gutter-y: 0;\n}\n.g-1,\n.gx-1 {\n --wje-gutter-x: 0.25rem;\n}\n.g-1,\n.gy-1 {\n --wje-gutter-y: 0.25rem;\n}\n.g-2,\n.gx-2 {\n --wje-gutter-x: 0.5rem;\n}\n.g-2,\n.gy-2 {\n --wje-gutter-y: 0.5rem;\n}\n.g-3,\n.gx-3 {\n --wje-gutter-x: 1rem;\n}\n.g-3,\n.gy-3 {\n --wje-gutter-y: 1rem;\n}\n.g-4,\n.gx-4 {\n --wje-gutter-x: 1.5rem;\n}\n.g-4,\n.gy-4 {\n --wje-gutter-y: 1.5rem;\n}\n.g-5,\n.gx-5 {\n --wje-gutter-x: 3rem;\n}\n.g-5,\n.gy-5 {\n --wje-gutter-y: 3rem;\n}\n@media (min-width: 576px) {\n :host(.wje-col-sm-auto) {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-col-sm-1) {\n flex: 0 0 auto;\n width: 8.33333333%;\n }\n :host(.wje-col-sm-2) {\n flex: 0 0 auto;\n width: 16.66666667%;\n }\n :host(.wje-col-sm-3) {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-col-sm-4) {\n flex: 0 0 auto;\n width: 33.33333333%;\n }\n :host(.wje-col-sm-5) {\n flex: 0 0 auto;\n width: 41.66666667%;\n }\n :host(.wje-col-sm-6) {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-col-sm-7) {\n flex: 0 0 auto;\n width: 58.33333333%;\n }\n :host(.wje-col-sm-8) {\n flex: 0 0 auto;\n width: 66.66666667%;\n }\n :host(.wje-col-sm-9) {\n flex: 0 0 auto;\n width: 75%;\n }\n :host(.wje-col-sm-10) {\n flex: 0 0 auto;\n width: 83.33333333%;\n }\n :host(.wje-col-sm-11) {\n flex: 0 0 auto;\n width: 91.66666667%;\n }\n :host(.wje-col-sm-12) {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-offset-sm-0) {\n margin-left: 0;\n }\n :host(.wje-offset-sm-1) {\n margin-left: 8.33333333%;\n }\n :host(.wje-offset-sm-2) {\n margin-left: 16.66666667%;\n }\n :host(.wje-offset-sm-3) {\n margin-left: 25%;\n }\n :host(.wje-offset-sm-4) {\n margin-left: 33.33333333%;\n }\n :host(.wje-offset-sm-5) {\n margin-left: 41.66666667%;\n }\n :host(.wje-offset-sm-6) {\n margin-left: 50%;\n }\n :host(.wje-offset-sm-7) {\n margin-left: 58.33333333%;\n }\n :host(.wje-offset-sm-8) {\n margin-left: 66.66666667%;\n }\n :host(.wje-offset-sm-9) {\n margin-left: 75%;\n }\n :host(.wje-offset-sm-10) {\n margin-left: 83.33333333%;\n }\n :host(.wje-offset-sm-11) {\n margin-left: 91.66666667%;\n }\n .g-sm-0,\n .gx-sm-0 {\n --wje-gutter-x: 0;\n }\n .g-sm-0,\n .gy-sm-0 {\n --wje-gutter-y: 0;\n }\n .g-sm-1,\n .gx-sm-1 {\n --wje-gutter-x: 0.25rem;\n }\n .g-sm-1,\n .gy-sm-1 {\n --wje-gutter-y: 0.25rem;\n }\n .g-sm-2,\n .gx-sm-2 {\n --wje-gutter-x: 0.5rem;\n }\n .g-sm-2,\n .gy-sm-2 {\n --wje-gutter-y: 0.5rem;\n }\n .g-sm-3,\n .gx-sm-3 {\n --wje-gutter-x: 1rem;\n }\n .g-sm-3,\n .gy-sm-3 {\n --wje-gutter-y: 1rem;\n }\n .g-sm-4,\n .gx-sm-4 {\n --wje-gutter-x: 1.5rem;\n }\n .g-sm-4,\n .gy-sm-4 {\n --wje-gutter-y: 1.5rem;\n }\n .g-sm-5,\n .gx-sm-5 {\n --wje-gutter-x: 3rem;\n }\n .g-sm-5,\n .gy-sm-5 {\n --wje-gutter-y: 3rem;\n }\n}\n@media (min-width: 768px) {\n :host(.wje-col-md-auto) {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-col-md-1) {\n flex: 0 0 auto;\n width: 8.33333333%;\n }\n :host(.wje-col-md-2) {\n flex: 0 0 auto;\n width: 16.66666667%;\n }\n :host(.wje-col-md-3) {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-col-md-4) {\n flex: 0 0 auto;\n width: 33.33333333%;\n }\n :host(.wje-col-md-5) {\n flex: 0 0 auto;\n width: 41.66666667%;\n }\n :host(.wje-col-md-6) {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-col-md-7) {\n flex: 0 0 auto;\n width: 58.33333333%;\n }\n :host(.wje-col-md-8) {\n flex: 0 0 auto;\n width: 66.66666667%;\n }\n :host(.wje-col-md-9) {\n flex: 0 0 auto;\n width: 75%;\n }\n :host(.wje-col-md-10) {\n flex: 0 0 auto;\n width: 83.33333333%;\n }\n :host(.wje-col-md-11) {\n flex: 0 0 auto;\n width: 91.66666667%;\n }\n :host(.wje-col-md-12) {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-offset-md-0) {\n margin-left: 0;\n }\n :host(.wje-offset-md-1) {\n margin-left: 8.33333333%;\n }\n :host(.wje-offset-md-2) {\n margin-left: 16.66666667%;\n }\n :host(.wje-offset-md-3) {\n margin-left: 25%;\n }\n :host(.wje-offset-md-4) {\n margin-left: 33.33333333%;\n }\n :host(.wje-offset-md-5) {\n margin-left: 41.66666667%;\n }\n :host(.wje-offset-md-6) {\n margin-left: 50%;\n }\n :host(.wje-offset-md-7) {\n margin-left: 58.33333333%;\n }\n :host(.wje-offset-md-8) {\n margin-left: 66.66666667%;\n }\n :host(.wje-offset-md-9) {\n margin-left: 75%;\n }\n :host(.wje-offset-md-10) {\n margin-left: 83.33333333%;\n }\n :host(.wje-offset-md-11) {\n margin-left: 91.66666667%;\n }\n .g-md-0,\n .gx-md-0 {\n --wje-gutter-x: 0;\n }\n .g-md-0,\n .gy-md-0 {\n --wje-gutter-y: 0;\n }\n .g-md-1,\n .gx-md-1 {\n --wje-gutter-x: 0.25rem;\n }\n .g-md-1,\n .gy-md-1 {\n --wje-gutter-y: 0.25rem;\n }\n .g-md-2,\n .gx-md-2 {\n --wje-gutter-x: 0.5rem;\n }\n .g-md-2,\n .gy-md-2 {\n --wje-gutter-y: 0.5rem;\n }\n .g-md-3,\n .gx-md-3 {\n --wje-gutter-x: 1rem;\n }\n .g-md-3,\n .gy-md-3 {\n --wje-gutter-y: 1rem;\n }\n .g-md-4,\n .gx-md-4 {\n --wje-gutter-x: 1.5rem;\n }\n .g-md-4,\n .gy-md-4 {\n --wje-gutter-y: 1.5rem;\n }\n .g-md-5,\n .gx-md-5 {\n --wje-gutter-x: 3rem;\n }\n .g-md-5,\n .gy-md-5 {\n --wje-gutter-y: 3rem;\n }\n}\n@media (min-width: 992px) {\n :host(.wje-col-lg-auto) {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-col-lg-1) {\n flex: 0 0 auto;\n width: 8.33333333%;\n }\n :host(.wje-col-lg-2) {\n flex: 0 0 auto;\n width: 16.66666667%;\n }\n :host(.wje-col-lg-3) {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-col-lg-4) {\n flex: 0 0 auto;\n width: 33.33333333%;\n }\n :host(.wje-col-lg-5) {\n flex: 0 0 auto;\n width: 41.66666667%;\n }\n :host(.wje-col-lg-6) {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-col-lg-7) {\n flex: 0 0 auto;\n width: 58.33333333%;\n }\n :host(.wje-col-lg-8) {\n flex: 0 0 auto;\n width: 66.66666667%;\n }\n :host(.wje-col-lg-9) {\n flex: 0 0 auto;\n width: 75%;\n }\n :host(.wje-col-lg-10) {\n flex: 0 0 auto;\n width: 83.33333333%;\n }\n :host(.wje-col-lg-11) {\n flex: 0 0 auto;\n width: 91.66666667%;\n }\n :host(.wje-col-lg-12) {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-offset-lg-0) {\n margin-left: 0;\n }\n :host(.wje-offset-lg-1) {\n margin-left: 8.33333333%;\n }\n :host(.wje-offset-lg-2) {\n margin-left: 16.66666667%;\n }\n :host(.wje-offset-lg-3) {\n margin-left: 25%;\n }\n :host(.wje-offset-lg-4) {\n margin-left: 33.33333333%;\n }\n :host(.wje-offset-lg-5) {\n margin-left: 41.66666667%;\n }\n :host(.wje-offset-lg-6) {\n margin-left: 50%;\n }\n :host(.wje-offset-lg-7) {\n margin-left: 58.33333333%;\n }\n :host(.wje-offset-lg-8) {\n margin-left: 66.66666667%;\n }\n :host(.wje-offset-lg-9) {\n margin-left: 75%;\n }\n :host(.wje-offset-lg-10) {\n margin-left: 83.33333333%;\n }\n :host(.wje-offset-lg-11) {\n margin-left: 91.66666667%;\n }\n .g-lg-0,\n .gx-lg-0 {\n --wje-gutter-x: 0;\n }\n .g-lg-0,\n .gy-lg-0 {\n --wje-gutter-y: 0;\n }\n .g-lg-1,\n .gx-lg-1 {\n --wje-gutter-x: 0.25rem;\n }\n .g-lg-1,\n .gy-lg-1 {\n --wje-gutter-y: 0.25rem;\n }\n .g-lg-2,\n .gx-lg-2 {\n --wje-gutter-x: 0.5rem;\n }\n .g-lg-2,\n .gy-lg-2 {\n --wje-gutter-y: 0.5rem;\n }\n .g-lg-3,\n .gx-lg-3 {\n --wje-gutter-x: 1rem;\n }\n .g-lg-3,\n .gy-lg-3 {\n --wje-gutter-y: 1rem;\n }\n .g-lg-4,\n .gx-lg-4 {\n --wje-gutter-x: 1.5rem;\n }\n .g-lg-4,\n .gy-lg-4 {\n --wje-gutter-y: 1.5rem;\n }\n .g-lg-5,\n .gx-lg-5 {\n --wje-gutter-x: 3rem;\n }\n .g-lg-5,\n .gy-lg-5 {\n --wje-gutter-y: 3rem;\n }\n}\n@media (min-width: 1200px) {\n :host(.wje-col-xl-auto) {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-col-xl-1) {\n flex: 0 0 auto;\n width: 8.33333333%;\n }\n :host(.wje-col-xl-2) {\n flex: 0 0 auto;\n width: 16.66666667%;\n }\n :host(.wje-col-xl-3) {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-col-xl-4) {\n flex: 0 0 auto;\n width: 33.33333333%;\n }\n :host(.wje-col-xl-5) {\n flex: 0 0 auto;\n width: 41.66666667%;\n }\n :host(.wje-col-xl-6) {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-col-xl-7) {\n flex: 0 0 auto;\n width: 58.33333333%;\n }\n :host(.wje-col-xl-8) {\n flex: 0 0 auto;\n width: 66.66666667%;\n }\n :host(.wje-col-xl-9) {\n flex: 0 0 auto;\n width: 75%;\n }\n :host(.wje-col-xl-10) {\n flex: 0 0 auto;\n width: 83.33333333%;\n }\n :host(.wje-col-xl-11) {\n flex: 0 0 auto;\n width: 91.66666667%;\n }\n :host(.wje-col-xl-12) {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-offset-xl-0) {\n margin-left: 0;\n }\n :host(.wje-offset-xl-1) {\n margin-left: 8.33333333%;\n }\n :host(.wje-offset-xl-2) {\n margin-left: 16.66666667%;\n }\n :host(.wje-offset-xl-3) {\n margin-left: 25%;\n }\n :host(.wje-offset-xl-4) {\n margin-left: 33.33333333%;\n }\n :host(.wje-offset-xl-5) {\n margin-left: 41.66666667%;\n }\n :host(.wje-offset-xl-6) {\n margin-left: 50%;\n }\n :host(.wje-offset-xl-7) {\n margin-left: 58.33333333%;\n }\n :host(.wje-offset-xl-8) {\n margin-left: 66.66666667%;\n }\n :host(.wje-offset-xl-9) {\n margin-left: 75%;\n }\n :host(.wje-offset-xl-10) {\n margin-left: 83.33333333%;\n }\n :host(.wje-offset-xl-11) {\n margin-left: 91.66666667%;\n }\n .g-xl-0,\n .gx-xl-0 {\n --wje-gutter-x: 0;\n }\n .g-xl-0,\n .gy-xl-0 {\n --wje-gutter-y: 0;\n }\n .g-xl-1,\n .gx-xl-1 {\n --wje-gutter-x: 0.25rem;\n }\n .g-xl-1,\n .gy-xl-1 {\n --wje-gutter-y: 0.25rem;\n }\n .g-xl-2,\n .gx-xl-2 {\n --wje-gutter-x: 0.5rem;\n }\n .g-xl-2,\n .gy-xl-2 {\n --wje-gutter-y: 0.5rem;\n }\n .g-xl-3,\n .gx-xl-3 {\n --wje-gutter-x: 1rem;\n }\n .g-xl-3,\n .gy-xl-3 {\n --wje-gutter-y: 1rem;\n }\n .g-xl-4,\n .gx-xl-4 {\n --wje-gutter-x: 1.5rem;\n }\n .g-xl-4,\n .gy-xl-4 {\n --wje-gutter-y: 1.5rem;\n }\n .g-xl-5,\n .gx-xl-5 {\n --wje-gutter-x: 3rem;\n }\n .g-xl-5,\n .gy-xl-5 {\n --wje-gutter-y: 3rem;\n }\n}\n@media (min-width: 1400px) {\n :host(.wje-col-xxl-auto) {\n flex: 0 0 auto;\n width: auto;\n }\n :host(.wje-col-xxl-1) {\n flex: 0 0 auto;\n width: 8.33333333%;\n }\n :host(.wje-col-xxl-2) {\n flex: 0 0 auto;\n width: 16.66666667%;\n }\n :host(.wje-col-xxl-3) {\n flex: 0 0 auto;\n width: 25%;\n }\n :host(.wje-col-xxl-4) {\n flex: 0 0 auto;\n width: 33.33333333%;\n }\n :host(.wje-col-xxl-5) {\n flex: 0 0 auto;\n width: 41.66666667%;\n }\n :host(.wje-col-xxl-6) {\n flex: 0 0 auto;\n width: 50%;\n }\n :host(.wje-col-xxl-7) {\n flex: 0 0 auto;\n width: 58.33333333%;\n }\n :host(.wje-col-xxl-8) {\n flex: 0 0 auto;\n width: 66.66666667%;\n }\n :host(.wje-col-xxl-9) {\n flex: 0 0 auto;\n width: 75%;\n }\n :host(.wje-col-xxl-10) {\n flex: 0 0 auto;\n width: 83.33333333%;\n }\n :host(.wje-col-xxl-11) {\n flex: 0 0 auto;\n width: 91.66666667%;\n }\n :host(.wje-col-xxl-12) {\n flex: 0 0 auto;\n width: 100%;\n }\n :host(.wje-offset-xxl-0) {\n margin-left: 0;\n }\n :host(.wje-offset-xxl-1) {\n margin-left: 8.33333333%;\n }\n :host(.wje-offset-xxl-2) {\n margin-left: 16.66666667%;\n }\n :host(.wje-offset-xxl-3) {\n margin-left: 25%;\n }\n :host(.wje-offset-xxl-4) {\n margin-left: 33.33333333%;\n }\n :host(.wje-offset-xxl-5) {\n margin-left: 41.66666667%;\n }\n :host(.wje-offset-xxl-6) {\n margin-left: 50%;\n }\n :host(.wje-offset-xxl-7) {\n margin-left: 58.33333333%;\n }\n :host(.wje-offset-xxl-8) {\n margin-left: 66.66666667%;\n }\n :host(.wje-offset-xxl-9) {\n margin-left: 75%;\n }\n :host(.wje-offset-xxl-10) {\n margin-left: 83.33333333%;\n }\n :host(.wje-offset-xxl-11) {\n margin-left: 91.66666667%;\n }\n .g-xxl-0,\n .gx-xxl-0 {\n --wje-gutter-x: 0;\n }\n .g-xxl-0,\n .gy-xxl-0 {\n --wje-gutter-y: 0;\n }\n .g-xxl-1,\n .gx-xxl-1 {\n --wje-gutter-x: 0.25rem;\n }\n .g-xxl-1,\n .gy-xxl-1 {\n --wje-gutter-y: 0.25rem;\n }\n .g-xxl-2,\n .gx-xxl-2 {\n --wje-gutter-x: 0.5rem;\n }\n .g-xxl-2,\n .gy-xxl-2 {\n --wje-gutter-y: 0.5rem;\n }\n .g-xxl-3,\n .gx-xxl-3 {\n --wje-gutter-x: 1rem;\n }\n .g-xxl-3,\n .gy-xxl-3 {\n --wje-gutter-y: 1rem;\n }\n .g-xxl-4,\n .gx-xxl-4 {\n --wje-gutter-x: 1.5rem;\n }\n .g-xxl-4,\n .gy-xxl-4 {\n --wje-gutter-y: 1.5rem;\n }\n .g-xxl-5,\n .gx-xxl-5 {\n --wje-gutter-x: 3rem;\n }\n .g-xxl-5,\n .gy-xxl-5 {\n --wje-gutter-y: 3rem;\n }\n}\n:host(.order-first) {\n order: -1 !important;\n}\n:host(.order-0) {\n order: 0 !important;\n}\n:host(.order-1) {\n order: 1 !important;\n}\n:host(.order-2) {\n order: 2 !important;\n}\n:host(.order-3) {\n order: 3 !important;\n}\n:host(.order-4) {\n order: 4 !important;\n}\n:host(.order-5) {\n order: 5 !important;\n}\n:host(.order-last) {\n order: 6 !important;\n}\n:host(.order-sm-first) {\n order: -1 !important;\n}\n:host(.order-sm-0) {\n order: 0 !important;\n}\n:host(.order-sm-1) {\n order: 1 !important;\n}\n:host(.order-sm-2) {\n order: 2 !important;\n}\n:host(.order-sm-3) {\n order: 3 !important;\n}\n:host(.order-sm-4) {\n order: 4 !important;\n}\n:host(.order-sm-5) {\n order: 5 !important;\n}\n:host(.order-sm-last) {\n order: 6 !important;\n}\n:host(.order-md-first) {\n order: -1 !important;\n}\n:host(.order-md-0) {\n order: 0 !important;\n}\n:host(.order-md-1) {\n order: 1 !important;\n}\n:host(.order-md-2) {\n order: 2 !important;\n}\n:host(.order-md-3) {\n order: 3 !important;\n}\n:host(.order-md-4) {\n order: 4 !important;\n}\n:host(.order-md-5) {\n order: 5 !important;\n}\n:host(.order-md-last) {\n order: 6 !important;\n}\n:host(.order-lg-first) {\n order: -1 !important;\n}\n:host(.order-lg-0) {\n order: 0 !important;\n}\n:host(.order-lg-1) {\n order: 1 !important;\n}\n:host(.order-lg-2) {\n order: 2 !important;\n}\n:host(.order-lg-3) {\n order: 3 !important;\n}\n:host(.order-lg-4) {\n order: 4 !important;\n}\n:host(.order-lg-5) {\n order: 5 !important;\n}\n:host(.order-lg-last) {\n order: 6 !important;\n}\n:host(.order-xl-first) {\n order: -1 !important;\n}\n:host(.order-xl-0) {\n order: 0 !important;\n}\n:host(.order-xl-1) {\n order: 1 !important;\n}\n:host(.order-xl-2) {\n order: 2 !important;\n}\n:host(.order-xl-3) {\n order: 3 !important;\n}\n:host(.order-xl-4) {\n order: 4 !important;\n}\n:host(.order-xl-5) {\n order: 5 !important;\n}\n:host(.order-xl-last) {\n order: 6 !important;\n}\n:host(.order-xxl-first) {\n order: -1 !important;\n}\n:host(.order-xxl-0) {\n order: 0 !important;\n}\n:host(.order-xxl-1) {\n order: 1 !important;\n}\n:host(.order-xxl-2) {\n order: 2 !important;\n}\n:host(.order-xxl-3) {\n order: 3 !important;\n}\n:host(.order-xxl-4) {\n order: 4 !important;\n}\n:host(.order-xxl-5) {\n order: 5 !important;\n}\n:host(.order-xxl-last) {\n order: 6 !important;\n}";
9
6
  class Col extends WJElement {