@dimasbaguspm/versaur 0.0.40 → 0.0.41

package/dist/js/{bottom-sheet-BjNMFNXp.js → bottom-sheet-Da41OlDM.js}

@@ -1,6 +1,6 @@
 import { c as f, j as r, a as l } from "./index-DOdDlCoL.js";
 import j, { useState as p, useEffect as x, createContext as V, useContext as B, forwardRef as u, useRef as z, useMemo as M } from "react";
-import { O as S, n as P, k as N, H as D } from "./image-rectangle-DGO9R_ox.js";
+import { O as S, n as P, k as N, H as D } from "./image-rectangle-S0pOfTm5.js";
 import { XIcon as R } from "lucide-react";
 import "./snackbar-DH8jCh2V.js";
 function F() {

package/dist/js/{bottom-sheet-input-BnuL4Cci.js → bottom-sheet-input-BB3FZtpr.js}

@@ -1,9 +1,9 @@
 import { c as v, j as e, a as m } from "./index-DOdDlCoL.js";
 import x, { createContext as N, useContext as z, useId as F, forwardRef as j, useRef as B, useState as R, useEffect as U, useMemo as E } from "react";
-import { I as C } from "./image-rectangle-DGO9R_ox.js";
+import { I as C } from "./image-rectangle-S0pOfTm5.js";
 import { Calendar as X, SearchIcon as Y, Clock as Z, Banknote as ee, MailIcon as re, Check as P } from "lucide-react";
 import "./snackbar-DH8jCh2V.js";
-import { M as O, D as M, B as V } from "./bottom-sheet-BjNMFNXp.js";
+import { M as O, D as M, B as V } from "./bottom-sheet-Da41OlDM.js";
 const te = v("space-y-2", {
   variants: {
     direction: {

package/dist/js/forms/index.js

@@ -1,4 +1,4 @@
-import { B as a, C as n, b as p, a as u, D as s, k as I, E as i, M as l, P as S, R as c, d as r, c as g, S as h, e as o, j as m, i as M, h as b, f as k, T as x, g as C } from "../bottom-sheet-input-BnuL4Cci.js";
+import { B as a, C as n, b as p, a as u, D as s, k as I, E as i, M as l, P as S, R as c, d as r, c as g, S as h, e as o, j as m, i as M, h as b, f as k, T as x, g as C } from "../bottom-sheet-input-BB3FZtpr.js";
 export {
   a as BottomSheetInput,
   n as CheckboxInput,

package/dist/js/{image-rectangle-DGO9R_ox.js → image-rectangle-S0pOfTm5.js}

@@ -2046,11 +2046,12 @@ const cardVariants = cva(
   {
     variants: {
       size: {
-        xs: "p-2",
-        sm: "p-3",
-        md: "p-4",
-        lg: "p-6",
-        xl: "p-8"
+        none: "p-0",
+        xs: "p-2 sm:p-2",
+        sm: "p-2 sm:p-3",
+        md: "p-3 sm:p-4",
+        lg: "p-4 sm:p-6",
+        xl: "p-6 sm:p-8"
       },
       shape: {
         rounded: "rounded-lg",
@@ -2072,7 +2073,7 @@ const cardVariants = cva(
     "ul",
     {
       ref: t,
-      className: "flex items-center min-w-0 overflow-hidden w-full",
+      className: "flex flex-wrap items-center min-w-0 overflow-hidden w-full gap-x-0",
       children: e
     }
   )
@@ -2081,8 +2082,8 @@ const cardVariants = cva(
     "li",
     {
       ref: t,
-      className: "flex items-center min-w-0 flex-shrink after:content-[''] after:inline-block after:mx-2 after:w-1 after:h-1 after:rounded-full after:bg-ghost last:after:hidden after:flex-shrink-0",
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate min-w-0", children: e })
+      className: "flex items-center min-w-0 flex-shrink-0 after:content-[''] after:inline-block after:mx-1.5 sm:after:mx-2 after:w-1 after:h-1 after:rounded-full after:bg-ghost last:after:hidden after:flex-shrink-0",
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { as: "span", fontSize: "sm", color: "gray", ellipsis: !0, clamp: 1, children: e })
     }
   )
 ), CardRoot = forwardRef(
@@ -2105,28 +2106,37 @@ const cardVariants = cva(
       ref: d,
       className: cn(cardVariants({ size: e, shape: t, bordered: u }), f),
       ...n,
-      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start gap-4 w-full", children: [
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start gap-3 sm:gap-4 w-full", children: [
         r && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-shrink-0", children: r }),
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "w-full min-w-0", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-2", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mb-2", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 min-w-0", children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx(
                 Text,
                 {
                   as: "h3",
                   fontSize: "base",
                   fontWeight: "semibold",
-                  className: "truncate",
+                  className: "break-words leading-tight",
                   children: i
                 }
               ),
-              l && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: l })
+              s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1", children: typeof s == "string" ? /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { as: "p", fontSize: "sm", color: "gray", children: s }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-w-0 overflow-hidden", children: s }) })
             ] }),
-            s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn(l && "-mt-3"), children: typeof s == "string" ? /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { as: "p", fontSize: "sm", color: "gray", children: s }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "min-w-0 overflow-hidden", children: s }) })
-          ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between items-center gap-2 flex-wrap ", children: [
-            o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mr-auto flex-shrink-0 flex-wrap", children: o }),
-            a && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ml-auto flex-shrink-0", children: typeof a == "string" ? /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { as: "p", fontSize: "sm", color: "gray", children: a }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: a }) })
+            l && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-shrink-0 ml-2 -mt-1", children: l })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-2 sm:flex-row sm:justify-between sm:items-center", children: [
+            o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-shrink-0 order-1 sm:order-none overflow-hidden", children: o }),
+            a && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-shrink-0 order-2 sm:order-none sm:ml-auto", children: typeof a == "string" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Text,
+              {
+                as: "p",
+                fontSize: "sm",
+                color: "gray",
+                className: "truncate",
+                children: a
+              }
+            ) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "overflow-hidden", children: a }) })
           ] })
         ] })
       ] })

