@revotech-group/revotech-ui-kit 0.0.53 → 0.0.54

package/dist/revotech-ui-kit.js

@@ -65,13 +65,13 @@ const as = "-", Ro = (e) => {
     nextPart: /* @__PURE__ */ new Map(),
     validators: []
   };
-  return Vo(Object.entries(e.classGroups), s).forEach(([i, n]) => {
+  return Uo(Object.entries(e.classGroups), s).forEach(([i, n]) => {
     kr(n, o, i, t);
   }), o;
 }, kr = (e, t, s, o) => {
   e.forEach((r) => {
     if (typeof r == "string") {
-      const i = r === "" ? t : Vs(t, r);
+      const i = r === "" ? t : Us(t, r);
       i.classGroupId = s;
       return;
     }
@@ -87,10 +87,10 @@ const as = "-", Ro = (e) => {
       return;
     }
     Object.entries(r).forEach(([i, n]) => {
-      kr(n, Vs(t, i), s, o);
+      kr(n, Us(t, i), s, o);
     });
   });
-}, Vs = (e, t) => {
+}, Us = (e, t) => {
   let s = e;
   return t.split(as).forEach((o) => {
     s.nextPart.has(o) || s.nextPart.set(o, {
@@ -98,10 +98,10 @@ const as = "-", Ro = (e) => {
       validators: []
     }), s = s.nextPart.get(o);
   }), s;
-}, To = (e) => e.isThemeGetter, Vo = (e, t) => t ? e.map(([s, o]) => {
+}, To = (e) => e.isThemeGetter, Uo = (e, t) => t ? e.map(([s, o]) => {
   const r = o.map((i) => typeof i == "string" ? t + i : typeof i == "object" ? Object.fromEntries(Object.entries(i).map(([n, g]) => [t + n, g])) : i);
   return [s, r];
-}) : e, Uo = (e) => {
+}) : e, Vo = (e) => {
   if (e < 1)
     return {
       get: () => {
@@ -146,11 +146,11 @@ const as = "-", Ro = (e) => {
       }
       k === "[" ? b++ : k === "]" && b--;
     }
-    const S = v.length === 0 ? g : g.substring(w), G = S.startsWith(Ks), L = G ? S.substring(1) : S, E = O && O > w ? O - w : void 0;
+    const S = v.length === 0 ? g : g.substring(w), G = S.startsWith(Ks), j = G ? S.substring(1) : S, E = O && O > w ? O - w : void 0;
     return {
       modifiers: v,
       hasImportantModifier: G,
-      baseClassName: L,
+      baseClassName: j,
       maybePostfixModifierPosition: E
     };
   };
@@ -167,7 +167,7 @@ const as = "-", Ro = (e) => {
     o[0] === "[" ? (t.push(...s.sort(), o), s = []) : s.push(o);
   }), t.push(...s.sort()), t;
 }, Ho = (e) => ({
-  cache: Uo(e.cacheSize),
+  cache: Vo(e.cacheSize),
   parseClassName: Fo(e),
   ...Ro(e)
 }), Yo = /\s+/, Xo = (e, t) => {
@@ -184,9 +184,9 @@ const as = "-", Ro = (e) => {
       baseClassName: S,
       maybePostfixModifierPosition: G
     } = s(b);
-    let L = !!G, E = o(L ? S.substring(0, G) : S);
+    let j = !!G, E = o(j ? S.substring(0, G) : S);
     if (!E) {
-      if (!L) {
+      if (!j) {
         g = b + (g.length > 0 ? " " + g : g);
         continue;
       }
@@ -194,16 +194,16 @@ const as = "-", Ro = (e) => {
         g = b + (g.length > 0 ? " " + g : g);
         continue;
       }
-      L = !1;
+      j = !1;
     }
-    const x = Go(w).join(":"), k = O ? x + Ks : x, A = k + E;
-    if (i.includes(A))
+    const x = Go(w).join(":"), k = O ? x + Ks : x, L = k + E;
+    if (i.includes(L))
       continue;
-    i.push(A);
-    const mt = r(E, L);
+    i.push(L);
+    const mt = r(E, j);
     for (let Me = 0; Me < mt.length; ++Me) {
-      const Vt = mt[Me];
-      i.push(k + Vt);
+      const Ut = mt[Me];
+      i.push(k + Ut);
     }
     g = b + (g.length > 0 ? " " + g : g);
   }
@@ -252,7 +252,7 @@ const _ = (e) => {
   // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
   ei.test(e) && !ti.test(e)
 ), Js = () => !1, ui = (e) => ri.test(e), hi = (e) => si.test(e), gi = () => {
-  const e = _("colors"), t = _("spacing"), s = _("blur"), o = _("brightness"), r = _("borderColor"), i = _("borderRadius"), n = _("borderSpacing"), g = _("borderWidth"), v = _("contrast"), b = _("grayscale"), w = _("hueRotate"), O = _("invert"), S = _("gap"), G = _("gradientColorStops"), L = _("gradientColorStopPositions"), E = _("inset"), x = _("margin"), k = _("opacity"), A = _("padding"), mt = _("saturate"), Me = _("scale"), Vt = _("sepia"), Ms = _("skew"), Is = _("space"), zs = _("translate"), Cr = () => ["auto", "contain", "none"], Or = () => ["auto", "hidden", "clip", "visible", "scroll"], Pr = () => ["auto", m, t], C = () => [m, t], Bs = () => ["", se, fe], Ut = () => ["auto", tt, m], Rs = () => ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top"], Ft = () => ["solid", "dashed", "dotted", "double", "none"], qs = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], Sr = () => ["start", "end", "center", "between", "around", "evenly", "stretch"], vt = () => ["", "0", m], Ns = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], re = () => [tt, m];
+  const e = _("colors"), t = _("spacing"), s = _("blur"), o = _("brightness"), r = _("borderColor"), i = _("borderRadius"), n = _("borderSpacing"), g = _("borderWidth"), v = _("contrast"), b = _("grayscale"), w = _("hueRotate"), O = _("invert"), S = _("gap"), G = _("gradientColorStops"), j = _("gradientColorStopPositions"), E = _("inset"), x = _("margin"), k = _("opacity"), L = _("padding"), mt = _("saturate"), Me = _("scale"), Ut = _("sepia"), Ms = _("skew"), Is = _("space"), zs = _("translate"), Cr = () => ["auto", "contain", "none"], Or = () => ["auto", "hidden", "clip", "visible", "scroll"], Pr = () => ["auto", m, t], C = () => [m, t], Bs = () => ["", se, fe], Vt = () => ["auto", tt, m], Rs = () => ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top"], Ft = () => ["solid", "dashed", "dotted", "double", "none"], qs = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], Sr = () => ["start", "end", "center", "between", "around", "evenly", "stretch"], vt = () => ["", "0", m], Ns = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], re = () => [tt, m];
   return {
     cacheSize: 500,
     separator: ":",
@@ -570,14 +570,14 @@ const _ = (e) => {
        * @see https://tailwindcss.com/docs/grid-column
        */
       "col-start": [{
-        "col-start": Ut()
+        "col-start": Vt()
       }],
       /**
        * Grid Column End
        * @see https://tailwindcss.com/docs/grid-column
        */
       "col-end": [{
-        "col-end": Ut()
+        "col-end": Vt()
       }],
       /**
        * Grid Template Rows
@@ -600,14 +600,14 @@ const _ = (e) => {
        * @see https://tailwindcss.com/docs/grid-row
        */
       "row-start": [{
-        "row-start": Ut()
+        "row-start": Vt()
       }],
       /**
        * Grid Row End
        * @see https://tailwindcss.com/docs/grid-row
        */
       "row-end": [{
-        "row-end": Ut()
+        "row-end": Vt()
       }],
       /**
        * Grid Auto Flow
@@ -720,63 +720,63 @@ const _ = (e) => {
        * @see https://tailwindcss.com/docs/padding
        */
       p: [{
-        p: [A]
+        p: [L]
       }],
       /**
        * Padding X
        * @see https://tailwindcss.com/docs/padding
        */
       px: [{
-        px: [A]
+        px: [L]
       }],
       /**
        * Padding Y
        * @see https://tailwindcss.com/docs/padding
        */
       py: [{
-        py: [A]
+        py: [L]
       }],
       /**
        * Padding Start
        * @see https://tailwindcss.com/docs/padding
        */
       ps: [{
-        ps: [A]
+        ps: [L]
       }],
       /**
        * Padding End
        * @see https://tailwindcss.com/docs/padding
        */
       pe: [{
-        pe: [A]
+        pe: [L]
       }],
       /**
        * Padding Top
        * @see https://tailwindcss.com/docs/padding
        */
       pt: [{
-        pt: [A]
+        pt: [L]
       }],
       /**
        * Padding Right
        * @see https://tailwindcss.com/docs/padding
        */
       pr: [{
-        pr: [A]
+        pr: [L]
       }],
       /**
        * Padding Bottom
        * @see https://tailwindcss.com/docs/padding
        */
       pb: [{
-        pb: [A]
+        pb: [L]
       }],
       /**
        * Padding Left
        * @see https://tailwindcss.com/docs/padding
        */
       pl: [{
-        pl: [A]
+        pl: [L]
       }],
       /**
        * Margin
@@ -1223,21 +1223,21 @@ const _ = (e) => {
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-from-pos": [{
-        from: [L]
+        from: [j]
       }],
       /**
        * Gradient Color Stops Via Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-via-pos": [{
-        via: [L]
+        via: [j]
       }],
       /**
        * Gradient Color Stops To Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-to-pos": [{
-        to: [L]
+        to: [j]
       }],
       /**
        * Gradient Color Stops From
@@ -1711,7 +1711,7 @@ const _ = (e) => {
        * @see https://tailwindcss.com/docs/sepia
        */
       sepia: [{
-        sepia: [Vt]
+        sepia: [Ut]
       }],
       /**
        * Backdrop Filter
@@ -1782,7 +1782,7 @@ const _ = (e) => {
        * @see https://tailwindcss.com/docs/backdrop-sepia
        */
       "backdrop-sepia": [{
-        "backdrop-sepia": [Vt]
+        "backdrop-sepia": [Ut]
       }],
       // Tables
       /**
@@ -2301,11 +2301,12 @@ function Qs() {
     }
   );
 }
-const c = p` @font-face {
+const c = p` 
+/* @font-face {
   font-family: 'GeistSans';
 
   src: url('assets/fonts/Geist/Geist-Regular.woff2') format('woff2');
-}
+} */
 
 /*
 ! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com
@@ -2791,7 +2792,7 @@ video {
 }
 
 .dark {
-  --background: 240 10% 3.9%;
+  --background: 240 10% 4%;
   --foreground: 0 0% 98%;
   --card: 240 10% 3.9%;
   --card-foreground: 0 0% 98%;
@@ -2826,7 +2827,7 @@ video {
 
 * {
   border-color: hsl(var(--border));
-  font-family: GeistSans, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 }
 
 body {
@@ -4161,7 +4162,7 @@ body {
 }
 
 .font-geist {
-  font-family: GeistSans, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 }
 
 .font-mono {
@@ -5669,7 +5670,7 @@ function Di() {
     (e = arguments[s++]) && (t = io(e)) && (o && (o += " "), o += t);
   return o;
 }
-const Us = (e) => typeof e == "boolean" ? "".concat(e) : e === 0 ? "0" : e, Fs = Di, Y = (e, t) => (s) => {
+const Vs = (e) => typeof e == "boolean" ? "".concat(e) : e === 0 ? "0" : e, Fs = Di, Y = (e, t) => (s) => {
   var o;
   if ((t == null ? void 0 : t.variants) == null)
     return Fs(e, s == null ? void 0 : s.class, s == null ? void 0 : s.className);
@@ -5677,15 +5678,15 @@ const Us = (e) => typeof e == "boolean" ? "".concat(e) : e === 0 ? "0" : e, Fs =
     const w = s == null ? void 0 : s[b], O = i == null ? void 0 : i[b];
     if (w === null)
       return null;
-    const S = Us(w) || Us(O);
+    const S = Vs(w) || Vs(O);
     return r[b][S];
   }), g = s && Object.entries(s).reduce((b, w) => {
     let [O, S] = w;
     return S === void 0 || (b[O] = S), b;
   }, {}), v = t == null || (o = t.compoundVariants) === null || o === void 0 ? void 0 : o.reduce((b, w) => {
     let { class: O, className: S, ...G } = w;
-    return Object.entries(G).every((L) => {
-      let [E, x] = L;
+    return Object.entries(G).every((j) => {
+      let [E, x] = j;
       return Array.isArray(x) ? x.includes({
         ...i,
         ...g
@@ -5862,7 +5863,7 @@ us([
 xt = us([
   d("rtg-aspect-ratio")
 ], xt);
-const Ti = "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", Vi = "aspect-square h-full w-full", Ui = "flex h-full w-full items-center justify-center rounded-full bg-muted";
+const Ti = "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", Ui = "aspect-square h-full w-full", Vi = "flex h-full w-full items-center justify-center rounded-full bg-muted";
 var Fi = Object.defineProperty, Gi = Object.getOwnPropertyDescriptor, ao = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? Gi(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -5899,7 +5900,7 @@ let Lr = class extends u {
   render() {
     return l`
       <span
-        class="${h(Ui, this.className)}"
+        class="${h(Vi, this.className)}"
         style="width:40px;height:40px"
         part="avatar-fallback"
       >
@@ -5924,7 +5925,7 @@ let _t = class extends u {
   render() {
     return l`
       <img  
-          class="${h(Vi, this.className)}" 
+          class="${h(Ui, this.className)}" 
           alt="${this.alt}" 
           src="${this.src}"
           part="avatar-image"
@@ -5974,7 +5975,7 @@ var Ji = Object.defineProperty, Qi = Object.getOwnPropertyDescriptor, Le = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && Ji(t, s, r), r;
 };
-let M = class extends $ {
+let A = class extends $ {
   constructor() {
     super(...arguments), this.click = () => {
     }, this.disabled = !1, this.type = "button", this.variant = "default", this.size = "default", this.externalClass = "", this.isCustomClass = !1;
@@ -5994,7 +5995,7 @@ let M = class extends $ {
         ${P(e)}
         ?disabled="${this.disabled}"
         class="${h(
-      M.buttonVariants({
+      A.buttonVariants({
         variant: this.variant,
         size: this.size,
         className: this.className
@@ -6007,8 +6008,8 @@ let M = class extends $ {
     `;
   }
 };
-M.buttonVariants = Zi;
-M.styles = [
+A.buttonVariants = Zi;
+A.styles = [
   p`
       :host {
         --rtg-button-bg: unset;
@@ -6027,28 +6028,28 @@ M.styles = [
 ];
 Le([
   a({ type: Function })
-], M.prototype, "click", 2);
+], A.prototype, "click", 2);
 Le([
   a({ type: Boolean })
-], M.prototype, "disabled", 2);
+], A.prototype, "disabled", 2);
 Le([
   a({ type: String })
-], M.prototype, "type", 2);
+], A.prototype, "type", 2);
 Le([
   a({ type: String })
-], M.prototype, "variant", 2);
+], A.prototype, "variant", 2);
 Le([
   a({ type: String })
-], M.prototype, "size", 2);
+], A.prototype, "size", 2);
 Le([
   a({ type: String })
-], M.prototype, "externalClass", 2);
+], A.prototype, "externalClass", 2);
 Le([
   a({ type: String })
-], M.prototype, "isCustomClass", 2);
-M = Le([
+], A.prototype, "isCustomClass", 2);
+A = Le([
   d("rtg-button")
-], M);
+], A);
 const en = Y(
   "inline-flex items-center border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent rounded-full",
   {
@@ -6310,7 +6311,7 @@ Be = cr([
   d("rtg-collapsible")
 ], Be);
 const Dn = "peer h-4 w-4 align-middle shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground", jn = "flex items-center justify-center text-current pointer-events-none";
-var Ln = Object.defineProperty, An = Object.getOwnPropertyDescriptor, Ve = (e, t, s, o) => {
+var Ln = Object.defineProperty, An = Object.getOwnPropertyDescriptor, Ue = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? An(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && Ln(t, s, r), r;
@@ -6364,25 +6365,25 @@ let oe = class extends u {
   }
 };
 oe.styles = [p``, c];
-Ve([
+Ue([
   a({ type: Boolean })
 ], oe.prototype, "disabled", 2);
-Ve([
+Ue([
   a({ type: Boolean })
 ], oe.prototype, "checked", 2);
-Ve([
+Ue([
   a({ type: String })
 ], oe.prototype, "type", 2);
-Ve([
+Ue([
   a({ type: String })
 ], oe.prototype, "value", 2);
-Ve([
+Ue([
   a({ type: Boolean })
 ], oe.prototype, "required", 2);
-Ve([
+Ue([
   a({ type: String })
 ], oe.prototype, "twCLass", 2);
-oe = Ve([
+oe = Ue([
   d("rtg-checkbox")
 ], oe);
 const pr = "closed";
@@ -6440,12 +6441,12 @@ gs([
 rt = gs([
   d("rtg-context-menu-content")
 ], rt);
-var zn = Object.defineProperty, Bn = Object.getOwnPropertyDescriptor, Ue = (e, t, s, o) => {
+var zn = Object.defineProperty, Bn = Object.getOwnPropertyDescriptor, Ve = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? Bn(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && zn(t, s, r), r;
 };
-let I = class extends u {
+let M = class extends u {
   constructor() {
     super(...arguments), this._id = "", this._hidden = "", this.selected = !1, this.checked = !1, this.disabled = !1;
   }
@@ -6456,7 +6457,7 @@ let I = class extends u {
     const e = (s = (t = this.parentElement) == null ? void 0 : t.shadowRoot) == null ? void 0 : s.querySelector("div[rtgcmd-group]");
     return e ? this._id = `${e.getAttribute(
       "id"
-    )}li${I._counter++}` : this._id = `rtgcmdrxgxli${I._counter++}`, this._id;
+    )}li${M._counter++}` : this._id = `rtgcmdrxgxli${M._counter++}`, this._id;
   }
   get value() {
     var e;
@@ -6510,8 +6511,8 @@ let I = class extends u {
     `;
   }
 };
-I._counter = 0;
-I.styles = [
+M._counter = 0;
+M.styles = [
   p`
       .icon-space {
         width: 16px; /* Fixed width to reserve space for the check icon */
@@ -6521,27 +6522,27 @@ I.styles = [
     `,
   c
 ];
-Ue([
+Ve([
   a({ type: String })
-], I.prototype, "_id", 2);
-Ue([
+], M.prototype, "_id", 2);
+Ve([
   a({ attribute: "aria-hidden", type: String })
-], I.prototype, "_hidden", 2);
-Ue([
+], M.prototype, "_hidden", 2);
+Ve([
   a({ attribute: "data-value", type: String })
-], I.prototype, "value", 1);
-Ue([
+], M.prototype, "value", 1);
+Ve([
   a({ type: Boolean })
-], I.prototype, "selected", 2);
-Ue([
+], M.prototype, "selected", 2);
+Ve([
   a({ type: Boolean })
-], I.prototype, "checked", 2);
-Ue([
+], M.prototype, "checked", 2);
+Ve([
   a({ type: Boolean })
-], I.prototype, "disabled", 2);
-I = Ue([
+], M.prototype, "disabled", 2);
+M = Ve([
   d("rtg-context-menu-checkbox-item")
-], I);
+], M);
 var Rn = Object.defineProperty, qn = Object.getOwnPropertyDescriptor, ur = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? qn(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -6664,12 +6665,12 @@ Bt([
 X = Bt([
   d("rtg-context-menu-item")
 ], X);
-var Vn = Object.defineProperty, Un = Object.getOwnPropertyDescriptor, Fe = (e, t, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? Un(t, s) : t, i = e.length - 1, n; i >= 0; i--)
+var Un = Object.defineProperty, Vn = Object.getOwnPropertyDescriptor, Fe = (e, t, s, o) => {
+  for (var r = o > 1 ? void 0 : o ? Vn(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
-  return o && r && Vn(t, s, r), r;
+  return o && r && Un(t, s, r), r;
 };
-let z = class extends u {
+let I = class extends u {
   constructor() {
     super(...arguments), this._id = "", this._hidden = "", this.selected = !1, this.checked = !1, this.disabled = !1;
   }
@@ -6680,7 +6681,7 @@ let z = class extends u {
     const e = (s = (t = this.parentElement) == null ? void 0 : t.shadowRoot) == null ? void 0 : s.querySelector("div[rtgcmd-group]");
     return e ? this._id = `${e.getAttribute(
       "id"
-    )}li${z._counter++}` : this._id = `rtgcmdrxgxli${z._counter++}`, this._id;
+    )}li${I._counter++}` : this._id = `rtgcmdrxgxli${I._counter++}`, this._id;
   }
   get value() {
     var e;
@@ -6725,8 +6726,8 @@ let z = class extends u {
     `;
   }
 };
-z._counter = 0;
-z.styles = [
+I._counter = 0;
+I.styles = [
   p`
       .icon-space {
         width: 16px; /* Fixed width to reserve space for the check icon */
@@ -6738,25 +6739,25 @@ z.styles = [
 ];
 Fe([
   a({ type: String })
-], z.prototype, "_id", 2);
+], I.prototype, "_id", 2);
 Fe([
   a({ attribute: "aria-hidden", type: String })
-], z.prototype, "_hidden", 2);
+], I.prototype, "_hidden", 2);
 Fe([
   a({ attribute: "data-value", type: String })
-], z.prototype, "value", 1);
+], I.prototype, "value", 1);
 Fe([
   a({ type: Boolean })
-], z.prototype, "selected", 2);
+], I.prototype, "selected", 2);
 Fe([
   a({ type: Boolean })
-], z.prototype, "checked", 2);
+], I.prototype, "checked", 2);
 Fe([
   a({ type: Boolean })
-], z.prototype, "disabled", 2);
-z = Fe([
+], I.prototype, "disabled", 2);
+I = Fe([
   d("rtg-context-menu-radio-item")
-], z);
+], I);
 var Fn = Object.defineProperty, Gn = Object.getOwnPropertyDescriptor, ms = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? Gn(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -7193,7 +7194,7 @@ var aa = Object.defineProperty, la = Object.getOwnPropertyDescriptor, da = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && aa(t, s, r), r;
 };
