@cargosense/cargo-design-system 1.0.11 → 1.0.13

package/dist/assets/index.es.js

@@ -273,8 +273,8 @@ const UA = (Q, A) => {
   let C, E = A === 2 ? "<svg>" : A === 3 ? "<math>" : "", I = v;
   for (let r = 0; r < g; r++) {
     const w = Q[r];
-    let M, c, o = -1, F = 0;
-    for (; F < w.length && (I.lastIndex = F, c = I.exec(w), c !== null); ) F = I.lastIndex, I === v ? c[1] === "!--" ? I = q : c[1] !== void 0 ? I = $ : c[2] !== void 0 ? (IA.test(c[2]) && (C = RegExp("</" + c[2], "g")), I = l) : c[3] !== void 0 && (I = l) : I === l ? c[0] === ">" ? (I = C ?? v, o = -1) : c[1] === void 0 ? o = -2 : (o = I.lastIndex - c[2].length, M = c[1], I = c[3] === void 0 ? l : c[3] === '"' ? AA : _) : I === AA || I === _ ? I = l : I === q || I === $ ? I = v : (I = l, C = void 0);
+    let M, c, o = -1, n = 0;
+    for (; n < w.length && (I.lastIndex = n, c = I.exec(w), c !== null); ) n = I.lastIndex, I === v ? c[1] === "!--" ? I = q : c[1] !== void 0 ? I = $ : c[2] !== void 0 ? (IA.test(c[2]) && (C = RegExp("</" + c[2], "g")), I = l) : c[3] !== void 0 && (I = l) : I === l ? c[0] === ">" ? (I = C ?? v, o = -1) : c[1] === void 0 ? o = -2 : (o = I.lastIndex - c[2].length, M = c[1], I = c[3] === void 0 ? l : c[3] === '"' ? AA : _) : I === AA || I === _ ? I = l : I === q || I === $ ? I = v : (I = l, C = void 0);
     const U = I === l && Q[r + 1].startsWith("/>") ? " " : "";
     E += I === v ? w + YA : o >= 0 ? (B.push(M), w.slice(0, o) + QA + w.slice(o) + h + U) : w + h + (o === -2 ? r : U);
   }
@@ -293,15 +293,15 @@ class H {
     for (; (C = a.nextNode()) !== null && w.length < r; ) {
       if (C.nodeType === 1) {
         if (C.hasAttributes()) for (const o of C.getAttributeNames()) if (o.endsWith(QA)) {
-          const F = c[I++], U = C.getAttribute(o).split(h), z = /([.?@])?(.*)/.exec(F);
+          const n = c[I++], U = C.getAttribute(o).split(h), z = /([.?@])?(.*)/.exec(n);
           w.push({ type: 1, index: E, name: z[2], strings: U, ctor: z[1] === "." ? lA : z[1] === "?" ? aA : z[1] === "@" ? GA : T }), C.removeAttribute(o);
         } else o.startsWith(h) && (w.push({ type: 6, index: E }), C.removeAttribute(o));
         if (IA.test(C.tagName)) {
-          const o = C.textContent.split(h), F = o.length - 1;
-          if (F > 0) {
+          const o = C.textContent.split(h), n = o.length - 1;
+          if (n > 0) {
             C.textContent = R ? R.emptyScript : "";
-            for (let U = 0; U < F; U++) C.append(o[U], N()), a.nextNode(), w.push({ type: 2, index: ++E });
-            C.append(o[F], N());
+            for (let U = 0; U < n; U++) C.append(o[U], N()), a.nextNode(), w.push({ type: 2, index: ++E });
+            C.append(o[n], N());
           }
         }
       } else if (C.nodeType === 8) if (C.data === EA) w.push({ type: 2, index: E });
@@ -667,7 +667,7 @@ function gg() {
  * Copyright 2018 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const n = (Q) => Q ?? t;
+const F = (Q) => Q ?? t;
 class fA extends e {
   static styles = s`
     @font-face {
@@ -720,7 +720,7 @@ class fA extends e {
   }
   render() {
     return D`
-      <a href="${n(this.link)}" class="default ${this.variant}" tabindex="0">
+      <a href="${F(this.link)}" class="default ${this.variant}" tabindex="0">
       <slot name="start"></slot>
       <slot></slot>
       <slot name="end"></slot>
@@ -962,7 +962,7 @@ class RA extends e {
   }
   render() {
     return D`
-      <a href="${n(this.link)}" class="navImage">
+      <a href="${F(this.link)}" class="navImage">
         <img src="${this.src}" alt="${this.alt}" />
         <span>${this.name}</span>
       </a>
@@ -1453,7 +1453,7 @@ class mA extends e {
       </div>
 
 
-      <input type="checkbox" id='${this.name | "checkbox"}' name='${this.name | "checkbox"}' aria-describedby='${this.description | this.name | "checkbox"}' value='${n(this.value)}' ?checked="${this.checked}" ?disabled="${this.disabled}" @change="${this._onChange}" tabindex="-1">
+      <input type="checkbox" id='${this.name | "checkbox"}' name='${this.name | "checkbox"}' aria-describedby='${this.description | this.name | "checkbox"}' value='${F(this.value)}' ?checked="${this.checked}" ?disabled="${this.disabled}" ?required='${this.required}' @change="${this._onChange}" tabindex="-1">
 
       <div class='checkmark ${this.checked ? "active" : ""} ${this.error ? "error" : ""}' id='check'  aria-describedby='${this.description | this.name | "checkbox"}' tabindex="${this.disabled ? "-1" : "0"}">
         <cd-icon name='check' size='xs' color='white'></cd-icon>
@@ -1605,7 +1605,7 @@ class WA extends e {
     return D`
       <label
         class="${this.disabled ? "disabled" : ""}"
-        for="${n(this.for)}"
+        for="${F(this.for)}"
       >
         ${this.text}
         <slot></slot>
@@ -1946,10 +1946,12 @@ class KA extends e {
   `;
   static properties = {
     name: {
-      type: String
+      type: String,
+      reflect: !0
     },
     value: {
-      type: String
+      type: String,
+      reflect: !0
     },
     checked: {
       type: Boolean,
@@ -1990,7 +1992,7 @@ class KA extends e {
           ?disabled="${this.disabled}"
           @change="${this._handleChange}"
           @click="${this._select}"
-          required="${this.required}"
+          ?required="${F(this.required)}"
           tabindex="0"
         >
         <div class='radio-text' @click="${this._handleLabelClick}">
@@ -2184,11 +2186,11 @@ class XA extends e {
     return D`
     <div class='container ${this.fullWidth ? "full-width" : ""}'>
       <select
-        name="${n(this.name)}"
+        name="${F(this.name)}"
         ?disabled="${this.disabled}"
         ?required="${this.required}"
         ?error="${this.error}"
-        .value="${n(this.value)}"
+        .value="${F(this.value)}"
         class="${this.error ? "input-error" : ""} ${this.size} ${this.fullWidth ? "full-width" : ""}"
         @change="${this.handleChange}"
       >
@@ -2399,8 +2401,8 @@ class ZA extends e {
     return D`
       <div class='container ${this.fullWidth ? "full-width" : ""}'>
         <textarea
-          id="${n(this.name)}"
-          name="${n(this.name)}"
+          id="${F(this.name)}"
+          name="${F(this.name)}"
           .value="${this.value}"
           placeholder="${this.placeholder}"
           ?disabled="${this.disabled}"
@@ -2412,7 +2414,7 @@ class ZA extends e {
           @focus="${this.handleFocus}"
           @blur="${this.handleBlur}">
         </textarea>
-        ${this.iconRight ? D`<span class="icon-right-container"><cd-icon size='sm' name='${this.iconRight}' class='icon-right' color='${n(this.error ? "var(--input-error-border-color)" : void 0)}'></cd-icon></span>` : ""}
+        ${this.iconRight ? D`<span class="icon-right-container"><cd-icon size='sm' name='${this.iconRight}' class='icon-right' color='${F(this.error ? "var(--input-error-border-color)" : void 0)}'></cd-icon></span>` : ""}
       </div>
     `;
   }
@@ -2512,7 +2514,7 @@ export {
   Cg as l,
   bA as m,
   Ig as n,
-  n as o,
+  F as o,
   wg as p,
   Dg as q,
   zA as r,