@dimasbaguspm/versaur 0.0.14 → 0.0.16

package/dist/js/{tile-8hqVMf2m.js → tile-BjhJ5Mvl.js}

@@ -1,7 +1,6 @@
-import { a as b, j as a } from "./index-Dmu_fHni.js";
-import * as g from "react";
-import { forwardRef as d, useState as v, useEffect as x, useCallback as y, useRef as S, createContext as T, useContext as V, useMemo as A } from "react";
-import { c as l } from "./cn-BKwT3erk.js";
+import { c as b, j as n, a as l } from "./index-DOdDlCoL.js";
+import * as u from "react";
+import { forwardRef as d, useState as v, useEffect as x, useCallback as y, useRef as S, createContext as V, useContext as T, useMemo as A } from "react";
 const B = b(
   "relative flex items-center gap-2 rounded-md p-2 text-sm transition-all duration-200",
   {
@@ -138,7 +137,7 @@ const B = b(
     }
   }
 ), C = d(
-  ({ className: e, children: r, ...t }, s) => /* @__PURE__ */ a.jsx("div", { ref: s, className: l(R(), e), ...t, children: r })
+  ({ className: e, children: r, ...t }, s) => /* @__PURE__ */ n.jsx("div", { ref: s, className: l(R(), e), ...t, children: r })
 ), k = d(
   ({
     variant: e = "default",
@@ -146,23 +145,70 @@ const B = b(
     icon: t,
     className: s,
     children: o,
-    ...n
-  }, u) => /* @__PURE__ */ a.jsxs(
+    ...a
+  }, g) => /* @__PURE__ */ n.jsxs(
     "div",
     {
-      ref: u,
+      ref: g,
       role: "alert",
       className: l(B({ variant: e, color: r }), s),
-      ...n,
+      ...a,
       children: [
-        t && /* @__PURE__ */ a.jsx(C, { children: t }),
-        /* @__PURE__ */ a.jsx("div", { className: "flex-1", children: o })
+        t && /* @__PURE__ */ n.jsx(C, { children: t }),
+        /* @__PURE__ */ n.jsx("div", { className: "flex-1", children: o })
       ]
     }
   )
-), ie = Object.assign(k, {
+), le = Object.assign(k, {
   Icon: C
 }), I = b(
+  [
+    "inline-flex items-center transition-colors underline underline-offset-2 focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
+    // pseudo selectors for anchor
+    "hover:no-underline"
+  ],
+  {
+    variants: {
+      color: {
+        primary: "text-primary",
+        secondary: "text-secondary",
+        ghost: "text-ghost",
+        danger: "text-danger",
+        neutral: "text-neutral"
+      }
+    },
+    defaultVariants: {
+      color: "primary"
+    }
+  }
+), O = d(
+  ({
+    children: e,
+    className: r,
+    color: t = "primary",
+    fontSize: s = "base",
+    fontWeight: o = "medium",
+    ...a
+  }, g) => {
+    const i = s ? `text-${s}` : "text-base", f = o ? `font-${o}` : "font-medium";
+    return /* @__PURE__ */ n.jsx(
+      "a",
+      {
+        ref: g,
+        className: l(
+          I({ color: t }),
+          i,
+          f,
+          r
+        ),
+        ...a,
+        children: e
+      }
+    );
+  }
+);
+O.displayName = "Anchor";
+const q = b(
   "inline-flex items-center justify-center font-medium text-white overflow-hidden transition-all duration-200 select-none relative",
   {
     variants: {
@@ -198,28 +244,28 @@ const B = b(
       shape: "circle"
     }
   }
-), O = b(
+), F = b(
   "absolute inset-0 h-full w-full object-cover"
-), q = d(
+), L = d(
   ({
     variant: e = "primary",
     size: r = "md",
     shape: t = "circle",
     className: s,
     children: o,
-    ...n
-  }, u) => /* @__PURE__ */ a.jsx(
+    ...a
+  }, g) => /* @__PURE__ */ n.jsx(
     "div",
     {
-      ref: u,
-      className: l(I({ variant: e, size: r, shape: t }), s),
-      ...n,
+      ref: g,
+      className: l(q({ variant: e, size: r, shape: t }), s),
+      ...a,
       children: o
     }
   )
-), F = d(
-  ({ src: e, alt: r, className: t, onError: s, ...o }, n) => {
-    const [u, i] = v(!1);
+), $ = d(
+  ({ src: e, alt: r, className: t, onError: s, ...o }, a) => {
+    const [g, i] = v(!1);
     x(() => {
       i(!1);
     }, [e]);
@@ -229,24 +275,24 @@ const B = b(
       },
       [s]
     );
-    return u ? null : /* @__PURE__ */ a.jsx(
+    return g ? null : /* @__PURE__ */ n.jsx(
       "img",
       {
-        ref: n,
+        ref: a,
         src: e,
         alt: r,
-        className: l(O(), t),
+        className: l(F(), t),
         onError: f,
         ...o
       }
     );
   }
-), le = Object.assign(q, {
+), ce = Object.assign(L, {
   /**
    * AvatarImage sub-component for displaying images with fallback behavior
    */
-  Image: F
-}), L = b(
+  Image: $
+}), M = b(
   "inline-flex items-center justify-center font-medium transition-all duration-200 select-none gap-1 min-h-[1.25rem]",
   {
     variants: {
@@ -399,51 +445,51 @@ const B = b(
       iconOnly: !1
     }
   }
-), M = d(
+), P = d(
   ({
     variant: e = "default",
     shape: r = "square",
     color: t = "primary",
     size: s = "md",
     iconLeft: o,
-    iconRight: n,
-    className: u,
+    iconRight: a,
+    className: g,
     children: i,
     ...f
   }, c) => {
-    const h = !(i != null && i !== "") && !!(o || n);
-    return /* @__PURE__ */ a.jsx(
+    const h = !(i != null && i !== "") && !!(o || a);
+    return /* @__PURE__ */ n.jsx(
       "span",
       {
         ref: c,
         className: l(
-          L({
+          M({
             variant: e,
             color: t,
             shape: r,
             size: s,
             iconOnly: h
           }),
-          u
+          g
         ),
         ...f,
         children: h ? (
           // Icon-only mode: display only the icon
-          o || n
+          o || a
         ) : (
           // Normal mode: display icon(s) and text
-          /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+          /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
             o,
             i,
-            n
+            a
           ] })
         )
       }
     );
   }
 );
-M.displayName = "Badge";
-const E = (e) => /* @__PURE__ */ g.createElement("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ g.createElement("title", null, "Spenicle"), /* @__PURE__ */ g.createElement("rect", { width: 32, height: 32, fill: "#e07a5f" }), /* @__PURE__ */ g.createElement("g", { transform: "translate(16, 16) scale(0.625) translate(-12, -12)" }, /* @__PURE__ */ g.createElement("path", { d: "M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z", fill: "white" }))), P = (e) => /* @__PURE__ */ g.createElement("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ g.createElement("title", null, "Spenicle"), /* @__PURE__ */ g.createElement("rect", { width: 32, height: 32, rx: 8, fill: "#e07a5f" }), /* @__PURE__ */ g.createElement("g", { transform: "translate(16, 16) scale(0.625) translate(-12, -12)" }, /* @__PURE__ */ g.createElement("path", { d: "M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z", fill: "white" }))), H = (e) => /* @__PURE__ */ g.createElement("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ g.createElement("title", null, "Spenicle"), /* @__PURE__ */ g.createElement("circle", { cx: 16, cy: 16, r: 16, fill: "#e07a5f" }), /* @__PURE__ */ g.createElement("g", { transform: "translate(16, 16) scale(0.625) translate(-12, -12)" }, /* @__PURE__ */ g.createElement("path", { d: "M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z", fill: "white" }))), $ = b("", {
+P.displayName = "Badge";
+const E = (e) => /* @__PURE__ */ u.createElement("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ u.createElement("title", null, "Spenicle"), /* @__PURE__ */ u.createElement("rect", { width: 32, height: 32, fill: "#e07a5f" }), /* @__PURE__ */ u.createElement("g", { transform: "translate(16, 16) scale(0.625) translate(-12, -12)" }, /* @__PURE__ */ u.createElement("path", { d: "M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z", fill: "white" }))), H = (e) => /* @__PURE__ */ u.createElement("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ u.createElement("title", null, "Spenicle"), /* @__PURE__ */ u.createElement("rect", { width: 32, height: 32, rx: 8, fill: "#e07a5f" }), /* @__PURE__ */ u.createElement("g", { transform: "translate(16, 16) scale(0.625) translate(-12, -12)" }, /* @__PURE__ */ u.createElement("path", { d: "M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z", fill: "white" }))), Y = (e) => /* @__PURE__ */ u.createElement("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ u.createElement("title", null, "Spenicle"), /* @__PURE__ */ u.createElement("circle", { cx: 16, cy: 16, r: 16, fill: "#e07a5f" }), /* @__PURE__ */ u.createElement("g", { transform: "translate(16, 16) scale(0.625) translate(-12, -12)" }, /* @__PURE__ */ u.createElement("path", { d: "M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z", fill: "white" }))), _ = b("", {
   variants: {
     size: {
       xs: "h-6 w-6",
@@ -456,33 +502,33 @@ const E = (e) => /* @__PURE__ */ g.createElement("svg", { width: 32, height: 32,
   defaultVariants: {
     size: "md"
   }
-}), Y = d(
+}), D = d(
   ({ shape: e = "square", size: r, ...t }, s) => {
-    const n = {
+    const a = {
       square: E,
-      rounded: P,
-      circle: H
+      rounded: H,
+      circle: Y
     }[e] || E;
-    return /* @__PURE__ */ a.jsx(
-      n,
+    return /* @__PURE__ */ n.jsx(
+      a,
       {
         ref: s,
         ...t,
-        className: l("inline-block", $({ size: r }))
+        className: l("inline-block", _({ size: r }))
       }
     );
   }
-), ce = d(
-  ({ name: e = "spenicle", size: r = "md", shape: t, ...s }, o) => /* @__PURE__ */ a.jsx(
+), de = d(
+  ({ name: e = "spenicle", size: r = "md", shape: t, ...s }, o) => /* @__PURE__ */ n.jsx(
     "span",
     {
       ref: o,
       className: l("inline-flex items-center gap-2"),
       ...s,
-      children: /* @__PURE__ */ a.jsx(Y, { shape: t, size: r, "aria-hidden": "true" })
+      children: /* @__PURE__ */ n.jsx(D, { shape: t, size: r, "aria-hidden": "true" })
     }
   )
-), _ = b(
+), G = b(
   [
     "inline-flex items-center justify-center gap-2",
     "rounded-lg",
@@ -549,8 +595,8 @@ const E = (e) => /* @__PURE__ */ g.createElement("svg", { width: 32, height: 32,
     }
   }
 );
-function D(e, r = "1rem") {
-  const t = S(null), [s, o] = v({}), [n, u] = v("fixed bottom-4 right-4"), i = y(() => {
+function J(e, r = "1rem") {
+  const t = S(null), [s, o] = v({}), [a, g] = v("fixed bottom-4 right-4"), i = y(() => {
     const c = t.current;
     if (!c) return;
     const m = c.getBoundingClientRect().height > window.innerHeight;
@@ -564,7 +610,7 @@ function D(e, r = "1rem") {
       position: "fixed",
       bottom: r,
       zIndex: 50
-    }, p = `fixed bottom-4 ${e}-4`), o(h), u(p);
+    }, p = `fixed bottom-4 ${e}-4`), o(h), g(p);
   }, [e, r]);
   return x(() => {
     i();
@@ -579,40 +625,40 @@ function D(e, r = "1rem") {
       t.current = c, c && i();
     },
     [i]
-  ), s, n];
+  ), s, a];
 }
-const de = d(
+const ge = d(
   function({
     className: r,
     variant: t = "primary",
     size: s = "md",
     side: o = "right",
-    offset: n = "1rem",
-    ...u
+    offset: a = "1rem",
+    ...g
   }, i) {
-    const [f, c, w] = D(
+    const [f, c, w] = J(
       o,
-      n
+      a
     ), [m, h] = v(!1);
     return x(() => {
       h(!0);
-    }, []), /* @__PURE__ */ a.jsx("div", { ref: f, children: /* @__PURE__ */ a.jsx(
+    }, []), /* @__PURE__ */ n.jsx("div", { ref: f, children: /* @__PURE__ */ n.jsx(
       "button",
       {
         ref: i,
-        type: u.type || "button",
+        type: g.type || "button",
         className: l(
-          _({ variant: t, size: s }),
+          G({ variant: t, size: s }),
           w,
           m && "animate-fab-in",
           r
         ),
         style: c,
-        ...u
+        ...g
       }
     ) });
   }
-), G = b(
+), K = b(
   "flex items-center gap-2 px-4 py-2 rounded-sm w-fit relative shadow-sm",
   {
     variants: {
@@ -627,10 +673,10 @@ const de = d(
       color: "success"
     }
   }
-), J = ({
+), Q = ({
   children: e,
   ...r
-}) => /* @__PURE__ */ a.jsx(
+}) => /* @__PURE__ */ n.jsx(
   "span",
   {
     className: "flex-1 truncate text-sm",
@@ -638,27 +684,27 @@ const de = d(
     ...r,
     children: e
   }
-), K = ({
+), U = ({
   children: e,
   ...r
-}) => /* @__PURE__ */ a.jsx("span", { className: "ml-2", "data-testid": "snackbar-action", ...r, children: e }), ge = d(
-  ({ children: e, action: r, color: t, className: s, ...o }, n) => /* @__PURE__ */ a.jsxs(
+}) => /* @__PURE__ */ n.jsx("span", { className: "ml-2", "data-testid": "snackbar-action", ...r, children: e }), ue = d(
+  ({ children: e, action: r, color: t, className: s, ...o }, a) => /* @__PURE__ */ n.jsxs(
     "div",
     {
-      ref: n,
+      ref: a,
       role: "status",
       "aria-live": "polite",
-      className: l(G({ color: t }), s),
+      className: l(K({ color: t }), s),
       ...o,
       children: [
-        /* @__PURE__ */ a.jsx(J, { children: e }),
-        r && /* @__PURE__ */ a.jsx(K, { children: r })
+        /* @__PURE__ */ n.jsx(Q, { children: e }),
+        r && /* @__PURE__ */ n.jsx(U, { children: r })
       ]
     }
   )
-), z = T(null), Q = z.Provider;
+), z = V(null), W = z.Provider;
 function N() {
-  const e = V(z);
+  const e = T(z);
   if (!e)
     throw new Error("Table compound components must be used within <Table>");
   return e;
@@ -694,7 +740,7 @@ const j = (e) => {
     default:
       return "grid-cols-2";
   }
-}, U = (e) => {
+}, X = (e) => {
   if (e < 1 || e > 12)
     throw new Error("Column span must be between 1 and 12");
   switch (e) {
@@ -725,17 +771,17 @@ const j = (e) => {
     default:
       return "col-span-2";
   }
-}, W = d(
+}, Z = d(
   ({ children: e, className: r, ...t }, s) => {
     const { maxColumns: o } = N();
-    return /* @__PURE__ */ a.jsx(
+    return /* @__PURE__ */ n.jsx(
       "div",
       {
         role: "rowgroup",
         className: l("bg-neutral-soft", r),
         ...t,
         ref: s,
-        children: /* @__PURE__ */ a.jsx(
+        children: /* @__PURE__ */ n.jsx(
           "div",
           {
             role: "row",
@@ -746,19 +792,19 @@ const j = (e) => {
       }
     );
   }
-), X = d(
-  ({ children: e, className: r, ...t }, s) => /* @__PURE__ */ a.jsx("div", { role: "rowgroup", ref: s, className: l(r), ...t, children: e })
-), Z = d(
+), ee = d(
+  ({ children: e, className: r, ...t }, s) => /* @__PURE__ */ n.jsx("div", { role: "rowgroup", ref: s, className: l(r), ...t, children: e })
+), re = d(
   ({ children: e, className: r, ...t }, s) => {
     const { maxColumns: o } = N();
-    return /* @__PURE__ */ a.jsx(
+    return /* @__PURE__ */ n.jsx(
       "div",
       {
         role: "rowgroup",
         className: l("bg-neutral-soft", r),
         ...t,
         ref: s,
-        children: /* @__PURE__ */ a.jsx(
+        children: /* @__PURE__ */ n.jsx(
           "div",
           {
             role: "row",
@@ -769,10 +815,10 @@ const j = (e) => {
       }
     );
   }
-), ee = d(
+), te = d(
   ({ children: e, className: r, ...t }, s) => {
     const { maxColumns: o } = N();
-    return /* @__PURE__ */ a.jsx(
+    return /* @__PURE__ */ n.jsx(
       "div",
       {
         role: "row",
@@ -788,34 +834,34 @@ const j = (e) => {
       }
     );
   }
-), re = d(
-  ({ as: e = "td", span: r, align: t = "left", children: s, className: o, ...n }, u) => {
+), se = d(
+  ({ as: e = "td", span: r, align: t = "left", children: s, className: o, ...a }, g) => {
     const i = e === "th" ? "columnheader" : "cell";
     let f = "text-left";
-    return t === "center" ? f = "text-center" : t === "right" && (f = "text-right"), /* @__PURE__ */ a.jsx(
+    return t === "center" ? f = "text-center" : t === "right" && (f = "text-right"), /* @__PURE__ */ n.jsx(
       "div",
       {
-        ref: u,
+        ref: g,
         role: i,
         className: l(
           "px-4 py-2",
           "[&:not(:last-child)]:border-r [&:not(:last-child)]:border-border",
-          U(r),
+          X(r),
           f,
           o
         ),
-        ...n,
+        ...a,
         children: s
       }
     );
   }
-), te = d(
+), oe = d(
   ({ children: e, className: r, maxColumns: t = 12, ...s }, o) => {
-    const n = A(
+    const a = A(
       () => ({ maxColumns: t }),
       [t]
     );
-    return /* @__PURE__ */ a.jsx(Q, { value: n, children: /* @__PURE__ */ a.jsx(
+    return /* @__PURE__ */ n.jsx(W, { value: a, children: /* @__PURE__ */ n.jsx(
       "div",
       {
         ref: o,
@@ -829,13 +875,13 @@ const j = (e) => {
       }
     ) });
   }
-), ue = Object.assign(te, {
-  Header: W,
-  Body: X,
-  Footer: Z,
-  Row: ee,
-  Column: re
-}), se = b(
+), fe = Object.assign(oe, {
+  Header: Z,
+  Body: ee,
+  Footer: re,
+  Row: te,
+  Column: se
+}), ne = b(
   // Base classes
   "block transition-colors duration-200",
   {
@@ -870,23 +916,24 @@ const j = (e) => {
       shape: "rounded"
     }
   }
-), fe = d(
-  ({ variant: e = "white", size: r = "md", shape: t = "rounded", className: s, ...o }, n) => /* @__PURE__ */ a.jsx(
+), be = d(
+  ({ variant: e = "white", size: r = "md", shape: t = "rounded", className: s, ...o }, a) => /* @__PURE__ */ n.jsx(
     "div",
     {
-      ref: n,
-      className: l(se({ variant: e, size: r, shape: t }), s),
+      ref: a,
+      className: l(ne({ variant: e, size: r, shape: t }), s),
       ...o
     }
   )
 );
 export {
-  ie as A,
-  M as B,
-  ge as S,
-  ue as T,
-  le as a,
+  le as A,
+  P as B,
+  ue as S,
+  fe as T,
+  O as a,
   ce as b,
   de as c,
-  fe as d
+  ge as d,
+  be as e
 };

package/dist/types/overlays/bottom-sheet/index.d.ts

@@ -1,2 +1,2 @@
-export * from './bottom-sheet';
+export { BottomSheet } from './bottom-sheet';
 export * from './types';

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

@@ -1,4 +1,5 @@
 export * from './alert';
+export * from './anchor';
 export * from './avatar';
 export * from './badge';
 export * from './brand';

package/package.json

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