-let Vr = class extends u {
+let Ur = class extends u {
   get identifier() {
     var t, s;
     const e = (s = (t = this.parentElement) == null ? void 0 : t.shadowRoot) == null ? void 0 : s.querySelector("div[rtgcmd-root]");
@@ -7219,10 +7220,10 @@ let Vr = class extends u {
     `;
   }
 };
-Vr.styles = [p``, c];
-Vr = da([
+Ur.styles = [p``, c];
+Ur = da([
   d("rtg-command-list")
-], Vr);
+], Ur);
 var ca = Object.defineProperty, pa = Object.getOwnPropertyDescriptor, ws = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? pa(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -7267,7 +7268,7 @@ var ua = Object.defineProperty, ha = Object.getOwnPropertyDescriptor, ga = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && ua(t, s, r), r;
 };
-let Ur = class extends u {
+let Vr = class extends u {
   constructor() {
     super(...arguments), this.handleClick = () => {
       if (this._comboBox) {
@@ -7320,10 +7321,10 @@ let Ur = class extends u {
     `;
   }
 };
-Ur.styles = [p``, c];
-Ur = ga([
+Vr.styles = [p``, c];
+Vr = ga([
   d("rtg-combo-box-trigger")
-], Ur);
+], Vr);
 var ma = Object.defineProperty, va = Object.getOwnPropertyDescriptor, co = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? va(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -7516,7 +7517,7 @@ var wa = Object.defineProperty, ya = Object.getOwnPropertyDescriptor, ee = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && wa(t, s, r), r;
 };
-let B = class extends $ {
+let z = class extends $ {
   constructor() {
     super(...arguments), this.value = "", this.key = "", this.tabindex = 0, this.isSelected = !1, this.isFocus = !1, this.class = "", this.selectItemIndex = -1, this.onSelect = (e, t) => {
     }, this.onMouseOver = (e, t) => {
@@ -7570,37 +7571,37 @@ let B = class extends $ {
     `;
   }
 };
-B.styles = [p``, c];
+z.styles = [p``, c];
 ee([
   a({ type: String })
-], B.prototype, "value", 2);
+], z.prototype, "value", 2);
 ee([
   a({ type: String })
-], B.prototype, "key", 2);
+], z.prototype, "key", 2);
 ee([
   a({ type: Number })
-], B.prototype, "tabindex", 2);
+], z.prototype, "tabindex", 2);
 ee([
   a({ type: Boolean })
-], B.prototype, "isSelected", 2);
+], z.prototype, "isSelected", 2);
 ee([
   a({ type: Boolean })
-], B.prototype, "isFocus", 2);
+], z.prototype, "isFocus", 2);
 ee([
   a({ type: String })
-], B.prototype, "class", 2);
+], z.prototype, "class", 2);
 ee([
   a({ type: Number })
-], B.prototype, "selectItemIndex", 2);
+], z.prototype, "selectItemIndex", 2);
 ee([
   a({ type: Function })
-], B.prototype, "onSelect", 2);
+], z.prototype, "onSelect", 2);
 ee([
   a({ type: Function })
-], B.prototype, "onMouseOver", 2);
-B = ee([
+], z.prototype, "onMouseOver", 2);
+z = ee([
   d("rtg-combo-box-item")
-], B);
+], z);
 var xa = Object.defineProperty, _a = Object.getOwnPropertyDescriptor, mr = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? _a(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -7938,7 +7939,7 @@ ys([
 St = ys([
   d("rtg-dialog-header")
 ], St);
-var Na = Object.defineProperty, Ta = Object.getOwnPropertyDescriptor, Va = (e, t, s, o) => {
+var Na = Object.defineProperty, Ta = Object.getOwnPropertyDescriptor, Ua = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? Ta(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && Na(t, s, r), r;
@@ -7957,13 +7958,13 @@ let Yr = class extends u {
   }
 };
 Yr.styles = [p``, c];
-Yr = Va([
+Yr = Ua([
   d("rtg-dialog-overlay")
 ], Yr);
-var Ua = Object.defineProperty, Fa = Object.getOwnPropertyDescriptor, Ga = (e, t, s, o) => {
+var Va = Object.defineProperty, Fa = Object.getOwnPropertyDescriptor, Ga = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? Fa(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
-  return o && r && Ua(t, s, r), r;
+  return o && r && Va(t, s, r), r;
 };
 const Ha = "open";
 let Xr = class extends u {
@@ -8165,7 +8166,7 @@ var tl = Object.defineProperty, rl = Object.getOwnPropertyDescriptor, Ge = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && tl(t, s, r), r;
 };
-let R = class extends u {
+let B = class extends u {
   constructor() {
     super(...arguments), this._id = "", this._hidden = "", this.selected = !1, this.checked = !1, this.disabled = !1;
   }
@@ -8176,7 +8177,7 @@ let R = class extends u {
     const e = (s = (t = this.parentElement) == null ? void 0 : t.shadowRoot) == null ? void 0 : s.querySelector("div[rtgcmd-group]");
     return e ? this._id = `${e.getAttribute(
       "id"
-    )}li${R._counter++}` : this._id = `rtgcmdrxgxli${R._counter++}`, this._id;
+    )}li${B._counter++}` : this._id = `rtgcmdrxgxli${B._counter++}`, this._id;
   }
   get value() {
     var e;
@@ -8221,8 +8222,8 @@ let R = class extends u {
     `;
   }
 };
-R._counter = 0;
-R.styles = [
+B._counter = 0;
+B.styles = [
   p`
       .icon-space {
         width: 16px; /* Fixed width to reserve space for the check icon */
@@ -8234,25 +8235,25 @@ R.styles = [
 ];
 Ge([
   a({ type: String })
-], R.prototype, "_id", 2);
+], B.prototype, "_id", 2);
 Ge([
   a({ attribute: "aria-hidden", type: String })
-], R.prototype, "_hidden", 2);
+], B.prototype, "_hidden", 2);
 Ge([
   a({ attribute: "data-value", type: String })
-], R.prototype, "value", 1);
+], B.prototype, "value", 1);
 Ge([
   a({ type: Boolean })
-], R.prototype, "selected", 2);
+], B.prototype, "selected", 2);
 Ge([
   a({ type: Boolean })
-], R.prototype, "checked", 2);
+], B.prototype, "checked", 2);
 Ge([
   a({ type: Boolean })
-], R.prototype, "disabled", 2);
-R = Ge([
+], B.prototype, "disabled", 2);
+B = Ge([
   d("rtg-dropdown-menu-radio-item")
-], R);
+], B);
 var sl = Object.defineProperty, ol = Object.getOwnPropertyDescriptor, _s = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? ol(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -8299,7 +8300,7 @@ var il = Object.defineProperty, nl = Object.getOwnPropertyDescriptor, He = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && il(t, s, r), r;
 };
