@unicitylabs/sphere-ui 0.1.2 → 0.1.3

package/dist/index.d.ts

@@ -110,11 +110,12 @@ interface ConfirmDialogProps {
     title: string;
     message: string;
     confirmLabel?: string;
+    confirmPending?: boolean;
     variant?: 'danger' | 'default';
     onConfirm: () => void;
     onCancel: () => void;
 }
-declare function ConfirmDialog({ isOpen, title, message, confirmLabel, variant, onConfirm, onCancel, }: ConfirmDialogProps): react.ReactPortal | null;
+declare function ConfirmDialog({ isOpen, title, message, confirmLabel, confirmPending, variant, onConfirm, onCancel, }: ConfirmDialogProps): react.ReactPortal | null;
 
 interface StatusBadgeProps {
     status: string;

package/dist/index.js

@@ -4,7 +4,7 @@ import { Menu } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 function DashboardLayout({ logo, nav, footer, children }) {
   const [mobileOpen, setMobileOpen] = useState(false);
-  return /* @__PURE__ */ jsxs("div", { className: "min-h-screen flex", style: { background: "var(--bg-root)" }, children: [
+  return /* @__PURE__ */ jsxs("div", { className: "min-h-screen flex sphere-dashboard", style: { background: "var(--bg-root)" }, children: [
     mobileOpen && /* @__PURE__ */ jsx(
       "div",
       {
@@ -15,7 +15,7 @@ function DashboardLayout({ logo, nav, footer, children }) {
     /* @__PURE__ */ jsxs(
       "aside",
       {
-        className: `fixed lg:static inset-y-0 left-0 z-50 w-56 shrink-0 flex flex-col relative transition-transform lg:translate-x-0 ${mobileOpen ? "translate-x-0" : "-translate-x-full"}`,
+        className: `fixed lg:static inset-y-0 left-0 z-50 w-56 shrink-0 flex flex-col transition-transform lg:translate-x-0 ${mobileOpen ? "translate-x-0" : "-translate-x-full"}`,
         style: {
           background: "linear-gradient(180deg, rgba(255,111,0,0.03) 0%, var(--bg-root) 40%)",
           borderRight: "1px solid var(--border)"
@@ -327,6 +327,7 @@ function ConfirmDialog({
   title,
   message,
   confirmLabel = "Confirm",
+  confirmPending,
   variant = "default",
   onConfirm,
   onCancel
@@ -345,13 +346,20 @@ function ConfirmDialog({
       /* @__PURE__ */ jsx7("h3", { className: "font-semibold text-white mb-2", children: title }),
       /* @__PURE__ */ jsx7("p", { className: "text-sm mb-5", style: { color: "var(--text-muted)" }, children: message }),
       /* @__PURE__ */ jsxs7("div", { className: "flex gap-3", children: [
-        /* @__PURE__ */ jsx7("button", { onClick: onCancel, className: "btn-secondary flex-1", children: "Cancel" }),
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx7("button", { onClick: onCancel, disabled: confirmPending, className: "btn-secondary flex-1", children: "Cancel" }),
+        /* @__PURE__ */ jsxs7(
           "button",
           {
             onClick: onConfirm,
-            className: `flex-1 ${variant === "danger" ? "btn-danger" : "btn-primary"}`,
-            children: confirmLabel
+            disabled: confirmPending,
+            className: `flex-1 inline-flex items-center justify-center gap-2 ${variant === "danger" ? "btn-danger" : "btn-primary"}`,
+            children: [
+              confirmPending && /* @__PURE__ */ jsxs7("svg", { className: "w-4 h-4 animate-spin", viewBox: "0 0 24 24", fill: "none", children: [
+                /* @__PURE__ */ jsx7("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+                /* @__PURE__ */ jsx7("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" })
+              ] }),
+              confirmLabel
+            ]
           }
         )
       ] })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unicitylabs/sphere-ui",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",