@floegence/floe-webapp-core 0.1.0

package/dist/index14.js

@@ -0,0 +1,123 @@
+import { delegateEvents as O, createComponent as e, template as l, insert as r, effect as P, className as j } from "solid-js/web";
+import { createSignal as k, Show as n, For as y } from "solid-js";
+import { cn as f } from "./index53.js";
+import { useDeck as D } from "./index46.js";
+import { useWidgetRegistry as F } from "./index45.js";
+import { Plus as T, X, ChevronRight as q } from "./index30.js";
+import { Button as G } from "./index19.js";
+import { deferNonBlocking as H } from "./index54.js";
+var J = /* @__PURE__ */ l('<div class="text-center text-muted-foreground text-sm py-8">No widgets registered'), K = /* @__PURE__ */ l('<div><div class="flex items-center justify-between p-3 border-b border-border"><h2 class="text-sm font-semibold">Add Widget</h2><button class="p-1 rounded hover:bg-muted transition-colors cursor-pointer"></button></div><div class="p-2 overflow-y-auto h-[calc(100%-48px)]">'), L = /* @__PURE__ */ l('<div class="fixed inset-0 bg-black/20 z-40">'), Q = /* @__PURE__ */ l('<div class="ml-4 mt-1 space-y-1">'), U = /* @__PURE__ */ l('<div class=mb-2><button class="w-full flex items-center gap-2 p-2 rounded hover:bg-muted transition-colors text-left cursor-pointer"><span class="text-sm font-medium"></span><span class="ml-auto text-xs text-muted-foreground">'), V = /* @__PURE__ */ l('<button class="w-full flex items-center gap-2 p-2 rounded hover:bg-muted transition-colors text-left cursor-pointer"><span class=text-sm>'), Y = /* @__PURE__ */ l('<div class="w-4 h-4">');
+function ie(C) {
+  const p = D(), b = F(), [d, s] = k(!1), [W, z] = k(null), S = [{
+    key: "metrics",
+    label: "Metrics"
+  }, {
+    key: "terminal",
+    label: "Terminal"
+  }, {
+    key: "custom",
+    label: "Custom"
+  }], A = (t) => {
+    s(!1), H(() => p.addWidget(t));
+  }, B = (t) => {
+    z((o) => o === t ? null : t);
+  };
+  return e(n, {
+    get when() {
+      return p.editMode();
+    },
+    get children() {
+      return [e(n, {
+        get when() {
+          return !d();
+        },
+        get children() {
+          return e(G, {
+            variant: "outline",
+            size: "sm",
+            get class() {
+              return f("fixed bottom-4 right-4 z-50 shadow-lg", C.class);
+            },
+            onClick: () => s(!0),
+            get children() {
+              return [e(T, {
+                class: "w-4 h-4 mr-1"
+              }), "Add Widget"];
+            }
+          });
+        }
+      }), (() => {
+        var t = K(), o = t.firstChild, E = o.firstChild, x = E.nextSibling, $ = o.nextSibling;
+        return x.$$click = () => s(!1), r(x, e(X, {
+          class: "w-4 h-4"
+        })), r($, e(y, {
+          each: S,
+          children: (i) => {
+            const c = () => b.getWidgetsByCategory(i.key), v = () => W() === i.key, N = () => c().length > 0;
+            return e(n, {
+              get when() {
+                return N();
+              },
+              get children() {
+                var u = U(), m = u.firstChild, g = m.firstChild, R = g.nextSibling;
+                return m.$$click = () => B(i.key), r(m, e(q, {
+                  get class() {
+                    return f("w-4 h-4 text-muted-foreground transition-transform", v() && "rotate-90");
+                  }
+                }), g), r(g, () => i.label), r(R, () => c().length), r(u, e(n, {
+                  get when() {
+                    return v();
+                  },
+                  get children() {
+                    var w = Q();
+                    return r(w, e(y, {
+                      get each() {
+                        return c();
+                      },
+                      children: (h) => (() => {
+                        var a = V(), _ = a.firstChild;
+                        return a.$$click = () => A(h.type), r(a, e(n, {
+                          get when() {
+                            return h.icon;
+                          },
+                          get fallback() {
+                            return Y();
+                          },
+                          children: (I) => {
+                            const M = I();
+                            return e(M, {
+                              class: "w-4 h-4 text-muted-foreground"
+                            });
+                          }
+                        }), _), r(_, () => h.name), a;
+                      })()
+                    })), w;
+                  }
+                }), null), u;
+              }
+            });
+          }
+        }), null), r($, e(n, {
+          get when() {
+            return b.widgets().size === 0;
+          },
+          get children() {
+            return J();
+          }
+        }), null), P(() => j(t, f("fixed right-0 top-0 bottom-0 w-72 bg-background border-l border-border shadow-xl z-50", "transform transition-transform duration-200", d() ? "translate-x-0" : "translate-x-full"))), t;
+      })(), e(n, {
+        get when() {
+          return d();
+        },
+        get children() {
+          var t = L();
+          return t.$$click = () => s(!1), t;
+        }
+      })];
+    }
+  });
+}
+O(["click"]);
+export {
+  ie as WidgetPalette
+};