package/dist/js/index.js

@@ -1,82 +1,83 @@
-import { L as e, P as s, S as r } from "./skeleton-BNZyaRjo.js";
-import { A as n, a as u, B as p, b as i, F as l, e as I, P as c, c as S, d as m, S as B, T as g } from "./top-bar-D8P4uwtN.js";
-import { B as b, C as T, b as x, a as h, D as f, k as C, E as M, M as P, P as A, R as k, d as F, c as D, S as L, e as H, j as R, i as w, h as G, f as j, T as q, g as v } from "./bottom-sheet-input-BnuL4Cci.js";
-import { B as E, D as N, M as z } from "./bottom-sheet-BjNMFNXp.js";
-import { A as K, a as O, b as Q, c as U, d as V, e as W, B as X, s as Y, f as Z, g as _, j as $, k as aa, h as ta, i as ea, C as sa, l as ra, F as oa, H as na, m as ua, I as pa, p as ia, r as la, q as Ia, M as ca, N as Sa, T as ma, n as Ba, o as ga } from "./image-rectangle-DGO9R_ox.js";
-import { T as ba } from "./tooltip-uCpYAX_O.js";
-import { S as xa } from "./snackbar-DH8jCh2V.js";
-import { B as fa, T as Ca } from "./tabs-lPDgArjA.js";
-import { S as Pa, u as Aa } from "./use-snackbars-CKi6BQDT.js";
+import { L as t, P as s, S as r } from "./skeleton-BNZyaRjo.js";
+import { A as n, a as u, B as p, b as i, F as l, f as I, P as c, c as S, d as m, e as B, S as g, T as d } from "./top-bar-DYbS1NgD.js";
+import { B as T, C as x, b as f, a as h, D as P, k as C, E as M, M as A, P as k, R as F, d as L, c as D, S as H, e as R, j as w, i as G, h as j, f as q, T as v, g as y } from "./bottom-sheet-input-BB3FZtpr.js";
+import { B as N, D as z, M as J } from "./bottom-sheet-Da41OlDM.js";
+import { A as O, a as Q, b as U, c as V, d as W, e as X, B as Y, s as Z, f as _, g as $, j as aa, k as ea, h as ta, i as sa, C as ra, l as oa, F as na, H as ua, m as pa, I as ia, p as la, r as Ia, q as ca, M as Sa, N as ma, T as Ba, n as ga, o as da } from "./image-rectangle-S0pOfTm5.js";
+import { T as Ta } from "./tooltip-VV9T0wn6.js";
+import { S as fa } from "./snackbar-DH8jCh2V.js";
+import { B as Pa, T as Ca } from "./tabs-C8iGcy7x.js";
+import { S as Aa, u as ka } from "./use-snackbars-Cou8L41F.js";
 export {
-  K as Accordion,
-  O as Alert,
-  Q as Anchor,
+  O as Accordion,
+  Q as Alert,
+  U as Anchor,
   n as AppBar,
-  U as Attribute,
-  V as AttributeList,
-  W as Avatar,
-  X as Badge,
+  V as Attribute,
+  W as AttributeList,
+  X as Avatar,
+  Y as Badge,
   u as BadgeGroup,
-  Y as BaseImage,
+  Z as BaseImage,
   p as BottomBar,
-  E as BottomSheet,
-  b as BottomSheetInput,
-  Z as Brand,
-  fa as Breadcrumbs,
-  _ as Button,
-  $ as ButtonFloat,
+  N as BottomSheet,
+  T as BottomSheetInput,
+  _ as Brand,
+  Pa as Breadcrumbs,
+  $ as Button,
+  aa as ButtonFloat,
   i as ButtonGroup,
-  aa as ButtonIcon,
+  ea as ButtonIcon,
   ta as ButtonMenu,
-  ea as ButtonMenuIcon,
-  sa as Calculator,
-  ra as Card,
-  T as CheckboxInput,
-  x as ChipMultipleInput,
+  sa as ButtonMenuIcon,
+  ra as Calculator,
+  oa as Card,
+  x as CheckboxInput,
+  f as ChipMultipleInput,
   h as ChipSingleInput,
-  f as DateSinglePickerInput,
-  N as Drawer,
+  P as DateSinglePickerInput,
+  z as Drawer,
   C as DrawerInput,
   M as EmailInput,
-  oa as FilterChip,
+  na as FilterChip,
   l as FilterChipGroup,
   I as FormLayout,
-  na as Heading,
-  ua as Hr,
-  pa as Icon,
-  ia as ImageCircle,
-  la as ImageRectangle,
-  Ia as ImageSquare,
-  e as LoadingIndicator,
-  ca as Menu,
-  z as Modal,
-  P as ModalInput,
-  Sa as NoResults,
+  ua as Heading,
+  pa as Hr,
+  ia as Icon,
+  la as ImageCircle,
+  Ia as ImageRectangle,
+  ca as ImageSquare,
+  t as LoadingIndicator,
+  Sa as Menu,
+  J as Modal,
+  A as ModalInput,
+  ma as NoResults,
   c as PageContent,
   S as PageHeader,
   m as PageLayout,
-  A as PriceInput,
+  B as PageLoader,
+  k as PriceInput,
   s as ProgressIndicator,
-  k as RadioInput,
-  F as SearchInput,
+  F as RadioInput,
+  L as SearchInput,
   D as SegmentMultipleInput,
-  L as SegmentSingleInput,
-  H as SelectInput,
-  R as SelectableMultipleInput,
-  w as SelectableSingleInput,
-  B as SideBar,
+  H as SegmentSingleInput,
+  R as SelectInput,
+  w as SelectableMultipleInput,
+  G as SelectableSingleInput,
+  g as SideBar,
   r as Skeleton,
-  xa as Snackbar,
-  Pa as SnackbarsProvider,
-  G as SwitchInput,
-  ma as Table,
+  fa as Snackbar,
+  Aa as SnackbarsProvider,
+  j as SwitchInput,
+  Ba as Table,
   Ca as Tabs,
-  Ba as Text,
-  j as TextAreaInput,
-  q as TextInput,
-  ga as Tile,
-  v as TimePickerInput,
-  ba as Tooltip,
-  g as TopBar,
-  Aa as useSnackbars
+  ga as Text,
+  q as TextAreaInput,
+  v as TextInput,
+  da as Tile,
+  y as TimePickerInput,
+  Ta as Tooltip,
+  d as TopBar,
+  ka as useSnackbars
 };

