@patimweb/crtstyleguide 1.0.15 → 1.0.17

package/dist/lib/index.js

@@ -1,5 +1,5 @@
 import { css as d, LitElement as h, html as l } from "lit";
-const v = (e) => (t, a) => {
+const u = (e) => (t, a) => {
   a !== void 0 ? a.addInitializer(() => {
     customElements.define(e, t);
   }) : customElements.define(e, t);
@@ -34,7 +34,7 @@ const Ae = (e) => new Oe(typeof e == "string" ? e : e + "", void 0, ke), Se = (e
   for (const s of t.cssRules) a += s.cssText;
   return Ae(a);
 })(e) : e;
-const { is: Ee, defineProperty: Me, getOwnPropertyDescriptor: De, getOwnPropertyNames: Te, getOwnPropertySymbols: je, getPrototypeOf: Le } = Object, Vt = globalThis, ve = Vt.trustedTypes, Ie = ve ? ve.emptyScript : "", Be = Vt.reactiveElementPolyfillSupport, bt = (e, t) => e, jt = { toAttribute(e, t) {
+const { is: Ee, defineProperty: Me, getOwnPropertyDescriptor: De, getOwnPropertyNames: Te, getOwnPropertySymbols: je, getPrototypeOf: Le } = Object, Vt = globalThis, ue = Vt.trustedTypes, Ie = ue ? ue.emptyScript : "", Be = Vt.reactiveElementPolyfillSupport, bt = (e, t) => e, jt = { toAttribute(e, t) {
   switch (t) {
     case Boolean:
       e = e ? Ie : null;
@@ -62,7 +62,7 @@ const { is: Ee, defineProperty: Me, getOwnPropertyDescriptor: De, getOwnProperty
       }
   }
   return a;
-} }, te = (e, t) => !Ee(e, t), ue = { attribute: !0, type: String, converter: jt, reflect: !1, useDefault: !1, hasChanged: te };
+} }, te = (e, t) => !Ee(e, t), ve = { attribute: !0, type: String, converter: jt, reflect: !1, useDefault: !1, hasChanged: te };
 Symbol.metadata ??= /* @__PURE__ */ Symbol("metadata"), Vt.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
 let mt = class extends HTMLElement {
   static addInitializer(t) {
@@ -71,7 +71,7 @@ let mt = class extends HTMLElement {
   static get observedAttributes() {
     return this.finalize(), this._$Eh && [...this._$Eh.keys()];
   }
-  static createProperty(t, a = ue) {
+  static createProperty(t, a = ve) {
     if (a.state && (a.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(t) && ((a = Object.create(a)).wrapped = !0), this.elementProperties.set(t, a), !a.noAccessor) {
       const s = /* @__PURE__ */ Symbol(), r = this.getPropertyDescriptor(t, s, a);
       r !== void 0 && Me(this.prototype, t, r);
@@ -89,7 +89,7 @@ let mt = class extends HTMLElement {
     }, configurable: !0, enumerable: !0 };
   }
   static getPropertyOptions(t) {
-    return this.elementProperties.get(t) ?? ue;
+    return this.elementProperties.get(t) ?? ve;
   }
   static _$Ei() {
     if (this.hasOwnProperty(bt("elementProperties"))) return;
@@ -297,10 +297,10 @@ const Ye = (e, t) => {
   let r, i = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", o = ft;
   for (let c = 0; c < a; c++) {
     const p = e[c];
-    let u, b, g = -1, E = 0;
-    for (; E < p.length && (o.lastIndex = E, b = o.exec(p), b !== null); ) E = o.lastIndex, o === ft ? b[1] === "!--" ? o = fe : b[1] !== void 0 ? o = be : b[2] !== void 0 ? (ze.test(b[2]) && (r = RegExp("</" + b[2], "g")), o = G) : b[3] !== void 0 && (o = G) : o === G ? b[0] === ">" ? (o = r ?? ft, g = -1) : b[1] === void 0 ? g = -2 : (g = o.lastIndex - b[2].length, u = b[1], o = b[3] === void 0 ? G : b[3] === '"' ? xe : ye) : o === xe || o === ye ? o = G : o === fe || o === be ? o = ft : (o = G, r = void 0);
+    let v, b, g = -1, E = 0;
+    for (; E < p.length && (o.lastIndex = E, b = o.exec(p), b !== null); ) E = o.lastIndex, o === ft ? b[1] === "!--" ? o = fe : b[1] !== void 0 ? o = be : b[2] !== void 0 ? (ze.test(b[2]) && (r = RegExp("</" + b[2], "g")), o = G) : b[3] !== void 0 && (o = G) : o === G ? b[0] === ">" ? (o = r ?? ft, g = -1) : b[1] === void 0 ? g = -2 : (g = o.lastIndex - b[2].length, v = b[1], o = b[3] === void 0 ? G : b[3] === '"' ? xe : ye) : o === xe || o === ye ? o = G : o === fe || o === be ? o = ft : (o = G, r = void 0);
     const R = o === G && e[c + 1].startsWith("/>") ? " " : "";
-    i += o === ft ? p + Fe : g >= 0 ? (s.push(u), p.slice(0, g) + $e + p.slice(g) + F + R) : p + F + (g === -2 ? c : R);
+    i += o === ft ? p + Fe : g >= 0 ? (s.push(v), p.slice(0, g) + $e + p.slice(g) + F + R) : p + F + (g === -2 ? c : R);
   }
   return [Ce(e, i + (e[a] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), s];
 };
@@ -309,8 +309,8 @@ class xt {
     let r;
     this.parts = [];
     let i = 0, o = 0;
-    const c = t.length - 1, p = this.parts, [u, b] = Ye(t, a);
-    if (this.el = xt.createElement(u, s), Z.currentNode = this.el.content, a === 2 || a === 3) {
+    const c = t.length - 1, p = this.parts, [v, b] = Ye(t, a);
+    if (this.el = xt.createElement(v, s), Z.currentNode = this.el.content, a === 2 || a === 3) {
       const g = this.el.content.firstChild;
       g.replaceWith(...g.childNodes);
     }
@@ -363,8 +363,8 @@ class Ve {
     let i = Z.nextNode(), o = 0, c = 0, p = s[0];
     for (; p !== void 0; ) {
       if (o === p.index) {
-        let u;
-        p.type === 2 ? u = new qt(i, i.nextSibling, this, t) : p.type === 1 ? u = new p.ctor(i, p.name, p.strings, this, t) : p.type === 6 && (u = new Ke(i, this, t)), this._$AV.push(u), p = s[++c];
+        let v;
+        p.type === 2 ? v = new qt(i, i.nextSibling, this, t) : p.type === 1 ? v = new p.ctor(i, p.name, p.strings, this, t) : p.type === 6 && (v = new Ke(i, this, t)), this._$AV.push(v), p = s[++c];
       }
       o !== p?.index && (i = Z.nextNode(), o++);
     }
@@ -450,8 +450,8 @@ class Wt {
     if (i === void 0) t = pt(this, t, a, 0), o = !yt(t) || t !== this._$AH && t !== ct, o && (this._$AH = t);
     else {
       const c = t;
-      let p, u;
-      for (t = i[0], p = 0; p < i.length - 1; p++) u = pt(this, c[s + p], a, p), u === ct && (u = this._$AH[p]), o ||= !yt(u) || u !== this._$AH[p], u === f ? t = f : t !== f && (t += (u ?? "") + i[p + 1]), this._$AH[p] = u;
+      let p, v;
+      for (t = i[0], p = 0; p < i.length - 1; p++) v = pt(this, c[s + p], a, p), v === ct && (v = this._$AH[p]), o ||= !yt(v) || v !== this._$AH[p], v === f ? t = f : t !== f && (t += (v ?? "") + i[p + 1]), this._$AH[p] = v;
     }
     o && !r && this.j(t);
   }
@@ -555,8 +555,24 @@ const ar = {
   upload: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M21 9V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v4"/><path d="M7 14l5-5 5 5"/><path d="M12 9v12"/></svg>',
   folder: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/></svg>',
   file: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/></svg>',
-  trash: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/><path d="M10 11v6M14 11v6"/></svg>',
-  delete: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/><path d="M10 11v6M14 11v6"/></svg>',
+  trash: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
+    <!-- lid -->
+    <path d="M9 3h6l1 3H8l1-3z"/>
+    <!-- top edge -->
+    <polyline points="3 6 5 6 21 6"/>
+    <!-- body -->
+    <path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/>
+    <!-- inner lines -->
+    <path d="M10 11v6M14 11v6"/></svg>`,
+  delete: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
+    <!-- lid -->
+    <path d="M9 3h6l1 3H8l1-3z"/>
+    <!-- top edge -->
+    <polyline points="3 6 5 6 21 6"/>
+    <!-- body -->
+    <path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/>
+    <!-- inner lines -->
+    <path d="M10 11v6M14 11v6"/></svg>`,
   edit: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M12 20h9"/><path d="M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"/></svg>',
   pencil: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M12 20h9"/><path d="M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"/></svg>',
   eye: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z"/><circle cx="12" cy="12" r="3"/></svg>',
@@ -610,7 +626,7 @@ se([
   n()
 ], wt.prototype, "size", 2);
 wt = se([
-  v("crt-icon")
+  u("crt-icon")
 ], wt);
 var sr = Object.defineProperty, ir = Object.getOwnPropertyDescriptor, K = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? ir(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -820,7 +836,7 @@ K([
   n({ attribute: "icon-right" })
 ], C.prototype, "iconRight", 2);
 C = K([
-  v("crt-button")
+  u("crt-button")
 ], C);
 var or = Object.defineProperty, nr = Object.getOwnPropertyDescriptor, Pe = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? nr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -880,7 +896,7 @@ Pe([
   n()
 ], Bt.prototype, "variant", 2);
 Bt = Pe([
-  v("crt-badge")
+  u("crt-badge")
 ], Bt);
 var lr = Object.defineProperty, cr = Object.getOwnPropertyDescriptor, Xt = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? cr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -943,7 +959,7 @@ Xt([
   n({ type: Number })
 ], Nt.prototype, "level", 2);
 Nt = Xt([
-  v("crt-heading")
+  u("crt-heading")
 ], Nt);
 let Ut = class extends h {
   constructor() {
@@ -969,7 +985,7 @@ Xt([
   n()
 ], Ut.prototype, "muted", 2);
 Ut = Xt([
-  v("crt-text")
+  u("crt-text")
 ], Ut);
 var pr = Object.defineProperty, dr = Object.getOwnPropertyDescriptor, ie = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? dr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -1083,16 +1099,16 @@ ie([
   n({ type: Array })
 ], kt.prototype, "tabs", 2);
 kt = ie([
-  v("crt-tabs")
+  u("crt-tabs")
 ], kt);
 function hr(e) {
   const t = document.createElement("div");
   return t.innerHTML = e, t;
 }
-var vr = Object.defineProperty, ur = Object.getOwnPropertyDescriptor, P = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? ur(t, a) : t, i = e.length - 1, o; i >= 0; i--)
+var ur = Object.defineProperty, vr = Object.getOwnPropertyDescriptor, P = (e, t, a, s) => {
+  for (var r = s > 1 ? void 0 : s ? vr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
     (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && vr(t, a, r), r;
+  return s && r && ur(t, a, r), r;
 };
 let J = class extends h {
   constructor() {
@@ -1171,7 +1187,7 @@ P([
   n()
 ], J.prototype, "disabled", 2);
 J = P([
-  v("crt-input")
+  u("crt-input")
 ], J);
 let tt = class extends h {
   constructor() {
@@ -1246,9 +1262,9 @@ P([
   n()
 ], tt.prototype, "rows", 2);
 tt = P([
-  v("crt-textarea")
+  u("crt-textarea")
 ], tt);
-var gr = Object.defineProperty, mr = Object.getOwnPropertyDescriptor, vt = (e, t, a, s) => {
+var gr = Object.defineProperty, mr = Object.getOwnPropertyDescriptor, ut = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? mr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
     (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
   return s && r && gr(t, a, r), r;
@@ -1293,23 +1309,23 @@ H.styles = d`
       color: var(--crt-primary-dark);
     }
   `;
-vt([
+ut([
   n({ type: String })
 ], H.prototype, "href", 2);
-vt([
+ut([
   n({ type: String })
 ], H.prototype, "target", 2);
-vt([
+ut([
   n({ type: Boolean })
 ], H.prototype, "iconLeft", 2);
-vt([
+ut([
   n({ type: Boolean })
 ], H.prototype, "iconRight", 2);
-vt([
+ut([
   n({ type: String })
 ], H.prototype, "icon", 2);
-H = vt([
-  v("crt-link")
+H = ut([
+  u("crt-link")
 ], H);
 var fr = Object.defineProperty, br = Object.getOwnPropertyDescriptor, st = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? br(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -1347,8 +1363,8 @@ let M = class extends h {
       if (r.size > this.maxSize)
         return console.warn(`File ${r.name} exceeds max size`), !1;
       if (this.accept) {
-        const i = this.accept.split(",").map((u) => u.trim()), o = r.type, c = "." + r.name.split(".").pop()?.toLowerCase();
-        if (!i.some((u) => u.startsWith(".") ? c === u.toLowerCase() : u.endsWith("/*") ? o.startsWith(u.replace("/*", "/")) : o === u))
+        const i = this.accept.split(",").map((v) => v.trim()), o = r.type, c = "." + r.name.split(".").pop()?.toLowerCase();
+        if (!i.some((v) => v.startsWith(".") ? c === v.toLowerCase() : v.endsWith("/*") ? o.startsWith(v.replace("/*", "/")) : o === v))
           return console.warn(`File ${r.name} type not accepted`), !1;
       }
       return !0;
@@ -1771,7 +1787,7 @@ st([
   m()
 ], M.prototype, "files", 2);
 M = st([
-  v("crt-file-upload")
+  u("crt-file-upload")
 ], M);
 var yr = Object.defineProperty, xr = Object.getOwnPropertyDescriptor, O = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? xr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -1869,10 +1885,10 @@ let w = class extends h {
       `);
     }
     for (let c = 1; c <= a; c++) {
-      const p = new Date(e, t, c), u = this._isToday(p), b = this._isSelected(p);
+      const p = new Date(e, t, c), v = this._isToday(p), b = this._isSelected(p);
       i.push(l`
         <div 
-          class="day ${u ? "today" : ""} ${b ? "selected" : ""}"
+          class="day ${v ? "today" : ""} ${b ? "selected" : ""}"
           @click="${() => this._selectDate(p)}"
         >
           ${c}
@@ -2170,7 +2186,7 @@ O([
   m()
 ], w.prototype, "_selectedDate", 2);
 w = O([
-  v("crt-calendar")
+  u("crt-calendar")
 ], w);
 var wr = Object.defineProperty, kr = Object.getOwnPropertyDescriptor, it = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? kr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -2434,7 +2450,7 @@ it([
   m()
 ], D.prototype, "_isOpen", 2);
 D = it([
-  v("crt-select")
+  u("crt-select")
 ], D);
 var $r = Object.defineProperty, _r = Object.getOwnPropertyDescriptor, y = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? _r(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -2567,7 +2583,7 @@ y([
   n({ type: String })
 ], Y.prototype, "value", 2);
 Y = y([
-  v("crt-checkbox")
+  u("crt-checkbox")
 ], Y);
 let V = class extends h {
   constructor() {
@@ -2688,7 +2704,7 @@ y([
   n({ type: String })
 ], V.prototype, "name", 2);
 V = y([
-  v("crt-radio")
+  u("crt-radio")
 ], V);
 let dt = class extends h {
   constructor() {
@@ -2734,7 +2750,7 @@ y([
   n({ type: Boolean, reflect: !0 })
 ], dt.prototype, "horizontal", 2);
 dt = y([
-  v("crt-radio-group")
+  u("crt-radio-group")
 ], dt);
 var zr = Object.defineProperty, Cr = Object.getOwnPropertyDescriptor, A = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Cr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -2919,7 +2935,7 @@ A([
   n({ type: Boolean })
 ], k.prototype, "showValue", 2);
 k = A([
-  v("crt-progress")
+  u("crt-progress")
 ], k);
 var Pr = Object.defineProperty, Or = Object.getOwnPropertyDescriptor, At = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Or(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -3075,7 +3091,7 @@ At([
   m()
 ], et.prototype, "_visible", 2);
 et = At([
-  v("crt-tooltip")
+  u("crt-tooltip")
 ], et);
 var Ar = Object.defineProperty, Sr = Object.getOwnPropertyDescriptor, oe = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Sr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -3156,7 +3172,7 @@ oe([
   n({ type: String })
 ], $t.prototype, "separator", 2);
 $t = oe([
-  v("crt-breadcrumb")
+  u("crt-breadcrumb")
 ], $t);
 var Er = Object.defineProperty, Mr = Object.getOwnPropertyDescriptor, St = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Mr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -3290,7 +3306,7 @@ St([
   n({ type: Boolean })
 ], rt.prototype, "showInfo", 2);
 rt = St([
-  v("crt-pagination")
+  u("crt-pagination")
 ], rt);
 var Dr = Object.defineProperty, Tr = Object.getOwnPropertyDescriptor, B = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Tr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -3513,7 +3529,7 @@ B([
   n({ type: String })
 ], _.prototype, "unit", 2);
 _ = B([
-  v("crt-slider")
+  u("crt-slider")
 ], _);
 var jr = Object.defineProperty, Lr = Object.getOwnPropertyDescriptor, ot = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Lr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -3692,7 +3708,7 @@ ot([
   n({ type: String, reflect: !0 })
 ], T.prototype, "size", 2);
 T = ot([
-  v("crt-toggle")
+  u("crt-toggle")
 ], T);
 var Ir = Object.defineProperty, Br = Object.getOwnPropertyDescriptor, N = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Br(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -3879,7 +3895,7 @@ N([
   n({ type: String, reflect: !0 })
 ], j.prototype, "status", 2);
 j = N([
-  v("crt-avatar")
+  u("crt-avatar")
 ], j);
 let Rt = class extends h {
   constructor() {
@@ -3924,7 +3940,7 @@ N([
   n({ type: Number })
 ], Rt.prototype, "max", 2);
 Rt = N([
-  v("crt-avatar-group")
+  u("crt-avatar-group")
 ], Rt);
 var Nr = Object.defineProperty, Ur = Object.getOwnPropertyDescriptor, S = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Ur(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -4075,7 +4091,7 @@ S([
   n({ type: Boolean, reflect: !0 })
 ], q.prototype, "effect", 2);
 q = S([
-  v("crt-skeleton")
+  u("crt-skeleton")
 ], q);
 let Ft = class extends h {
   constructor() {
@@ -4125,7 +4141,7 @@ S([
   n({ type: Number })
 ], Ft.prototype, "lines", 2);
 Ft = S([
-  v("crt-skeleton-text")
+  u("crt-skeleton-text")
 ], Ft);
 let Ht = class extends h {
   constructor() {
@@ -4198,7 +4214,7 @@ S([
   n({ type: Boolean })
 ], Ht.prototype, "hideImage", 2);
 Ht = S([
-  v("crt-skeleton-card")
+  u("crt-skeleton-card")
 ], Ht);
 var Rr = Object.defineProperty, Fr = Object.getOwnPropertyDescriptor, U = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Fr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -4430,7 +4446,7 @@ U([
   n({ type: String })
 ], z.prototype, "icon", 2);
 z = U([
-  v("crt-alert")
+  u("crt-alert")
 ], z);
 var Hr = Object.defineProperty, Yr = Object.getOwnPropertyDescriptor, ne = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Yr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -4690,7 +4706,7 @@ ne([
   n({ type: String })
 ], _t.prototype, "message", 2);
 _t = ne([
-  v("crt-spinner")
+  u("crt-spinner")
 ], _t);
 var Vr = Object.getOwnPropertyDescriptor, qr = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Vr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -4757,7 +4773,7 @@ Qt.styles = d`
     }
   `;
 Qt = qr([
-  v("crt-card")
+  u("crt-card")
 ], Qt);
 var Wr = Object.defineProperty, Xr = Object.getOwnPropertyDescriptor, le = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Xr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -4842,7 +4858,7 @@ le([
   n({ type: Array })
 ], zt.prototype, "rows", 2);
 zt = le([
-  v("crt-table")
+  u("crt-table")
 ], zt);
 var Kr = Object.defineProperty, Gr = Object.getOwnPropertyDescriptor, ce = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Gr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -4903,9 +4919,9 @@ ce([
   n({ type: String })
 ], Ct.prototype, "gap", 2);
 Ct = ce([
-  v("crt-grid")
+  u("crt-grid")
 ], Ct);
-var Zr = Object.defineProperty, Qr = Object.getOwnPropertyDescriptor, ut = (e, t, a, s) => {
+var Zr = Object.defineProperty, Qr = Object.getOwnPropertyDescriptor, vt = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? Qr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
     (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
   return s && r && Zr(t, a, r), r;
@@ -5116,23 +5132,23 @@ W.styles = d`
       color: var(--crt-bg-dark);
     }
   `;
-ut([
+vt([
   n()
 ], W.prototype, "title", 2);
-ut([
+vt([
   n()
 ], W.prototype, "description", 2);
-ut([
+vt([
   n()
 ], W.prototype, "code", 2);
-ut([
+vt([
   m()
 ], W.prototype, "activeTab", 2);
-ut([
+vt([
   m()
 ], W.prototype, "copied", 2);
-W = ut([
-  v("crt-code-example")
+W = vt([
+  u("crt-code-example")
 ], W);
 var Jr = Object.defineProperty, ta = Object.getOwnPropertyDescriptor, Kt = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? ta(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -5313,7 +5329,7 @@ Kt([
   n({ type: String })
 ], ht.prototype, "size", 2);
 ht = Kt([
-  v("crt-modal")
+  u("crt-modal")
 ], ht);
 var ea = Object.defineProperty, ra = Object.getOwnPropertyDescriptor, nt = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? ra(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -5571,7 +5587,7 @@ nt([
   m()
 ], L.prototype, "_toasts", 2);
 L = nt([
-  v("crt-toast")
+  u("crt-toast")
 ], L);
 var aa = Object.defineProperty, sa = Object.getOwnPropertyDescriptor, Et = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? sa(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -5685,7 +5701,7 @@ Et([
   n({ type: Boolean, reflect: !0 })
 ], Pt.prototype, "open", 2);
 Pt = Et([
-  v("crt-accordion-item")
+  u("crt-accordion-item")
 ], Pt);
 let Yt = class extends h {
   constructor() {
@@ -5714,7 +5730,7 @@ Et([
   n({ type: Boolean })
 ], Yt.prototype, "multiple", 2);
 Yt = Et([
-  v("crt-accordion")
+  u("crt-accordion")
 ], Yt);
 var ia = Object.defineProperty, oa = Object.getOwnPropertyDescriptor, Mt = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? oa(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -5862,7 +5878,7 @@ Mt([
   m()
 ], at.prototype, "isActive", 2);
 at = Mt([
-  v("crt-visualizer")
+  u("crt-visualizer")
 ], at);
 var na = Object.defineProperty, la = Object.getOwnPropertyDescriptor, pe = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? la(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -6115,7 +6131,7 @@ pe([
   n({ type: Number })
 ], Ot.prototype, "currentIndex", 2);
 Ot = pe([
-  v("crt-playlist")
+  u("crt-playlist")
 ], Ot);
 var ca = Object.defineProperty, pa = Object.getOwnPropertyDescriptor, $ = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? pa(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -6250,10 +6266,10 @@ let x = class extends h {
 
             <!-- Progress -->
             <div class="progress-section progress-clickable" @click="${this.handleProgressClick}">
-              <crt-progress 
-                .value="${this.progressPercent}" 
-                ?animated="${this.isPlaying}"
-                .showValue="${!1}"
+              <crt-progress
+                .value="${this.progressPercent}"
+                variant="success"
+                .showValue="${!0}"
               ></crt-progress>
               <div class="time-display">
                 <span>${this.formatTime(this.currentTime)}</span>
@@ -6493,7 +6509,7 @@ $([
   ee("crt-visualizer")
 ], x.prototype, "visualizer", 2);
 x = $([
-  v("crt-music-player")
+  u("crt-music-player")
 ], x);
 var da = Object.defineProperty, ha = Object.getOwnPropertyDescriptor, gt = (e, t, a, s) => {
   for (var r = s > 1 ? void 0 : s ? ha(t, a) : t, i = e.length - 1, o; i >= 0; i--)
@@ -6641,12 +6657,12 @@ gt([
   m()
 ], X.prototype, "input", 2);
 X = gt([
-  v("crt-terminal")
+  u("crt-terminal")
 ], X);
-var va = Object.defineProperty, ua = Object.getOwnPropertyDescriptor, lt = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? ua(t, a) : t, i = e.length - 1, o; i >= 0; i--)
+var ua = Object.defineProperty, va = Object.getOwnPropertyDescriptor, lt = (e, t, a, s) => {
+  for (var r = s > 1 ? void 0 : s ? va(t, a) : t, i = e.length - 1, o; i >= 0; i--)
     (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && va(t, a, r), r;
+  return s && r && ua(t, a, r), r;
 };
 let I = class extends h {
   constructor() {
@@ -6830,7 +6846,7 @@ lt([
   ee("crt-file-upload")
 ], I.prototype, "fileUpload", 2);
 I = lt([
-  v("crt-music-station")
+  u("crt-music-station")
 ], I);
 export {
   Yt as Accordion,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patimweb/crtstyleguide",
-  "version": "1.0.15",
+  "version": "1.0.17",
   "description": "CRT Style Guide - Retro Lit component library",
   "type": "module",
   "main": "dist/lib/index.js",