@dimasbaguspm/versaur 0.0.56 → 0.0.57

package/dist/js/index.js

@@ -1,10 +1,10 @@
 import { L as e, P as t, S as r } from "./skeleton-BNZyaRjo.js";
-import { A as n, a as u, B as p, b as i, F as c, e as l, c as I, P as B, d, S, T as m } from "./top-bar-Dqje-W3G.js";
+import { A as n, a as u, B as p, b as i, F as c, e as l, c as I, P as B, d, S, T as m } from "./top-bar-Do2JqSqe.js";
 import { C as T, b, a as x, D as A, E as h, P, c as C, R as f, S as k, d as M, f as F, e as L, g as D, i as H, T as R, h as G, j } from "./time-picker-input-BgbyllDK.js";
 import { B as v, D as w, M as E, T as N } from "./tooltip-nZW9TUz3.js";
 import { A as z, a as J, b as K, c as O, d as Q, e as U, f as V, B as W, s as X, g as Y, h as Z, i as _, l as $, j as aa, k as sa, C as ea, F as ta, H as ra, m as oa, I as na, p as ua, r as pa, q as ia, M as ca, N as la, T as Ia, n as Ba, o as da } from "./image-rectangle-K9jmTTED.js";
 import { S as ma } from "./snackbar-DH8jCh2V.js";