-let q = class extends u {
+let R = class extends u {
   constructor() {
     super(...arguments), this._id = "", this._hidden = "", this.selected = !1, this.checked = !1, this.disabled = !1;
   }
@@ -8310,7 +8311,7 @@ let q = class extends u {
     const e = (s = (t = this.parentElement) == null ? void 0 : t.shadowRoot) == null ? void 0 : s.querySelector("div[rtgcmd-group]");
     return e ? this._id = `${e.getAttribute(
       "id"
-    )}li${q._counter++}` : this._id = `rtgcmdrxgxli${q._counter++}`, this._id;
+    )}li${R._counter++}` : this._id = `rtgcmdrxgxli${R._counter++}`, this._id;
   }
   get value() {
     var e;
@@ -8364,8 +8365,8 @@ let q = class extends u {
     `;
   }
 };
-q._counter = 0;
-q.styles = [
+R._counter = 0;
+R.styles = [
   p`
       .icon-space {
         width: 16px; /* Fixed width to reserve space for the check icon */
@@ -8377,25 +8378,25 @@ q.styles = [
 ];
 He([
   a({ type: String })
-], q.prototype, "_id", 2);
+], R.prototype, "_id", 2);
 He([
   a({ attribute: "aria-hidden", type: String })
-], q.prototype, "_hidden", 2);
+], R.prototype, "_hidden", 2);
 He([
   a({ attribute: "data-value", type: String })
-], q.prototype, "value", 1);
+], R.prototype, "value", 1);
 He([
   a({ type: Boolean })
-], q.prototype, "selected", 2);
+], R.prototype, "selected", 2);
 He([
   a({ type: Boolean })
-], q.prototype, "checked", 2);
+], R.prototype, "checked", 2);
 He([
   a({ type: Boolean })
-], q.prototype, "disabled", 2);
-q = He([
+], R.prototype, "disabled", 2);
+R = He([
   d("rtg-dropdown-menu-checkbox-item")
-], q);
+], R);
 var al = Object.defineProperty, ll = Object.getOwnPropertyDescriptor, vr = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? ll(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -9048,7 +9049,7 @@ var Il = Object.defineProperty, zl = Object.getOwnPropertyDescriptor, te = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && Il(t, s, r), r;
 };
-let N = class extends $ {
+let q = class extends $ {
   constructor() {
     super(...arguments), this.value = "", this.key = "", this.tabindex = 0, this.isSelected = !1, this.isFocus = !1, this.class = "", this.selectItemIndex = -1, this.onSelect = (e, t) => {
     }, this.onMouseOver = (e, t) => {
@@ -9099,37 +9100,37 @@ let N = class extends $ {
     `;
   }
 };