package/dist/index15.js

@@ -0,0 +1,106 @@
+import { delegateEvents as E, createComponent as o, template as s, insert as l, effect as v, className as x, Portal as R, setStyleProperty as w, use as T } from "solid-js/web";
+import { createSignal as y, createEffect as W, onCleanup as I, Show as p, For as L } from "solid-js";
+import { cn as m } from "./index53.js";
+import { useDeck as N } from "./index46.js";
+import { useWidgetRegistry as z } from "./index45.js";
+import { deferNonBlocking as A } from "./index54.js";
+import { ArrowRightLeft as B, ChevronDown as M } from "./index30.js";
+var O = /* @__PURE__ */ s('<button title="Switch widget type">'), F = /* @__PURE__ */ s('<div class="fixed inset-0 z-[9998]">'), K = /* @__PURE__ */ s('<div class="px-2 py-3 text-xs text-muted-foreground text-center">No other widget types available'), j = /* @__PURE__ */ s('<div><div class=p-1><div class="px-2 py-1.5 text-xs text-muted-foreground font-medium">Switch to'), q = /* @__PURE__ */ s('<button class="w-full flex items-center gap-2 px-2 py-1.5 rounded hover:bg-muted transition-colors text-left cursor-pointer"><span class=text-xs>'), G = /* @__PURE__ */ s('<div class="w-4 h-4">');
+function Z(f) {
+  const $ = N(), b = z(), [c, d] = y(!1), [g, k] = y({
+    top: 0,
+    left: 0
+  });
+  let u;
+  const _ = () => f.widget.type, h = () => Array.from(b.widgets().values()).filter((t) => t.type !== _()), C = (e, t) => {
+    e.stopPropagation(), e.preventDefault(), d(!1);
+    const r = f.widget.id, n = $.changeWidgetType;
+    A(() => n(r, t));
+  }, S = (e) => {
+    if (e.stopPropagation(), e.preventDefault(), !c() && u) {
+      const t = u.getBoundingClientRect();
+      k({
+        top: t.bottom + 4,
+        left: t.right - 160
+        // Align right edge
+      });
+    }
+    d((t) => !t);
+  }, P = () => {
+    d(!1);
+  };
+  return W(() => {
+    if (!c() || typeof document > "u") return;
+    const e = (t) => {
+      t.key === "Escape" && d(!1);
+    };
+    document.addEventListener("keydown", e), I(() => document.removeEventListener("keydown", e));
+  }), [(() => {
+    var e = O();
+    e.$$click = S;
+    var t = u;
+    return typeof t == "function" ? T(t, e) : u = e, l(e, o(B, {
+      class: "w-3.5 h-3.5"
+    }), null), l(e, o(M, {
+      get class() {
+        return m("w-3 h-3 transition-transform", c() && "rotate-180");
+      }
+    }), null), v(() => x(e, m("p-0.5 rounded hover:bg-muted text-muted-foreground hover:text-foreground", "transition-colors cursor-pointer pointer-events-auto flex items-center gap-0.5", f.class))), e;
+  })(), o(p, {
+    get when() {
+      return c();
+    },
+    get children() {
+      return o(R, {
+        get children() {
+          return [(() => {
+            var e = F();
+            return e.$$click = P, e;
+          })(), (() => {
+            var e = j(), t = e.firstChild;
+            return t.firstChild, l(t, o(L, {
+              get each() {
+                return h();
+              },
+              children: (r) => (() => {
+                var n = q(), a = n.firstChild;
+                return n.$$click = (i) => C(i, r.type), l(n, o(p, {
+                  get when() {
+                    return r.icon;
+                  },
+                  get fallback() {
+                    return G();
+                  },
+                  children: (i) => {
+                    const D = i();
+                    return o(D, {
+                      class: "w-4 h-4 text-muted-foreground"
+                    });
+                  }
+                }), a), l(a, () => r.name), n;
+              })()
+            }), null), l(t, o(p, {
+              get when() {
+                return h().length === 0;
+              },
+              get children() {
+                return K();
+              }
+            }), null), v((r) => {
+              var n = m("fixed z-[9999]", "min-w-[160px] max-h-[240px] overflow-y-auto", "bg-popover border border-border rounded-md shadow-xl", "animate-in fade-in slide-in-from-top-1 duration-150"), a = `${g().top}px`, i = `${Math.max(8, g().left)}px`;
+              return n !== r.e && x(e, r.e = n), a !== r.t && w(e, "top", r.t = a), i !== r.a && w(e, "left", r.a = i), r;
+            }, {
+              e: void 0,
+              t: void 0,
+              a: void 0
+            }), e;
+          })()];
+        }
+      });
+    }
+  })];
+}
+E(["click"]);
+export {
+  Z as WidgetTypeSwitcher
+};

