cekat-ui 1.0.0 → 1.0.2

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export * from '../stories/Button';
+export * from '../stories/Checkbox';
+export * from '../stories/Radio';
+export * from '../stories/Toggle';
+export * from '../stories/Tooltip';

package/dist/index.es.js

@@ -1 +1,754 @@
-
+import * as k from "react";
+import D from "react";
+var C = { exports: {} }, j = {};
+var B;
+function ue() {
+  if (B) return j;
+  B = 1;
+  var r = /* @__PURE__ */ Symbol.for("react.transitional.element"), o = /* @__PURE__ */ Symbol.for("react.fragment");
+  function t(a, s, l) {
+    var b = null;
+    if (l !== void 0 && (b = "" + l), s.key !== void 0 && (b = "" + s.key), "key" in s) {
+      l = {};
+      for (var c in s)
+        c !== "key" && (l[c] = s[c]);
+    } else l = s;
+    return s = l.ref, {
+      $$typeof: r,
+      type: a,
+      key: b,
+      ref: s !== void 0 ? s : null,
+      props: l
+    };
+  }
+  return j.Fragment = o, j.jsx = t, j.jsxs = t, j;
+}
+var N = {};
+var G;
+function ce() {
+  return G || (G = 1, process.env.NODE_ENV !== "production" && (function() {
+    function r(e) {
+      if (e == null) return null;
+      if (typeof e == "function")
+        return e.$$typeof === se ? null : e.displayName || e.name || null;
+      if (typeof e == "string") return e;
+      switch (e) {
+        case g:
+          return "Fragment";
+        case Q:
+          return "Profiler";
+        case Z:
+          return "StrictMode";
+        case re:
+          return "Suspense";
+        case ae:
+          return "SuspenseList";
+        case ne:
+          return "Activity";
+      }
+      if (typeof e == "object")
+        switch (typeof e.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), e.$$typeof) {
+          case _:
+            return "Portal";
+          case ee:
+            return e.displayName || "Context";
+          case K:
+            return (e._context.displayName || "Context") + ".Consumer";
+          case te:
+            var n = e.render;
+            return e = e.displayName, e || (e = n.displayName || n.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case oe:
+            return n = e.displayName || null, n !== null ? n : r(e.type) || "Memo";
+          case O:
+            n = e._payload, e = e._init;
+            try {
+              return r(e(n));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function o(e) {
+      return "" + e;
+    }
+    function t(e) {
+      try {
+        o(e);
+        var n = !1;
+      } catch {
+        n = !0;
+      }
+      if (n) {
+        n = console;
+        var i = n.error, d = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return i.call(
+          n,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          d
+        ), o(e);
+      }
+    }
+    function a(e) {
+      if (e === g) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === O)
+        return "<...>";
+      try {
+        var n = r(e);
+        return n ? "<" + n + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function s() {
+      var e = A.A;
+      return e === null ? null : e.getOwner();
+    }
+    function l() {
+      return Error("react-stack-top-frame");
+    }
+    function b(e) {
+      if (F.call(e, "key")) {
+        var n = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (n && n.isReactWarning) return !1;
+      }
+      return e.key !== void 0;
+    }
+    function c(e, n) {
+      function i() {
+        Y || (Y = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          n
+        ));
+      }
+      i.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: i,
+        configurable: !0
+      });
+    }
+    function p() {
+      var e = r(this.type);
+      return z[e] || (z[e] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), e = this.props.ref, e !== void 0 ? e : null;
+    }
+    function u(e, n, i, d, S, V) {
+      var f = i.ref;
+      return e = {
+        $$typeof: w,
+        type: e,
+        key: n,
+        props: i,
+        _owner: d
+      }, (f !== void 0 ? f : null) !== null ? Object.defineProperty(e, "ref", {
+        enumerable: !1,
+        get: p
+      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(e, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(e, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: S
+      }), Object.defineProperty(e, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: V
+      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+    }
+    function h(e, n, i, d, S, V) {
+      var f = n.children;
+      if (f !== void 0)
+        if (d)
+          if (le(f)) {
+            for (d = 0; d < f.length; d++)
+              v(f[d]);
+            Object.freeze && Object.freeze(f);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else v(f);
+      if (F.call(n, "key")) {
+        f = r(e);
+        var E = Object.keys(n).filter(function(ie) {
+          return ie !== "key";
+        });
+        d = 0 < E.length ? "{key: someKey, " + E.join(": ..., ") + ": ...}" : "{key: someKey}", M[f + d] || (E = 0 < E.length ? "{" + E.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          d,
+          f,
+          E,
+          f
+        ), M[f + d] = !0);
+      }
+      if (f = null, i !== void 0 && (t(i), f = "" + i), b(n) && (t(n.key), f = "" + n.key), "key" in n) {
+        i = {};
+        for (var I in n)
+          I !== "key" && (i[I] = n[I]);
+      } else i = n;
+      return f && c(
+        i,
+        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
+      ), u(
+        e,
+        f,
+        i,
+        s(),
+        S,
+        V
+      );
+    }
+    function v(e) {
+      x(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === O && (e._payload.status === "fulfilled" ? x(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    }
+    function x(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === w;
+    }
+    var y = D, w = /* @__PURE__ */ Symbol.for("react.transitional.element"), _ = /* @__PURE__ */ Symbol.for("react.portal"), g = /* @__PURE__ */ Symbol.for("react.fragment"), Z = /* @__PURE__ */ Symbol.for("react.strict_mode"), Q = /* @__PURE__ */ Symbol.for("react.profiler"), K = /* @__PURE__ */ Symbol.for("react.consumer"), ee = /* @__PURE__ */ Symbol.for("react.context"), te = /* @__PURE__ */ Symbol.for("react.forward_ref"), re = /* @__PURE__ */ Symbol.for("react.suspense"), ae = /* @__PURE__ */ Symbol.for("react.suspense_list"), oe = /* @__PURE__ */ Symbol.for("react.memo"), O = /* @__PURE__ */ Symbol.for("react.lazy"), ne = /* @__PURE__ */ Symbol.for("react.activity"), se = /* @__PURE__ */ Symbol.for("react.client.reference"), A = y.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, F = Object.prototype.hasOwnProperty, le = Array.isArray, P = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    y = {
+      react_stack_bottom_frame: function(e) {
+        return e();
+      }
+    };
+    var Y, z = {}, L = y.react_stack_bottom_frame.bind(
+      y,
+      l
+    )(), $ = P(a(l)), M = {};
+    N.Fragment = g, N.jsx = function(e, n, i) {
+      var d = 1e4 > A.recentlyCreatedOwnerStacks++;
+      return h(
+        e,
+        n,
+        i,
+        !1,
+        d ? Error("react-stack-top-frame") : L,
+        d ? P(a(e)) : $
+      );
+    }, N.jsxs = function(e, n, i) {
+      var d = 1e4 > A.recentlyCreatedOwnerStacks++;
+      return h(
+        e,
+        n,
+        i,
+        !0,
+        d ? Error("react-stack-top-frame") : L,
+        d ? P(a(e)) : $
+      );
+    };
+  })()), N;
+}
+var W;
+function de() {
+  return W || (W = 1, process.env.NODE_ENV === "production" ? C.exports = ue() : C.exports = ce()), C.exports;
+}
+var m = de();
+function q(r) {
+  var o, t, a = "";
+  if (typeof r == "string" || typeof r == "number") a += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var s = r.length;
+    for (o = 0; o < s; o++) r[o] && (t = q(r[o])) && (a && (a += " "), a += t);
+  } else for (t in r) r[t] && (a && (a += " "), a += t);
+  return a;
+}
+function R() {
+  for (var r, o, t = 0, a = "", s = arguments.length; t < s; t++) (r = arguments[t]) && (o = q(r)) && (a && (a += " "), a += o);
+  return a;
+}
+const U = (r) => typeof r == "boolean" ? `${r}` : r === 0 ? "0" : r, J = R, T = (r, o) => (t) => {
+  var a;
+  if (o?.variants == null) return J(r, t?.class, t?.className);
+  const { variants: s, defaultVariants: l } = o, b = Object.keys(s).map((u) => {
+    const h = t?.[u], v = l?.[u];
+    if (h === null) return null;
+    const x = U(h) || U(v);
+    return s[u][x];
+  }), c = t && Object.entries(t).reduce((u, h) => {
+    let [v, x] = h;
+    return x === void 0 || (u[v] = x), u;
+  }, {}), p = o == null || (a = o.compoundVariants) === null || a === void 0 ? void 0 : a.reduce((u, h) => {
+    let { class: v, className: x, ...y } = h;
+    return Object.entries(y).every((w) => {
+      let [_, g] = w;
+      return Array.isArray(g) ? g.includes({
+        ...l,
+        ...c
+      }[_]) : {
+        ...l,
+        ...c
+      }[_] === g;
+    }) ? [
+      ...u,
+      v,
+      x
+    ] : u;
+  }, []);
+  return J(r, b, p, t?.class, t?.className);
+}, fe = T(["inline-flex items-center justify-center font-medium", "transition-colors duration-150", "focus-visible:outline-none", "disabled:cursor-not-allowed"], {
+  variants: {
+    size: {
+      sm: "h-[36px] px-4 gap-1 rounded-lg text-sm",
+      md: "h-[44px] px-4 gap-2 rounded-lg text-sm",
+      lg: "h-[52px] px-5 gap-2 rounded-[10px] text-base",
+      xl: "h-[60px] px-6 gap-2 rounded-[10px] text-base",
+      "2xl": "h-[68px] px-6 gap-2 rounded-[10px] text-lg"
+    },
+    tone: {
+      primary: ""
+    },
+    variant: {
+      solid: [
+        "bg-primary-500 text-white",
+        "hover:bg-primary-800",
+        "focus-visible:ring-2 focus-visible:ring-primary-400",
+        "focus-visible:ring-offset-2 focus-visible:ring-offset-white",
+        "disabled:bg-light-100 disabled:text-light-400"
+      ]
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    tone: "primary",
+    variant: "solid"
+  }
+}), me = ({ children: r, className: o, tone: t, variant: a, size: s, ...l }) => /* @__PURE__ */ m.jsx("button", { className: R(fe({ tone: t, variant: a, size: s }), o), ...l, children: r }), be = ({ children: r }) => /* @__PURE__ */ m.jsx("span", { className: "flex items-center", children: r }), pe = ({ children: r }) => /* @__PURE__ */ m.jsx("span", { className: "whitespace-nowrap", children: r }), X = me;
+X.Icon = be;
+X.Text = pe;
+const he = T(
+  [
+    "inline-flex items-center justify-center",
+    "border-2 transition-colors duration-150",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-400"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-5 w-5 rounded-[4px]",
+        md: "h-6 w-6 rounded-[6px]",
+        lg: "h-8 w-8 rounded-[8px]"
+      },
+      checked: {
+        true: "",
+        false: ""
+      },
+      disabled: {
+        true: "cursor-not-allowed",
+        false: "cursor-pointer"
+      }
+    },
+    compoundVariants: [
+      {
+        checked: !1,
+        disabled: !1,
+        className: "bg-white border-[#D0D5DD]"
+      },
+      {
+        checked: !0,
+        disabled: !1,
+        className: "bg-primary-500 border-primary-500 text-white"
+      },
+      {
+        disabled: !0,
+        className: "bg-[#F2F4F7] border-[#E4E7EC] text-white"
+      }
+    ],
+    defaultVariants: {
+      size: "md",
+      checked: !1,
+      disabled: !1
+    }
+  }
+), xe = {
+  sm: { width: 12, height: 9 },
+  md: { width: 14, height: 10 },
+  lg: { width: 18, height: 14 }
+}, ve = k.forwardRef(
+  ({
+    id: r,
+    checked: o,
+    indeterminate: t = !1,
+    disabled: a,
+    size: s = "md",
+    onCheckedChange: l,
+    className: b
+  }, c) => {
+    const p = () => {
+      a || l?.(!o);
+    }, u = xe[s], h = a ? "text-white/80" : "text-current";
+    return /* @__PURE__ */ m.jsxs(
+      "button",
+      {
+        id: r,
+        ref: c,
+        type: "button",
+        role: "checkbox",
+        "aria-checked": t ? "mixed" : o,
+        disabled: a,
+        onClick: p,
+        className: R(
+          he({ size: s, checked: o, disabled: a }),
+          b
+        ),
+        children: [
+          o && !t && /* @__PURE__ */ m.jsx(
+            "svg",
+            {
+              width: u.width,
+              height: u.height,
+              viewBox: "0 0 14 10",
+              fill: "none",
+              className: h,
+              children: /* @__PURE__ */ m.jsx(
+                "path",
+                {
+                  d: "M1 5L5 9L13 1",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round"
+                }
+              )
+            }
+          ),
+          t && /* @__PURE__ */ m.jsx(
+            "span",
+            {
+              className: R(
+                h,
+                "bg-current rounded-sm",
+                s === "sm" && "h-0.5 w-3",
+                s === "md" && "h-0.5 w-4",
+                s === "lg" && "h-0.5 w-5"
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+ve.displayName = "Checkbox";
+const H = k.createContext(null), je = ({
+  value: r,
+  defaultValue: o,
+  onValueChange: t,
+  children: a,
+  className: s
+}) => {
+  const [l, b] = k.useState(o), c = r ?? l, p = (u) => {
+    b(u), t?.(u);
+  };
+  return /* @__PURE__ */ m.jsx(
+    H.Provider,
+    {
+      value: { value: c, onValueChange: p },
+      children: /* @__PURE__ */ m.jsx("div", { role: "radiogroup", className: s, children: a })
+    }
+  );
+}, ge = () => {
+  const r = k.useContext(H);
+  if (!r)
+    throw new Error("RadioGroupItem must be used within RadioGroup");
+  return r;
+}, ye = T(
+  [
+    "relative inline-flex items-center justify-center",
+    "border-2 rounded-full transition-colors duration-150",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-400"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-5 w-5",
+        md: "h-6 w-6",
+        lg: "h-8 w-8"
+      },
+      checked: {
+        true: "",
+        false: ""
+      },
+      disabled: {
+        true: "cursor-not-allowed",
+        false: "cursor-pointer"
+      }
+    },
+    compoundVariants: [
+      {
+        checked: !1,
+        disabled: !1,
+        className: "border-[#D0D5DD] bg-white"
+      },
+      {
+        checked: !0,
+        disabled: !1,
+        className: "border-primary-500 bg-primary-500"
+      },
+      {
+        disabled: !0,
+        className: "border-[#E4E7EC] bg-[#F2F4F7]"
+      }
+    ],
+    defaultVariants: {
+      size: "md",
+      checked: !1,
+      disabled: !1
+    }
+  }
+), we = T(
+  ["rounded-full bg-white transition-all"],
+  {
+    variants: {
+      size: {
+        sm: "h-2 w-2",
+        md: "h-2.5 w-2.5",
+        lg: "h-3 w-3"
+      },
+      checked: {
+        true: "scale-100",
+        false: "scale-0"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      checked: !1
+    }
+  }
+), _e = k.forwardRef(({ id: r, value: o, disabled: t, size: a = "md", className: s }, l) => {
+  const { value: b, onValueChange: c } = ge(), p = b === o;
+  return /* @__PURE__ */ m.jsx(
+    "button",
+    {
+      ref: l,
+      id: r,
+      type: "button",
+      role: "radio",
+      "aria-checked": p,
+      disabled: t,
+      onClick: () => {
+        t || c?.(o);
+      },
+      className: R(
+        ye({ size: a, checked: p, disabled: t }),
+        s
+      ),
+      children: /* @__PURE__ */ m.jsx(
+        "span",
+        {
+          className: we({
+            size: a,
+            checked: p
+          })
+        }
+      )
+    }
+  );
+});
+_e.displayName = "RadioGroupItem";
+const Ee = T(
+  "relative inline-flex shrink-0 cursor-pointer rounded-full transition-colors duration-200 focus-visible:outline-none",
+  {
+    variants: {
+      size: {
+        sm: "h-6 w-10",
+        md: "h-8 w-14",
+        lg: "h-10 w-[72px]"
+      },
+      checked: {
+        true: "bg-primary-500",
+        false: "bg-[#e4e7ec]"
+      },
+      disabled: {
+        true: "cursor-not-allowed opacity-60"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      checked: !1
+    }
+  }
+), Re = T(
+  "absolute top-1 left-1 rounded-full bg-white transition-transform duration-200 shadow",
+  {
+    variants: {
+      size: {
+        sm: "h-4 w-4",
+        md: "h-6 w-6",
+        lg: "h-8 w-8"
+      },
+      checked: {
+        true: "",
+        false: ""
+      }
+    },
+    compoundVariants: [
+      {
+        size: "sm",
+        checked: !0,
+        className: "translate-x-4"
+      },
+      {
+        size: "md",
+        checked: !0,
+        className: "translate-x-6"
+      },
+      {
+        size: "lg",
+        checked: !0,
+        className: "translate-x-8"
+      }
+    ],
+    defaultVariants: {
+      size: "md",
+      checked: !1
+    }
+  }
+), ke = k.forwardRef(
+  ({
+    checked: r = !1,
+    size: o = "md",
+    disabled: t,
+    onCheckedChange: a,
+    className: s
+  }, l) => /* @__PURE__ */ m.jsx(
+    "button",
+    {
+      ref: l,
+      type: "button",
+      role: "switch",
+      "aria-checked": r,
+      disabled: t,
+      onClick: () => {
+        t || a?.(!r);
+      },
+      className: R(
+        Ee({ size: o, checked: r, disabled: t }),
+        s
+      ),
+      children: /* @__PURE__ */ m.jsx(
+        "span",
+        {
+          className: Re({
+            size: o,
+            checked: r
+          })
+        }
+      )
+    }
+  )
+);
+ke.displayName = "Toggle";
+const Ne = ({
+  label: r,
+  children: o,
+  isOpen: t,
+  position: a = "top"
+}) => {
+  const [s, l] = D.useState(!1), b = D.useId(), c = typeof t == "boolean", p = c ? t : s;
+  function u() {
+    c || l(!0);
+  }
+  function h() {
+    c || l(!1);
+  }
+  const v = "absolute z-20 min-w-max max-w-[240px] rounded-xl bg-[#111827] px-4 py-2 text-[13px] leading-snug text-white opacity-0 invisible shadow-[0_10px_30px_rgba(2,8,23,0.2)] transition-all duration-150", x = p ? "opacity-100 visible" : "", y = c ? "" : "group-hover:opacity-100 group-hover:visible group-focus-within:opacity-100 group-focus-within:visible", w = {
+    top: "bottom-[calc(100%+8px)] left-1/2 -translate-x-1/2 translate-y-1",
+    "top-start": "bottom-[calc(100%+8px)] left-0 translate-y-1",
+    "top-end": "bottom-[calc(100%+8px)] right-0 translate-y-1",
+    bottom: "top-[calc(100%+8px)] left-1/2 -translate-x-1/2 -translate-y-1",
+    "bottom-start": "top-[calc(100%+8px)] left-0 -translate-y-1",
+    "bottom-end": "top-[calc(100%+8px)] right-0 -translate-y-1",
+    left: "right-[calc(100%+8px)] top-1/2 -translate-y-1/2 translate-x-1",
+    right: "left-[calc(100%+8px)] top-1/2 -translate-y-1/2 -translate-x-1"
+  }[a], _ = p ? {
+    top: "translate-y-0",
+    "top-start": "translate-y-0",
+    "top-end": "translate-y-0",
+    bottom: "translate-y-0",
+    "bottom-start": "translate-y-0",
+    "bottom-end": "translate-y-0",
+    left: "translate-x-0",
+    right: "translate-x-0"
+  }[a] : "", g = {
+    top: "top-full left-1/2 -translate-x-1/2 border-t-[#111827]",
+    "top-start": "top-full left-4 border-t-[#111827]",
+    "top-end": "top-full right-4 border-t-[#111827]",
+    bottom: "bottom-full left-1/2 -translate-x-1/2 border-b-[#111827]",
+    "bottom-start": "bottom-full left-4 border-b-[#111827]",
+    "bottom-end": "bottom-full right-4 border-b-[#111827]",
+    left: "left-full top-1/2 -translate-y-1/2 border-l-[#111827]",
+    right: "right-full top-1/2 -translate-y-1/2 border-r-[#111827]"
+  }[a];
+  return /* @__PURE__ */ m.jsxs(
+    "span",
+    {
+      className: "group relative inline-flex items-center justify-center font-sans",
+      onMouseEnter: u,
+      onMouseLeave: h,
+      onFocus: u,
+      onBlur: h,
+      children: [
+        /* @__PURE__ */ m.jsx(
+          "span",
+          {
+            className: "inline-flex items-center justify-center gap-1 rounded-md border border-[#d1d5db] bg-white px-2.5 py-1.5 text-sm text-[#111827] outline-none transition-shadow duration-150 focus-visible:border-[#2563eb] focus-visible:shadow-[0_0_0_3px_rgba(37,99,235,0.25)]",
+            tabIndex: 0,
+            "aria-describedby": p ? b : void 0,
+            children: o
+          }
+        ),
+        /* @__PURE__ */ m.jsxs(
+          "span",
+          {
+            id: b,
+            role: "tooltip",
+            className: [
+              v,
+              w,
+              x,
+              _,
+              y
+            ].filter(Boolean).join(" "),
+            children: [
+              r,
+              /* @__PURE__ */ m.jsx(
+                "span",
+                {
+                  className: [
+                    "absolute h-0 w-0 border-[8px] border-transparent",
+                    g
+                  ].filter(Boolean).join(" ")
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  X as Button,
+  ve as Checkbox,
+  je as RadioGroup,
+  _e as RadioGroupItem,
+  ke as Toggle,
+  Ne as Tooltip
+};

package/dist/index.umd.js

@@ -1 +1,6 @@
-(function(n){typeof define=="function"&&define.amd?define(n):n()})((function(){"use strict"}));
+(function(x,w){typeof exports=="object"&&typeof module<"u"?w(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],w):(x=typeof globalThis<"u"?globalThis:x||self,w(x.CekatUI={},x.React))})(this,(function(x,w){"use strict";function te(t){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const r in t)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(t,r);Object.defineProperty(o,r,n.get?n:{enumerable:!0,get:()=>t[r]})}}return o.default=t,Object.freeze(o)}const E=te(w);var C={exports:{}},S={};var z;function re(){if(z)return S;z=1;var t=Symbol.for("react.transitional.element"),o=Symbol.for("react.fragment");function r(n,s,l){var b=null;if(l!==void 0&&(b=""+l),s.key!==void 0&&(b=""+s.key),"key"in s){l={};for(var c in s)c!=="key"&&(l[c]=s[c])}else l=s;return s=l.ref,{$$typeof:t,type:n,key:b,ref:s!==void 0?s:null,props:l}}return S.Fragment=o,S.jsx=r,S.jsxs=r,S}var O={};var $;function ne(){return $||($=1,process.env.NODE_ENV!=="production"&&(function(){function t(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===je?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case y:return"Fragment";case ge:return"Profiler";case ve:return"StrictMode";case Ee:return"Suspense";case ke:return"SuspenseList";case Te:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case j:return"Portal";case we:return e.displayName||"Context";case ye:return(e._context.displayName||"Context")+".Consumer";case _e:var a=e.render;return e=e.displayName,e||(e=a.displayName||a.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case Re:return a=e.displayName||null,a!==null?a:t(e.type)||"Memo";case V:a=e._payload,e=e._init;try{return t(e(a))}catch{}}return null}function o(e){return""+e}function r(e){try{o(e);var a=!1}catch{a=!0}if(a){a=console;var i=a.error,d=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return i.call(a,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",d),o(e)}}function n(e){if(e===y)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===V)return"<...>";try{var a=t(e);return a?"<"+a+">":"<...>"}catch{return"<...>"}}function s(){var e=I.A;return e===null?null:e.getOwner()}function l(){return Error("react-stack-top-frame")}function b(e){if(X.call(e,"key")){var a=Object.getOwnPropertyDescriptor(e,"key").get;if(a&&a.isReactWarning)return!1}return e.key!==void 0}function c(e,a){function i(){H||(H=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",a))}i.isReactWarning=!0,Object.defineProperty(e,"key",{get:i,configurable:!0})}function p(){var e=t(this.type);return Z[e]||(Z[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function u(e,a,i,d,P,F){var f=i.ref;return e={$$typeof:T,type:e,key:a,props:i,_owner:d},(f!==void 0?f:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:p}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:P}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:F}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function h(e,a,i,d,P,F){var f=a.children;if(f!==void 0)if(d)if(Ne(f)){for(d=0;d<f.length;d++)g(f[d]);Object.freeze&&Object.freeze(f)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else g(f);if(X.call(a,"key")){f=t(e);var N=Object.keys(a).filter(function(Se){return Se!=="key"});d=0<N.length?"{key: someKey, "+N.join(": ..., ")+": ...}":"{key: someKey}",ee[f+d]||(N=0<N.length?"{"+N.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,d,f,N,f),ee[f+d]=!0)}if(f=null,i!==void 0&&(r(i),f=""+i),b(a)&&(r(a.key),f=""+a.key),"key"in a){i={};for(var Y in a)Y!=="key"&&(i[Y]=a[Y])}else i=a;return f&&c(i,typeof e=="function"?e.displayName||e.name||"Unknown":e),u(e,f,i,s(),P,F)}function g(e){v(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===V&&(e._payload.status==="fulfilled"?v(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function v(e){return typeof e=="object"&&e!==null&&e.$$typeof===T}var _=w,T=Symbol.for("react.transitional.element"),j=Symbol.for("react.portal"),y=Symbol.for("react.fragment"),ve=Symbol.for("react.strict_mode"),ge=Symbol.for("react.profiler"),ye=Symbol.for("react.consumer"),we=Symbol.for("react.context"),_e=Symbol.for("react.forward_ref"),Ee=Symbol.for("react.suspense"),ke=Symbol.for("react.suspense_list"),Re=Symbol.for("react.memo"),V=Symbol.for("react.lazy"),Te=Symbol.for("react.activity"),je=Symbol.for("react.client.reference"),I=_.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,X=Object.prototype.hasOwnProperty,Ne=Array.isArray,D=console.createTask?console.createTask:function(){return null};_={react_stack_bottom_frame:function(e){return e()}};var H,Z={},Q=_.react_stack_bottom_frame.bind(_,l)(),K=D(n(l)),ee={};O.Fragment=y,O.jsx=function(e,a,i){var d=1e4>I.recentlyCreatedOwnerStacks++;return h(e,a,i,!1,d?Error("react-stack-top-frame"):Q,d?D(n(e)):K)},O.jsxs=function(e,a,i){var d=1e4>I.recentlyCreatedOwnerStacks++;return h(e,a,i,!0,d?Error("react-stack-top-frame"):Q,d?D(n(e)):K)}})()),O}var L;function oe(){return L||(L=1,process.env.NODE_ENV==="production"?C.exports=re():C.exports=ne()),C.exports}var m=oe();function M(t){var o,r,n="";if(typeof t=="string"||typeof t=="number")n+=t;else if(typeof t=="object")if(Array.isArray(t)){var s=t.length;for(o=0;o<s;o++)t[o]&&(r=M(t[o]))&&(n&&(n+=" "),n+=r)}else for(r in t)t[r]&&(n&&(n+=" "),n+=r);return n}function k(){for(var t,o,r=0,n="",s=arguments.length;r<s;r++)(t=arguments[r])&&(o=M(t))&&(n&&(n+=" "),n+=o);return n}const G=t=>typeof t=="boolean"?`${t}`:t===0?"0":t,B=k,R=(t,o)=>r=>{var n;if(o?.variants==null)return B(t,r?.class,r?.className);const{variants:s,defaultVariants:l}=o,b=Object.keys(s).map(u=>{const h=r?.[u],g=l?.[u];if(h===null)return null;const v=G(h)||G(g);return s[u][v]}),c=r&&Object.entries(r).reduce((u,h)=>{let[g,v]=h;return v===void 0||(u[g]=v),u},{}),p=o==null||(n=o.compoundVariants)===null||n===void 0?void 0:n.reduce((u,h)=>{let{class:g,className:v,..._}=h;return Object.entries(_).every(T=>{let[j,y]=T;return Array.isArray(y)?y.includes({...l,...c}[j]):{...l,...c}[j]===y})?[...u,g,v]:u},[]);return B(t,b,p,r?.class,r?.className)},ae=R(["inline-flex items-center justify-center font-medium","transition-colors duration-150","focus-visible:outline-none","disabled:cursor-not-allowed"],{variants:{size:{sm:"h-[36px] px-4 gap-1 rounded-lg text-sm",md:"h-[44px] px-4 gap-2 rounded-lg text-sm",lg:"h-[52px] px-5 gap-2 rounded-[10px] text-base",xl:"h-[60px] px-6 gap-2 rounded-[10px] text-base","2xl":"h-[68px] px-6 gap-2 rounded-[10px] text-lg"},tone:{primary:""},variant:{solid:["bg-primary-500 text-white","hover:bg-primary-800","focus-visible:ring-2 focus-visible:ring-primary-400","focus-visible:ring-offset-2 focus-visible:ring-offset-white","disabled:bg-light-100 disabled:text-light-400"]}},defaultVariants:{size:"md",tone:"primary",variant:"solid"}}),se=({children:t,className:o,tone:r,variant:n,size:s,...l})=>m.jsx("button",{className:k(ae({tone:r,variant:n,size:s}),o),...l,children:t}),le=({children:t})=>m.jsx("span",{className:"flex items-center",children:t}),ie=({children:t})=>m.jsx("span",{className:"whitespace-nowrap",children:t}),A=se;A.Icon=le,A.Text=ie;const ue=R(["inline-flex items-center justify-center","border-2 transition-colors duration-150","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-400"],{variants:{size:{sm:"h-5 w-5 rounded-[4px]",md:"h-6 w-6 rounded-[6px]",lg:"h-8 w-8 rounded-[8px]"},checked:{true:"",false:""},disabled:{true:"cursor-not-allowed",false:"cursor-pointer"}},compoundVariants:[{checked:!1,disabled:!1,className:"bg-white border-[#D0D5DD]"},{checked:!0,disabled:!1,className:"bg-primary-500 border-primary-500 text-white"},{disabled:!0,className:"bg-[#F2F4F7] border-[#E4E7EC] text-white"}],defaultVariants:{size:"md",checked:!1,disabled:!1}}),ce={sm:{width:12,height:9},md:{width:14,height:10},lg:{width:18,height:14}},W=E.forwardRef(({id:t,checked:o,indeterminate:r=!1,disabled:n,size:s="md",onCheckedChange:l,className:b},c)=>{const p=()=>{n||l?.(!o)},u=ce[s],h=n?"text-white/80":"text-current";return m.jsxs("button",{id:t,ref:c,type:"button",role:"checkbox","aria-checked":r?"mixed":o,disabled:n,onClick:p,className:k(ue({size:s,checked:o,disabled:n}),b),children:[o&&!r&&m.jsx("svg",{width:u.width,height:u.height,viewBox:"0 0 14 10",fill:"none",className:h,children:m.jsx("path",{d:"M1 5L5 9L13 1",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),r&&m.jsx("span",{className:k(h,"bg-current rounded-sm",s==="sm"&&"h-0.5 w-3",s==="md"&&"h-0.5 w-4",s==="lg"&&"h-0.5 w-5")})]})});W.displayName="Checkbox";const U=E.createContext(null),de=({value:t,defaultValue:o,onValueChange:r,children:n,className:s})=>{const[l,b]=E.useState(o),c=t??l,p=u=>{b(u),r?.(u)};return m.jsx(U.Provider,{value:{value:c,onValueChange:p},children:m.jsx("div",{role:"radiogroup",className:s,children:n})})},fe=()=>{const t=E.useContext(U);if(!t)throw new Error("RadioGroupItem must be used within RadioGroup");return t},me=R(["relative inline-flex items-center justify-center","border-2 rounded-full transition-colors duration-150","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-400"],{variants:{size:{sm:"h-5 w-5",md:"h-6 w-6",lg:"h-8 w-8"},checked:{true:"",false:""},disabled:{true:"cursor-not-allowed",false:"cursor-pointer"}},compoundVariants:[{checked:!1,disabled:!1,className:"border-[#D0D5DD] bg-white"},{checked:!0,disabled:!1,className:"border-primary-500 bg-primary-500"},{disabled:!0,className:"border-[#E4E7EC] bg-[#F2F4F7]"}],defaultVariants:{size:"md",checked:!1,disabled:!1}}),be=R(["rounded-full bg-white transition-all"],{variants:{size:{sm:"h-2 w-2",md:"h-2.5 w-2.5",lg:"h-3 w-3"},checked:{true:"scale-100",false:"scale-0"}},defaultVariants:{size:"md",checked:!1}}),q=E.forwardRef(({id:t,value:o,disabled:r,size:n="md",className:s},l)=>{const{value:b,onValueChange:c}=fe(),p=b===o;return m.jsx("button",{ref:l,id:t,type:"button",role:"radio","aria-checked":p,disabled:r,onClick:()=>{r||c?.(o)},className:k(me({size:n,checked:p,disabled:r}),s),children:m.jsx("span",{className:be({size:n,checked:p})})})});q.displayName="RadioGroupItem";const pe=R("relative inline-flex shrink-0 cursor-pointer rounded-full transition-colors duration-200 focus-visible:outline-none",{variants:{size:{sm:"h-6 w-10",md:"h-8 w-14",lg:"h-10 w-[72px]"},checked:{true:"bg-primary-500",false:"bg-[#e4e7ec]"},disabled:{true:"cursor-not-allowed opacity-60"}},defaultVariants:{size:"md",checked:!1}}),he=R("absolute top-1 left-1 rounded-full bg-white transition-transform duration-200 shadow",{variants:{size:{sm:"h-4 w-4",md:"h-6 w-6",lg:"h-8 w-8"},checked:{true:"",false:""}},compoundVariants:[{size:"sm",checked:!0,className:"translate-x-4"},{size:"md",checked:!0,className:"translate-x-6"},{size:"lg",checked:!0,className:"translate-x-8"}],defaultVariants:{size:"md",checked:!1}}),J=E.forwardRef(({checked:t=!1,size:o="md",disabled:r,onCheckedChange:n,className:s},l)=>m.jsx("button",{ref:l,type:"button",role:"switch","aria-checked":t,disabled:r,onClick:()=>{r||n?.(!t)},className:k(pe({size:o,checked:t,disabled:r}),s),children:m.jsx("span",{className:he({size:o,checked:t})})}));J.displayName="Toggle";const xe=({label:t,children:o,isOpen:r,position:n="top"})=>{const[s,l]=w.useState(!1),b=w.useId(),c=typeof r=="boolean",p=c?r:s;function u(){c||l(!0)}function h(){c||l(!1)}const g="absolute z-20 min-w-max max-w-[240px] rounded-xl bg-[#111827] px-4 py-2 text-[13px] leading-snug text-white opacity-0 invisible shadow-[0_10px_30px_rgba(2,8,23,0.2)] transition-all duration-150",v=p?"opacity-100 visible":"",_=c?"":"group-hover:opacity-100 group-hover:visible group-focus-within:opacity-100 group-focus-within:visible",T={top:"bottom-[calc(100%+8px)] left-1/2 -translate-x-1/2 translate-y-1","top-start":"bottom-[calc(100%+8px)] left-0 translate-y-1","top-end":"bottom-[calc(100%+8px)] right-0 translate-y-1",bottom:"top-[calc(100%+8px)] left-1/2 -translate-x-1/2 -translate-y-1","bottom-start":"top-[calc(100%+8px)] left-0 -translate-y-1","bottom-end":"top-[calc(100%+8px)] right-0 -translate-y-1",left:"right-[calc(100%+8px)] top-1/2 -translate-y-1/2 translate-x-1",right:"left-[calc(100%+8px)] top-1/2 -translate-y-1/2 -translate-x-1"}[n],j=p?{top:"translate-y-0","top-start":"translate-y-0","top-end":"translate-y-0",bottom:"translate-y-0","bottom-start":"translate-y-0","bottom-end":"translate-y-0",left:"translate-x-0",right:"translate-x-0"}[n]:"",y={top:"top-full left-1/2 -translate-x-1/2 border-t-[#111827]","top-start":"top-full left-4 border-t-[#111827]","top-end":"top-full right-4 border-t-[#111827]",bottom:"bottom-full left-1/2 -translate-x-1/2 border-b-[#111827]","bottom-start":"bottom-full left-4 border-b-[#111827]","bottom-end":"bottom-full right-4 border-b-[#111827]",left:"left-full top-1/2 -translate-y-1/2 border-l-[#111827]",right:"right-full top-1/2 -translate-y-1/2 border-r-[#111827]"}[n];return m.jsxs("span",{className:"group relative inline-flex items-center justify-center font-sans",onMouseEnter:u,onMouseLeave:h,onFocus:u,onBlur:h,children:[m.jsx("span",{className:"inline-flex items-center justify-center gap-1 rounded-md border border-[#d1d5db] bg-white px-2.5 py-1.5 text-sm text-[#111827] outline-none transition-shadow duration-150 focus-visible:border-[#2563eb] focus-visible:shadow-[0_0_0_3px_rgba(37,99,235,0.25)]",tabIndex:0,"aria-describedby":p?b:void 0,children:o}),m.jsxs("span",{id:b,role:"tooltip",className:[g,T,v,j,_].filter(Boolean).join(" "),children:[t,m.jsx("span",{className:["absolute h-0 w-0 border-[8px] border-transparent",y].filter(Boolean).join(" ")})]})]})};x.Button=A,x.Checkbox=W,x.RadioGroup=de,x.RadioGroupItem=q,x.Toggle=J,x.Tooltip=xe,Object.defineProperty(x,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,10 +1,19 @@
 {
   "name": "cekat-ui",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "Cekat UI Component Library",
   "main": "dist/index.umd.js",
   "module": "dist/index.es.js",
   "types": "dist/index.d.ts",
+  "style": "dist/style.css",
+  "exports": {
+    ".": {
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.umd.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./style.css": "./dist/style.css"
+  },
   "files": [
     "dist"
   ],
@@ -26,9 +35,7 @@
   "dependencies": {
     "@tabler/icons-react": "^3.36.1",
     "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "react": "^19.2.3",
-    "react-dom": "^19.2.3"
+    "clsx": "^2.1.1"
   },
   "devDependencies": {
     "@rollup/rollup-darwin-arm64": "^4.55.1",