package/dist/js/layouts/index.js

@@ -1,7 +1,7 @@
-import { A as r, a as e, B as s, b as t, F as p, e as B, P as u, c as d, d as g, S as P, T as i } from "../top-bar-D8P4uwtN.js";
+import { A as e, a as r, B as s, b as t, F as p, f as B, P as u, c as d, d as g, e as P, S as i, T as m } from "../top-bar-DYbS1NgD.js";
 export {
-  r as AppBar,
-  e as BadgeGroup,
+  e as AppBar,
+  r as BadgeGroup,
   s as BottomBar,
   t as ButtonGroup,
   p as FilterChipGroup,
@@ -9,6 +9,7 @@ export {
   u as PageContent,
   d as PageHeader,
   g as PageLayout,
-  P as SideBar,
-  i as TopBar
+  P as PageLoader,
+  i as SideBar,
+  m as TopBar
 };

package/dist/js/navigation/index.js

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

package/dist/js/overlays/index.js

@@ -1,6 +1,6 @@
-import { B as a, D as e, M as t } from "../bottom-sheet-BjNMFNXp.js";
-import { M as m } from "../image-rectangle-DGO9R_ox.js";
-import { T as M } from "../tooltip-uCpYAX_O.js";
+import { B as a, D as e, M as t } from "../bottom-sheet-Da41OlDM.js";
+import { M as m } from "../image-rectangle-S0pOfTm5.js";
+import { T as M } from "../tooltip-VV9T0wn6.js";
 export {
   a as BottomSheet,
   e as Drawer,

package/dist/js/primitive/index.js

@@ -1,4 +1,4 @@
-import { A as t, a as e, b as o, c as r, d as n, e as u, B as c, s as l, f as i, g as B, j as g, k as I, h as m, i as A, C as d, l as b, F as C, H as p, m as T, I as f, p as h, r as x, q as F, N as H, T as S, n as k, o as q } from "../image-rectangle-DGO9R_ox.js";
+import { A as t, a as e, b as o, c as r, d as n, e as u, B as c, s as l, f as i, g as B, j as g, k as I, h as m, i as A, C as d, l as b, F as C, H as p, m as T, I as f, p as h, r as x, q as F, N as H, T as S, n as k, o as q } from "../image-rectangle-S0pOfTm5.js";
 import { S as N } from "../snackbar-DH8jCh2V.js";
 export {
   t as Accordion,

package/dist/js/providers/index.js

@@ -1,4 +1,4 @@
-import { S as s, u as e } from "../use-snackbars-CKi6BQDT.js";
+import { S as s, u as e } from "../use-snackbars-Cou8L41F.js";
 export {
   s as SnackbarsProvider,
   e as useSnackbars

package/dist/js/{tabs-lPDgArjA.js → tabs-C8iGcy7x.js}

@@ -1,6 +1,6 @@
 import { c as d, j as s, a as u } from "./index-DOdDlCoL.js";
 import { forwardRef as f, createContext as x, useContext as g, useState as p, useLayoutEffect as y, useRef as h } from "react";
-import { I as w } from "./image-rectangle-DGO9R_ox.js";
+import { I as w } from "./image-rectangle-S0pOfTm5.js";
 import "./snackbar-DH8jCh2V.js";
 import { ChevronRight as T } from "lucide-react";
 const j = d(

package/dist/js/{tooltip-uCpYAX_O.js → tooltip-VV9T0wn6.js}

@@ -1,6 +1,6 @@
 import { c as v, j as c, a as w } from "./index-DOdDlCoL.js";
 import { useRef as m, useState as d, useEffect as h, useId as T, cloneElement as j } from "react";
-import { n as y } from "./image-rectangle-DGO9R_ox.js";
+import { n as y } from "./image-rectangle-S0pOfTm5.js";
 function P(e = "auto") {
   const n = m(null), [a, t] = d("bottom");
   return h(() => {

package/dist/js/{top-bar-D8P4uwtN.js → top-bar-DYbS1NgD.js}

@@ -1,9 +1,10 @@
-import { c as i, j as r, a as l } from "./index-DOdDlCoL.js";
+import { c as i, j as s, a as l } from "./index-DOdDlCoL.js";
 import * as v from "react";
 import { forwardRef as o } from "react";
-import { n as f } from "./image-rectangle-DGO9R_ox.js";
+import { n as f } from "./image-rectangle-S0pOfTm5.js";
 import "./snackbar-DH8jCh2V.js";
-const h = i(
+import { L as h } from "./skeleton-BNZyaRjo.js";
+const j = i(
   "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: {
@@ -19,7 +20,7 @@ const h = i(
       variant: "primary"
     }
   }
-), j = i(
+), y = i(
   "flex flex-col justify-center min-w-0 flex-grow",
   {
     variants: {
@@ -33,8 +34,8 @@ const h = i(
       placement: "start"
     }
   }
-), y = o(
-  ({ children: t, className: a }, e) => /* @__PURE__ */ r.jsx(
+), w = o(
+  ({ children: t, className: a }, e) => /* @__PURE__ */ s.jsx(
     "div",
     {
       ref: e,
@@ -44,7 +45,7 @@ const h = i(
     }
   )
 ), B = o(
-  ({ children: t, className: a }, e) => /* @__PURE__ */ r.jsx(
+  ({ children: t, className: a }, e) => /* @__PURE__ */ s.jsx(
     "div",
     {
       ref: e,
@@ -53,7 +54,7 @@ const h = i(
       children: t
     }
   )
-), w = o(({ children: t, ...a }, e) => /* @__PURE__ */ r.jsx(
+), N = o(({ children: t, ...a }, e) => /* @__PURE__ */ s.jsx(
   f,
   {
     ...a,
@@ -65,7 +66,7 @@ const h = i(
     clamp: 1,
     children: t
   }
-)), N = o(({ children: t, ...a }, e) => /* @__PURE__ */ r.jsx(
+)), V = o(({ children: t, ...a }, e) => /* @__PURE__ */ s.jsx(
   f,
   {
     ...a,
@@ -78,8 +79,8 @@ const h = i(
     color: "gray",
     children: t
   }
-)), V = o(
-  ({ children: t, className: a }, e) => /* @__PURE__ */ r.jsx(
+)), S = o(
+  ({ children: t, className: a }, e) => /* @__PURE__ */ s.jsx(
     "div",
     {
       ref: e,
@@ -88,33 +89,33 @@ const h = i(
       children: t
     }
   )
-), S = o(
-  ({ children: t, className: a, placement: e }, s) => /* @__PURE__ */ r.jsx(
+), T = o(
+  ({ children: t, className: a, placement: e }, r) => /* @__PURE__ */ s.jsx(
     "div",
     {
-      ref: s,
-      className: l(j({ placement: e }), a),
+      ref: r,
+      className: l(y({ placement: e }), a),
       children: t
     }
   )
-), T = ({
+), L = ({
   children: t,
   className: a,
   variant: e = "primary"
-}) => /* @__PURE__ */ r.jsx(
+}) => /* @__PURE__ */ s.jsx(
   "header",
   {
-    className: l(h({ variant: e }), a),
+    className: l(j({ variant: e }), a),
     role: "banner",
     children: t
   }
-), Na = Object.assign(T, {
+), La = Object.assign(L, {
   Leading: B,
-  Headline: w,
-  Subtitle: N,
-  Trailing: V,
-  Center: S,
-  Bottom: y
+  Headline: N,
+  Subtitle: V,
+  Trailing: S,
+  Center: T,
+  Bottom: w
 }), H = i(
   "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",
   {
@@ -155,46 +156,46 @@ const h = i(
       as: "button"
     }
   }
-), A = o(
+), P = o(
   ({
     as: t = "button",
     icon: a,
     label: e,
-    active: s = !1,
+    active: r = !1,
     className: n,
     children: c,
     ...p
-  }, d) => /* @__PURE__ */ r.jsxs(
+  }, d) => /* @__PURE__ */ s.jsxs(
     t,
     {
       ref: d,
-      "aria-current": s ? "page" : void 0,
-      className: z({ active: s, className: n, as: t }),
+      "aria-current": r ? "page" : void 0,
+      className: z({ active: r, className: n, as: t }),
       ...p,
       children: [
         a && a,
         c && c,
-        e && /* @__PURE__ */ r.jsx("span", { className: "text-xs mt-0.5", children: e })
+        e && /* @__PURE__ */ s.jsx("span", { className: "text-xs mt-0.5", children: e })
       ]
     }
   )
-), P = ({
+), A = ({
   children: t,
   variant: a = "primary",
   size: e = "md",
-  className: s,
+  className: r,
   ...n
-}) => /* @__PURE__ */ r.jsx(
+}) => /* @__PURE__ */ s.jsx(
   "nav",
   {
     role: "navigation",
     "aria-label": "Bottom navigation",
-    className: H({ variant: a, size: e, className: s }),
+    className: H({ variant: a, size: e, className: r }),
     ...n,
     children: t
   }
-), Va = Object.assign(P, {
-  Item: A
+), Ha = Object.assign(A, {
+  Item: P
 }), C = i("flex", {
   variants: {
     orientation: {
@@ -227,24 +228,24 @@ const h = i(
     gap: "md",
     fluid: !1
   }
-}), Sa = o(
+}), za = o(
   function({
     className: a,
     children: e,
-    orientation: s = "horizontal",
+    orientation: r = "horizontal",
     alignment: n = "start",
     gap: c = "md",
     fluid: p = !1,
     hasMargin: d,
     ...u
   }, m) {
-    return /* @__PURE__ */ r.jsx(
+    return /* @__PURE__ */ s.jsx(
       "div",
       {
         ref: m,
         className: l(
           C({
-            orientation: s,
+            orientation: r,
             alignment: n,
             gap: c,
             fluid: p
@@ -258,7 +259,7 @@ const h = i(
       }
     );
   }
-), L = i("flex", {
+), R = i("flex", {
   variants: {
     orientation: {
       horizontal: "flex-row",
@@ -290,24 +291,24 @@ const h = i(
     gap: "md",
     fluid: !1
   }
-}), Ta = o(
+}), Pa = o(
   function({
     className: a,
     children: e,
-    orientation: s = "horizontal",
+    orientation: r = "horizontal",
     alignment: n = "start",
     gap: c = "md",
     fluid: p = !1,
     hasMargin: d,
     ...u
   }, m) {
-    return /* @__PURE__ */ r.jsx(
+    return /* @__PURE__ */ s.jsx(
       "div",
       {
         ref: m,
         className: l(
-          L({
-            orientation: s,
+          R({
+            orientation: r,
             alignment: n,
             gap: c,
             fluid: p
@@ -353,24 +354,24 @@ const h = i(
     gap: "md",
     fluid: !1
   }
-}), Ha = o(
+}), Aa = o(
   function({
     className: a,
     children: e,
-    orientation: s = "horizontal",
+    orientation: r = "horizontal",
     alignment: n = "start",
     gap: c = "md",
     fluid: p = !1,
     hasMargin: d,
     ...u
   }, m) {
-    return /* @__PURE__ */ r.jsx(
+    return /* @__PURE__ */ s.jsx(
       "div",
       {
         ref: m,
         className: l(
           G({
-            orientation: s,
+            orientation: r,
             alignment: n,
             gap: c,
             fluid: p
@@ -384,54 +385,54 @@ const h = i(
       }
     );
   }
-), R = i("w-full px-4 sm:px-6 py-6 sm:py-8"), za = o(
-  ({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+), I = i("w-full px-4 sm:px-6 py-6 sm:py-8"), Ca = o(
+  ({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx(
     "div",
     {
-      ref: s,
-      className: l(R(), a),
+      ref: r,
+      className: l(I(), a),
       ...e,
       children: t
     }
   )
-), I = i("w-full mt-4"), k = i(
+), k = i("w-full mt-4"), F = i(
   "flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4 px-4 sm:px-6 mb-4"
-), F = i("mb-4 px-4 sm:px-6"), O = i(
+), O = i("mb-4 px-4 sm:px-6"), W = i(
   "flex-1 min-w-0 flex flex-col gap-2 w-full sm:w-auto"
-), W = i("flex items-center gap-2 flex-wrap"), M = i(
+), M = i("flex items-center gap-2 flex-wrap"), E = i(
   "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"
-), E = i("md:hidden"), $ = i(
+), $ = i("md:hidden"), q = i(
   "w-full flex items-center px-4 sm:px-6 py-0 overflow-x-auto"
-), q = o(
-  ({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+), D = o(
+  ({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx(
     "div",
     {
-      ref: s,
-      className: l(k(), a),
+      ref: r,
+      className: l(F(), a),
       "data-versaur-page-header-top": !0,
       ...e,
       children: t
     }
   )
-), D = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+), J = o(({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx(
   "div",
   {
-    ref: s,
-    className: l(F(), a),
+    ref: r,
+    className: l(O(), a),
     "data-versaur-page-header-breadcrumbs": !0,
     ...e,
     children: t
   }
-)), J = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), K = o(({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx(
   "div",
   {
-    ref: s,
-    className: l(O(), a),
+    ref: r,
+    className: l(W(), a),
     "data-versaur-page-header-content": !0,
     ...e,
     children: t
   }
-)), K = o((t, a) => /* @__PURE__ */ r.jsx(
+)), Q = o((t, a) => /* @__PURE__ */ s.jsx(
   f,
   {
     ...t,
@@ -441,7 +442,7 @@ const h = i(
     ellipsis: !0,
     ref: a
   }
-)), Q = o(({ className: t, ...a }, e) => /* @__PURE__ */ r.jsx(
+)), U = o(({ className: t, ...a }, e) => /* @__PURE__ */ s.jsx(
   f,
   {
     as: "p",
@@ -452,83 +453,83 @@ const h = i(
     className: l("mb-2 sm:clamp-3", t),
     ...a
   }
-)), U = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), X = o(({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx(
   "div",
   {
-    ref: s,
-    className: l(W(), a),
+    ref: r,
+    className: l(M(), a),
     "data-versaur-page-header-badges": !0,
     ...e,
     children: t
   }
-)), X = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), Y = o(({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx(
   "div",
   {
-    ref: s,
-    className: l(M(), a),
+    ref: r,
+    className: l(E(), a),
     "data-versaur-page-header-actions": !0,
     ...e,
     children: t
   }
-)), Y = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), Z = o(({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx(
   "div",
   {
-    ref: s,
-    className: l(E(), a),
+    ref: r,
+    className: l($(), a),
     "data-versaur-page-header-mobile-actions": !0,
     ...e,
     children: t
   }
-)), Z = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), _ = o(({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx(
   "div",
   {
-    ref: s,
-    className: l($(), a),
+    ref: r,
+    className: l(q(), a),
     "data-versaur-page-header-bottom": !0,
     ...e,
     children: t
   }
-)), _ = o(
+)), aa = o(
   ({
     children: t,
     className: a,
     title: e,
-    subtitle: s,
+    subtitle: r,
     breadcrumbs: n,
     badges: c,
     actions: p,
     mobileActions: d,
     tabs: u,
     ...m
-  }, g) => {
+  }, x) => {
     const b = u;
-    return /* @__PURE__ */ r.jsxs(
+    return /* @__PURE__ */ s.jsxs(
       "header",
       {
-        ref: g,
-        className: l(I(), a),
+        ref: x,
+        className: l(k(), a),
         role: "banner",
         ...m,
         children: [
-          n && /* @__PURE__ */ r.jsx(D, { children: n }),
-          /* @__PURE__ */ r.jsxs(q, { children: [
-            /* @__PURE__ */ r.jsxs(J, { children: [
-              /* @__PURE__ */ r.jsxs("div", { className: "flex items-center justify-between", children: [
-                /* @__PURE__ */ r.jsx(K, { children: e }),
-                d && /* @__PURE__ */ r.jsx(Y, { children: d })
+          n && /* @__PURE__ */ s.jsx(J, { children: n }),
+          /* @__PURE__ */ s.jsxs(D, { children: [
+            /* @__PURE__ */ s.jsxs(K, { children: [
+              /* @__PURE__ */ s.jsxs("div", { className: "flex items-center justify-between", children: [
+                /* @__PURE__ */ s.jsx(Q, { children: e }),
+                d && /* @__PURE__ */ s.jsx(Z, { children: d })
               ] }),
-              s && /* @__PURE__ */ r.jsx(Q, { children: s }),
-              c && /* @__PURE__ */ r.jsx(U, { children: c })
+              r && /* @__PURE__ */ s.jsx(U, { children: r }),
+              c && /* @__PURE__ */ s.jsx(X, { children: c })
             ] }),
-            p && /* @__PURE__ */ r.jsx(X, { children: p })
+            p && /* @__PURE__ */ s.jsx(Y, { children: p })
           ] }),
-          b && /* @__PURE__ */ r.jsx(Z, { children: u }),
+          b && /* @__PURE__ */ s.jsx(_, { children: u }),
           t
         ]
       }
     );
   }
-), Aa = _, aa = i("w-full mx-auto relative", {
+), Ra = aa, ea = i("w-full mx-auto relative", {
   variants: {
     type: {
       desktop: "max-w-7xl px-6 pb-10",
@@ -539,19 +540,89 @@ const h = i(
   defaultVariants: {
     type: "desktop"
   }
-}), Pa = v.forwardRef(
-  function({ type: a = "desktop", className: e, children: s, ...n }, c) {
-    return /* @__PURE__ */ r.jsx(
+}), Ga = v.forwardRef(
+  function({ type: a = "desktop", className: e, children: r, ...n }, c) {
+    return /* @__PURE__ */ s.jsx(
       "div",
       {
         ref: c,
-        className: l(aa({ type: a }), e),
+        className: l(ea({ type: a }), e),
         ...n,
-        children: s
+        children: r
+      }
+    );
+  }
+), ta = i(
+  [
+    // Base styles: flex container that centers content
+    "flex",
+    "items-center",
+    "justify-center",
+    "flex-col",
+    "gap-3",
+    // Ensure it takes available space
+    "flex-grow",
+    "w-full"
+  ],
+  {
+    variants: {
+      minimal: {
+        false: [
+          // Full height for standalone page loading
+          "min-h-96",
+          "h-full"
+        ],
+        true: [
+          // Minimal height for inline loading states
+          "min-h-32",
+          "py-8"
+        ]
+      }
+    },
+    defaultVariants: {
+      minimal: !1
+    }
+  }
+), sa = i([
+  "text-foreground-light",
+  "text-sm",
+  "text-center",
+  "max-w-xs"
+]), Ia = v.forwardRef(
+  function({
+    type: a = "bar",
+    size: e = "sm",
+    color: r = "primary",
+    ariaLabel: n = "Loading page",
+    message: c,
+    minimal: p = !1,
+    className: d,
+    children: u,
+    ...m
+  }, x) {
+    return /* @__PURE__ */ s.jsxs(
+      "div",
+      {
+        ref: x,
+        className: l(ta({ minimal: p }), d),
+        ...m,
+        children: [
+          /* @__PURE__ */ s.jsx("div", { className: "max-w-xs w-full flex justify-center", children: /* @__PURE__ */ s.jsx(
+            h,
+            {
+              type: a,
+              size: e,
+              color: r,
+              ariaLabel: n
+            }
+          ) }),
+          c && /* @__PURE__ */ s.jsx("p", { className: sa(), "aria-live": "polite", children: c }),
+          u
+        ]
       }
     );
   }
-), ea = i("grid w-full gap-4 grid-cols-12"), ta = i("", {
+), ra = i("grid w-full gap-4 grid-cols-12"), na = i("", {
   variants: {
     span: {
       1: "col-span-1",
@@ -571,37 +642,37 @@ const h = i(
   defaultVariants: {
     span: "4"
   }
-}), sa = o(
-  function({ className: a, children: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsx(
+}), oa = o(
+  function({ className: a, children: e, ...r }, n) {
+    return /* @__PURE__ */ s.jsx(
       "div",
       {
         ref: n,
-        className: l(ea(), a),
-        ...s,
+        className: l(ra(), a),
+        ...r,
         children: e
       }
     );
   }
-), ra = o(
-  function({ span: a = 4, className: e, children: s, ...n }, c) {
+), ia = o(
+  function({ span: a = 4, className: e, children: r, ...n }, c) {
     const p = Math.min(12, Math.max(1, a));
-    return /* @__PURE__ */ r.jsx(
+    return /* @__PURE__ */ s.jsx(
       "div",
       {
         ref: c,
         className: l(
-          ta({ span: `${p}` }),
+          na({ span: `${p}` }),
           e
         ),
         ...n,
-        children: s
+        children: r
       }
     );
   }
-), Ca = Object.assign(sa, {
-  Column: ra
-}), x = i(
+), ka = Object.assign(oa, {
+  Column: ia
+}), g = i(
   "flex items-center gap-2 px-4 py-2 rounded-md hover:text-primary focus:outline-none transition-colors",
   {
     variants: {
@@ -619,52 +690,52 @@ const h = i(
       disabled: !1
     }
   }
-), na = o(
+), la = o(
   (t, a) => {
-    const { icon: e, children: s, href: n, onClick: c, active: p, ...d } = t;
+    const { icon: e, children: r, href: n, onClick: c, active: p, ...d } = t;
     if (typeof n == "string") {
       const m = d;
-      return /* @__PURE__ */ r.jsx("li", { children: /* @__PURE__ */ r.jsxs(
+      return /* @__PURE__ */ s.jsx("li", { children: /* @__PURE__ */ s.jsxs(
         "a",
         {
           ref: a,
           href: n,
-          className: x({
+          className: g({
             disabled: !!t["aria-disabled"],
             active: p
           }),
           ...m,
           children: [
             e,
-            /* @__PURE__ */ r.jsx(f, { as: "span", color: "inherit", fontSize: "sm", children: s })
+            /* @__PURE__ */ s.jsx(f, { as: "span", color: "inherit", fontSize: "sm", children: r })
           ]
         }
       ) });
     } else {
       const m = d;
-      return /* @__PURE__ */ r.jsx("li", { children: /* @__PURE__ */ r.jsxs(
+      return /* @__PURE__ */ s.jsx("li", { children: /* @__PURE__ */ s.jsxs(
         "button",
         {
           ref: a,
           type: "button",
           onClick: c,
           className: l(
-            x({ disabled: !!m.disabled, active: p }),
+            g({ disabled: !!m.disabled, active: p }),
             "w-full text-left"
           ),
           ...m,
           children: [
             e,
-            /* @__PURE__ */ r.jsx(f, { as: "span", color: "inherit", fontSize: "sm", children: s })
+            /* @__PURE__ */ s.jsx(f, { as: "span", color: "inherit", fontSize: "sm", children: r })
           ]
         }
       ) });
     }
   }
-), oa = o(
-  function({ children: a, label: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsxs("li", { ref: n, className: "flex flex-col gap-2 mt-2", ...s, children: [
-      /* @__PURE__ */ r.jsx(
+), ca = o(
+  function({ children: a, label: e, ...r }, n) {
+    return /* @__PURE__ */ s.jsxs("li", { ref: n, className: "flex flex-col gap-2 mt-2", ...r, children: [
+      /* @__PURE__ */ s.jsx(
         f,
         {
           as: "h2",
@@ -675,30 +746,30 @@ const h = i(
           children: e
         }
       ),
-      /* @__PURE__ */ r.jsx("ul", { className: "flex flex-col gap-1", children: a })
+      /* @__PURE__ */ s.jsx("ul", { className: "flex flex-col gap-1", children: a })
     ] });
   }
-), ia = o(
-  ({ children: t, ...a }, e) => /* @__PURE__ */ r.jsx(
+), pa = o(
+  ({ children: t, ...a }, e) => /* @__PURE__ */ s.jsx(
     "nav",
     {
       ref: e,
       className: "w-56 bg-background border-r border-border flex flex-col my-2",
       "aria-label": "Sidebar",
       ...a,
-      children: /* @__PURE__ */ r.jsx("div", { className: "flex-1 overflow-y-auto scrollbar-thin scrollbar-thumb-border scrollbar-track-background", children: /* @__PURE__ */ r.jsx("ul", { className: "flex flex-col gap-1 mx-2", children: t }) })
+      children: /* @__PURE__ */ s.jsx("div", { className: "flex-1 overflow-y-auto scrollbar-thin scrollbar-thumb-border scrollbar-track-background", children: /* @__PURE__ */ s.jsx("ul", { className: "flex flex-col gap-1 mx-2", children: t }) })
     }
   )
-), La = Object.assign(ia, {
-  Item: na,
-  Group: oa
-}), la = i(
+), Fa = Object.assign(pa, {
+  Item: la,
+  Group: ca
+}), da = i(
   "w-full flex items-center px-6 py-4 mb-6 border-b border-border shadow-xs bg-white",
   {
     variants: {},
     defaultVariants: {}
   }
-), ca = i("flex items-center gap-3 min-w-0 flex-1"), pa = i("flex items-center gap-2 ml-auto"), da = i(
+), ma = i("flex items-center gap-3 min-w-0 flex-1"), ua = i("flex items-center gap-2 ml-auto"), fa = i(
   "px-2.5 py-1.5 rounded-md text-sm cursor-pointer transition-colors",
   {
     variants: {
@@ -711,54 +782,55 @@ const h = i(
       active: !1
     }
   }
-), ma = i("flex items-center gap-2 ml-4"), ua = i("flex items-center gap-2 mr-4"), fa = o(
-  function({ children: a, className: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsx("nav", { ref: n, className: ma({ className: e }), ...s, children: a });
+), xa = i("flex items-center gap-2 ml-4"), ga = i("flex items-center gap-2 mr-4"), va = o(
+  function({ children: a, className: e, ...r }, n) {
+    return /* @__PURE__ */ s.jsx("nav", { ref: n, className: xa({ className: e }), ...r, children: a });
   }
-), xa = o(
-  function({ children: a, className: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsx("div", { ref: n, className: ua({ className: e }), ...s, children: a });
+), ba = o(
+  function({ children: a, className: e, ...r }, n) {
+    return /* @__PURE__ */ s.jsx("div", { ref: n, className: ga({ className: e }), ...r, children: a });
   }
-), ga = o(
-  function({ children: a, className: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsx("div", { ref: n, className: ca({ className: e }), ...s, children: a });
+), ha = o(
+  function({ children: a, className: e, ...r }, n) {
+    return /* @__PURE__ */ s.jsx("div", { ref: n, className: ma({ className: e }), ...r, children: a });
   }
-), ba = o(
-  function({ children: a, className: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsx("div", { ref: n, className: pa({ className: e }), ...s, children: a });
+), ja = o(
+  function({ children: a, className: e, ...r }, n) {
+    return /* @__PURE__ */ s.jsx("div", { ref: n, className: ua({ className: e }), ...r, children: a });
   }
-), va = o(
-  function({ children: a, className: e, active: s, ...n }, c) {
-    return /* @__PURE__ */ r.jsx(
+), ya = o(
+  function({ children: a, className: e, active: r, ...n }, c) {
+    return /* @__PURE__ */ s.jsx(
       "div",
       {
         ref: c,
-        className: da({ active: s, className: e }),
-        "aria-current": s ? "page" : void 0,
+        className: fa({ active: r, className: e }),
+        "aria-current": r ? "page" : void 0,
         ...n,
         children: a
       }
     );
   }
-), ha = o(
-  ({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx("header", { ref: s, className: la({ className: a }), ...e, children: t })
-), Ga = Object.assign(ha, {
-  Leading: ga,
-  Trailing: ba,
-  NavItem: va,
-  Nav: fa,
-  Actions: xa
+), wa = o(
+  ({ children: t, className: a, ...e }, r) => /* @__PURE__ */ s.jsx("header", { ref: r, className: da({ className: a }), ...e, children: t })
+), Oa = Object.assign(wa, {
+  Leading: ha,
+  Trailing: ja,
+  NavItem: ya,
+  Nav: va,
+  Actions: ba
 });
 export {
-  Na as A,
-  Va as B,
-  Ha as F,
-  za as P,
-  La as S,
-  Ga as T,
-  Sa as a,
-  Ta as b,
-  Aa as c,
-  Pa as d,
-  Ca as e
+  La as A,
+  Ha as B,
+  Aa as F,
+  Ca as P,
+  Fa as S,
+  Oa as T,
+  za as a,
+  Pa as b,
+  Ra as c,
+  Ga as d,
+  Ia as e,
+  ka as f
 };

package/dist/js/{use-snackbars-CKi6BQDT.js → use-snackbars-Cou8L41F.js}

@@ -6,10 +6,7 @@ const f = x(
 ), j = d(
   [
     "fixed z-100 flex flex-col gap-2 px-0 pb-2",
-    "w-[80vw] left-0 top-4",
-    // mobile: full width
-    "sm:w-auto sm:left-4 sm:bottom-4 sm:max-w-sm"
-    // desktop/tablet
+    "w-[80vw] left-0 top-4 md:w-auto md:left-4 md:top-auto md:bottom-4 md:max-w-sm"
   ].join(" ")
 ), T = d("", {
   variants: {
@@ -23,18 +20,18 @@ const f = x(
   }
 }), C = 4e3;
 function E() {
-  const [a, s] = p([]), t = k({}), n = m((e) => {
-    s((r) => r.filter((o) => o.id !== e)), t.current[e] && (clearTimeout(t.current[e]), delete t.current[e]);
+  const [a, o] = p([]), t = k({}), n = m((e) => {
+    o((r) => r.filter((s) => s.id !== e)), t.current[e] && (clearTimeout(t.current[e]), delete t.current[e]);
   }, []), i = m(
-    (e, r, o) => {
-      const u = `${Date.now()}-${Math.random()}`, l = o?.duration ?? C;
-      s((b) => [
+    (e, r, s) => {
+      const u = `${Date.now()}-${Math.random()}`, l = s?.duration ?? C;
+      o((b) => [
         ...b,
         {
           id: u,
           color: e,
           message: r,
-          ...o,
+          ...s,
           duration: l
         }
       ]), t.current[u] = setTimeout(() => {
@@ -48,7 +45,7 @@ function E() {
   }, []), { queue: a, showSnack: i, removeSnack: n };
 }
 const V = ({ children: a }) => {
-  const { queue: s, showSnack: t, removeSnack: n } = E(), i = v(() => ({ showSnack: t }), [t]);
+  const { queue: o, showSnack: t, removeSnack: n } = E(), i = v(() => ({ showSnack: t }), [t]);
   return /* @__PURE__ */ c.jsxs(f.Provider, { value: i, children: [
     a,
     /* @__PURE__ */ c.jsx(
@@ -57,7 +54,7 @@ const V = ({ children: a }) => {
         className: j(),
         "aria-live": "polite",
         "aria-atomic": "true",
-        children: s.map((e, r) => /* @__PURE__ */ c.jsx(
+        children: o.map((e, r) => /* @__PURE__ */ c.jsx(
           "div",
           {
             className: T({

package/dist/types/layouts/index.d.ts

@@ -6,6 +6,7 @@ export * from './filter-chip-group';
 export * from './page-content';
 export * from './page-header';
 export * from './page-layout';
+export * from './page-loader';
 export * from './form-layout';
 export * from './side-bar';
 export * from './top-bar';

package/dist/types/layouts/page-loader/index.d.ts

@@ -0,0 +1,2 @@
+export { PageLoader } from './page-loader';
+export type { PageLoaderProps } from './types';

package/dist/types/layouts/page-loader/page-loader.d.ts

@@ -0,0 +1,11 @@
+import { PageLoaderProps } from './types';
+import * as React from 'react';
+/**
+ * PageLoader component that centers a loading indicator within a flex container
+ *
+ * This component wraps the LoadingIndicator with layout styling to center it
+ * within the available container space, making it ideal for full-page loading states.
+ *
+ * @group Layout
+ */
+export declare const PageLoader: React.ForwardRefExoticComponent<PageLoaderProps & React.RefAttributes<HTMLDivElement>>;

package/dist/types/layouts/page-loader/types.d.ts

@@ -0,0 +1,36 @@
+import { HTMLAttributes } from 'react';
+import { LoadingIndicatorProps } from '../../feedbacks/loading-indicator';
+/**
+ * PageLoaderProps defines the props for the PageLoader component
+ * Extends LoadingIndicatorProps to support all loading indicator configurations
+ * while adding layout-specific functionality
+ */
+export interface PageLoaderProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Type of loading indicator: spinner (default), bar
+     * Spinner is recommended for page loading states
+     */
+    type?: LoadingIndicatorProps['type'];
+    /**
+     * Size of the indicator: sm, md, lg
+     */
+    size?: LoadingIndicatorProps['size'];
+    /**
+     * Color variant based on Versaur color system
+     * Core: primary, secondary, tertiary, ghost, neutral
+     * Semantic: success, info, warning, danger
+     */
+    color?: LoadingIndicatorProps['color'];
+    /**
+     * Accessible label for screen readers
+     */
+    ariaLabel?: LoadingIndicatorProps['ariaLabel'];
+    /**
+     * Optional loading message to display below the indicator
+     */
+    message?: string;
+    /**
+     * Whether to use a minimal height (useful for inline loading states)
+     */
+    minimal?: boolean;
+}

package/dist/types/primitive/card/types.d.ts

@@ -9,7 +9,7 @@ export interface CardProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
      * Size variant affecting padding
      * @default 'md'
      */
-    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    size?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
     /**
      * Shape variant affecting border radius
      * @default 'rounded'

package/dist/utils/enforce-subpath-import.js

@@ -36,6 +36,7 @@ const symbolToSubpath = {
   "PageContent": "layouts",
   "PageHeader": "layouts",
   "PageLayout": "layouts",
+  "PageLoader": "layouts",
   "SideBar": "layouts",
   "TopBar": "layouts",
   "Breadcrumbs": "navigation",

package/package.json

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