-N.styles = [p``, c];
+q.styles = [p``, c];
 te([
   a({ type: String })
-], N.prototype, "value", 2);
+], q.prototype, "value", 2);
 te([
   a({ type: String })
-], N.prototype, "key", 2);
+], q.prototype, "key", 2);
 te([
   a({ type: Number })
-], N.prototype, "tabindex", 2);
+], q.prototype, "tabindex", 2);
 te([
   a({ type: Boolean })
-], N.prototype, "isSelected", 2);
+], q.prototype, "isSelected", 2);
 te([
   a({ type: Boolean })
-], N.prototype, "isFocus", 2);
+], q.prototype, "isFocus", 2);
 te([
   a({ type: String })
-], N.prototype, "class", 2);
+], q.prototype, "class", 2);
 te([
   a({ type: Number })
-], N.prototype, "selectItemIndex", 2);
+], q.prototype, "selectItemIndex", 2);
 te([
   a({ type: Function })
-], N.prototype, "onSelect", 2);
+], q.prototype, "onSelect", 2);
 te([
   a({ type: Function })
-], N.prototype, "onMouseOver", 2);
-N = te([
+], q.prototype, "onMouseOver", 2);
+q = te([
   d("rtg-select-item")
-], N);
+], q);
 var Bl = Object.defineProperty, Rl = Object.getOwnPropertyDescriptor, Cs = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? Rl(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -9184,10 +9185,10 @@ Wr.styles = [p``, c];
 Wr = Tl([
   d("rtg-select-label")
 ], Wr);
-var Vl = Object.defineProperty, Ul = Object.getOwnPropertyDescriptor, Os = (e, t, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? Ul(t, s) : t, i = e.length - 1, n; i >= 0; i--)
+var Ul = Object.defineProperty, Vl = Object.getOwnPropertyDescriptor, Os = (e, t, s, o) => {
+  for (var r = o > 1 ? void 0 : o ? Vl(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
-  return o && r && Vl(t, s, r), r;
+  return o && r && Ul(t, s, r), r;
 };
 let Pe = class extends u {
   constructor() {
@@ -9913,7 +9914,7 @@ var fd = Object.defineProperty, bd = Object.getOwnPropertyDescriptor, me = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && fd(t, s, r), r;
 };
-let T = class extends u {
+let N = class extends u {
   constructor() {
     super(...arguments), this.click = () => {
     }, this.disabled = !1, this.isCustomClass = !1, this.variant = "default", this.size = "default", this.mode = "single", this.selectedStartDate = null, this.selectedEndDate = null;
@@ -9922,7 +9923,7 @@ let T = class extends u {
     const e = ["1", "2", "3", "4", "5", "6"];
     return l`
     <main>
-    <rtg-progress .progressValue="${15}"></rtg-progress>
+    <rtg-progress .value="${50}"></rtg-progress>
     </main>
     <main>
     <rtg-date-picker>
@@ -10396,8 +10397,8 @@ let T = class extends u {
     `;
   }
 };
-T.buttonVariants = vd;
-T.styles = [
+N.buttonVariants = vd;
+N.styles = [
   c,
   p`
       :host {
@@ -10416,31 +10417,31 @@ T.styles = [
 ];
 me([
   a({ type: Function })
-], T.prototype, "click", 2);
+], N.prototype, "click", 2);
 me([
   a({ type: Boolean })
-], T.prototype, "disabled", 2);
+], N.prototype, "disabled", 2);
 me([
   a({ type: String })
-], T.prototype, "isCustomClass", 2);
+], N.prototype, "isCustomClass", 2);
 me([
   a({ type: String })
-], T.prototype, "variant", 2);
+], N.prototype, "variant", 2);
 me([
   a({ type: String })
-], T.prototype, "size", 2);
+], N.prototype, "size", 2);
 me([
   a({ type: String })
-], T.prototype, "mode", 2);
+], N.prototype, "mode", 2);
 me([
   a({ type: Object })
-], T.prototype, "selectedStartDate", 2);
+], N.prototype, "selectedStartDate", 2);
 me([
   a({ type: Object })
-], T.prototype, "selectedEndDate", 2);
-T = me([
+], N.prototype, "selectedEndDate", 2);
+N = me([
   d("rtg-sample-demo")
-], T);
+], N);
 var wd = Object.defineProperty, yd = Object.getOwnPropertyDescriptor, ut = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? yd(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -10758,7 +10759,7 @@ var Sd = Object.defineProperty, Ed = Object.getOwnPropertyDescriptor, Ke = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && Sd(t, s, r), r;
 };
-let V = class extends u {
+let T = class extends u {
   constructor() {
     super(...arguments), this._id = "", this._hidden = "", this.selected = !1, this.checked = !1, this.disabled = !1;
   }
@@ -10767,7 +10768,7 @@ let V = class extends u {
     if (this._id !== "")
       return this._id;
     const e = (s = (t = this.parentElement) == null ? void 0 : t.shadowRoot) == null ? void 0 : s.querySelector("div[rtgcmd-group]");
-    return e ? this._id = `${e.getAttribute("id")}li${V._counter++}` : this._id = `rtgcmdrxgxli${V._counter++}`, this._id;
+    return e ? this._id = `${e.getAttribute("id")}li${T._counter++}` : this._id = `rtgcmdrxgxli${T._counter++}`, this._id;
   }
   get value() {
     var e;
@@ -10812,8 +10813,8 @@ let V = class extends u {
     `;
   }
 };
-V._counter = 0;
-V.styles = [
+T._counter = 0;
+T.styles = [
   p`
       .icon-space {
         width: 16px; /* Fixed width to reserve space for the check icon */
@@ -10825,25 +10826,25 @@ V.styles = [
 ];
 Ke([
   a({ type: String })
-], V.prototype, "_id", 2);
+], T.prototype, "_id", 2);
 Ke([
   a({ attribute: "aria-hidden", type: String })
-], V.prototype, "_hidden", 2);
+], T.prototype, "_hidden", 2);
 Ke([
   a({ attribute: "data-value", type: String })
-], V.prototype, "value", 1);
+], T.prototype, "value", 1);
 Ke([
   a({ type: Boolean })
-], V.prototype, "selected", 2);
+], T.prototype, "selected", 2);
 Ke([
   a({ type: Boolean })
-], V.prototype, "checked", 2);
+], T.prototype, "checked", 2);
 Ke([
   a({ type: Boolean })
-], V.prototype, "disabled", 2);
-V = Ke([
+], T.prototype, "disabled", 2);
+T = Ke([
   d("rtg-menubar-radio-item")
-], V);
+], T);
 var kd = Object.defineProperty, Dd = Object.getOwnPropertyDescriptor, We = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? Dd(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -11151,10 +11152,10 @@ ht([
 ue = ht([
   d("rtg-navigation-menu-content")
 ], ue);
-var Vd = Object.defineProperty, Ud = Object.getOwnPropertyDescriptor, Ze = (e, t, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? Ud(t, s) : t, i = e.length - 1, n; i >= 0; i--)
+var Ud = Object.defineProperty, Vd = Object.getOwnPropertyDescriptor, Ze = (e, t, s, o) => {
+  for (var r = o > 1 ? void 0 : o ? Vd(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
-  return o && r && Vd(t, s, r), r;
+  return o && r && Ud(t, s, r), r;
 };
 let Q = class extends u {
   constructor() {
@@ -11417,7 +11418,7 @@ var Zd = Object.defineProperty, Jd = Object.getOwnPropertyDescriptor, Je = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && Zd(t, s, r), r;
 };
-let F = class extends u {
+let V = class extends u {
   constructor() {
     super(...arguments), this.state = "close", this.twClass = "", this.isActive = !1, this.size = "icon", this.variant = "ghost", this.href = "javascript:void(0)";
   }
@@ -11433,7 +11434,7 @@ let F = class extends u {
         href="${this.href}"
         aria-current="${this.isActive ? "page" : void 0}"
         class="${h(
-      F.paginationVariants({
+      V.paginationVariants({
         variant: this.isActive ? "outline" : "ghost",
         size: this.size,
         className: this.className
@@ -11446,29 +11447,29 @@ let F = class extends u {
     `;
   }
 };
-F.styles = [p``, c];
-F.paginationVariants = Wd;
+V.styles = [p``, c];
+V.paginationVariants = Wd;
 Je([
   a({ attribute: "data-state", type: String })
-], F.prototype, "state", 2);
+], V.prototype, "state", 2);
 Je([
   a({ type: String })
-], F.prototype, "twClass", 2);
+], V.prototype, "twClass", 2);
 Je([
   a({ type: Boolean })
-], F.prototype, "isActive", 2);
+], V.prototype, "isActive", 2);
 Je([
   a({ type: String })
-], F.prototype, "size", 2);
+], V.prototype, "size", 2);
 Je([
   a({ type: String })
-], F.prototype, "variant", 2);
+], V.prototype, "variant", 2);
 Je([
   a({ type: String })
-], F.prototype, "href", 2);
-F = Je([
+], V.prototype, "href", 2);
+V = Je([
   d("rtg-pagination-link")
-], F);
+], V);
 var Qd = Object.defineProperty, ec = Object.getOwnPropertyDescriptor, _r = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? ec(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -11483,7 +11484,7 @@ let dt = class extends u {
     const e = (s = this.shadowRoot) == null ? void 0 : s.querySelector("slot"), t = e == null ? void 0 : e.assignedElements();
     if (t) {
       for (let o = 0; o < t.length; o++)
-        if (t[o] instanceof F)
+        if (t[o] instanceof V)
           return t[o];
     }
     return null;
@@ -11978,7 +11979,7 @@ var uc = Object.defineProperty, hc = Object.getOwnPropertyDescriptor, ve = (e, t
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
   return o && r && uc(t, s, r), r;
 };
-let j = class extends u {
+let F = class extends u {
   constructor() {
     super(...arguments), this.currentDate = /* @__PURE__ */ new Date(), this.selectedStartDate = null, this.selectedEndDate = null, this.variant = "outline", this.size = "default", this.styleCalendar = !1, this.twCLass = "", this.mode = "single";
   }
@@ -12032,7 +12033,7 @@ let j = class extends u {
       <div
         part="calendar"
         class="${h(
-      "p-3 rounded-md border shadow",
+      "p-3 rounded-md border shadow bg-popover",
       this.styleCalendar ? "styled-calendar" : "",
       this.className,
       this.twCLass
@@ -12046,13 +12047,7 @@ let j = class extends u {
               <div class="space-x-1 flex items-center">
                 <button
                   style="width:1.75rem"
-                  class="${h(
-      j.buttonVariants({
-        variant: this.variant,
-        size: this.size,
-        className: this.className
-      })
-    ), "nav-button absolute left-2"}"
+                  class="nav-button text-muted-foreground absolute left-2 inline-flex items-center justify-center whitespace-nowrap rounded-sm text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-transparent shadow-sm hover:bg-accent hover:text-accent-foreground h-7 w-7 p-0"
                   @click="${this.previousMonth}"
                 >
                   <svg
@@ -12065,8 +12060,8 @@ let j = class extends u {
                     stroke-width="2"
                     stroke-linecap="round"
                     stroke-linejoin="round"
-                    style="width:1.2rem;height:1.2rem;margin-left:-4px"
-                    class="lucide lucide-chevron-left rdp-nav_icon"
+                    style="width:1.2rem;height:1.2rem;"
+                    class="lucide lucide-chevron-left rdp-nav_icon hover:text-muted-foreground"
                   >
                     <path d="m15 18-6-6 6-6"></path>
                   </svg>
@@ -12079,13 +12074,7 @@ let j = class extends u {
                 </div>
                 <button
                   style="width:1.75rem"
-                  class="${h(
-      j.buttonVariants({
-        variant: this.variant,
-        size: this.size,
-        className: this.className
-      })
-    ), "nav-button absolute right-1"}"
+                  class="nav-button absolute right-1 text-muted-foreground inline-flex items-center justify-center whitespace-nowrap rounded-sm text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-transparent shadow-sm hover:bg-accent hover:text-accent-foreground h-7 w-7 p-0"
                   @click="${this.nextMonth}"
                 >
                   <svg
@@ -12098,8 +12087,8 @@ let j = class extends u {
                     stroke-width="2"
                     stroke-linecap="round"
                     stroke-linejoin="round"
-                    style="width:1.2rem;height:1.2rem;margin-left:-4px"
-                    class="lucide lucide-chevron-right rdp-nav_icon"
+                    style="width:1.2rem;height:1.2rem;"
+                    class="lucide lucide-chevron-right rdp-nav_icon hover:text-muted-foreground"
                   >
                     <path d="m9 18 6-6-6-6"></path>
                   </svg>
@@ -12176,11 +12165,11 @@ let j = class extends u {
     `;
   }
 };
-j.styles = [
+F.styles = [
   p`
       :host {
         display: inline-block;
-        font-family: Arial, sans-serif;
+
         border: 1px solid #e0e0e0;
         border-radius: 8px;
         padding: 8px;
@@ -12224,34 +12213,34 @@ j.styles = [
     `,
   c
 ];
-j.buttonVariants = pc;
+F.buttonVariants = pc;
 ve([
   a({ type: Object })
-], j.prototype, "currentDate", 2);
+], F.prototype, "currentDate", 2);
 ve([
   a({ type: Object })
-], j.prototype, "selectedStartDate", 2);
+], F.prototype, "selectedStartDate", 2);
 ve([
   a({ type: Object })
-], j.prototype, "selectedEndDate", 2);
+], F.prototype, "selectedEndDate", 2);
 ve([
   a({ type: String })
-], j.prototype, "variant", 2);
+], F.prototype, "variant", 2);
 ve([
   a({ type: String })
-], j.prototype, "size", 2);
+], F.prototype, "size", 2);
 ve([
   a({ type: Boolean })
-], j.prototype, "styleCalendar", 2);
+], F.prototype, "styleCalendar", 2);
 ve([
   a({ type: String })
-], j.prototype, "twCLass", 2);
+], F.prototype, "twCLass", 2);
 ve([
   a({ type: String })
-], j.prototype, "mode", 2);
-j = ve([
+], F.prototype, "mode", 2);
+F = ve([
   d("rtg-calendar")
-], j);
+], F);
 var gc = Object.defineProperty, mc = Object.getOwnPropertyDescriptor, Ls = (e, t, s, o) => {
   for (var r = o > 1 ? void 0 : o ? mc(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
@@ -12262,7 +12251,7 @@ let It = class extends u {
     super(...arguments), this.twCLass = "", this.selectedDate = null;
   }
   handleDateSelected(e) {
-    this.selectedDate = e.detail.date, this.requestUpdate();
+    this.selectedDate = e.detail.startDate, this.requestUpdate();
   }
   render() {
     return l`
@@ -12275,7 +12264,7 @@ let It = class extends u {
           <!-- Trigger to open/close the popover -->
           <rtg-popover-trigger slot="trigger">
             <rtg-button
-              class="w-64 justify-start text-left font-normal text-muted-foreground"
+              class="w-64 justify-start text-left text-sm font-normal bg-background hover:bg-accent text-muted-foreground hover:text-muted-foreground"
               variant="outline"
               slot="trigger-button"
             >
@@ -12340,18 +12329,13 @@ var vc = Object.defineProperty, fc = Object.getOwnPropertyDescriptor, As = (e, t
 };
 let zt = class extends u {
   constructor() {
-    super(...arguments), this.twClass = "", this.progressValue = 15;
-  }
-  firstUpdated() {
-    setTimeout(() => {
-      this.progressValue = 65;
-    }, 500);
+    super(...arguments), this.twClass = "", this.value = 15;
   }
   render() {
     return l`
       <div
         part="progress"
-        aria-valuenow="${this.progressValue}"
+        aria-valuenow="${this.value}"
         aria-valuemax="100"
         aria-valuemin="0"
         role="progressbar"
@@ -12368,23 +12352,31 @@ let zt = class extends u {
           data-state="indeterminate"
           data-max="100"
           class="${h(
-      "h-full w-full flex-1 bg-primary transition-all duration-500",
+      "progress-bar__fill h-full w-full flex-1 bg-primary",
       this.className,
       this.twClass
     )}"
-          style="width: ${this.progressValue}%;"
+          style="width: ${this.value}%;"
         ></div>
       </div>
     `;
   }
 };
-zt.styles = [p``, c];
+zt.styles = [
+  p`
+      .progress-bar__fill {
+        height: 100%;
+        transition: width 0.5s ease-in-out;
+      }
+    `,
+  c
+];
 As([
   a({ type: String })
 ], zt.prototype, "twClass", 2);
 As([
   a({ type: Number })
-], zt.prototype, "progressValue", 2);
+], zt.prototype, "value", 2);
 zt = As([
   d("rtg-progress")
 ], zt);
@@ -12582,10 +12574,10 @@ os.styles = [p``, c];
 os = Tc([
   d("rtg-bread-crumb-text")
 ], os);
-var Vc = Object.defineProperty, Uc = Object.getOwnPropertyDescriptor, Eo = (e, t, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? Uc(t, s) : t, i = e.length - 1, n; i >= 0; i--)
+var Uc = Object.defineProperty, Vc = Object.getOwnPropertyDescriptor, Eo = (e, t, s, o) => {
+  for (var r = o > 1 ? void 0 : o ? Vc(t, s) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (r = (o ? n(t, s, r) : n(r)) || r);
-  return o && r && Vc(t, s, r), r;
+  return o && r && Uc(t, s, r), r;
 };
 let ir = class extends $ {
   constructor() {
@@ -12851,8 +12843,8 @@ export {
   Dr as AlertTitle,
   xt as AspectRatio,
   ye as Badge,
-  M as Button,
-  j as Calendar,
+  A as Button,
+  F as Calendar,
   Rr as Card,
   Br as CardContent,
   zr as CardDescription,
@@ -12863,11 +12855,11 @@ export {
   oe as Checkbox,
   D as ComboBox,
   $t as ContextMenu,
-  I as ContextMenuCheckboxItem,
+  M as ContextMenuCheckboxItem,
   rt as ContextMenuContent,
   ie as ContextMenuGroup,
   X as ContextMenuItem,
-  z as ContextMenuRadioItem,
+  I as ContextMenuRadioItem,
   xe as ContextMenuSeparator,
   Tr as ContextMenuShortcut,
   It as DatePicker,
@@ -12878,11 +12870,11 @@ export {
   St as DialogHeader,
   Yr as DialogOverlay,
   Et as DropdownMenu,
-  q as DropdownMenuCheckboxItem,
+  R as DropdownMenuCheckboxItem,
   ot as DropdownMenuContent,
   ae as DropdownMenuGroup,
   W as DropdownMenuItem,
-  R as DropdownMenuRadioItem,
+  B as DropdownMenuRadioItem,
   Ce as DropdownMenuSeparator,
   le as Input,
   Zt as Menubar,
@@ -12891,7 +12883,7 @@ export {
   pe as MenubarGroup,
   J as MenubarItem,
   ce as MenubarMenu,
-  V as MenubarRadioItem,
+  T as MenubarRadioItem,
   ke as MenubarSeparator,
   Jr as MenubarShortcut,
   Qt as NavigationMenu,
@@ -12903,7 +12895,7 @@ export {
   er as PaginationContent,
   tr as PaginationEllipsis,
   dt as PaginationItem,
-  F as PaginationLink,
+  V as PaginationLink,
   rr as PaginationNext,
   sr as PaginationPrevious,
   at as Popover,
@@ -12913,7 +12905,7 @@ export {
   Kt as RadioGroup,
   Oe as RadioGroupItem,
   de as Select,
-  N as SelectItem,
+  q as SelectItem,
   Wr as SelectLabel,
   Dt as SelectList,
   Pe as SelectSeperator,