@orbit_ui_toolkit/orbitui-kit 0.1.0 → 0.1.2

package/dist/orbitui.es.js

@@ -1,278 +1,279 @@
-import G from "react";
+import z, { useState as te } 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,
+var G;
+function se() {
+  if (G) return C;
+  G = 1;
+  var s = /* @__PURE__ */ Symbol.for("react.transitional.element"), o = /* @__PURE__ */ Symbol.for("react.fragment");
+  function i(t, l, n) {
+    var a = null;
+    if (n !== void 0 && (a = "" + n), l.key !== void 0 && (a = "" + l.key), "key" in l) {
+      n = {};
+      for (var c in l)
+        c !== "key" && (n[c] = l[c]);
+    } else n = l;
+    return l = n.ref, {
+      $$typeof: s,
       type: t,
-      key: c,
-      ref: o !== void 0 ? o : null,
-      props: i
+      key: a,
+      ref: l !== void 0 ? l : null,
+      props: n
     };
   }
-  return C.Fragment = a, C.jsx = l, C.jsxs = l, C;
+  return C.Fragment = o, C.jsx = i, C.jsxs = i, 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:
+var $ = {};
+var H;
+function ne() {
+  return H || (H = 1, process.env.NODE_ENV !== "production" && (function() {
+    function s(r) {
+      if (r == null) return null;
+      if (typeof r == "function")
+        return r.$$typeof === K ? null : r.displayName || r.name || null;
+      if (typeof r == "string") return r;
+      switch (r) {
+        case j:
           return "Fragment";
-        case M:
+        case _:
           return "Profiler";
-        case L:
+        case T:
           return "StrictMode";
-        case J:
+        case q:
           return "Suspense";
         case Z:
           return "SuspenseList";
         case Q:
           return "Activity";
       }
-      if (typeof e == "object")
-        switch (typeof e.tag == "number" && console.error(
+      if (typeof r == "object")
+        switch (typeof r.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:
+        ), r.$$typeof) {
+          case N:
             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 S:
+            return r.displayName || "Context";
+          case W:
+            return (r._context.displayName || "Context") + ".Consumer";
+          case I:
+            var d = r.render;
+            return r = r.displayName, r || (r = d.displayName || d.name || "", r = r !== "" ? "ForwardRef(" + r + ")" : "ForwardRef"), r;
           case X:
-            return s = e.displayName || null, s !== null ? s : n(e.type) || "Memo";
-          case $:
-            s = e._payload, e = e._init;
+            return d = r.displayName || null, d !== null ? d : s(r.type) || "Memo";
+          case A:
+            d = r._payload, r = r._init;
             try {
-              return n(e(s));
+              return s(r(d));
             } catch {
             }
         }
       return null;
     }
-    function a(e) {
-      return "" + e;
+    function o(r) {
+      return "" + r;
     }
-    function l(e) {
+    function i(r) {
       try {
-        a(e);
-        var s = !1;
+        o(r);
+        var d = !1;
       } catch {
-        s = !0;
+        d = !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,
+      if (d) {
+        d = console;
+        var x = d.error, h = typeof Symbol == "function" && Symbol.toStringTag && r[Symbol.toStringTag] || r.constructor.name || "Object";
+        return x.call(
+          d,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          x
-        ), a(e);
+          h
+        ), o(r);
       }
     }
-    function t(e) {
-      if (e === N) return "<>";
-      if (typeof e == "object" && e !== null && e.$$typeof === $)
+    function t(r) {
+      if (r === j) return "<>";
+      if (typeof r == "object" && r !== null && r.$$typeof === A)
         return "<...>";
       try {
-        var s = n(e);
-        return s ? "<" + s + ">" : "<...>";
+        var d = s(r);
+        return d ? "<" + d + ">" : "<...>";
       } catch {
         return "<...>";
       }
     }
-    function o() {
-      var e = S.A;
-      return e === null ? null : e.getOwner();
+    function l() {
+      var r = O.A;
+      return r === null ? null : r.getOwner();
     }
-    function i() {
+    function n() {
       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;
+    function a(r) {
+      if (B.call(r, "key")) {
+        var d = Object.getOwnPropertyDescriptor(r, "key").get;
+        if (d && d.isReactWarning) return !1;
       }
-      return e.key !== void 0;
+      return r.key !== void 0;
     }
-    function d(e, s) {
-      function u() {
-        W || (W = !0, console.error(
+    function c(r, d) {
+      function x() {
+        D || (D = !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
+          d
         ));
       }
-      u.isReactWarning = !0, Object.defineProperty(e, "key", {
-        get: u,
+      x.isReactWarning = !0, Object.defineProperty(r, "key", {
+        get: x,
         configurable: !0
       });
     }
-    function h() {
-      var e = n(this.type);
-      return B[e] || (B[e] = !0, console.error(
+    function u() {
+      var r = s(this.type);
+      return Y[r] || (Y[r] = !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;
+      )), r = this.props.ref, r !== void 0 ? r : 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", {
+    function f(r, d, x, h, E, L) {
+      var m = x.ref;
+      return r = {
+        $$typeof: y,
+        type: r,
+        key: d,
+        props: x,
+        _owner: h
+      }, (m !== void 0 ? m : null) !== null ? Object.defineProperty(r, "ref", {
         enumerable: !1,
-        get: h
-      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        get: u
+      }) : Object.defineProperty(r, "ref", { enumerable: !1, value: null }), r._store = {}, Object.defineProperty(r._store, "validated", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: 0
-      }), Object.defineProperty(e, "_debugInfo", {
+      }), Object.defineProperty(r, "_debugInfo", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: null
-      }), Object.defineProperty(e, "_debugStack", {
+      }), Object.defineProperty(r, "_debugStack", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: E
-      }), Object.defineProperty(e, "_debugTask", {
+      }), Object.defineProperty(r, "_debugTask", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: O
-      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+        value: L
+      }), Object.freeze && (Object.freeze(r.props), Object.freeze(r)), r;
     }
-    function g(e, s, u, x, E, O) {
-      var m = s.children;
+    function b(r, d, x, h, E, L) {
+      var m = d.children;
       if (m !== void 0)
-        if (x)
+        if (h)
           if (ee(m)) {
-            for (x = 0; x < m.length; x++)
-              b(m[x]);
+            for (h = 0; h < m.length; h++)
+              p(m[h]);
             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) {
+        else p(m);
+      if (B.call(d, "key")) {
+        m = s(r);
+        var w = Object.keys(d).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(
+        h = 0 < w.length ? "{key: someKey, " + w.join(": ..., ") + ": ...}" : "{key: someKey}", V[m + h] || (w = 0 < w.length ? "{" + w.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,
+          h,
           m,
-          y,
+          w,
           m
-        ), Y[m + x] = !0);
+        ), V[m + h] = !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,
+      if (m = null, x !== void 0 && (i(x), m = "" + x), a(d) && (i(d.key), m = "" + d.key), "key" in d) {
+        x = {};
+        for (var M in d)
+          M !== "key" && (x[M] = d[M]);
+      } else x = d;
+      return m && c(
+        x,
+        typeof r == "function" ? r.displayName || r.name || "Unknown" : r
+      ), f(
+        r,
         m,
-        u,
-        o(),
+        x,
+        l(),
         E,
-        O
+        L
       );
     }
-    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 p(r) {
+      v(r) ? r._store && (r._store.validated = 1) : typeof r == "object" && r !== null && r.$$typeof === A && (r._payload.status === "fulfilled" ? v(r._payload.value) && r._payload.value._store && (r._payload.value._store.validated = 1) : r._store && (r._store.validated = 1));
     }
-    function j(e) {
-      return typeof e == "object" && e !== null && e.$$typeof === v;
+    function v(r) {
+      return typeof r == "object" && r !== null && r.$$typeof === y;
     }
-    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() {
+    var g = z, y = /* @__PURE__ */ Symbol.for("react.transitional.element"), N = /* @__PURE__ */ Symbol.for("react.portal"), j = /* @__PURE__ */ Symbol.for("react.fragment"), T = /* @__PURE__ */ Symbol.for("react.strict_mode"), _ = /* @__PURE__ */ Symbol.for("react.profiler"), W = /* @__PURE__ */ Symbol.for("react.consumer"), S = /* @__PURE__ */ Symbol.for("react.context"), I = /* @__PURE__ */ Symbol.for("react.forward_ref"), q = /* @__PURE__ */ Symbol.for("react.suspense"), Z = /* @__PURE__ */ Symbol.for("react.suspense_list"), X = /* @__PURE__ */ Symbol.for("react.memo"), A = /* @__PURE__ */ Symbol.for("react.lazy"), Q = /* @__PURE__ */ Symbol.for("react.activity"), K = /* @__PURE__ */ Symbol.for("react.client.reference"), O = g.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, B = Object.prototype.hasOwnProperty, ee = Array.isArray, P = console.createTask ? console.createTask : function() {
       return null;
     };
-    f = {
-      react_stack_bottom_frame: function(e) {
-        return e();
+    g = {
+      react_stack_bottom_frame: function(r) {
+        return r();
       }
     };
-    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,
+    var D, Y = {}, F = g.react_stack_bottom_frame.bind(
+      g,
+      n
+    )(), U = P(t(n)), V = {};
+    $.Fragment = j, $.jsx = function(r, d, x) {
+      var h = 1e4 > O.recentlyCreatedOwnerStacks++;
+      return b(
+        r,
+        d,
+        x,
         !1,
-        x ? Error("react-stack-top-frame") : D,
-        x ? A(t(e)) : I
+        h ? Error("react-stack-top-frame") : F,
+        h ? P(t(r)) : U
       );
-    }, _.jsxs = function(e, s, u) {
-      var x = 1e4 > S.recentlyCreatedOwnerStacks++;
-      return g(
-        e,
-        s,
-        u,
+    }, $.jsxs = function(r, d, x) {
+      var h = 1e4 > O.recentlyCreatedOwnerStacks++;
+      return b(
+        r,
+        d,
+        x,
         !0,
-        x ? Error("react-stack-top-frame") : D,
-        x ? A(t(e)) : I
+        h ? Error("react-stack-top-frame") : F,
+        h ? P(t(r)) : U
       );
     };
-  })()), _;
+  })()), $;
 }
-var V;
-function ne() {
-  return V || (V = 1, process.env.NODE_ENV === "production" ? R.exports = te() : R.exports = se()), R.exports;
+var J;
+function oe() {
+  return J || (J = 1, process.env.NODE_ENV === "production" ? R.exports = se() : R.exports = ne()), R.exports;
 }
-var r = ne();
-const w = ({
-  variant: n = "primary",
-  size: a = "md",
-  rounded: l = "full",
+var e = oe();
+const k = ({
+  variant: s = "primary",
+  size: o = "md",
+  rounded: i = "full",
   isLoading: t = !1,
-  fullWidth: o = !1,
-  leftIcon: i,
-  rightIcon: c,
-  className: d = "",
-  children: h,
-  disabled: p,
-  ...g
+  fullWidth: l = !1,
+  leftIcon: n,
+  rightIcon: a,
+  className: c = "",
+  children: u,
+  disabled: f,
+  gradient: b,
+  ...p
 }) => {
-  const b = "inline-flex items-center justify-center font-medium disabled:opacity-50 disabled:pointer-events-none transition-colors duration-150", j = {
+  const v = "inline-flex items-center justify-center font-medium disabled:opacity-50 disabled:pointer-events-none transition-colors duration-150", g = {
     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
@@ -282,203 +283,223 @@ const w = ({
     // 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"
+    ghost: "bg-transparent text-gray-700 hover:bg-gray-100 border-transparent",
     // Transparent with hover bg
-  }, f = {
+    gradient: `text-white border-none hover:opacity-90 active:scale-95 ${b || "bg-gradient-to-r from-red-500 to-pink-500"}`
+  }, y = {
     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]",
+    md: "px-6 py-2.5 text-sm gap-2 min-w-[100px]",
+    lg: "px-8 py-3.5 text-lg gap-2 min-w-[120px]",
     icon: "w-10 h-10 p-0 min-w-0"
-  }, v = {
+  }, N = {
     none: "rounded-none",
     sm: "rounded-sm",
     md: "rounded-md",
     lg: "rounded-lg",
     full: "rounded-full"
-  }, k = o ? "w-full" : "";
-  return /* @__PURE__ */ r.jsxs(
+  }, j = l ? "w-full" : "";
+  return /* @__PURE__ */ e.jsxs(
     "button",
     {
-      className: `${b} ${j[n]} ${f[a]} ${v[l]} ${k} ${d}`,
-      disabled: p || t,
-      ...g,
+      className: `${v} ${g[s]} ${y[o]} ${N[i]} ${j} ${c}`,
+      disabled: f || t,
+      ...p,
       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 && /* @__PURE__ */ e.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__ */ e.jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+          /* @__PURE__ */ e.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 })
+        !t && n && /* @__PURE__ */ e.jsx("span", { className: "shrink-0", children: n }),
+        /* @__PURE__ */ e.jsx("span", { className: "truncate", children: t ? "Loading..." : u }),
+        !t && a && /* @__PURE__ */ e.jsx("span", { className: "shrink-0", children: a })
       ]
     }
   );
-}, ce = ({
-  label: n,
-  error: a,
-  leftIcon: l,
+}, le = z.forwardRef(({
+  label: s,
+  error: o,
+  leftIcon: i,
   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: `
+  variant: l = "default",
+  className: n = "",
+  ...a
+}, c) => {
+  const u = {
+    default: "bg-white border-gray-300 text-gray-900 focus:ring-blue-500",
+    glass: "bg-black/30 border-gray-600 text-white placeholder-gray-400 focus:ring-pink-500 focus:border-pink-500",
+    dark: "bg-gray-900 border-gray-800 text-white focus:ring-blue-500"
+  };
+  return /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5 w-full", children: [
+    s && /* @__PURE__ */ e.jsx("label", { className: `text-sm font-medium ${l === "default" ? "text-gray-700" : "text-gray-300"}`, children: s }),
+    /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+      i && /* @__PURE__ */ e.jsx("div", { className: "absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none text-gray-400", children: i }),
+      /* @__PURE__ */ e.jsx(
+        "input",
+        {
+          ref: c,
+          className: `
                         w-full 
-                        ${l ? "pl-10" : "px-3"} 
+                        ${i ? "pl-10" : "px-3"} 
                         ${t ? "pr-10" : "px-3"} 
-                        py-2 
-                        bg-white 
+                        py-3 
                         border 
-                        ${a ? "border-red-500" : "border-gray-300"} 
-                        rounded-md 
+                        ${o ? "border-red-500" : ""} 
+                        rounded-lg 
                         shadow-sm 
                         focus:outline-none 
                         focus:ring-2 
-                        ${a ? "focus:ring-red-500" : "focus:ring-blue-500"} 
+                        ${o ? "focus:ring-red-500" : ""} 
                         focus:border-transparent 
                         transition-all 
                         duration-200 
-                        hover:border-gray-400 
-                        ${o}
+                        ${u[l]}
+                        ${n}
                     `,
-        ...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,
+          ...a
+        }
+      ),
+      t && /* @__PURE__ */ e.jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center text-gray-400", children: t })
+    ] }),
+    o && /* @__PURE__ */ e.jsx("span", { className: "text-xs text-red-500", children: o })
+  ] });
+});
+le.displayName = "Input";
+const ue = ({
+  title: s,
+  subtitle: o,
+  children: i,
   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,
+  className: l = "",
+  variant: n = "default",
+  noPadding: a = !1
+}) => {
+  const c = {
+    default: "bg-white border-gray-200 shadow-sm",
+    glass: "bg-black/40 backdrop-blur-lg border-gray-800 shadow-lg",
+    transparent: "bg-transparent border-none shadow-none"
+  };
+  return /* @__PURE__ */ e.jsxs("div", { className: `rounded-xl border overflow-hidden transition-all duration-300 ${c[n]} ${l}`, children: [
+    (s || o) && /* @__PURE__ */ e.jsxs("div", { className: `px-6 py-4 border-b ${n === "glass" ? "border-gray-800" : "border-gray-100"}`, children: [
+      s && /* @__PURE__ */ e.jsx("h3", { className: `text-lg font-semibold ${n === "glass" ? "text-white" : "text-gray-900"}`, children: s }),
+      o && /* @__PURE__ */ e.jsx("p", { className: `text-sm mt-1 ${n === "glass" ? "text-gray-400" : "text-gray-500"}`, children: o })
+    ] }),
+    /* @__PURE__ */ e.jsx("div", { className: a ? "" : "px-6 py-4", children: i }),
+    t && /* @__PURE__ */ e.jsx("div", { className: `px-6 py-4 border-t ${n === "glass" ? "bg-black/20 border-gray-800" : "bg-gray-50 border-gray-100"}`, children: t })
+  ] });
+}, xe = ({
+  username: s,
+  profilePic: o,
+  postImage: i,
   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(
+  caption: l,
+  location: n,
+  isLiked: a = !1,
+  isBookmarked: c = !1,
+  onLike: u,
+  onComment: f,
+  onShare: b,
+  onBookmark: p
+}) => /* @__PURE__ */ e.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__ */ e.jsxs("div", { className: "relative w-full aspect-4/5 bg-gray-100 overflow-hidden", children: [
+    /* @__PURE__ */ e.jsx(
       "img",
       {
-        src: l,
+        src: i,
         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,
+    /* @__PURE__ */ e.jsx("div", { className: "absolute top-4 right-4 opacity-0 group-hover:opacity-100 transition-opacity", children: /* @__PURE__ */ e.jsx(
+      k,
       {
         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" })
+        children: /* @__PURE__ */ e.jsxs("svg", { "aria-label": "More options", fill: "currentColor", height: "24", role: "img", viewBox: "0 0 24 24", width: "24", children: [
+          /* @__PURE__ */ e.jsx("circle", { cx: "12", cy: "12", r: "1.5" }),
+          /* @__PURE__ */ e.jsx("circle", { cx: "6", cy: "12", r: "1.5" }),
+          /* @__PURE__ */ e.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(
+  /* @__PURE__ */ e.jsxs("div", { className: "p-5", children: [
+    /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between mb-4", children: [
+      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ e.jsx("div", { className: "relative", children: /* @__PURE__ */ e.jsx(
           "img",
           {
-            src: a,
-            alt: n,
+            src: o,
+            alt: s,
             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__ */ e.jsxs("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ e.jsx("span", { className: "font-bold text-gray-900 text-sm leading-tight hover:text-indigo-600 cursor-pointer transition-colors", children: s }),
+          n && /* @__PURE__ */ e.jsx("span", { className: "text-[11px] font-medium text-gray-400 uppercase tracking-wide", children: n })
         ] })
       ] }),
-      /* @__PURE__ */ r.jsxs("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ r.jsx(
-          w,
+      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ e.jsx(
+          k,
           {
             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" }) })
+            onClick: u,
+            className: `transition-colors ${a ? "text-rose-500 hover:bg-rose-50" : "text-gray-400 hover:text-rose-500"}`,
+            children: a ? /* @__PURE__ */ e.jsx("svg", { "aria-label": "Unlike", fill: "currentColor", height: "26", role: "img", viewBox: "0 0 48 48", width: "26", children: /* @__PURE__ */ e.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__ */ e.jsx("svg", { "aria-label": "Like", fill: "currentColor", height: "26", role: "img", viewBox: "0 0 24 24", width: "26", children: /* @__PURE__ */ e.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,
+        /* @__PURE__ */ e.jsx(
+          k,
           {
             variant: "ghost",
             size: "icon",
             rounded: "full",
-            onClick: p,
+            onClick: f,
             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" }) })
+            children: /* @__PURE__ */ e.jsx("svg", { "aria-label": "Comment", fill: "currentColor", height: "26", role: "img", viewBox: "0 0 24 24", width: "26", children: /* @__PURE__ */ e.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,
+        /* @__PURE__ */ e.jsx(
+          k,
           {
             variant: "ghost",
             size: "icon",
             rounded: "full",
-            onClick: g,
+            onClick: b,
             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" })
+            children: /* @__PURE__ */ e.jsxs("svg", { "aria-label": "Share Post", fill: "currentColor", height: "26", role: "img", viewBox: "0 0 24 24", width: "26", children: [
+              /* @__PURE__ */ e.jsx("line", { fill: "none", stroke: "currentColor", strokeLinejoin: "round", strokeWidth: "2", x1: "22", x2: "9.218", y1: "3", y2: "10.083" }),
+              /* @__PURE__ */ e.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: [
+    /* @__PURE__ */ e.jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ e.jsx("p", { className: "text-gray-800 text-sm leading-relaxed", children: l }),
+      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between pt-2 border-t border-gray-50", children: [
+        /* @__PURE__ */ e.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,
+        /* @__PURE__ */ e.jsx("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ e.jsx(
+          k,
           {
             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" }) })
+            onClick: p,
+            className: `transition-colors ${c ? "text-gray-900" : "text-gray-400 hover:text-gray-900"}`,
+            children: c ? /* @__PURE__ */ e.jsx("svg", { "aria-label": "Remove", fill: "currentColor", height: "22", role: "img", viewBox: "0 0 24 24", width: "22", children: /* @__PURE__ */ e.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__ */ e.jsx("svg", { "aria-label": "Save", fill: "currentColor", height: "22", role: "img", viewBox: "0 0 24 24", width: "22", children: /* @__PURE__ */ e.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(
+      /* @__PURE__ */ e.jsxs("div", { className: "relative mt-2", children: [
+        /* @__PURE__ */ e.jsx(
           "input",
           {
             type: "text",
@@ -486,148 +507,148 @@ const w = ({
             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" }) })
+        /* @__PURE__ */ e.jsx("div", { className: "absolute right-2 top-1/2 -translate-y-1/2", children: /* @__PURE__ */ e.jsx(k, { 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 = "",
+] }), he = ({
+  variant: s = "spinner",
+  size: o = "md",
+  className: i = "",
   color: t,
-  colors: o
+  colors: l
 }) => {
-  const i = {
+  const n = {
     sm: "w-4 h-4",
     md: "w-8 h-8",
     lg: "w-12 h-12",
     xl: "w-16 h-16"
-  }, c = {
+  }, a = {
     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(
+  }, c = n[o], u = "bg-gradient-to-tr from-yellow-400 via-red-500 to-purple-600";
+  if (s === "dots") {
+    const f = a[o], b = !!t || !!l?.length, p = (g) => {
+      if (!b) return {};
+      const y = l?.[g] || t;
+      return y ? { backgroundColor: y } : {};
+    }, v = () => b ? "" : u;
+    return /* @__PURE__ */ e.jsx("div", { className: `flex items-center justify-center gap-1 ${i}`, children: [0, 1, 2].map((g) => /* @__PURE__ */ e.jsx(
       "div",
       {
-        className: `${p} rounded-full animate-bounce ${j()}`,
+        className: `${f} rounded-full animate-bounce ${v()}`,
         style: {
-          ...b(f),
-          animationDelay: f === 0 ? "-0.3s" : f === 1 ? "-0.15s" : "0s"
+          ...p(g),
+          animationDelay: g === 0 ? "-0.3s" : g === 1 ? "-0.15s" : "0s"
         }
       },
-      f
+      g
     )) });
   }
-  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(
+  if (s === "pulse") {
+    const f = t ? "" : u;
+    return /* @__PURE__ */ e.jsxs("div", { className: `relative flex items-center justify-center ${c} ${i}`, children: [
+      /* @__PURE__ */ e.jsx(
         "span",
         {
-          className: `absolute inline-flex h-full w-full rounded-full opacity-75 animate-ping ${p}`,
+          className: `absolute inline-flex h-full w-full rounded-full opacity-75 animate-ping ${f}`,
           style: t ? { backgroundColor: t } : {}
         }
       ),
-      /* @__PURE__ */ r.jsx(
+      /* @__PURE__ */ e.jsx(
         "span",
         {
-          className: `relative inline-flex rounded-full h-3/4 w-3/4 ${p}`,
+          className: `relative inline-flex rounded-full h-3/4 w-3/4 ${f}`,
           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(
+  return s === "multicolor" ? /* @__PURE__ */ e.jsx("div", { className: `${c} relative ${i}`, children: /* @__PURE__ */ e.jsx("div", { className: `absolute inset-0 rounded-full ${u} animate-spin`, children: /* @__PURE__ */ e.jsx("div", { className: "absolute inset-[3px] bg-white rounded-full" }) }) }) : s === "orbit" ? t ? /* @__PURE__ */ e.jsxs("div", { className: `relative ${c} ${i}`, children: [
+    /* @__PURE__ */ e.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(
+    /* @__PURE__ */ e.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" }) })
+  ] }) : /* @__PURE__ */ e.jsxs("div", { className: `relative ${c} ${i}`, children: [
+    /* @__PURE__ */ e.jsx("div", { className: `absolute inset-0 rounded-full ${u} animate-spin`, children: /* @__PURE__ */ e.jsx("div", { className: "absolute inset-[2px] bg-white rounded-full" }) }),
+    /* @__PURE__ */ e.jsx("div", { className: `absolute inset-1 rounded-full ${u} animate-spin-reverse opacity-75`, style: { animationDirection: "reverse", animationDuration: "1.5s" }, children: /* @__PURE__ */ e.jsx("div", { className: "absolute inset-[2px] bg-white rounded-full" }) })
   ] }) : null;
 }, me = ({
-  variant: n = "info",
-  title: a,
-  children: l,
+  variant: s = "info",
+  title: o,
+  children: i,
   onClose: t,
-  className: o = ""
+  className: l = ""
 }) => {
-  const c = {
+  const a = {
     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" }) })
+      Icon: () => /* @__PURE__ */ e.jsx("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e.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" }) })
+      Icon: () => /* @__PURE__ */ e.jsx("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e.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" }) })
+      Icon: () => /* @__PURE__ */ e.jsx("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e.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" }) })
+      Icon: () => /* @__PURE__ */ e.jsx("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e.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(
+  }[s], c = a.Icon;
+  return /* @__PURE__ */ e.jsxs(
     "div",
     {
       role: "alert",
-      className: `flex p-4 rounded-lg border ${c.container} ${o}`,
+      className: `flex p-4 rounded-lg border ${a.container} ${l}`,
       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 })
+        /* @__PURE__ */ e.jsx("div", { className: `shrink-0 ${a.iconColor}`, children: /* @__PURE__ */ e.jsx(c, {}) }),
+        /* @__PURE__ */ e.jsxs("div", { className: "ml-3 text-sm flex-1", children: [
+          o && /* @__PURE__ */ e.jsx("span", { className: "font-semibold block mb-1", children: o }),
+          /* @__PURE__ */ e.jsx("div", { className: "leading-relaxed", children: i })
         ] }),
-        t && /* @__PURE__ */ r.jsx(
+        t && /* @__PURE__ */ e.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}`,
+            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 ${a.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" }) })
+            children: /* @__PURE__ */ e.jsx("svg", { className: "w-4 h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
           }
         )
       ]
     }
   );
-}, oe = ({
-  children: n,
-  colSpan: a,
-  rowSpan: l,
+}, ae = ({
+  children: s,
+  colSpan: o,
+  rowSpan: i,
   colStart: t,
-  className: o = ""
+  className: l = ""
 }) => {
-  const i = {
+  const n = {
     1: "col-span-1",
     2: "col-span-2",
     3: "col-span-3",
@@ -641,32 +662,32 @@ const w = ({
     11: "col-span-11",
     12: "col-span-12",
     full: "col-span-full"
-  }, c = {
+  }, a = {
     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] : "",
+  }, c = [
+    o ? n[o] : "",
+    i ? a[i] : "",
     t ? `col-start-${t}` : "",
-    o
+    l
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r.jsx("div", { className: d, children: n });
-}, ae = ({
-  children: n,
-  cols: a = 1,
-  gap: l = 4,
+  return /* @__PURE__ */ e.jsx("div", { className: c, children: s });
+}, ie = ({
+  children: s,
+  cols: o = 1,
+  gap: i = 4,
   gapX: t,
-  gapY: o,
-  flow: i = "row",
-  align: c,
-  justify: d,
-  className: h = ""
+  gapY: l,
+  flow: n = "row",
+  align: a,
+  justify: c,
+  className: u = ""
 }) => {
-  const p = {
+  const f = {
     1: "grid-cols-1",
     2: "grid-cols-2",
     3: "grid-cols-3",
@@ -676,7 +697,7 @@ const w = ({
     8: "grid-cols-8",
     10: "grid-cols-10",
     12: "grid-cols-12"
-  }, g = {
+  }, b = {
     0: "gap-0",
     1: "gap-1",
     2: "gap-2",
@@ -687,32 +708,33 @@ const w = ({
     8: "gap-8",
     10: "gap-10",
     12: "gap-12"
-  }, b = [
+  }, p = [
     "grid",
-    p[a],
-    t === void 0 && o === void 0 ? g[l] : "",
+    f[o],
+    t === void 0 && l === void 0 ? b[i] : "",
     // 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
+    l ? `gap-y-${l}` : "",
+    n ? `grid-flow-${n}` : "",
+    a ? `items-${a}` : "",
+    c ? `justify-${c}` : "",
+    u
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r.jsx("div", { className: b, children: n });
+  return /* @__PURE__ */ e.jsx("div", { className: p, children: s });
 };
-ae.Item = oe;
+ie.Item = ae;
 const fe = ({
-  variant: n = "body1",
-  component: a,
-  children: l,
+  variant: s = "body1",
+  component: o,
+  children: i,
   weight: t,
-  align: o = "left",
-  color: i,
-  className: c = "",
-  noWrap: d = !1
+  align: l = "left",
+  color: n,
+  className: a = "",
+  noWrap: c = !1,
+  gradient: u
 }) => {
-  const p = a || {
+  const b = o || {
     h1: "h1",
     h2: "h2",
     h3: "h3",
@@ -723,7 +745,7 @@ const fe = ({
     body2: "p",
     caption: "span",
     overline: "span"
-  }[n] || "p", g = {
+  }[s] || "p", p = {
     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",
@@ -734,7 +756,7 @@ const fe = ({
     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 = {
+  }, v = {
     h1: "font-extrabold",
     h2: "font-bold",
     h3: "font-bold",
@@ -745,39 +767,310 @@ const fe = ({
     body2: "font-normal",
     caption: "font-normal",
     overline: "font-bold"
-  }, j = {
+  }, g = {
     normal: "font-normal",
     medium: "font-medium",
     semibold: "font-semibold",
     bold: "font-bold",
     extrabold: "font-extrabold"
-  }, f = {
+  }, y = {
     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 = p[s], j = t ? g[t] : v[s], T = y[l];
+  let _ = n || (s === "caption" ? "text-gray-500" : "text-gray-900");
+  u && (_ = `${typeof u == "string" ? u : "bg-gradient-to-r from-pink-500 via-red-500 to-yellow-500"} text-transparent bg-clip-text`);
+  const S = [
     N,
-    i || "text-gray-900",
-    d ? "truncate" : "",
-    c
+    j,
+    T,
+    _,
+    c ? "truncate" : "",
+    a
   ].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 });
+  return /* @__PURE__ */ e.jsx(b, { className: S, children: i });
+}, ce = z.forwardRef(({
+  as: s,
+  className: o = "",
+  children: i,
+  center: t,
+  fullScreen: l,
+  bgImage: n,
+  overlay: a,
+  glass: c,
+  style: u,
+  ...f
+}, b) => {
+  const p = s || "div", v = [
+    t ? "flex items-center justify-center" : "",
+    l ? "min-h-screen w-full" : "",
+    c ? "backdrop-blur-lg bg-black/40" : "",
+    o
+  ].filter(Boolean).join(" "), g = {
+    ...n ? {
+      backgroundImage: `url(${n})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      backgroundRepeat: "no-repeat"
+    } : {},
+    ...u
+  };
+  return /* @__PURE__ */ e.jsxs(p, { ref: b, className: `relative ${v}`, style: g, ...f, children: [
+    a && /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        className: `absolute inset-0 z-0 ${typeof a == "string" ? "" : "bg-black/70"}`,
+        style: typeof a == "string" ? { backgroundColor: a } : {}
+      }
+    ),
+    /* @__PURE__ */ e.jsx("div", { className: "relative z-10 w-full h-full flex flex-col items-center justify-center", children: i })
+  ] });
 });
-le.displayName = "Box";
+ce.displayName = "Box";
+const ge = ({
+  label: s,
+  error: o,
+  autoResize: i,
+  className: t = "",
+  rows: l = 4,
+  ...n
+}) => {
+  const a = (c) => {
+    i && (c.target.style.height = "auto", c.target.style.height = `${c.target.scrollHeight}px`), n.onChange?.(c);
+  };
+  return /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5 w-full", children: [
+    s && /* @__PURE__ */ e.jsx("label", { className: "text-sm font-medium text-gray-700", children: s }),
+    /* @__PURE__ */ e.jsx(
+      "textarea",
+      {
+        className: `
+                    w-full 
+                    px-3 
+                    py-2 
+                    bg-white 
+                    border 
+                    ${o ? "border-red-500" : "border-gray-300"} 
+                    rounded-md 
+                    shadow-sm 
+                    focus:outline-none 
+                    focus:ring-2 
+                    ${o ? "focus:ring-red-500" : "focus:ring-blue-500"} 
+                    focus:border-transparent 
+                    transition-all 
+                    duration-200 
+                    hover:border-gray-400 
+                    min-h-[100px]
+                    resize-y
+                    ${t}
+                `,
+        rows: l,
+        onInput: a,
+        ...n
+      }
+    ),
+    o && /* @__PURE__ */ e.jsx("span", { className: "text-xs text-red-500", children: o })
+  ] });
+}, be = ({
+  sidebar: s,
+  header: o,
+  children: i,
+  footer: t,
+  sidebarWidth: l = "260px",
+  className: n = ""
+}) => {
+  const [a, c] = te(!1);
+  return /* @__PURE__ */ e.jsxs("div", { className: `flex h-screen bg-gray-50 overflow-hidden ${n}`, children: [
+    s && /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        className: "hidden md:flex flex-col h-full bg-white border-r border-gray-200",
+        style: { width: l },
+        children: s
+      }
+    ),
+    s && a && /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        className: "fixed inset-0 z-40 bg-black/50 md:hidden",
+        onClick: () => c(!1)
+      }
+    ),
+    s && /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        className: `
+                        fixed inset-y-0 left-0 z-50 w-64 bg-white shadow-xl transition-transform duration-300 md:hidden
+                        ${a ? "translate-x-0" : "-translate-x-full"}
+                    `,
+        children: s
+      }
+    ),
+    /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col flex-1 min-w-0 overflow-hidden", children: [
+      /* @__PURE__ */ e.jsxs("header", { className: "flex h-16 items-center border-b border-gray-200 bg-white px-4 shrink-0", children: [
+        s && /* @__PURE__ */ e.jsx(
+          "button",
+          {
+            className: "mr-4 p-2 md:hidden text-gray-500 hover:bg-gray-100 rounded-md",
+            onClick: () => c(!0),
+            children: /* @__PURE__ */ e.jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 6h16M4 12h16m-7 6h7" }) })
+          }
+        ),
+        /* @__PURE__ */ e.jsx("div", { className: "flex-1 flex items-center justify-between", children: o || /* @__PURE__ */ e.jsx("div", { className: "font-bold text-xl text-indigo-600", children: "OrbitUI" }) })
+      ] }),
+      /* @__PURE__ */ e.jsx("main", { className: "flex-1 overflow-y-auto p-4 md:p-6 lg:p-8", children: i }),
+      t && /* @__PURE__ */ e.jsx("footer", { className: "h-14 border-t border-gray-200 bg-white px-4 flex items-center shrink-0", children: t })
+    ] })
+  ] });
+}, pe = ({
+  sidebar: s,
+  header: o,
+  children: i,
+  footer: t,
+  maxWidth: l = "935px",
+  className: n = ""
+}) => /* @__PURE__ */ e.jsxs("div", { className: `flex flex-col md:flex-row h-screen bg-white ${n}`, children: [
+  s && /* @__PURE__ */ e.jsx("aside", { className: "hidden md:flex flex-col fixed left-0 h-screen border-r border-gray-200 transition-all duration-300 xl:w-64 w-20 z-50 bg-white", children: s }),
+  /* @__PURE__ */ e.jsxs(
+    "main",
+    {
+      className: `
+                    flex-1 bg-white overflow-y-auto min-w-0
+                    ${s ? "md:ml-20 xl:ml-64" : ""}
+                `,
+      children: [
+        o && /* @__PURE__ */ e.jsx("header", { className: "sticky top-0 z-40 bg-white/80 backdrop-blur-md border-b border-gray-100 md:hidden", children: o }),
+        /* @__PURE__ */ e.jsx("div", { className: "mx-auto px-4 md:px-8 py-8", style: { maxWidth: l }, children: i })
+      ]
+    }
+  ),
+  t && /* @__PURE__ */ e.jsx("nav", { className: "md:hidden fixed bottom-0 left-0 right-0 bg-white border-t border-gray-200 z-50", children: t })
+] }), ve = ({
+  list: s,
+  header: o,
+  children: i,
+  footer: t,
+  isChatActive: l = !1,
+  onBack: n,
+  listWidth: a = "350px",
+  className: c = ""
+}) => /* @__PURE__ */ e.jsxs("div", { className: `flex h-screen bg-white overflow-hidden ${c}`, children: [
+  /* @__PURE__ */ e.jsx(
+    "aside",
+    {
+      className: `
+                    flex-shrink-0 border-r border-gray-200 bg-white transition-all duration-300
+                    ${l ? "hidden md:flex" : "flex w-full md:w-auto"}
+                `,
+      style: { width: l ? a : window.innerWidth < 768 ? "100%" : a },
+      children: /* @__PURE__ */ e.jsx("div", { className: "flex flex-col w-full h-full", children: s })
+    }
+  ),
+  /* @__PURE__ */ e.jsxs(
+    "main",
+    {
+      className: `
+                    flex-1 flex flex-col min-w-0 bg-white transition-all duration-300
+                    ${l ? "flex w-full" : "hidden md:flex"}
+                `,
+      children: [
+        (o || n) && /* @__PURE__ */ e.jsxs("header", { className: "flex h-16 items-center px-4 border-b border-gray-100 shrink-0 bg-white/80 backdrop-blur-md sticky top-0 z-10", children: [
+          n && /* @__PURE__ */ e.jsx(
+            "button",
+            {
+              onClick: n,
+              className: "mr-3 p-2 md:hidden text-gray-500 hover:bg-gray-100 rounded-full transition-colors",
+              "aria-label": "Go back",
+              children: /* @__PURE__ */ e.jsx("svg", { className: "w-6 h-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) })
+            }
+          ),
+          /* @__PURE__ */ e.jsx("div", { className: "flex-1 min-w-0", children: o })
+        ] }),
+        /* @__PURE__ */ e.jsx("div", { className: "flex-1 overflow-y-auto bg-gray-50", children: i }),
+        t && /* @__PURE__ */ e.jsx("footer", { className: "p-4 bg-white border-t border-gray-100 shrink-0", children: t })
+      ]
+    }
+  )
+] }), ye = ({
+  src: s,
+  alt: o = "User",
+  initials: i,
+  size: t = "md",
+  status: l,
+  className: n = "",
+  isBordered: a = !1
+}) => {
+  const c = {
+    xs: "w-6 h-6 text-xs",
+    sm: "w-8 h-8 text-xs",
+    md: "w-10 h-10 text-sm",
+    lg: "w-12 h-12 text-base",
+    xl: "w-16 h-16 text-lg",
+    "2xl": "w-24 h-24 text-xl"
+  }, u = {
+    online: "bg-green-500",
+    offline: "bg-gray-400",
+    busy: "bg-red-500",
+    away: "bg-yellow-500"
+  }, f = {
+    xs: "w-1.5 h-1.5",
+    sm: "w-2 h-2",
+    md: "w-2.5 h-2.5",
+    lg: "w-3 h-3",
+    xl: "w-4 h-4",
+    "2xl": "w-5 h-5"
+  };
+  return /* @__PURE__ */ e.jsxs("div", { className: `relative inline-block ${n}`, children: [
+    /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        className: `
+                    ${c[t]} 
+                    rounded-full 
+                    flex items-center justify-center 
+                    overflow-hidden 
+                    bg-gray-100 
+                    text-gray-600 
+                    font-bold
+                    ${a ? "ring-2 ring-white" : ""}
+                `,
+        children: s ? /* @__PURE__ */ e.jsx(
+          "img",
+          {
+            src: s,
+            alt: o,
+            className: "w-full h-full object-cover"
+          }
+        ) : /* @__PURE__ */ e.jsx("span", { children: i || o.charAt(0).toUpperCase() })
+      }
+    ),
+    l && /* @__PURE__ */ e.jsx(
+      "span",
+      {
+        className: `
+                        absolute bottom-0 right-0 
+                        block rounded-full 
+                        ring-2 ring-white 
+                        ${u[l]} 
+                        ${f[t]}
+                    `
+      }
+    )
+  ] });
+};
 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,
+  be as AppLayout,
+  ye as Avatar,
+  ce as Box,
+  k as Button,
+  ue as Card,
+  ie as Grid,
+  ve as InboxLayout,
+  le as Input,
+  he as Loader,
+  xe as Post,
+  pe as SocialLayout,
+  ge as TextArea,
   fe as Typography
 };