@dimasbaguspm/versaur 0.0.10 → 0.0.12

package/dist/{tabs-KyFmo5cA.js → js/tabs-BbOkYchB.js}

@@ -1,7 +1,7 @@
 import { c as d, j as o, a as u } from "./index-DOdDlCoL.js";
-import { forwardRef as f, createContext as m, useContext as g, useState as p, useLayoutEffect as h, useRef as y } from "react";
+import { forwardRef as f, createContext as x, useContext as g, useState as p, useLayoutEffect as y, useRef as h } from "react";
 const w = d(
-  "flex items-center gap-2 text-sm text-slate-700 dark:text-slate-200",
+  "flex items-center gap-2 text-sm text-tertiary",
   {
     variants: {
       separator: {
@@ -18,23 +18,23 @@ const w = d(
   {
     variants: {
       isCurrent: {
-        true: "font-semibold text-slate-900 dark:text-white cursor-default",
-        false: "hover:text-primary focus:text-primary text-slate-700 dark:text-slate-200"
+        true: "font-semibold text-black cursor-default",
+        false: ""
       }
     },
     defaultVariants: {
       isCurrent: !1
     }
   }
-), j = "mx-1 text-slate-400 dark:text-slate-500 select-none", I = f(function({ children: t, icon: r, isCurrent: a, className: s, ...n }, i) {
+), j = "mx-1 text-ghost-400 select-none", I = f(function({ children: t, icon: r, isCurrent: a, className: n, ...s }, i) {
   return /* @__PURE__ */ o.jsx("li", { className: "flex items-center", children: /* @__PURE__ */ o.jsxs(
     "a",
     {
       ref: i,
       "aria-current": a ? "page" : void 0,
       tabIndex: a ? -1 : 0,
-      className: u(T({ isCurrent: a }) + s),
-      ...n,
+      className: u(T({ isCurrent: a }) + n),
+      ...s,
       children: [
         r && /* @__PURE__ */ o.jsx("span", { className: "mr-1 inline-flex", children: r }),
         t
@@ -46,14 +46,14 @@ function V() {
   return /* @__PURE__ */ o.jsx("span", { className: j, "aria-hidden": "true", children: "/" });
 }
 const C = f(
-  function({ children: t, "aria-label": r = "Breadcrumb", ...a }, s) {
-    return /* @__PURE__ */ o.jsx("nav", { "aria-label": r, ...a, children: /* @__PURE__ */ o.jsx("ol", { ref: s, className: w(), children: t }) });
+  function({ children: t, "aria-label": r = "Breadcrumb", ...a }, n) {
+    return /* @__PURE__ */ o.jsx("nav", { "aria-label": r, ...a, children: /* @__PURE__ */ o.jsx("ol", { ref: n, className: w(), children: t }) });
   }
 ), O = Object.assign(C, {
   Item: I,
   Separator: V
-}), x = m(null), v = () => {
-  const e = g(x);
+}), v = x(null), m = () => {
+  const e = g(v);
   if (!e)
     throw new Error("useTabsContext must be used within a TabsProvider");
   return e;
@@ -83,61 +83,61 @@ const C = f(
         variant: "underline",
         color: "primary",
         active: !0,
-        class: "text-coral border-coral"
+        class: "text-primary border-primary"
       },
       {
         variant: "underline",
         color: "primary",
         active: !1,
-        class: "text-foreground hover:text-coral"
+        class: "text-foreground hover:text-primary"
       },
       {
         variant: "underline",
         color: "secondary",
         active: !0,
-        class: "text-sage border-sage"
+        class: "text-secondary border-secondary"
       },
       {
         variant: "underline",
         color: "secondary",
         active: !1,
-        class: "text-foreground hover:text-sage"
+        class: "text-foreground hover:text-secondary"
       },
       {
         variant: "underline",
         color: "tertiary",
         active: !0,
-        class: "text-mist border-mist"
+        class: "text-tertiary border-tertiary"
       },
       {
         variant: "underline",
         color: "tertiary",
         active: !1,
-        class: "text-foreground hover:text-mist"
+        class: "text-foreground hover:text-tertiary"
       },
       {
         variant: "underline",
         color: "ghost",
         active: !0,
-        class: "text-slate border-slate"
+        class: "text-ghost border-ghost"
       },
       {
         variant: "underline",
         color: "ghost",
         active: !1,
-        class: "text-foreground hover:text-slate"
+        class: "text-foreground hover:text-ghost"
       },
       {
         variant: "underline",
         color: "neutral",
         active: !0,
-        class: "text-foreground border-light-gray"
+        class: "text-foreground border-neutral"
       },
       {
         variant: "underline",
         color: "neutral",
         active: !1,
-        class: "text-foreground hover:text-light-gray"
+        class: "text-foreground hover:text-neutral"
       },
       // Filled variant (no color, only white/transparent)
       {
@@ -175,29 +175,29 @@ const C = f(
   {
     variants: {
       color: {
-        primary: "bg-coral",
-        secondary: "bg-sage",
-        tertiary: "bg-mist",
-        ghost: "bg-slate",
-        neutral: "bg-light-gray"
+        primary: "bg-primary",
+        secondary: "bg-secondary",
+        tertiary: "bg-tertiary",
+        ghost: "bg-ghost",
+        neutral: "bg-neutral"
       }
     },
     defaultVariants: {
       color: "primary"
     }
   }
-), k = ({
+), R = ({
   value: e,
   children: t,
   className: r,
   ...a
 }) => {
   const {
-    activeTab: s,
-    setActiveTab: n,
+    activeTab: n,
+    setActiveTab: s,
     color: i,
     variant: c = "underline"
-  } = v(), l = s === e;
+  } = m(), l = n === e;
   return /* @__PURE__ */ o.jsx(
     "button",
     {
@@ -214,24 +214,24 @@ const C = f(
         }),
         r
       ),
-      onClick: () => n(e),
+      onClick: () => s(e),
       type: "button",
       ...a,
       children: t
     }
   );
-}, R = ({
+}, A = ({
   left: e,
   width: t,
   className: r,
   ...a
 }) => {
-  const { color: s } = v();
+  const { color: n } = m();
   return /* @__PURE__ */ o.jsx(
     "div",
     {
       "aria-hidden": !0,
-      className: u(S({ color: s }), r),
+      className: u(S({ color: n }), r),
       style: {
         left: e,
         width: t,
@@ -241,19 +241,19 @@ const C = f(
     }
   );
 };
-function A(e, t, r) {
-  const [a, s] = p({
+function E(e, t, r) {
+  const [a, n] = p({
     left: 0,
     width: 0
   });
-  return h(() => {
+  return y(() => {
     if (!t.current) return;
-    const n = t.current.querySelector(
+    const s = t.current.querySelector(
       `#tabs-trigger-${e}`
     );
-    if (n) {
-      const { offsetLeft: i, offsetWidth: c } = n;
-      s({ left: i, width: c }), n.scrollIntoView({
+    if (s) {
+      const { offsetLeft: i, offsetWidth: c } = s;
+      n({ left: i, width: c }), s.scrollIntoView({
         behavior: "smooth",
         inline: "center",
         block: "nearest"
@@ -261,28 +261,28 @@ function A(e, t, r) {
     }
   }, [e, r, t]), a;
 }
-const E = ({
+const k = ({
   value: e,
   onValueChange: t,
   children: r,
   className: a,
-  color: s = "primary",
-  variant: n = "underline",
+  color: n = "primary",
+  variant: s = "underline",
   ...i
 }) => {
   const c = {
     activeTab: e,
     setActiveTab: t,
-    color: s,
-    variant: n
-  }, l = y(null), b = A(e, l, r);
-  return /* @__PURE__ */ o.jsx(x.Provider, { value: c, children: /* @__PURE__ */ o.jsxs(
+    color: n,
+    variant: s
+  }, l = h(null), b = E(e, l, r);
+  return /* @__PURE__ */ o.jsx(v.Provider, { value: c, children: /* @__PURE__ */ o.jsxs(
     "div",
     {
       role: "tablist",
       className: u(
         N({
-          variant: n
+          variant: s
         }),
         a
       ),
@@ -291,8 +291,8 @@ const E = ({
       ...i,
       children: [
         r,
-        n === "underline" && /* @__PURE__ */ o.jsx(
-          R,
+        s === "underline" && /* @__PURE__ */ o.jsx(
+          A,
           {
             left: b.left,
             width: b.width
@@ -301,8 +301,8 @@ const E = ({
       ]
     }
   ) });
-}, P = Object.assign(E, {
-  Trigger: k
+}, P = Object.assign(k, {
+  Trigger: R
 });
 export {
   O as B,