package/dist/index16.js

@@ -0,0 +1,131 @@
+import { delegateEvents as j, template as s, insert as o, createComponent as a, memo as q, effect as w, className as C } from "solid-js/web";
+import { createSignal as R, Show as v, For as G } from "solid-js";
+import { cn as b } from "./index53.js";
+import { useDeck as H } from "./index46.js";
+import { deferNonBlocking as g } from "./index54.js";
+import { ChevronDown as J, Check as K, Copy as M, Pencil as Q, Trash as U } from "./index30.js";
+var W = /* @__PURE__ */ s('<div class="absolute top-full left-0 mt-1 w-64 bg-popover border border-border rounded-md shadow-lg z-50 overflow-hidden"><div class="max-h-64 overflow-y-auto py-1"></div><div class="border-t border-border px-2 py-1.5"><button class="w-full text-left text-xs text-primary hover:underline cursor-pointer">+ New Layout'), X = /* @__PURE__ */ s('<div class="fixed inset-0 z-40">'), Y = /* @__PURE__ */ s('<div><button><span class="truncate max-w-[120px]">'), Z = /* @__PURE__ */ s('<span class="flex-1 text-xs truncate">'), ee = /* @__PURE__ */ s('<button class="p-1 rounded hover:bg-background transition-colors cursor-pointer"title=Rename>'), te = /* @__PURE__ */ s('<button class="p-1 rounded hover:bg-destructive/10 transition-colors cursor-pointer"title=Delete>'), re = /* @__PURE__ */ s('<div class="flex items-center gap-0.5 opacity-0 group-hover:opacity-100 transition-opacity"><button class="p-1 rounded hover:bg-background transition-colors cursor-pointer"title=Duplicate>'), ne = /* @__PURE__ */ s('<div><div class="w-4 h-4 flex-shrink-0">'), oe = /* @__PURE__ */ s('<input type=text class="flex-1 text-xs bg-background border border-border rounded px-1.5 py-0.5"autofocus>'), le = /* @__PURE__ */ s('<span class="ml-1 text-[10px] text-muted-foreground">(preset)');
+function pe(N) {
+  const u = H(), [$, d] = R(!1), [I, _] = R(null), [P, h] = R(""), L = () => u.activeLayout(), D = () => u.layouts(), T = (t) => {
+    d(!1), g(() => u.setActiveLayout(t));
+  }, z = (t, n) => {
+    n.stopPropagation();
+    const p = D().find((e) => e.id === t);
+    if (p) {
+      d(!1), g(() => u.duplicateLayout(t, `${p.name} (Copy)`));
+      return;
+    }
+    d(!1);
+  }, A = (t, n) => {
+    n.stopPropagation(), d(!1), g(() => u.deleteLayout(t));
+  }, O = (t, n, p) => {
+    p.stopPropagation(), _(t), h(n);
+  }, S = (t) => {
+    const n = P().trim();
+    _(null), h(""), n && g(() => u.renameLayout(t, n));
+  }, V = () => {
+    _(null), h("");
+  };
+  return (() => {
+    var t = Y(), n = t.firstChild, p = n.firstChild;
+    return n.$$click = () => d(!$()), o(p, () => {
+      var e;
+      return ((e = L()) == null ? void 0 : e.name) ?? "Select Layout";
+    }), o(n, a(J, {
+      get class() {
+        return b("w-4 h-4 text-muted-foreground transition-transform", $() && "rotate-180");
+      }
+    }), null), o(t, a(v, {
+      get when() {
+        return $();
+      },
+      get children() {
+        return [(() => {
+          var e = W(), f = e.firstChild, x = f.nextSibling, B = x.firstChild;
+          return o(f, a(G, {
+            get each() {
+              return D();
+            },
+            children: (l) => {
+              const E = () => l.id === u.activeLayoutId(), k = () => I() === l.id;
+              return (() => {
+                var m = ne(), F = m.firstChild;
+                return m.$$click = () => !k() && T(l.id), o(F, a(v, {
+                  get when() {
+                    return E();
+                  },
+                  get children() {
+                    return a(K, {
+                      class: "w-4 h-4 text-primary"
+                    });
+                  }
+                })), o(m, a(v, {
+                  get when() {
+                    return !k();
+                  },
+                  get fallback() {
+                    return (() => {
+                      var r = oe();
+                      return r.$$click = (i) => i.stopPropagation(), r.addEventListener("blur", () => S(l.id)), r.$$keydown = (i) => {
+                        i.key === "Enter" && S(l.id), i.key === "Escape" && V();
+                      }, r.$$input = (i) => h(i.currentTarget.value), w(() => r.value = P()), r;
+                    })();
+                  },
+                  get children() {
+                    var r = Z();
+                    return o(r, () => l.name, null), o(r, (() => {
+                      var i = q(() => !!l.isPreset);
+                      return () => i() && le();
+                    })(), null), r;
+                  }
+                }), null), o(m, a(v, {
+                  get when() {
+                    return !k();
+                  },
+                  get children() {
+                    var r = re(), i = r.firstChild;
+                    return i.$$click = (c) => z(l.id, c), o(i, a(M, {
+                      class: "w-3.5 h-3.5 text-muted-foreground"
+                    })), o(r, a(v, {
+                      get when() {
+                        return !l.isPreset;
+                      },
+                      get children() {
+                        return [(() => {
+                          var c = ee();
+                          return c.$$click = (y) => O(l.id, l.name, y), o(c, a(Q, {
+                            class: "w-3.5 h-3.5 text-muted-foreground"
+                          })), c;
+                        })(), (() => {
+                          var c = te();
+                          return c.$$click = (y) => A(l.id, y), o(c, a(U, {
+                            class: "w-3.5 h-3.5 text-destructive"
+                          })), c;
+                        })()];
+                      }
+                    }), null), r;
+                  }
+                }), null), w(() => C(m, b("flex items-center gap-2 px-2 py-1.5 hover:bg-muted transition-colors cursor-pointer group", E() && "bg-muted"))), m;
+              })();
+            }
+          })), B.$$click = () => {
+            d(!1), g(() => u.createLayout("New Layout"));
+          }, e;
+        })(), (() => {
+          var e = X();
+          return e.$$click = () => d(!1), e;
+        })()];
+      }
+    }), null), w((e) => {
+      var f = b("relative", N.class), x = b("flex items-center gap-2 px-3 py-1.5 rounded-md border border-border", "hover:bg-muted transition-colors text-xs cursor-pointer", $() && "bg-muted");
+      return f !== e.e && C(t, e.e = f), x !== e.t && C(n, e.t = x), e;
+    }, {
+      e: void 0,
+      t: void 0
+    }), t;
+  })();
+}
+j(["click", "input", "keydown"]);
+export {
+  pe as LayoutSelector
+};

