@orbit_ui_toolkit/orbitui-kit 0.1.0

package/dist/orbitui.es.js

@@ -0,0 +1,783 @@
+import G from "react";
+var R = { exports: {} }, C = {};
+var F;
+function te() {
+  if (F) return C;
+  F = 1;
+  var n = /* @__PURE__ */ Symbol.for("react.transitional.element"), a = /* @__PURE__ */ Symbol.for("react.fragment");
+  function l(t, o, i) {
+    var c = null;
+    if (i !== void 0 && (c = "" + i), o.key !== void 0 && (c = "" + o.key), "key" in o) {
+      i = {};
+      for (var d in o)
+        d !== "key" && (i[d] = o[d]);
+    } else i = o;
+    return o = i.ref, {
+      $$typeof: n,
+      type: t,
+      key: c,
+      ref: o !== void 0 ? o : null,
+      props: i
+    };
+  }
+  return C.Fragment = a, C.jsx = l, C.jsxs = l, C;
+}
+var _ = {};
+var U;
+function se() {
+  return U || (U = 1, process.env.NODE_ENV !== "production" && (function() {
+    function n(e) {
+      if (e == null) return null;
+      if (typeof e == "function")
+        return e.$$typeof === K ? null : e.displayName || e.name || null;
+      if (typeof e == "string") return e;
+      switch (e) {
+        case N:
+          return "Fragment";
+        case M:
+          return "Profiler";
+        case L:
+          return "StrictMode";
+        case J:
+          return "Suspense";
+        case Z:
+          return "SuspenseList";
+        case Q:
+          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 k:
+            return "Portal";
+          case q:
+            return e.displayName || "Context";
+          case T:
+            return (e._context.displayName || "Context") + ".Consumer";
+          case H:
+            var s = e.render;
+            return e = e.displayName, e || (e = s.displayName || s.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case X:
+            return s = e.displayName || null, s !== null ? s : n(e.type) || "Memo";
+          case $:
+            s = e._payload, e = e._init;
+            try {
+              return n(e(s));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function a(e) {
+      return "" + e;
+    }
+    function l(e) {
+      try {
+        a(e);
+        var s = !1;
+      } catch {
+        s = !0;
+      }
+      if (s) {
+        s = console;
+        var u = s.error, x = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return u.call(
+          s,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          x
+        ), a(e);
+      }
+    }
+    function t(e) {
+      if (e === N) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === $)
+        return "<...>";
+      try {
+        var s = n(e);
+        return s ? "<" + s + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function o() {
+      var e = S.A;
+      return e === null ? null : e.getOwner();
+    }
+    function i() {
+      return Error("react-stack-top-frame");
+    }
+    function c(e) {
+      if (z.call(e, "key")) {
+        var s = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (s && s.isReactWarning) return !1;
+      }
+      return e.key !== void 0;
+    }
+    function d(e, s) {
+      function u() {
+        W || (W = !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)",
+          s
+        ));
+      }
+      u.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: u,
+        configurable: !0
+      });
+    }
+    function h() {
+      var e = n(this.type);
+      return B[e] || (B[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 p(e, s, u, x, E, O) {
+      var m = u.ref;
+      return e = {
+        $$typeof: v,
+        type: e,
+        key: s,
+        props: u,
+        _owner: x
+      }, (m !== void 0 ? m : null) !== null ? Object.defineProperty(e, "ref", {
+        enumerable: !1,
+        get: h
+      }) : 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: E
+      }), Object.defineProperty(e, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: O
+      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+    }
+    function g(e, s, u, x, E, O) {
+      var m = s.children;
+      if (m !== void 0)
+        if (x)
+          if (ee(m)) {
+            for (x = 0; x < m.length; x++)
+              b(m[x]);
+            Object.freeze && Object.freeze(m);
+          } 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 b(m);
+      if (z.call(s, "key")) {
+        m = n(e);
+        var y = Object.keys(s).filter(function(re) {
+          return re !== "key";
+        });
+        x = 0 < y.length ? "{key: someKey, " + y.join(": ..., ") + ": ...}" : "{key: someKey}", Y[m + x] || (y = 0 < y.length ? "{" + y.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} />`,
+          x,
+          m,
+          y,
+          m
+        ), Y[m + x] = !0);
+      }
+      if (m = null, u !== void 0 && (l(u), m = "" + u), c(s) && (l(s.key), m = "" + s.key), "key" in s) {
+        u = {};
+        for (var P in s)
+          P !== "key" && (u[P] = s[P]);
+      } else u = s;
+      return m && d(
+        u,
+        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
+      ), p(
+        e,
+        m,
+        u,
+        o(),
+        E,
+        O
+      );
+    }
+    function b(e) {
+      j(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === $ && (e._payload.status === "fulfilled" ? j(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    }
+    function j(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === v;
+    }
+    var f = G, v = /* @__PURE__ */ Symbol.for("react.transitional.element"), k = /* @__PURE__ */ Symbol.for("react.portal"), N = /* @__PURE__ */ Symbol.for("react.fragment"), L = /* @__PURE__ */ Symbol.for("react.strict_mode"), M = /* @__PURE__ */ Symbol.for("react.profiler"), T = /* @__PURE__ */ Symbol.for("react.consumer"), q = /* @__PURE__ */ Symbol.for("react.context"), H = /* @__PURE__ */ Symbol.for("react.forward_ref"), J = /* @__PURE__ */ Symbol.for("react.suspense"), Z = /* @__PURE__ */ Symbol.for("react.suspense_list"), X = /* @__PURE__ */ Symbol.for("react.memo"), $ = /* @__PURE__ */ Symbol.for("react.lazy"), Q = /* @__PURE__ */ Symbol.for("react.activity"), K = /* @__PURE__ */ Symbol.for("react.client.reference"), S = f.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, z = Object.prototype.hasOwnProperty, ee = Array.isArray, A = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    f = {
+      react_stack_bottom_frame: function(e) {
+        return e();
+      }
+    };
+    var W, B = {}, D = f.react_stack_bottom_frame.bind(
+      f,
+      i
+    )(), I = A(t(i)), Y = {};
+    _.Fragment = N, _.jsx = function(e, s, u) {
+      var x = 1e4 > S.recentlyCreatedOwnerStacks++;
+      return g(
+        e,
+        s,
+        u,
+        !1,
+        x ? Error("react-stack-top-frame") : D,
+        x ? A(t(e)) : I
+      );
+    }, _.jsxs = function(e, s, u) {
+      var x = 1e4 > S.recentlyCreatedOwnerStacks++;
+      return g(
+        e,
+        s,
+        u,
+        !0,
+        x ? Error("react-stack-top-frame") : D,
+        x ? A(t(e)) : I
+      );
+    };
+  })()), _;
+}
+var V;
+function ne() {
+  return V || (V = 1, process.env.NODE_ENV === "production" ? R.exports = te() : R.exports = se()), R.exports;
+}
+var r = ne();
+const w = ({
+  variant: n = "primary",
+  size: a = "md",
+  rounded: l = "full",
+  isLoading: t = !1,
+  fullWidth: o = !1,
+  leftIcon: i,
+  rightIcon: c,
+  className: d = "",
+  children: h,
+  disabled: p,
+  ...g
+}) => {
+  const b = "inline-flex items-center justify-center font-medium disabled:opacity-50 disabled:pointer-events-none transition-colors duration-150", j = {
+    primary: "bg-[#0070f3] text-white hover:bg-[#0060df] border border-transparent",
+    secondary: "bg-transparent text-[#0070f3] border border-[#0070f3] hover:bg-blue-50",
+    // White with Blue Border
+    tertiary: "bg-transparent text-[#0070f3] border border-gray-300 hover:border-gray-400 hover:bg-gray-50",
+    // White with Gray Border
+    danger: "bg-[#c23b22] text-white hover:bg-[#a0301b] border border-transparent",
+    // Burnt Orange/Red
+    link: "bg-transparent text-[#0070f3] hover:underline px-0 py-0 h-auto border-none",
+    // Text only
+    ghost: "bg-transparent text-gray-700 hover:bg-gray-100 border-transparent"
+    // Transparent with hover bg
+  }, f = {
+    sm: "px-4 py-1.5 text-xs gap-1.5 min-w-[80px]",
+    md: "px-6 py-2 text-sm gap-2 min-w-[100px]",
+    lg: "px-8 py-3 text-base gap-2 min-w-[120px]",
+    icon: "w-10 h-10 p-0 min-w-0"
+  }, v = {
+    none: "rounded-none",
+    sm: "rounded-sm",
+    md: "rounded-md",
+    lg: "rounded-lg",
+    full: "rounded-full"
+  }, k = o ? "w-full" : "";
+  return /* @__PURE__ */ r.jsxs(
+    "button",
+    {
+      className: `${b} ${j[n]} ${f[a]} ${v[l]} ${k} ${d}`,
+      disabled: p || t,
+      ...g,
+      children: [
+        t && /* @__PURE__ */ r.jsxs("svg", { className: "animate-spin -ml-1 mr-2 h-4 w-4", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: [
+          /* @__PURE__ */ r.jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+          /* @__PURE__ */ r.jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
+        ] }),
+        !t && i && /* @__PURE__ */ r.jsx("span", { className: "shrink-0", children: i }),
+        /* @__PURE__ */ r.jsx("span", { className: "truncate", children: t ? "Loading..." : h }),
+        !t && c && /* @__PURE__ */ r.jsx("span", { className: "shrink-0", children: c })
+      ]
+    }
+  );
+}, ce = ({
+  label: n,
+  error: a,
+  leftIcon: l,
+  rightIcon: t,
+  className: o = "",
+  ...i
+}) => /* @__PURE__ */ r.jsxs("div", { className: "flex flex-col gap-1.5 w-full", children: [
+  n && /* @__PURE__ */ r.jsx("label", { className: "text-sm font-medium text-gray-700", children: n }),
+  /* @__PURE__ */ r.jsxs("div", { className: "relative", children: [
+    l && /* @__PURE__ */ r.jsx("div", { className: "absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none text-gray-400", children: l }),
+    /* @__PURE__ */ r.jsx(
+      "input",
+      {
+        className: `
+                        w-full 
+                        ${l ? "pl-10" : "px-3"} 
+                        ${t ? "pr-10" : "px-3"} 
+                        py-2 
+                        bg-white 
+                        border 
+                        ${a ? "border-red-500" : "border-gray-300"} 
+                        rounded-md 
+                        shadow-sm 
+                        focus:outline-none 
+                        focus:ring-2 
+                        ${a ? "focus:ring-red-500" : "focus:ring-blue-500"} 
+                        focus:border-transparent 
+                        transition-all 
+                        duration-200 
+                        hover:border-gray-400 
+                        ${o}
+                    `,
+        ...i
+      }
+    ),
+    t && /* @__PURE__ */ r.jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center text-gray-400", children: t })
+  ] }),
+  a && /* @__PURE__ */ r.jsx("span", { className: "text-xs text-red-500", children: a })
+] }), de = ({
+  title: n,
+  subtitle: a,
+  children: l,
+  footer: t,
+  className: o = ""
+}) => /* @__PURE__ */ r.jsxs("div", { className: `bg-white rounded-xl border border-gray-200 shadow-sm overflow-hidden ${o}`, children: [
+  (n || a) && /* @__PURE__ */ r.jsxs("div", { className: "px-6 py-4 border-b border-gray-100", children: [
+    n && /* @__PURE__ */ r.jsx("h3", { className: "text-lg font-semibold text-gray-900", children: n }),
+    a && /* @__PURE__ */ r.jsx("p", { className: "text-sm text-gray-500 mt-1", children: a })
+  ] }),
+  /* @__PURE__ */ r.jsx("div", { className: "px-6 py-4", children: l }),
+  t && /* @__PURE__ */ r.jsx("div", { className: "px-6 py-4 bg-gray-50 border-t border-gray-100", children: t })
+] }), ue = ({
+  username: n,
+  profilePic: a,
+  postImage: l,
+  likesCount: t,
+  caption: o,
+  location: i,
+  isLiked: c = !1,
+  isBookmarked: d = !1,
+  onLike: h,
+  onComment: p,
+  onShare: g,
+  onBookmark: b
+}) => /* @__PURE__ */ r.jsxs("div", { className: "group relative max-w-[420px] mx-auto bg-white rounded-3xl overflow-hidden shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100/50", children: [
+  /* @__PURE__ */ r.jsxs("div", { className: "relative w-full aspect-4/5 bg-gray-100 overflow-hidden", children: [
+    /* @__PURE__ */ r.jsx(
+      "img",
+      {
+        src: l,
+        alt: "Post content",
+        className: "w-full h-full object-cover transition-transform duration-700 group-hover:scale-105"
+      }
+    ),
+    /* @__PURE__ */ r.jsx("div", { className: "absolute top-4 right-4 opacity-0 group-hover:opacity-100 transition-opacity", children: /* @__PURE__ */ r.jsx(
+      w,
+      {
+        variant: "ghost",
+        size: "icon",
+        rounded: "full",
+        className: "bg-black/20 backdrop-blur-md text-white hover:bg-black/40 border-none",
+        children: /* @__PURE__ */ r.jsxs("svg", { "aria-label": "More options", fill: "currentColor", height: "24", role: "img", viewBox: "0 0 24 24", width: "24", children: [
+          /* @__PURE__ */ r.jsx("circle", { cx: "12", cy: "12", r: "1.5" }),
+          /* @__PURE__ */ r.jsx("circle", { cx: "6", cy: "12", r: "1.5" }),
+          /* @__PURE__ */ r.jsx("circle", { cx: "18", cy: "12", r: "1.5" })
+        ] })
+      }
+    ) })
+  ] }),
+  /* @__PURE__ */ r.jsxs("div", { className: "p-5", children: [
+    /* @__PURE__ */ r.jsxs("div", { className: "flex items-center justify-between mb-4", children: [
+      /* @__PURE__ */ r.jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ r.jsx("div", { className: "relative", children: /* @__PURE__ */ r.jsx(
+          "img",
+          {
+            src: a,
+            alt: n,
+            className: "w-10 h-10 rounded-full object-cover ring-2 ring-offset-2 ring-indigo-500"
+          }
+        ) }),
+        /* @__PURE__ */ r.jsxs("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ r.jsx("span", { className: "font-bold text-gray-900 text-sm leading-tight hover:text-indigo-600 cursor-pointer transition-colors", children: n }),
+          i && /* @__PURE__ */ r.jsx("span", { className: "text-[11px] font-medium text-gray-400 uppercase tracking-wide", children: i })
+        ] })
+      ] }),
+      /* @__PURE__ */ r.jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ r.jsx(
+          w,
+          {
+            variant: "ghost",
+            size: "icon",
+            rounded: "full",
+            onClick: h,
+            className: `transition-colors ${c ? "text-rose-500 hover:bg-rose-50" : "text-gray-400 hover:text-rose-500"}`,
+            children: c ? /* @__PURE__ */ r.jsx("svg", { "aria-label": "Unlike", fill: "currentColor", height: "26", role: "img", viewBox: "0 0 48 48", width: "26", children: /* @__PURE__ */ r.jsx("path", { d: "M34.6 3.1c-4.5 0-7.9 1.8-10.6 5.6-2.7-3.7-6.1-5.5-10.6-5.5C6 3.1 0 9.6 0 17.6c0 14.9 17.8 29.1 23.9 30.2h.2c6.1-1.1 23.9-15.3 23.9-30.2 0-8-6-14.5-13.4-14.5z" }) }) : /* @__PURE__ */ r.jsx("svg", { "aria-label": "Like", fill: "currentColor", height: "26", role: "img", viewBox: "0 0 24 24", width: "26", children: /* @__PURE__ */ r.jsx("path", { d: "M16.792 3.904A4.989 4.989 0 0 1 21.5 9.122c0 3.072-2.652 4.959-5.197 7.222-2.512 2.243-3.865 3.469-4.303 3.752-.477-.309-2.143-1.823-4.303-3.752C5.141 14.072 2.5 12.194 2.5 9.122a4.989 4.989 0 0 1 4.708-5.218 4.21 4.21 0 0 1 3.675 1.941c.252.342.392.545.517.545s.265-.203.517-.545a4.21 4.21 0 0 1 3.675-1.941m0-2a6.21 6.21 0 0 0-5.292 2.768 6.21 6.21 0 0 0-5.292-2.768 6.989 6.989 0 0 0-6.708 7.218c0 4.19 2.923 6.64 5.642 9.066 2.057 1.838 4.19 3.744 5.358 5.485.474-.707 2.112-2.298 5.358-5.188 2.308-2.053 5.358-4.706 5.358-9.363a6.989 6.989 0 0 0-6.708-7.218Z" }) })
+          }
+        ),
+        /* @__PURE__ */ r.jsx(
+          w,
+          {
+            variant: "ghost",
+            size: "icon",
+            rounded: "full",
+            onClick: p,
+            className: "text-gray-400 hover:text-indigo-500",
+            children: /* @__PURE__ */ r.jsx("svg", { "aria-label": "Comment", fill: "currentColor", height: "26", role: "img", viewBox: "0 0 24 24", width: "26", children: /* @__PURE__ */ r.jsx("path", { d: "M20.656 17.008a9.993 9.993 0 1 0-3.59 3.615L22 22Z", fill: "none", stroke: "currentColor", strokeLinejoin: "round", strokeWidth: "2" }) })
+          }
+        ),
+        /* @__PURE__ */ r.jsx(
+          w,
+          {
+            variant: "ghost",
+            size: "icon",
+            rounded: "full",
+            onClick: g,
+            className: "text-gray-400 hover:text-indigo-500",
+            children: /* @__PURE__ */ r.jsxs("svg", { "aria-label": "Share Post", fill: "currentColor", height: "26", role: "img", viewBox: "0 0 24 24", width: "26", children: [
+              /* @__PURE__ */ r.jsx("line", { fill: "none", stroke: "currentColor", strokeLinejoin: "round", strokeWidth: "2", x1: "22", x2: "9.218", y1: "3", y2: "10.083" }),
+              /* @__PURE__ */ r.jsx("polygon", { fill: "none", points: "11.698 20.334 22 3.001 2 3.001 9.218 10.084 11.698 20.334", stroke: "currentColor", strokeLinejoin: "round", strokeWidth: "2" })
+            ] })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ r.jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ r.jsx("p", { className: "text-gray-800 text-sm leading-relaxed", children: o }),
+      /* @__PURE__ */ r.jsxs("div", { className: "flex items-center justify-between pt-2 border-t border-gray-50", children: [
+        /* @__PURE__ */ r.jsxs("span", { className: "font-semibold text-xs text-gray-500", children: [
+          t.toLocaleString(),
+          " Likes"
+        ] }),
+        /* @__PURE__ */ r.jsx("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ r.jsx(
+          w,
+          {
+            variant: "ghost",
+            size: "icon",
+            rounded: "full",
+            onClick: b,
+            className: `transition-colors ${d ? "text-gray-900" : "text-gray-400 hover:text-gray-900"}`,
+            children: d ? /* @__PURE__ */ r.jsx("svg", { "aria-label": "Remove", fill: "currentColor", height: "22", role: "img", viewBox: "0 0 24 24", width: "22", children: /* @__PURE__ */ r.jsx("path", { d: "M20 22a.999.999 0 0 1-.687-.273L12 14.89l-7.313 6.837A1 1 0 0 1 3 21V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1Z" }) }) : /* @__PURE__ */ r.jsx("svg", { "aria-label": "Save", fill: "currentColor", height: "22", role: "img", viewBox: "0 0 24 24", width: "22", children: /* @__PURE__ */ r.jsx("path", { d: "M20 22a.999.999 0 0 1-.687-.273L12 14.89l-7.313 6.837A1 1 0 0 1 3 21V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1Z", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }) })
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ r.jsxs("div", { className: "relative mt-2", children: [
+        /* @__PURE__ */ r.jsx(
+          "input",
+          {
+            type: "text",
+            placeholder: "Add a comment...",
+            className: "w-full text-xs text-gray-600 bg-gray-50 rounded-full px-3 py-2 outline-none focus:ring-1 focus:ring-indigo-200 transition-all"
+          }
+        ),
+        /* @__PURE__ */ r.jsx("div", { className: "absolute right-2 top-1/2 -translate-y-1/2", children: /* @__PURE__ */ r.jsx(w, { variant: "ghost", size: "sm", className: "text-indigo-500 font-bold px-2 py-0 h-auto hover:bg-transparent hover:text-indigo-700 min-w-0", children: "Post" }) })
+      ] })
+    ] })
+  ] })
+] }), xe = ({
+  variant: n = "spinner",
+  size: a = "md",
+  className: l = "",
+  color: t,
+  colors: o
+}) => {
+  const i = {
+    sm: "w-4 h-4",
+    md: "w-8 h-8",
+    lg: "w-12 h-12",
+    xl: "w-16 h-16"
+  }, c = {
+    sm: "w-1 h-1",
+    md: "w-2 h-2",
+    lg: "w-3 h-3",
+    xl: "w-4 h-4"
+  }, d = i[a], h = "bg-gradient-to-tr from-yellow-400 via-red-500 to-purple-600";
+  if (n === "dots") {
+    const p = c[a], g = !!t || !!o?.length, b = (f) => {
+      if (!g) return {};
+      const v = o?.[f] || t;
+      return v ? { backgroundColor: v } : {};
+    }, j = () => g ? "" : h;
+    return /* @__PURE__ */ r.jsx("div", { className: `flex items-center justify-center gap-1 ${l}`, children: [0, 1, 2].map((f) => /* @__PURE__ */ r.jsx(
+      "div",
+      {
+        className: `${p} rounded-full animate-bounce ${j()}`,
+        style: {
+          ...b(f),
+          animationDelay: f === 0 ? "-0.3s" : f === 1 ? "-0.15s" : "0s"
+        }
+      },
+      f
+    )) });
+  }
+  if (n === "pulse") {
+    const p = t ? "" : h;
+    return /* @__PURE__ */ r.jsxs("div", { className: `relative flex items-center justify-center ${d} ${l}`, children: [
+      /* @__PURE__ */ r.jsx(
+        "span",
+        {
+          className: `absolute inline-flex h-full w-full rounded-full opacity-75 animate-ping ${p}`,
+          style: t ? { backgroundColor: t } : {}
+        }
+      ),
+      /* @__PURE__ */ r.jsx(
+        "span",
+        {
+          className: `relative inline-flex rounded-full h-3/4 w-3/4 ${p}`,
+          style: t ? { backgroundColor: t } : {}
+        }
+      )
+    ] });
+  }
+  return n === "multicolor" ? /* @__PURE__ */ r.jsx("div", { className: `${d} relative ${l}`, children: /* @__PURE__ */ r.jsx("div", { className: `absolute inset-0 rounded-full ${h} animate-spin`, children: /* @__PURE__ */ r.jsx("div", { className: "absolute inset-[3px] bg-white rounded-full" }) }) }) : n === "orbit" ? t ? /* @__PURE__ */ r.jsxs("div", { className: `relative ${d} ${l}`, children: [
+    /* @__PURE__ */ r.jsx(
+      "div",
+      {
+        className: "absolute inset-0 rounded-full border-2 border-t-transparent border-b-transparent animate-spin",
+        style: { borderColor: t, borderTopColor: "transparent", borderBottomColor: "transparent" }
+      }
+    ),
+    /* @__PURE__ */ r.jsx(
+      "div",
+      {
+        className: "absolute inset-1 rounded-full border-2 border-l-transparent border-r-transparent animate-spin-reverse opacity-75",
+        style: { borderColor: t, borderLeftColor: "transparent", borderRightColor: "transparent", animationDirection: "reverse", animationDuration: "1.5s" }
+      }
+    )
+  ] }) : /* @__PURE__ */ r.jsxs("div", { className: `relative ${d} ${l}`, children: [
+    /* @__PURE__ */ r.jsx("div", { className: `absolute inset-0 rounded-full ${h} animate-spin`, children: /* @__PURE__ */ r.jsx("div", { className: "absolute inset-[2px] bg-white rounded-full" }) }),
+    /* @__PURE__ */ r.jsx("div", { className: `absolute inset-1 rounded-full ${h} animate-spin-reverse opacity-75`, style: { animationDirection: "reverse", animationDuration: "1.5s" }, children: /* @__PURE__ */ r.jsx("div", { className: "absolute inset-[2px] bg-white rounded-full" }) })
+  ] }) : null;
+}, me = ({
+  variant: n = "info",
+  title: a,
+  children: l,
+  onClose: t,
+  className: o = ""
+}) => {
+  const c = {
+    success: {
+      container: "bg-green-50 text-green-900 border-green-200",
+      iconColor: "text-green-600",
+      closeHover: "hover:bg-green-100 text-green-600",
+      Icon: () => /* @__PURE__ */ r.jsx("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) })
+    },
+    error: {
+      container: "bg-red-50 text-red-900 border-red-200",
+      iconColor: "text-red-600",
+      closeHover: "hover:bg-red-100 text-red-600",
+      Icon: () => /* @__PURE__ */ r.jsx("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) })
+    },
+    warning: {
+      container: "bg-yellow-50 text-yellow-900 border-yellow-200",
+      iconColor: "text-yellow-600",
+      closeHover: "hover:bg-yellow-100 text-yellow-600",
+      Icon: () => /* @__PURE__ */ r.jsx("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" }) })
+    },
+    info: {
+      container: "bg-blue-50 text-blue-900 border-blue-200",
+      iconColor: "text-blue-600",
+      closeHover: "hover:bg-blue-100 text-blue-600",
+      Icon: () => /* @__PURE__ */ r.jsx("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) })
+    }
+  }[n], d = c.Icon;
+  return /* @__PURE__ */ r.jsxs(
+    "div",
+    {
+      role: "alert",
+      className: `flex p-4 rounded-lg border ${c.container} ${o}`,
+      children: [
+        /* @__PURE__ */ r.jsx("div", { className: `shrink-0 ${c.iconColor}`, children: /* @__PURE__ */ r.jsx(d, {}) }),
+        /* @__PURE__ */ r.jsxs("div", { className: "ml-3 text-sm flex-1", children: [
+          a && /* @__PURE__ */ r.jsx("span", { className: "font-semibold block mb-1", children: a }),
+          /* @__PURE__ */ r.jsx("div", { className: "leading-relaxed", children: l })
+        ] }),
+        t && /* @__PURE__ */ r.jsx(
+          "button",
+          {
+            onClick: t,
+            className: `ml-auto -mx-1.5 -my-1.5 rounded-lg p-1.5 inline-flex h-8 w-8 items-center justify-center transition-colors ${c.closeHover}`,
+            "aria-label": "Close",
+            children: /* @__PURE__ */ r.jsx("svg", { className: "w-4 h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+          }
+        )
+      ]
+    }
+  );
+}, oe = ({
+  children: n,
+  colSpan: a,
+  rowSpan: l,
+  colStart: t,
+  className: o = ""
+}) => {
+  const i = {
+    1: "col-span-1",
+    2: "col-span-2",
+    3: "col-span-3",
+    4: "col-span-4",
+    5: "col-span-5",
+    6: "col-span-6",
+    7: "col-span-7",
+    8: "col-span-8",
+    9: "col-span-9",
+    10: "col-span-10",
+    11: "col-span-11",
+    12: "col-span-12",
+    full: "col-span-full"
+  }, c = {
+    1: "row-span-1",
+    2: "row-span-2",
+    3: "row-span-3",
+    4: "row-span-4",
+    5: "row-span-5",
+    6: "row-span-6"
+  }, d = [
+    a ? i[a] : "",
+    l ? c[l] : "",
+    t ? `col-start-${t}` : "",
+    o
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ r.jsx("div", { className: d, children: n });
+}, ae = ({
+  children: n,
+  cols: a = 1,
+  gap: l = 4,
+  gapX: t,
+  gapY: o,
+  flow: i = "row",
+  align: c,
+  justify: d,
+  className: h = ""
+}) => {
+  const p = {
+    1: "grid-cols-1",
+    2: "grid-cols-2",
+    3: "grid-cols-3",
+    4: "grid-cols-4",
+    5: "grid-cols-5",
+    6: "grid-cols-6",
+    8: "grid-cols-8",
+    10: "grid-cols-10",
+    12: "grid-cols-12"
+  }, g = {
+    0: "gap-0",
+    1: "gap-1",
+    2: "gap-2",
+    3: "gap-3",
+    4: "gap-4",
+    5: "gap-5",
+    6: "gap-6",
+    8: "gap-8",
+    10: "gap-10",
+    12: "gap-12"
+  }, b = [
+    "grid",
+    p[a],
+    t === void 0 && o === void 0 ? g[l] : "",
+    // Use standard gap if no X/Y overrides
+    t ? `gap-x-${t}` : "",
+    o ? `gap-y-${o}` : "",
+    i ? `grid-flow-${i}` : "",
+    c ? `items-${c}` : "",
+    d ? `justify-${d}` : "",
+    h
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ r.jsx("div", { className: b, children: n });
+};
+ae.Item = oe;
+const fe = ({
+  variant: n = "body1",
+  component: a,
+  children: l,
+  weight: t,
+  align: o = "left",
+  color: i,
+  className: c = "",
+  noWrap: d = !1
+}) => {
+  const p = a || {
+    h1: "h1",
+    h2: "h2",
+    h3: "h3",
+    h4: "h4",
+    h5: "h5",
+    h6: "h6",
+    body1: "p",
+    body2: "p",
+    caption: "span",
+    overline: "span"
+  }[n] || "p", g = {
+    h1: "text-5xl md:text-6xl tracking-tight leading-tight",
+    h2: "text-4xl md:text-5xl tracking-tight leading-tight",
+    h3: "text-3xl md:text-4xl tracking-tight",
+    h4: "text-2xl md:text-3xl tracking-tight",
+    h5: "text-xl md:text-2xl tracking-normal",
+    h6: "text-lg md:text-xl tracking-normal",
+    body1: "text-base md:text-lg leading-relaxed",
+    body2: "text-sm md:text-base leading-relaxed",
+    caption: "text-xs md:text-sm text-gray-500",
+    overline: "text-xs uppercase tracking-widest font-semibold"
+  }, b = {
+    h1: "font-extrabold",
+    h2: "font-bold",
+    h3: "font-bold",
+    h4: "font-bold",
+    h5: "font-semibold",
+    h6: "font-semibold",
+    body1: "font-normal",
+    body2: "font-normal",
+    caption: "font-normal",
+    overline: "font-bold"
+  }, j = {
+    normal: "font-normal",
+    medium: "font-medium",
+    semibold: "font-semibold",
+    bold: "font-bold",
+    extrabold: "font-extrabold"
+  }, f = {
+    left: "text-left",
+    center: "text-center",
+    right: "text-right",
+    justify: "text-justify"
+  }, v = g[n], k = t ? j[t] : b[n], N = f[o], T = [
+    v,
+    k,
+    N,
+    i || "text-gray-900",
+    d ? "truncate" : "",
+    c
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ r.jsx(p, { className: T, children: l });
+}, le = G.forwardRef(({ as: n, className: a = "", children: l, ...t }, o) => {
+  const i = n || "div";
+  return /* @__PURE__ */ r.jsx(i, { ref: o, className: a, ...t, children: l });
+});
+le.displayName = "Box";
+export {
+  me as Alert,
+  le as Box,
+  w as Button,
+  de as Card,
+  ae as Grid,
+  ce as Input,
+  xe as Loader,
+  ue as Post,
+  fe as Typography
+};