-import { B as Ta, T as ba } from "./tabs-I4n6MLAv.js";
+import { B as Ta, T as ba } from "./tabs-CmfJNCe6.js";
 import { S as Aa, u as ha } from "./use-snackbars-Cou8L41F.js";
 export {
   z as Accordion,

package/dist/js/layouts/index.js

@@ -1,4 +1,4 @@
-import { A as r, a as e, B as s, b as t, F as p, e as B, c as d, P as u, d as g, S as P, T as i } from "../top-bar-Dqje-W3G.js";
+import { A as r, a as e, B as s, b as t, F as p, e as B, c as d, P as u, d as g, S as P, T as i } from "../top-bar-Do2JqSqe.js";
 export {
   r as AppBar,
   e as BadgeGroup,

package/dist/js/navigation/index.js

@@ -1,4 +1,4 @@
-import { B as s, T as b } from "../tabs-I4n6MLAv.js";
+import { B as s, T as b } from "../tabs-CmfJNCe6.js";
 export {
   s as Breadcrumbs,
   b as Tabs

package/dist/js/{tabs-I4n6MLAv.js → tabs-CmfJNCe6.js}

@@ -1,21 +1,21 @@
-import { c as l, j as t, a as b } from "./index-DOdDlCoL.js";
+import { c as d, j as t, a as f } from "./index-DOdDlCoL.js";
 import { forwardRef as m, createContext as p, useContext as h, useState as g, useLayoutEffect as j, useRef as T } from "react";
 import { I as w } from "./image-rectangle-K9jmTTED.js";
 import "./snackbar-DH8jCh2V.js";
 import { ChevronRight as y } from "lucide-react";
-const I = l(
+const I = d(
   "flex items-center gap-2 text-sm text-gray-500"
-), C = l(
+), C = d(
   "inline-flex items-center gap-1 transition-colors hover:underline cursor-pointer"
-), N = m(function({ children: s, icon: n, isCurrent: a, className: r, ...i }, o) {
+), N = m(function({ children: s, icon: n, isCurrent: a, className: r, ...o }, i) {
   return /* @__PURE__ */ t.jsx("li", { className: "flex items-center", children: /* @__PURE__ */ t.jsxs(
     "a",
     {
-      ref: o,
+      ref: i,
       "aria-current": a ? "page" : void 0,
       tabIndex: a ? -1 : 0,
-      className: b(C(), r),
-      ...i,
+      className: f(C(), r),
+      ...o,
       children: [
         n && /* @__PURE__ */ t.jsx("span", { className: "mr-1 inline-flex", children: n }),
         s
@@ -30,20 +30,20 @@ const R = m(
   function({ children: s, "aria-label": n = "Breadcrumb", ...a }, r) {
     return /* @__PURE__ */ t.jsx("nav", { "aria-label": n, ...a, children: /* @__PURE__ */ t.jsx("ol", { ref: r, className: I(), children: s }) });
   }
-), W = Object.assign(R, {
+), D = Object.assign(R, {
   Item: N,
   Separator: B
-}), f = p(null), S = () => {
-  const e = h(f);
+}), x = p(null), S = () => {
+  const e = h(x);
   if (!e)
     throw new Error("useTabsContext must be used within a TabsProvider");
   return e;
-}, E = l(
+}, E = d(
   [
-    "inline-flex items-center justify-center",
+    "flex items-center justify-center",
     "px-4 py-2",
     "text-sm font-normal",
-    "text-foreground",
+    "text-foreground text-center",
     "transition-all duration-200",
     "border-b-2 border-transparent",
     "select-none",
@@ -63,20 +63,25 @@ const R = m(
       active: {
         true: "text-primary font-medium",
         false: "hover:text-primary"
+      },
+      fullWidth: {
+        true: "flex-1 w-full",
+        false: ""
       }
     },
     defaultVariants: {
-      active: !1
+      active: !1,
+      fullWidth: !1
     }
   }
-), L = l([
+), L = d([
   "flex flex-row w-full",
   "border-b border-border",
   "overflow-x-auto overflow-y-visible",
   "whitespace-nowrap",
   // Ensure focus rings with offset are not cropped (2px ring + 2px offset = 4px needed)
   "py-1"
-]), V = l([
+]), V = d([
   "absolute bottom-0",
   "h-0.5 rounded",
   "bg-primary",
@@ -89,10 +94,10 @@ const R = m(
   onClick: a,
   ...r
 }) => {
-  const { activeTab: i, setActiveTab: o } = S(), c = i === e, d = (u) => {
-    u.preventDefault(), o(e), a?.(u);
+  const { activeTab: o, setActiveTab: i, fullWidth: l } = S(), c = o === e, b = (u) => {
+    u.preventDefault(), i(e), a?.(u);
   };
-  return /* @__PURE__ */ t.jsx("li", { role: "presentation", children: /* @__PURE__ */ t.jsx(
+  return /* @__PURE__ */ t.jsx("li", { role: "presentation", className: l ? "flex-1" : void 0, children: /* @__PURE__ */ t.jsx(
     "a",
     {
       role: "tab",
@@ -101,13 +106,14 @@ const R = m(
       "aria-controls": `tabs-content-${e}`,
       "aria-current": c ? "page" : void 0,
       href: `#${e}`,
-      className: b(
+      className: f(
         E({
-          active: c
+          active: c,
+          fullWidth: l
         }),
         n
       ),
-      onClick: d,
+      onClick: b,
       ...r,
       children: s
     }
@@ -121,7 +127,7 @@ const R = m(
   "div",
   {
     "aria-hidden": "true",
-    className: b(V(), n),
+    className: f(V(), n),
     style: {
       left: e,
       width: s
@@ -129,7 +135,7 @@ const R = m(
     ...a
   }
 );
-function $(e, s) {
+function W(e, s) {
   const [n, a] = g({
     left: 0,
     width: 0
@@ -137,57 +143,59 @@ function $(e, s) {
   return j(() => {
     const r = s.current;
     if (!r) return;
-    const i = r.querySelector(
+    const o = r.querySelector(
       `a#tabs-trigger-${e}`
     );
-    if (!i) return;
-    const o = i.parentElement;
     if (!o) return;
-    const c = () => {
-      const x = o.offsetLeft - r.scrollLeft, v = o.offsetWidth;
-      a({ left: x, width: v });
+    const i = o.parentElement;
+    if (!i) return;
+    const l = () => {
+      const u = i.offsetLeft - r.scrollLeft, v = i.offsetWidth;
+      a({ left: u, width: v });
     };
-    c();
-    const d = () => {
-      c();
+    l();
+    const c = () => {
+      l();
     };
-    r.addEventListener("scroll", d, { passive: !0 });
-    const u = requestAnimationFrame(() => {
-      i.scrollIntoView({
+    r.addEventListener("scroll", c, { passive: !0 });
+    const b = requestAnimationFrame(() => {
+      o.scrollIntoView({
         behavior: "smooth",
         inline: "center",
         block: "nearest"
       });
     });
     return () => {
-      cancelAnimationFrame(u), r.removeEventListener("scroll", d);
+      cancelAnimationFrame(b), r.removeEventListener("scroll", c);
     };
   }, [e, s]), n;
 }
-const q = ({
+const $ = ({
   value: e,
   onValueChange: s,
   children: n,
   className: a,
-  ...r
+  fullWidth: r = !1,
+  ...o
 }) => {
   const i = {
     activeTab: e,
-    setActiveTab: s
-  }, o = T(null), c = $(e, o);
-  return /* @__PURE__ */ t.jsx(f.Provider, { value: i, children: /* @__PURE__ */ t.jsx(
+    setActiveTab: s,
+    fullWidth: r
+  }, l = T(null), c = W(e, l);
+  return /* @__PURE__ */ t.jsx(x.Provider, { value: i, children: /* @__PURE__ */ t.jsx(
     "nav",
     {
-      className: b("relative w-full", a),
+      className: f("relative w-full", a),
       "aria-label": "Tabs",
-      ...r,
+      ...o,
       children: /* @__PURE__ */ t.jsxs("div", { className: "relative overflow-hidden", children: [
         /* @__PURE__ */ t.jsx(
           "ul",
           {
             role: "tablist",
             className: L(),
-            ref: o,
+            ref: l,
             children: n
           }
         ),
@@ -201,10 +209,10 @@ const q = ({
       ] })
     }
   ) });
-}, G = Object.assign(q, {
+}, G = Object.assign($, {
   Trigger: A
 });
 export {
-  W as B,
+  D as B,
   G as T
 };

package/dist/js/{top-bar-Dqje-W3G.js → top-bar-Do2JqSqe.js}

@@ -1,10 +1,10 @@
-import { c as i, j as t, a as l } from "./index-DOdDlCoL.js";
-import * as v from "react";
+import { c as l, j as t, a as i } from "./index-DOdDlCoL.js";
+import * as b from "react";
 import { forwardRef as o } from "react";
-import { n as f } from "./image-rectangle-K9jmTTED.js";
+import { n as x } from "./image-rectangle-K9jmTTED.js";
 import "./snackbar-DH8jCh2V.js";
 import { L as y } from "./skeleton-BNZyaRjo.js";
-const w = i(
+const w = l(
   "w-full flex flex-wrap items-center pt-3 mb-3 gap-2 bg-white [&>[data-versaur-appbar-bottom]]:basis-full [&>[data-versaur-appbar-bottom]]:w-full [&:has([data-versaur-appbar-bottom])>[data-versaur-appbar-leading]]:pl-4 [&:has([data-versaur-appbar-bottom])>[data-versaur-appbar-trailing]]:pr-4 [&:not(:has([data-versaur-appbar-bottom]))]:px-4",
   {
     variants: {
@@ -20,7 +20,7 @@ const w = i(
       variant: "primary"
     }
   }
-), B = i(
+), B = l(
   "flex flex-col justify-center min-w-0 flex-grow",
   {
     variants: {
@@ -40,7 +40,7 @@ const w = i(
     {
       ref: e,
       "data-versaur-appbar-bottom": !0,
-      className: l("w-full flex items-center min-h-[2.5rem] mt-2", a),
+      className: i("w-full flex items-center min-h-[2.5rem] mt-2", a),
       children: s
     }
   )
@@ -49,13 +49,13 @@ const w = i(
     "div",
     {
       ref: e,
-      className: l("flex items-center", a),
+      className: i("flex items-center", a),
       "data-versaur-appbar-leading": !0,
       children: s
     }
   )
 ), z = o(({ children: s, ...a }, e) => /* @__PURE__ */ t.jsx(
-  f,
+  x,
   {
     ...a,
     as: "h1",
@@ -67,7 +67,7 @@ const w = i(
     children: s
   }
 )), S = o(({ children: s, ...a }, e) => /* @__PURE__ */ t.jsx(
-  f,
+  x,
   {
     ...a,
     ref: e,
@@ -84,7 +84,7 @@ const w = i(
     "div",
     {
       ref: e,
-      className: l("flex items-center justify-end gap-2", a),
+      className: i("flex items-center justify-end gap-2", a),
       "data-versaur-appbar-trailing": !0,
       children: s
     }
@@ -94,7 +94,7 @@ const w = i(
     "div",
     {
       ref: r,
-      className: l(B({ placement: e }), a),
+      className: i(B({ placement: e }), a),
       children: s
     }
   )
@@ -105,7 +105,7 @@ const w = i(
 }) => /* @__PURE__ */ t.jsx(
   "header",
   {
-    className: l(w({ variant: e }), a),
+    className: i(w({ variant: e }), a),
     role: "banner",
     children: s
   }
@@ -116,7 +116,7 @@ const w = i(
   Trailing: T,
   Center: C,
   Bottom: N
-}), L = i(
+}), L = l(
   "sticky bottom-0 w-full flex justify-around items-center bg-white border-t border-border shadow-xs z-40 safe-bottom gap-4 select-none px-8",
   {
     variants: {
@@ -138,7 +138,7 @@ const w = i(
       size: "md"
     }
   }
-), A = i(
+), A = l(
   "flex flex-col items-center justify-center gap-1",
   {
     variants: {
@@ -165,10 +165,10 @@ const w = i(
     className: n,
     children: c,
     ...d
-  }, m) => /* @__PURE__ */ t.jsxs(
+  }, u) => /* @__PURE__ */ t.jsxs(
     s,
     {
-      ref: m,
+      ref: u,
       "aria-current": r ? "page" : void 0,
       className: A({ active: r, className: n, as: s }),
       ...d,
@@ -196,7 +196,7 @@ const w = i(
   }
 ), Aa = Object.assign(I, {
   Item: P
-}), R = i("flex flex-wrap items-center", {
+}), R = l("flex items-center", {
   variants: {
     orientation: {
       horizontal: "flex-row",
@@ -220,13 +220,18 @@ const w = i(
     fluid: {
       true: "[&>*]:flex-1",
       false: ""
+    },
+    overlay: {
+      true: "flex-nowrap overflow-x-auto",
+      false: "flex-wrap"
     }
   },
   defaultVariants: {
     orientation: "horizontal",
     alignment: "start",
     gap: "md",
-    fluid: !1
+    fluid: !1,
+    overlay: !1
   }
 }), Pa = o(
   function({
@@ -236,30 +241,32 @@ const w = i(
     alignment: n = "start",
     gap: c = "md",
     fluid: d = !1,
-    hasMargin: m,
-    ...p
-  }, u) {
+    hasMargin: u,
+    overlay: p = !1,
+    ...m
+  }, f) {
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: u,
-        className: l(
+        ref: f,
+        className: i(
           R({
             orientation: r,
             alignment: n,
             gap: c,
-            fluid: d
+            fluid: d,
+            overlay: p
           }),
-          m && "mb-4",
+          u && "mb-4",
           a
         ),
         role: "group",
-        ...p,
+        ...m,
         children: e
       }
     );
   }
-), G = i("flex flex-wrap items-center", {
+), G = l("flex items-center", {
   variants: {
     orientation: {
       horizontal: "flex-row",
@@ -283,13 +290,18 @@ const w = i(
     fluid: {
       true: "[&>*]:flex-1",
       false: ""
+    },
+    overlay: {
+      true: "flex-nowrap overflow-x-auto",
+      false: "flex-wrap"
     }
   },
   defaultVariants: {
     orientation: "horizontal",
     alignment: "start",
     gap: "md",
-    fluid: !1
+    fluid: !1,
+    overlay: !1
   }
 }), Ia = o(
   function({
@@ -299,30 +311,32 @@ const w = i(
     alignment: n = "start",
     gap: c = "md",
     fluid: d = !1,
-    hasMargin: m,
-    ...p
-  }, u) {
+    hasMargin: u,
+    overlay: p = !1,
+    ...m
+  }, f) {
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: u,
-        className: l(
+        ref: f,
+        className: i(
           G({
             orientation: r,
             alignment: n,
             gap: c,
-            fluid: d
+            fluid: d,
+            overlay: p
           }),
-          m && "mb-4",
+          u && "mb-4",
           a
         ),
         role: "group",
-        ...p,
+        ...m,
         children: e
       }
     );
   }
-), k = i("flex flex-wrap items-center", {
+), k = l("flex items-center", {
   variants: {
     orientation: {
       horizontal: "flex-row",
@@ -346,13 +360,18 @@ const w = i(
     fluid: {
       true: "[&>*]:flex-1",
       false: ""
+    },
+    overlay: {
+      true: "flex-nowrap overflow-x-auto",
+      false: "flex-wrap"
     }
   },
   defaultVariants: {
     orientation: "horizontal",
     alignment: "start",
     gap: "md",
-    fluid: !1
+    fluid: !1,
+    overlay: !1
   }
 }), Ra = o(
   function({
@@ -362,30 +381,32 @@ const w = i(
     alignment: n = "start",
     gap: c = "md",
     fluid: d = !1,
-    hasMargin: m,
-    ...p
-  }, u) {
+    hasMargin: u,
+    overlay: p = !1,
+    ...m
+  }, f) {
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: u,
-        className: l(
+        ref: f,
+        className: i(
           k({
             orientation: r,
             alignment: n,
             gap: c,
-            fluid: d
+            fluid: d,
+            overlay: p
           }),
-          m && "mb-4",
+          u && "mb-4",
           a
         ),
         role: "group",
-        ...p,
+        ...m,
         children: e
       }
     );
   }
-), F = i("w-full mb-4", {
+), F = l("w-full mb-4", {
   variants: {
     backgroundColor: {
       white: "bg-white",
@@ -395,7 +416,7 @@ const w = i(
   defaultVariants: {
     backgroundColor: "white"
   }
-}), O = i("w-full mx-auto pt-4 md:pt-10", {
+}), O = l("w-full mx-auto pt-4 md:pt-10", {
   variants: {
     size: {
       fluid: "max-w-full px-0",
@@ -406,20 +427,20 @@ const w = i(
   defaultVariants: {
     size: "fluid"
   }
-}), W = i(
+}), W = l(
   "flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4 mb-4"
-), M = i("mb-4"), E = i(
+), M = l("mb-4"), E = l(
   "flex-1 min-w-0 flex flex-col gap-2 w-full sm:w-auto"
-), $ = i("flex items-center gap-2 flex-wrap"), q = i(
+), $ = l("flex items-center gap-2 flex-wrap"), q = l(
   "hidden md:flex  flex-col sm:flex-row gap-2 sm:gap-3 w-full w-auto sm:ml-auto sm:shrink-0 [&>*]:w-full sm:[&>*]:w-auto"
-), D = i("md:hidden"), J = i(
+), D = l("md:hidden"), J = l(
   "w-full flex items-center py-0 overflow-x-auto"
 ), K = o(
   ({ children: s, className: a, ...e }, r) => /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: r,
-      className: l(W(), a),
+      className: i(W(), a),
       "data-versaur-page-header-top": !0,
       ...e,
       children: s
@@ -429,7 +450,7 @@ const w = i(
   "div",
   {
     ref: r,
-    className: l(M(), a),
+    className: i(M(), a),
     "data-versaur-page-header-breadcrumbs": !0,
     ...e,
     children: s
@@ -438,13 +459,13 @@ const w = i(
   "div",
   {
     ref: r,
-    className: l(E(), a),
+    className: i(E(), a),
     "data-versaur-page-header-content": !0,
     ...e,
     children: s
   }
 )), X = o((s, a) => /* @__PURE__ */ t.jsx(
-  f,
+  x,
   {
     ...s,
     as: "h1",
@@ -454,21 +475,21 @@ const w = i(
     ref: a
   }
 )), Y = o(({ className: s, ...a }, e) => /* @__PURE__ */ t.jsx(
-  f,
+  x,
   {
     as: "p",
     fontSize: "sm",
     fontWeight: "normal",
     clamp: 2,
     ref: e,
-    className: l("mb-2 sm:clamp-3", s),
+    className: i("mb-2 sm:clamp-3", s),
     ...a
   }
 )), Z = o(({ children: s, className: a, ...e }, r) => /* @__PURE__ */ t.jsx(
   "div",
   {
     ref: r,
-    className: l($(), a),
+    className: i($(), a),
     "data-versaur-page-header-badges": !0,
     ...e,
     children: s
@@ -477,7 +498,7 @@ const w = i(
   "div",
   {
     ref: r,
-    className: l(q(), a),
+    className: i(q(), a),
     "data-versaur-page-header-actions": !0,
     ...e,
     children: s
@@ -486,7 +507,7 @@ const w = i(
   "div",
   {
     ref: r,
-    className: l(D(), a),
+    className: i(D(), a),
     "data-versaur-page-header-mobile-actions": !0,
     ...e,
     children: s
@@ -495,7 +516,7 @@ const w = i(
   "div",
   {
     ref: r,
-    className: l(J(), a),
+    className: i(J(), a),
     "data-versaur-page-header-bottom": !0,
     ...e,
     children: s
@@ -509,40 +530,40 @@ const w = i(
     title: n,
     subtitle: c,
     breadcrumbs: d,
-    badges: m,
+    badges: u,
     actions: p,
-    mobileActions: u,
-    tabs: x,
+    mobileActions: m,
+    tabs: f,
     ...g
   }, h) => {
-    const j = x;
+    const j = f;
     return /* @__PURE__ */ t.jsx(
       "header",
       {
         ref: h,
-        className: l(F({ backgroundColor: r })),
+        className: i(F({ backgroundColor: r })),
         role: "banner",
         ...g,
-        children: /* @__PURE__ */ t.jsxs("div", { className: l(O({ size: e }), a), children: [
+        children: /* @__PURE__ */ t.jsxs("div", { className: i(O({ size: e }), a), children: [
           d && /* @__PURE__ */ t.jsx(Q, { children: d }),
           /* @__PURE__ */ t.jsxs(K, { children: [
             /* @__PURE__ */ t.jsxs(U, { children: [
               /* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between", children: [
                 /* @__PURE__ */ t.jsx(X, { children: n }),
-                u && /* @__PURE__ */ t.jsx(aa, { children: u })
+                m && /* @__PURE__ */ t.jsx(aa, { children: m })
               ] }),
               c && /* @__PURE__ */ t.jsx(Y, { children: c }),
-              m && /* @__PURE__ */ t.jsx(Z, { children: m })
+              u && /* @__PURE__ */ t.jsx(Z, { children: u })
             ] }),
             p && /* @__PURE__ */ t.jsx(_, { children: p })
           ] }),
-          j && /* @__PURE__ */ t.jsx(ea, { children: x }),
+          j && /* @__PURE__ */ t.jsx(ea, { children: f }),
           s
         ] })
       }
     );
   }
-), Ga = ta, sa = i("w-full", {
+), Ga = ta, sa = l("w-full", {
   variants: {
     backgroundColor: {
       white: "bg-white",
@@ -552,7 +573,7 @@ const w = i(
   defaultVariants: {
     backgroundColor: "white"
   }
-}), ra = i("w-full mx-auto relative", {
+}), ra = l("w-full mx-auto relative", {
   variants: {
     size: {
       fluid: "max-w-full px-0",
@@ -570,7 +591,7 @@ const w = i(
     size: "fluid",
     template: "single-column"
   }
-}), ka = v.forwardRef(
+}), ka = b.forwardRef(
   function({
     size: a = "fluid",
     template: e = "single-column",
@@ -578,17 +599,17 @@ const w = i(
     className: n,
     children: c,
     ...d
-  }, m) {
+  }, u) {
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: m,
-        className: l(sa({ backgroundColor: r })),
+        ref: u,
+        className: i(sa({ backgroundColor: r })),
         ...d,
         children: /* @__PURE__ */ t.jsx(
           "div",
           {
-            className: l(
+            className: i(
               ra({ size: a, template: e }),
               n
             ),
@@ -598,7 +619,7 @@ const w = i(
       }
     );
   }
-), na = i(
+), na = l(
   [
     // Base styles: flex container that centers content
     "flex",
@@ -634,12 +655,12 @@ const w = i(
       fullscreen: !1
     }
   }
-), oa = i([
+), oa = l([
   "text-foreground-light",
   "text-sm",
   "text-center",
   "max-w-xs"
-]), Fa = v.forwardRef(
+]), Fa = b.forwardRef(
   function({
     type: a = "bar",
     size: e = "sm",
@@ -647,17 +668,17 @@ const w = i(
     ariaLabel: n = "Loading page",
     message: c,
     fullscreen: d = !1,
-    minimal: m = !1,
+    minimal: u = !1,
     className: p,
-    children: u,
-    ...x
+    children: m,
+    ...f
   }, g) {
     return /* @__PURE__ */ t.jsxs(
       "div",
       {
         ref: g,
-        className: l(na({ minimal: m, fullscreen: d }), p),
-        ...x,
+        className: i(na({ minimal: u, fullscreen: d }), p),
+        ...f,
         children: [
           /* @__PURE__ */ t.jsx("div", { className: "max-w-xs w-full flex justify-center", children: /* @__PURE__ */ t.jsx(
             y,
@@ -669,12 +690,12 @@ const w = i(
             }
           ) }),
           c && /* @__PURE__ */ t.jsx("p", { className: oa(), "aria-live": "polite", children: c }),
-          u
+          m
         ]
       }
     );
   }
-), ia = i("grid w-full gap-4 grid-cols-12"), la = i("", {
+), la = l("grid w-full gap-4 grid-cols-12"), ia = l("", {
   variants: {
     span: {
       1: "col-span-1",
@@ -700,7 +721,7 @@ const w = i(
       "div",
       {
         ref: n,
-        className: l(ia(), a),
+        className: i(la(), a),
         ...r,
         children: e
       }
@@ -713,8 +734,8 @@ const w = i(
       "div",
       {
         ref: c,
-        className: l(
-          la({ span: `${d}` }),
+        className: i(
+          ia({ span: `${d}` }),
           e
         ),
         ...n,
@@ -724,7 +745,7 @@ const w = i(
   }
 ), Oa = Object.assign(ca, {
   Column: da
-}), b = i(
+}), v = l(
   "flex items-center gap-2 px-4 py-2 rounded-md hover:text-primary focus:outline-none transition-colors",
   {
     variants: {
@@ -742,53 +763,53 @@ const w = i(
       disabled: !1
     }
   }
-), ma = o(
+), ua = o(
   (s, a) => {
-    const { icon: e, children: r, href: n, onClick: c, active: d, ...m } = s;
+    const { icon: e, children: r, href: n, onClick: c, active: d, ...u } = s;
     if (typeof n == "string") {
-      const u = m;
+      const m = u;
       return /* @__PURE__ */ t.jsx("li", { children: /* @__PURE__ */ t.jsxs(
         "a",
         {
           ref: a,
           href: n,
-          className: b({
+          className: v({
             disabled: !!s["aria-disabled"],
             active: d
           }),
-          ...u,
+          ...m,
           children: [
             e,
-            /* @__PURE__ */ t.jsx(f, { as: "span", color: "inherit", fontSize: "sm", children: r })
+            /* @__PURE__ */ t.jsx(x, { as: "span", color: "inherit", fontSize: "sm", children: r })
           ]
         }
       ) });
     } else {
-      const u = m;
+      const m = u;
       return /* @__PURE__ */ t.jsx("li", { children: /* @__PURE__ */ t.jsxs(
         "button",
         {
           ref: a,
           type: "button",
           onClick: c,
-          className: l(
-            b({ disabled: !!u.disabled, active: d }),
+          className: i(
+            v({ disabled: !!m.disabled, active: d }),
             "w-full text-left"
           ),
-          ...u,
+          ...m,
           children: [
             e,
-            /* @__PURE__ */ t.jsx(f, { as: "span", color: "inherit", fontSize: "sm", children: r })
+            /* @__PURE__ */ t.jsx(x, { as: "span", color: "inherit", fontSize: "sm", children: r })
           ]
         }
       ) });
     }
   }
-), ua = o(
+), ma = o(
   function({ children: a, label: e, ...r }, n) {
     return /* @__PURE__ */ t.jsxs("li", { ref: n, className: "flex flex-col gap-2 mt-2", ...r, children: [
       /* @__PURE__ */ t.jsx(
-        f,
+        x,
         {
           as: "h2",
           fontSize: "xs",
@@ -813,15 +834,15 @@ const w = i(
     }
   )
 ), Wa = Object.assign(pa, {
-  Item: ma,
-  Group: ua
-}), fa = i(
+  Item: ua,
+  Group: ma
+}), fa = l(
   "w-full flex items-center px-6 py-4 border-b border-border shadow-xs bg-white",
   {
     variants: {},
     defaultVariants: {}
   }
-), xa = i("flex items-center gap-3 min-w-0 flex-1"), ga = i("flex items-center gap-2 ml-auto"), ba = i(
+), xa = l("flex items-center gap-3 min-w-0 flex-1"), ga = l("flex items-center gap-2 ml-auto"), va = l(
   "px-2.5 py-1.5 rounded-md text-sm cursor-pointer transition-colors",
   {
     variants: {
@@ -834,9 +855,9 @@ const w = i(
       active: !1
     }
   }
-), va = i("flex items-center gap-2 ml-4"), ha = i("flex items-center gap-2 mr-4"), ja = o(
+), ba = l("flex items-center gap-2 ml-4"), ha = l("flex items-center gap-2 mr-4"), ja = o(
   function({ children: a, className: e, ...r }, n) {
-    return /* @__PURE__ */ t.jsx("nav", { ref: n, className: va({ className: e }), ...r, children: a });
+    return /* @__PURE__ */ t.jsx("nav", { ref: n, className: ba({ className: e }), ...r, children: a });
   }
 ), ya = o(
   function({ children: a, className: e, ...r }, n) {
@@ -856,7 +877,7 @@ const w = i(
       "div",
       {
         ref: c,
-        className: ba({ active: r, className: e }),
+        className: va({ active: r, className: e }),
         "aria-current": r ? "page" : void 0,
         ...n,
         children: a

package/dist/types/layouts/badge-group/types.d.ts

@@ -34,4 +34,9 @@ export interface BadgeGroupProps extends HTMLAttributes<HTMLDivElement>, Variant
      * @default false
      */
     hasMargin?: boolean;
+    /**
+     * Whether items should overlay in single line without wrapping
+     * @default false
+     */
+    overlay?: boolean;
 }

package/dist/types/layouts/button-group/types.d.ts

@@ -34,4 +34,9 @@ export interface ButtonGroupProps extends HTMLAttributes<HTMLDivElement>, Varian
      * @default false
      */
     hasMargin?: boolean;
+    /**
+     * Whether items should overlay in single line without wrapping
+     * @default false
+     */
+    overlay?: boolean;
 }

package/dist/types/layouts/filter-chip-group/types.d.ts

@@ -34,4 +34,9 @@ export interface FilterChipGroupProps extends HTMLAttributes<HTMLDivElement>, Va
      * @default false
      */
     hasMargin?: boolean;
+    /**
+     * Whether items should overlay in single line without wrapping
+     * @default false
+     */
+    overlay?: boolean;
 }

package/dist/types/navigation/tabs/types.d.ts

@@ -7,6 +7,8 @@ export interface TabsContextValue {
     activeTab: string;
     /** Set active tab */
     setActiveTab: (tab: string) => void;
+    /** Whether tab triggers should fill available width */
+    fullWidth?: boolean;
 }
 /**
  * TabsRootProps: Props for Tabs root (rendered as nav element)
@@ -18,6 +20,8 @@ export interface TabsRootProps extends HTMLAttributes<HTMLElement> {
     onValueChange: (tab: string) => void;
     /** Children: Tabs.Trigger */
     children: ReactNode;
+    /** Whether tab triggers should fill available width equally */
+    fullWidth?: boolean;
 }
 /**
  * TabsTriggerProps: Individual tab link (rendered as li > a)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dimasbaguspm/versaur",
-  "version": "0.0.56",
+  "version": "0.0.57",
   "description": "React UI library with Tailwind CSS",
   "author": "Dimas Bagus Prayogo Mukti<dimas.bagus.pm@gmail.com>",
   "license": "MIT",