package/dist/index17.js

@@ -0,0 +1,152 @@
+import { delegateEvents as S, template as d, insert as i, createComponent as t, Portal as B, effect as b, className as y, setStyleProperty as k } from "solid-js/web";
+import { createSignal as $, createEffect as L, onCleanup as R, Show as a, For as A } from "solid-js";
+import { cn as h } from "./index53.js";
+import { useDeck as N } from "./index46.js";
+import { useLayout as T } from "./index41.js";
+import { useWidgetRegistry as F } from "./index45.js";
+import { deferNonBlocking as I } from "./index54.js";
+import { LayoutSelector as K } from "./index16.js";
+import { Plus as j, ChevronDown as q, Check as G, Pencil as H } from "./index30.js";
+import { Button as C } from "./index19.js";
+var J = /* @__PURE__ */ d('<div class="fixed inset-0 z-[9998]">'), O = /* @__PURE__ */ d('<div class="px-3 py-4 text-xs text-muted-foreground text-center">No widgets available'), Q = /* @__PURE__ */ d("<div><div class=p-1>"), U = /* @__PURE__ */ d("<div><div class=flex-1>"), V = /* @__PURE__ */ d('<button class="w-full flex items-center gap-2 px-3 py-2 rounded hover:bg-muted transition-colors text-left cursor-pointer"><span class=text-xs>'), X = /* @__PURE__ */ d('<div class="w-4 h-4">');
+function ae(v) {
+  const c = N(), _ = T(), w = F(), [m, g] = $(!1), [x, M] = $({
+    top: 0,
+    left: 0
+  });
+  let p;
+  const P = () => _.isMobile(), D = (e, r) => {
+    e.stopPropagation(), e.preventDefault(), g(!1), I(() => c.addWidget(r));
+  }, E = (e) => {
+    if (e.stopPropagation(), e.preventDefault(), !m() && p) {
+      const r = p.getBoundingClientRect();
+      M({
+        top: r.bottom + 4,
+        left: r.left
+      });
+    }
+    g((r) => !r);
+  }, W = () => {
+    g(!1);
+  };
+  return L(() => {
+    if (!m() || typeof document > "u") return;
+    const e = (r) => {
+      r.key === "Escape" && g(!1);
+    };
+    document.addEventListener("keydown", e), R(() => document.removeEventListener("keydown", e));
+  }), (() => {
+    var e = U(), r = e.firstChild;
+    return i(e, t(K, {}), r), i(e, t(a, {
+      get when() {
+        return c.editMode();
+      },
+      get children() {
+        return [t(C, {
+          ref(n) {
+            var u = p;
+            typeof u == "function" ? u(n) : p = n;
+          },
+          variant: "outline",
+          size: "sm",
+          onClick: E,
+          get children() {
+            return [t(j, {
+              class: "w-3.5 h-3.5 mr-1"
+            }), "Add Widget", t(q, {
+              get class() {
+                return h("w-3.5 h-3.5 ml-1 transition-transform", m() && "rotate-180");
+              }
+            })];
+          }
+        }), t(a, {
+          get when() {
+            return m();
+          },
+          get children() {
+            return t(B, {
+              get children() {
+                return [(() => {
+                  var n = J();
+                  return n.$$click = W, n;
+                })(), (() => {
+                  var n = Q(), u = n.firstChild;
+                  return i(u, t(A, {
+                    get each() {
+                      return Array.from(w.widgets().values());
+                    },
+                    children: (o) => (() => {
+                      var l = V(), f = l.firstChild;
+                      return l.$$click = (s) => D(s, o.type), i(l, t(a, {
+                        get when() {
+                          return o.icon;
+                        },
+                        get fallback() {
+                          return X();
+                        },
+                        children: (s) => {
+                          const z = s();
+                          return t(z, {
+                            class: "w-4 h-4 text-muted-foreground"
+                          });
+                        }
+                      }), f), i(f, () => o.name), l;
+                    })()
+                  }), null), i(u, t(a, {
+                    get when() {
+                      return w.widgets().size === 0;
+                    },
+                    get children() {
+                      return O();
+                    }
+                  }), null), b((o) => {
+                    var l = h("fixed z-[9999]", "min-w-[180px] max-h-[300px] overflow-y-auto", "bg-popover border border-border rounded-md shadow-xl", "animate-in fade-in slide-in-from-top-1 duration-150"), f = `${x().top}px`, s = `${Math.max(8, x().left)}px`;
+                    return l !== o.e && y(n, o.e = l), f !== o.t && k(n, "top", o.t = f), s !== o.a && k(n, "left", o.a = s), o;
+                  }, {
+                    e: void 0,
+                    t: void 0,
+                    a: void 0
+                  }), n;
+                })()];
+              }
+            });
+          }
+        })];
+      }
+    }), r), i(e, t(a, {
+      get when() {
+        return !P();
+      },
+      get children() {
+        return t(C, {
+          get variant() {
+            return c.editMode() ? "default" : "outline";
+          },
+          size: "sm",
+          onClick: () => c.toggleEditMode(),
+          get children() {
+            return t(a, {
+              get when() {
+                return c.editMode();
+              },
+              get fallback() {
+                return [t(H, {
+                  class: "w-3.5 h-3.5 mr-1.5"
+                }), "Edit"];
+              },
+              get children() {
+                return [t(G, {
+                  class: "w-3.5 h-3.5 mr-1.5"
+                }), "Done"];
+              }
+            });
+          }
+        });
+      }
+    }), null), i(e, () => v.actions, null), b(() => y(e, h("deck-topbar flex items-center gap-3 px-3 py-2 border-b border-border bg-background", v.class))), e;
+  })();
+}
+S(["click"]);
+export {
+  ae as DeckTopBar
+};

