@dimasbaguspm/versaur 0.0.27 → 0.0.28

package/dist/js/{top-bar-BA88ij4M.js → top-bar-BqLv8_hy.js}

@@ -1,9 +1,9 @@
 import { c as i, j as r, a as l } from "./index-DOdDlCoL.js";
 import * as b from "react";
 import { forwardRef as o } from "react";
-import { i as d } from "./image-rectangle-BGLYH2Gl.js";
+import { i as u } from "./image-rectangle-C1zMt0DR.js";
 import "./snackbar-DH8jCh2V.js";
-const h = i(
+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 +19,7 @@ const h = i(
       variant: "primary"
     }
   }
-), j = i(
+), h = i(
   "flex flex-col justify-center min-w-0 flex-grow",
   {
     variants: {
@@ -54,7 +54,7 @@ const h = i(
     }
   )
 ), w = o(({ children: t, ...a }, e) => /* @__PURE__ */ r.jsx(
-  d,
+  u,
   {
     ...a,
     as: "h1",
@@ -66,7 +66,7 @@ const h = i(
     children: t
   }
 )), N = o(({ children: t, ...a }, e) => /* @__PURE__ */ r.jsx(
-  d,
+  u,
   {
     ...a,
     ref: e,
@@ -93,7 +93,7 @@ const h = i(
     "div",
     {
       ref: s,
-      className: l(j({ placement: e }), a),
+      className: l(h({ placement: e }), a),
       children: t
     }
   )
@@ -104,18 +104,18 @@ const h = i(
 }) => /* @__PURE__ */ r.jsx(
   "header",
   {
-    className: l(h({ variant: e }), a),
+    className: l(j({ variant: e }), a),
     role: "banner",
     children: t
   }
-), ya = Object.assign(T, {
+), Ba = Object.assign(T, {
   Leading: B,
   Headline: w,
   Subtitle: N,
   Trailing: V,
   Center: S,
   Bottom: y
-}), H = i(
+}), z = i(
   "sticky bottom-0 left-0 w-full flex justify-between items-center bg-white border-t border-border shadow-xs z-40 safe-bottom px-8 py-1",
   {
     variants: {
@@ -137,7 +137,7 @@ const h = i(
       size: "md"
     }
   }
-), A = i(
+), H = i(
   "flex flex-col items-center justify-center gap-1 px-2 py-1 select-none",
   {
     variants: {
@@ -150,13 +150,13 @@ const h = i(
       active: !1
     }
   }
-), z = o(
+), C = o(
   ({ icon: t, label: a, active: e = !1, className: s, ...n }, c) => /* @__PURE__ */ r.jsxs(
     "div",
     {
       ref: c,
       "aria-current": e ? "page" : void 0,
-      className: A({ active: e, className: s }),
+      className: H({ active: e, className: s }),
       ...n,
       children: [
         t,
@@ -164,7 +164,7 @@ const h = i(
       ]
     }
   )
-), L = ({
+), A = ({
   children: t,
   variant: a = "primary",
   size: e = "md",
@@ -175,13 +175,13 @@ const h = i(
   {
     role: "navigation",
     "aria-label": "Bottom navigation",
-    className: H({ variant: a, size: e, className: s }),
+    className: z({ variant: a, size: e, className: s }),
     ...n,
     children: t
   }
-), Ba = Object.assign(L, {
-  Item: z
-}), P = i("flex", {
+), wa = Object.assign(A, {
+  Item: C
+}), L = i("flex", {
   variants: {
     orientation: {
       horizontal: "flex-row",
@@ -213,7 +213,68 @@ const h = i(
     gap: "md",
     fluid: !1
   }
-}), wa = o(
+}), Na = o(
+  function({
+    className: a,
+    children: e,
+    orientation: s = "horizontal",
+    alignment: n = "start",
+    gap: c = "md",
+    fluid: p = !1,
+    ...m
+  }, d) {
+    return /* @__PURE__ */ r.jsx(
+      "div",
+      {
+        ref: d,
+        className: l(
+          L({
+            orientation: s,
+            alignment: n,
+            gap: c,
+            fluid: p
+          }),
+          a
+        ),
+        role: "group",
+        ...m,
+        children: e
+      }
+    );
+  }
+), P = i("flex", {
+  variants: {
+    orientation: {
+      horizontal: "flex-row",
+      vertical: "flex-col"
+    },
+    alignment: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    gap: {
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6"
+    },
+    fluid: {
+      true: "[&>*]:flex-1",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    alignment: "start",
+    gap: "md",
+    fluid: !1
+  }
+}), Va = o(
   function({
     className: a,
     children: e,
@@ -222,11 +283,11 @@ const h = i(
     gap: c = "md",
     fluid: p = !1,
     ...m
-  }, u) {
+  }, d) {
     return /* @__PURE__ */ r.jsx(
       "div",
       {
-        ref: u,
+        ref: d,
         className: l(
           P({
             orientation: s,
@@ -242,7 +303,7 @@ const h = i(
       }
     );
   }
-), C = i("flex", {
+), G = i("flex flex-wrap items-center", {
   variants: {
     orientation: {
       horizontal: "flex-row",
@@ -274,7 +335,7 @@ const h = i(
     gap: "md",
     fluid: !1
   }
-}), Na = o(
+}), Sa = o(
   function({
     className: a,
     children: e,
@@ -283,13 +344,13 @@ const h = i(
     gap: c = "md",
     fluid: p = !1,
     ...m
-  }, u) {
+  }, d) {
     return /* @__PURE__ */ r.jsx(
       "div",
       {
-        ref: u,
+        ref: d,
         className: l(
-          C({
+          G({
             orientation: s,
             alignment: n,
             gap: c,
@@ -303,7 +364,7 @@ const h = i(
       }
     );
   }
-), R = i("w-full px-4 sm:px-6 py-6 sm:py-8"), Va = o(
+), R = i("w-full px-4 sm:px-6 py-6 sm:py-8"), Ta = o(
   ({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
     "div",
     {
@@ -315,13 +376,13 @@ const h = i(
   )
 ), I = i("w-full mt-4"), k = i(
   "flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4 px-4 sm:px-6 mb-4"
-), G = i("mb-4 px-4 sm:px-6"), F = i(
+), F = i("mb-4 px-4 sm:px-6"), O = i(
   "flex-1 min-w-0 flex flex-col gap-2 w-full sm:w-auto"
-), O = i("flex items-center gap-2 flex-wrap"), W = i(
+), W = i("flex items-center gap-2 flex-wrap"), M = i(
   "flex flex-col sm:flex-row gap-2 sm:gap-3 w-full sm:w-auto sm:ml-auto sm:shrink-0 [&>*]:w-full sm:[&>*]:w-auto"
-), M = i(
+), E = i(
   "w-full flex items-center px-4 sm:px-6 py-0 overflow-x-auto"
-), E = o(
+), $ = o(
   ({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
     "div",
     {
@@ -332,26 +393,26 @@ const h = i(
       children: t
     }
   )
-), $ = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+), q = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
   "div",
   {
     ref: s,
-    className: l(G(), a),
+    className: l(F(), a),
     "data-versaur-page-header-breadcrumbs": !0,
     ...e,
     children: t
   }
-)), q = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), D = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
   "div",
   {
     ref: s,
-    className: l(F(), a),
+    className: l(O(), a),
     "data-versaur-page-header-content": !0,
     ...e,
     children: t
   }
-)), D = o((t, a) => /* @__PURE__ */ r.jsx(
-  d,
+)), J = o((t, a) => /* @__PURE__ */ r.jsx(
+  u,
   {
     ...t,
     as: "h1",
@@ -360,8 +421,8 @@ const h = i(
     ellipsis: !0,
     ref: a
   }
-)), J = o(({ className: t, ...a }, e) => /* @__PURE__ */ r.jsx(
-  d,
+)), K = o(({ className: t, ...a }, e) => /* @__PURE__ */ r.jsx(
+  u,
   {
     as: "p",
     fontSize: "sm",
@@ -371,34 +432,34 @@ const h = i(
     className: l("mb-2 sm:clamp-3", t),
     ...a
   }
-)), K = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), Q = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
   "div",
   {
     ref: s,
-    className: l(O(), a),
+    className: l(W(), a),
     "data-versaur-page-header-badges": !0,
     ...e,
     children: t
   }
-)), Q = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), U = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
   "div",
   {
     ref: s,
-    className: l(W(), a),
+    className: l(M(), a),
     "data-versaur-page-header-actions": !0,
     ...e,
     children: t
   }
-)), U = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
+)), X = o(({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx(
   "div",
   {
     ref: s,
-    className: l(M(), a),
+    className: l(E(), a),
     "data-versaur-page-header-bottom": !0,
     ...e,
     children: t
   }
-)), X = o(
+)), Y = o(
   ({
     children: t,
     className: a,
@@ -408,7 +469,7 @@ const h = i(
     badges: c,
     actions: p,
     tabs: m,
-    ...u
+    ...d
   }, f) => {
     const g = e || s || n || c || p, v = m;
     return /* @__PURE__ */ r.jsxs(
@@ -417,24 +478,24 @@ const h = i(
         ref: f,
         className: l(I(), a),
         role: "banner",
-        ...u,
+        ...d,
         children: [
-          n && /* @__PURE__ */ r.jsx($, { children: n }),
-          g && /* @__PURE__ */ r.jsxs(E, { children: [
-            /* @__PURE__ */ r.jsxs(q, { children: [
-              e && /* @__PURE__ */ r.jsx(D, { children: e }),
-              s && /* @__PURE__ */ r.jsx(J, { children: s }),
-              c && /* @__PURE__ */ r.jsx(K, { children: c })
+          n && /* @__PURE__ */ r.jsx(q, { children: n }),
+          g && /* @__PURE__ */ r.jsxs($, { children: [
+            /* @__PURE__ */ r.jsxs(D, { children: [
+              e && /* @__PURE__ */ r.jsx(J, { children: e }),
+              s && /* @__PURE__ */ r.jsx(K, { children: s }),
+              c && /* @__PURE__ */ r.jsx(Q, { children: c })
             ] }),
-            p && /* @__PURE__ */ r.jsx(Q, { children: p })
+            p && /* @__PURE__ */ r.jsx(U, { children: p })
           ] }),
-          v && /* @__PURE__ */ r.jsx(U, { children: m }),
+          v && /* @__PURE__ */ r.jsx(X, { children: m }),
           t
         ]
       }
     );
   }
-), Sa = X, Y = i("w-full mx-auto relative", {
+), za = Y, Z = i("w-full mx-auto relative", {
   variants: {
     type: {
       desktop: "max-w-7xl px-6 pb-10",
@@ -445,19 +506,19 @@ const h = i(
   defaultVariants: {
     type: "desktop"
   }
-}), Ta = b.forwardRef(
+}), Ha = b.forwardRef(
   function({ type: a = "desktop", className: e, children: s, ...n }, c) {
     return /* @__PURE__ */ r.jsx(
       "div",
       {
         ref: c,
-        className: l(Y({ type: a }), e),
+        className: l(Z({ type: a }), e),
         ...n,
         children: s
       }
     );
   }
-), Z = i("grid w-full gap-4 grid-cols-12"), _ = i("", {
+), _ = i("grid w-full gap-4 grid-cols-12"), aa = i("", {
   variants: {
     span: {
       1: "col-span-1",
@@ -477,19 +538,19 @@ const h = i(
   defaultVariants: {
     span: "4"
   }
-}), aa = o(
+}), ea = o(
   function({ className: a, children: e, ...s }, n) {
     return /* @__PURE__ */ r.jsx(
       "div",
       {
         ref: n,
-        className: l(Z(), a),
+        className: l(_(), a),
         ...s,
         children: e
       }
     );
   }
-), ea = o(
+), ta = o(
   function({ span: a = 4, className: e, children: s, ...n }, c) {
     const p = Math.min(12, Math.max(1, a));
     return /* @__PURE__ */ r.jsx(
@@ -497,7 +558,7 @@ const h = i(
       {
         ref: c,
         className: l(
-          _({ span: `${p}` }),
+          aa({ span: `${p}` }),
           e
         ),
         ...n,
@@ -505,8 +566,8 @@ const h = i(
       }
     );
   }
-), Ha = Object.assign(aa, {
-  Column: ea
+), Ca = Object.assign(ea, {
+  Column: ta
 }), x = i(
   "flex items-center gap-2 px-4 py-2 rounded-md hover:text-primary focus:outline-none transition-colors",
   {
@@ -525,7 +586,7 @@ const h = i(
       disabled: !1
     }
   }
-), ta = o(
+), sa = o(
   (t, a) => {
     const { icon: e, children: s, href: n, onClick: c, active: p, ...m } = t;
     if (typeof n == "string") {
@@ -542,7 +603,7 @@ const h = i(
           ...f,
           children: [
             e,
-            /* @__PURE__ */ r.jsx(d, { as: "span", color: "inherit", fontSize: "sm", children: s })
+            /* @__PURE__ */ r.jsx(u, { as: "span", color: "inherit", fontSize: "sm", children: s })
           ]
         }
       ) });
@@ -561,17 +622,17 @@ const h = i(
           ...f,
           children: [
             e,
-            /* @__PURE__ */ r.jsx(d, { as: "span", color: "inherit", fontSize: "sm", children: s })
+            /* @__PURE__ */ r.jsx(u, { as: "span", color: "inherit", fontSize: "sm", children: s })
           ]
         }
       ) });
     }
   }
-), sa = o(
+), ra = 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(
-        d,
+        u,
         {
           as: "h2",
           fontSize: "xs",
@@ -584,7 +645,7 @@ const h = i(
       /* @__PURE__ */ r.jsx("ul", { className: "flex flex-col gap-1", children: a })
     ] });
   }
-), ra = o(
+), na = o(
   ({ children: t, ...a }, e) => /* @__PURE__ */ r.jsx(
     "nav",
     {
@@ -595,16 +656,16 @@ const h = i(
       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 }) })
     }
   )
-), Aa = Object.assign(ra, {
-  Item: ta,
-  Group: sa
-}), na = i(
+), Aa = Object.assign(na, {
+  Item: sa,
+  Group: ra
+}), oa = i(
   "w-full flex items-center px-6 py-4 mb-6 border-b border-border shadow-xs bg-white",
   {
     variants: {},
     defaultVariants: {}
   }
-), oa = i("flex items-center gap-3 min-w-0 flex-1"), ia = i("flex items-center gap-2 ml-auto"), la = i(
+), ia = i("flex items-center gap-3 min-w-0 flex-1"), la = i("flex items-center gap-2 ml-auto"), ca = i(
   "px-2.5 py-1.5 rounded-md text-sm cursor-pointer transition-colors",
   {
     variants: {
@@ -617,53 +678,54 @@ const h = i(
       active: !1
     }
   }
-), ca = i("flex items-center gap-2 ml-4"), pa = i("flex items-center gap-2 mr-4"), ma = o(
-  function({ children: a, className: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsx("nav", { ref: n, className: ca({ className: e }), ...s, children: a });
-  }
-), da = o(
+), pa = i("flex items-center gap-2 ml-4"), ma = i("flex items-center gap-2 mr-4"), da = o(
   function({ children: a, className: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsx("div", { ref: n, className: pa({ className: e }), ...s, children: a });
+    return /* @__PURE__ */ r.jsx("nav", { ref: n, className: pa({ className: e }), ...s, children: a });
   }
 ), ua = o(
   function({ children: a, className: e, ...s }, n) {
-    return /* @__PURE__ */ r.jsx("div", { ref: n, className: oa({ className: e }), ...s, children: a });
+    return /* @__PURE__ */ r.jsx("div", { ref: n, className: ma({ className: e }), ...s, children: a });
   }
 ), fa = o(
   function({ children: a, className: e, ...s }, n) {
     return /* @__PURE__ */ r.jsx("div", { ref: n, className: ia({ className: e }), ...s, children: a });
   }
 ), xa = o(
+  function({ children: a, className: e, ...s }, n) {
+    return /* @__PURE__ */ r.jsx("div", { ref: n, className: la({ className: e }), ...s, children: a });
+  }
+), ga = o(
   function({ children: a, className: e, active: s, ...n }, c) {
     return /* @__PURE__ */ r.jsx(
       "div",
       {
         ref: c,
-        className: la({ active: s, className: e }),
+        className: ca({ active: s, className: e }),
         "aria-current": s ? "page" : void 0,
         ...n,
         children: a
       }
     );
   }
-), ga = o(
-  ({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx("header", { ref: s, className: na({ className: a }), ...e, children: t })
-), za = Object.assign(ga, {
-  Leading: ua,
-  Trailing: fa,
-  NavItem: xa,
-  Nav: ma,
-  Actions: da
+), va = o(
+  ({ children: t, className: a, ...e }, s) => /* @__PURE__ */ r.jsx("header", { ref: s, className: oa({ className: a }), ...e, children: t })
+), La = Object.assign(va, {
+  Leading: fa,
+  Trailing: xa,
+  NavItem: ga,
+  Nav: da,
+  Actions: ua
 });
 export {
-  ya as A,
-  Ba as B,
-  Ha as F,
-  Va as P,
+  Ba as A,
+  wa as B,
+  Sa as F,
+  Ta as P,
   Aa as S,
-  za as T,
-  wa as a,
-  Na as b,
-  Sa as c,
-  Ta as d
+  La as T,
+  Na as a,
+  Va as b,
+  za as c,
+  Ha as d,
+  Ca as e
 };

package/dist/types/forms/drawer-input/types.d.ts

@@ -13,6 +13,6 @@ export interface DrawerInputContextValue {
  * @property {(open: boolean) => void} onOpenChange - Callback for drawer open state change
  * @property {React.ReactNode} children - Drawer content
  */
-export interface DrawerInputProps extends Omit<TextInputProps, 'readOnly' | 'children'>, Pick<DrawerProps, 'size' | 'position'> {
+export interface DrawerInputProps extends Omit<TextInputProps, 'readOnly' | 'children'>, Pick<DrawerProps, 'size' | 'position' | 'disableEscapeKeyDown' | 'disableOverlayClickToClose'> {
     children: (ctx: DrawerInputContextValue) => ReactNode;
 }

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

@@ -0,0 +1,27 @@
+import { FilterChipGroupProps } from './types';
+/**
+ * FilterChipGroup provides layout management for filter chips with control over
+ * positioning, alignment, and fluid behavior
+ *
+ * @example
+ * <FilterChipGroup alignment="center" gap="sm">
+ *   <FilterChip active>Category 1</FilterChip>
+ *   <FilterChip>Category 2</FilterChip>
+ * </FilterChipGroup>
+ *
+ * @example
+ * // Vertical filter chip group
+ * <FilterChipGroup orientation="vertical" fluid>
+ *   <FilterChip active>Category 1</FilterChip>
+ *   <FilterChip>Category 2</FilterChip>
+ *   <FilterChip>Category 3</FilterChip>
+ * </FilterChipGroup>
+ *
+ * @example
+ * // Fluid filter chips with space between
+ * <FilterChipGroup alignment="between" fluid>
+ *   <FilterChip>Clear All</FilterChip>
+ *   <FilterChip active>Apply</FilterChip>
+ * </FilterChipGroup>
+ */
+export declare const FilterChipGroup: import('react').ForwardRefExoticComponent<FilterChipGroupProps & import('react').RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,2 @@
+export { FilterChipGroup } from './filter-chip-group';
+export type { FilterChipGroupProps } from './types';

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

@@ -0,0 +1,32 @@
+import { HTMLAttributes, ReactNode } from 'react';
+import { VariantProps } from '../../utils/variants';
+import { filterChipGroupVariants } from './helpers';
+/**
+ * Props for the FilterChipGroup component
+ */
+export interface FilterChipGroupProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof filterChipGroupVariants> {
+    /**
+     * Children (should be FilterChip components)
+     */
+    children: ReactNode;
+    /**
+     * Alignment of filter chips within the group
+     * @default 'start'
+     */
+    alignment?: 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
+    /**
+     * Whether filter chips should be fluid (full width)
+     * @default false
+     */
+    fluid?: boolean;
+    /**
+     * Orientation of the filter chip group
+     * @default 'horizontal'
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * Size of the gap between filter chips
+     * @default 'md'
+     */
+    gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+}

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

@@ -2,6 +2,7 @@ export * from './app-bar';
 export * from './bottom-bar';
 export * from './badge-group';
 export * from './button-group';
+export * from './filter-chip-group';
 export * from './page-content';
 export * from './page-header';
 export * from './page-layout';