package/dist/index18.js

@@ -0,0 +1,41 @@
+import { template as v, effect as b, className as i, setStyleProperty as m } from "solid-js/web";
+import { cn as n } from "./index53.js";
+import { positionToGridArea as f } from "./index60.js";
+var g = /* @__PURE__ */ v("<div><div>");
+function _(a) {
+  const s = () => f(a.position);
+  return (() => {
+    var e = g(), l = e.firstChild;
+    return b((r) => {
+      var t = n(
+        "pointer-events-none rounded-md relative",
+        "border-2 border-dashed",
+        // Theme-adaptive colors
+        a.isValid !== !1 ? [
+          // Light mode: darker colors for contrast
+          "border-slate-400 bg-slate-200/60",
+          // Dark mode: lighter colors for contrast
+          "dark:border-slate-400 dark:bg-slate-600/40"
+        ] : ["border-red-400 bg-red-200/60", "dark:border-red-400 dark:bg-red-500/30"],
+        // Theme-adaptive shadow
+        "shadow-[0_4px_16px_rgba(0,0,0,0.12)]",
+        "dark:shadow-[0_4px_16px_rgba(255,255,255,0.08)]",
+        // Subtle animation
+        "animate-in fade-in duration-150"
+      ), d = s(), o = n("absolute inset-0 rounded-md", a.isValid !== !1 ? [
+        // Light mode: subtle dark gradient
+        "bg-gradient-to-br from-slate-300/40 via-transparent to-slate-400/20",
+        // Dark mode: subtle light gradient
+        "dark:from-slate-400/20 dark:via-transparent dark:to-slate-300/10"
+      ] : ["bg-gradient-to-br from-red-300/40 via-transparent to-red-400/20", "dark:from-red-400/20 dark:via-transparent dark:to-red-300/10"]);
+      return t !== r.e && i(e, r.e = t), d !== r.t && m(e, "grid-area", r.t = d), o !== r.a && i(l, r.a = o), r;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    }), e;
+  })();
+}
+export {
+  _ as DropZonePreview
+};

package/dist/index19.js

@@ -0,0 +1,61 @@
+import { template as c, spread as d, mergeProps as l, insert as n, createComponent as t, memo as u, Dynamic as m } from "solid-js/web";
+import { splitProps as g, Show as p } from "solid-js";
+import { cn as s } from "./index53.js";
+import { Loader2 as h } from "./index30.js";
+var b = /* @__PURE__ */ c("<button type=button>");
+const f = {
+  default: "bg-primary text-primary-foreground shadow-sm hover:bg-primary/90 active:scale-[0.98]",
+  primary: "bg-primary text-primary-foreground shadow-sm hover:bg-primary/90 active:scale-[0.98]",
+  secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80 active:scale-[0.98]",
+  outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground active:scale-[0.98]",
+  ghost: "hover:bg-accent hover:text-accent-foreground active:scale-[0.98]",
+  destructive: "bg-error text-error-foreground shadow-sm hover:bg-error/90 active:scale-[0.98]"
+}, v = {
+  sm: "h-7 px-2.5 text-xs rounded",
+  md: "h-8 px-3 text-xs rounded-md",
+  lg: "h-9 px-4 text-sm rounded-md",
+  icon: "h-8 w-8 rounded-md"
+}, y = {
+  sm: "w-3.5 h-3.5",
+  md: "w-3.5 h-3.5",
+  lg: "w-4 h-4",
+  icon: "w-4 h-4"
+};
+function k(i) {
+  const [e, a] = g(i, ["variant", "size", "loading", "icon", "class", "children", "disabled"]), o = () => y[e.size ?? "md"];
+  return (() => {
+    var r = b();
+    return d(r, l({
+      get class() {
+        return s("inline-flex items-center justify-center gap-1.5 font-medium cursor-pointer", "transition-colors duration-150", "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", "disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed", f[e.variant ?? "default"], v[e.size ?? "md"], e.class);
+      },
+      get disabled() {
+        return e.disabled || e.loading;
+      }
+    }, a), !1, !0), n(r, t(p, {
+      get when() {
+        return e.loading;
+      },
+      get fallback() {
+        return u(() => !!e.icon)() && t(m, {
+          get component() {
+            return e.icon;
+          },
+          get class() {
+            return o();
+          }
+        });
+      },
+      get children() {
+        return t(h, {
+          get class() {
+            return s(o(), "animate-spin");
+          }
+        });
+      }
+    }), null), n(r, () => e.children, null), r;
+  })();
+}
+export {
+  k as Button
+};