@cronus-ui/ui 0.6.8 → 0.6.11

package/dist/components/invite-dialog.d.ts

@@ -10,7 +10,18 @@ export interface InviteDialogLabels {
     cancel?: string;
     sending?: string;
     errorFallback?: string;
+    sentTitle?: string;
+    sentDescription?: string;
+    link?: string;
+    copy?: string;
+    copied?: string;
+    done?: string;
 }
+/** Returned from `onInvite` to keep the dialog open with a copyable invite URL. */
+export interface InviteResult {
+    url?: string;
+}
+type InviteHandlerReturn = void | InviteResult | Promise<void | InviteResult>;
 export interface InviteRole {
     value: string;
     label: string;
@@ -30,13 +41,14 @@ export interface InviteDialogProps extends Omit<ComponentPropsWithoutRef<typeof
     defaultRole?: string;
     /**
      * Invoked with the submitted email and role. If it returns a promise, the send
-     * button shows a spinner and actions are disabled until it settles; on resolve
-     * the dialog closes, on reject it stays open and surfaces the error.
+     * button shows a spinner and actions are disabled until it settles. On reject
+     * the dialog stays open and surfaces the error. On resolve: a `{ url }` keeps
+     * the dialog open with a copyable link; otherwise the dialog closes.
      */
     onInvite?: (payload: {
         email: string;
         role: string;
-    }) => void | Promise<void>;
+    }) => InviteHandlerReturn;
     /** Override any subset of the built-in English strings. */
     labels?: InviteDialogLabels;
     /** Forwarded to the dialog content surface. */
@@ -49,9 +61,10 @@ export interface InviteDialogProps extends Omit<ComponentPropsWithoutRef<typeof
  * Behavior: `onInvite` may be async — while its promise is pending the send
  * button shows a `Spinner`, both actions are disabled, and the dialog cannot be
  * dismissed so the operation can't be interrupted mid-flight. On resolve the
- * dialog closes; on reject it stays open and renders the error in a
- * `role="alert"` region. Works controlled (`open`/`onOpenChange`) or
- * uncontrolled (`defaultOpen`).
+ * dialog closes, unless the result is `{ url }` — then it stays open on a
+ * success surface with a copyable link. On reject it stays open and renders
+ * the error in a `role="alert"` region. Works controlled (`open`/`onOpenChange`)
+ * or uncontrolled (`defaultOpen`).
  *
  * Performance/a11y: late promise settlements are ignored after unmount via a
  * mounted ref. The spinner is decorative (`aria-hidden`) with loading state
@@ -59,4 +72,5 @@ export interface InviteDialogProps extends Omit<ComponentPropsWithoutRef<typeof
  * underlying primitive and degrades under `prefers-reduced-motion`.
  */
 export declare function InviteDialog({ trigger, open, defaultOpen, onOpenChange, roles, defaultRole, onInvite, labels, className, ref, ...contentProps }: InviteDialogProps): import("react").JSX.Element;
+export {};
 //# sourceMappingURL=invite-dialog.d.ts.map

package/dist/components/invite-dialog.js

@@ -1,9 +1,10 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { CircleAlert } from "lucide-react";
 import { useCallback, useEffect, useId, useRef, useState, } from "react";
 import { cn } from "../lib/cn.js";
 import { Button } from "./button.js";
+import { CopyButton } from "./copy-button.js";
 import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "./dialog.js";
 import { Field, FieldLabel } from "./field.js";
 import { Input } from "./input.js";
@@ -19,6 +20,12 @@ const DEFAULT_LABELS = {
     cancel: "Cancel",
     sending: "Sending",
     errorFallback: "Something went wrong. Please try again.",
+    sentTitle: "Invite sent",
+    sentDescription: "Copy the link and send it to your teammate.",
+    link: "Invite link",
+    copy: "Copy invite link",
+    copied: "Copied",
+    done: "Done",
 };
 const DEFAULT_ROLES = [
     { value: "member", label: "Member" },
@@ -42,6 +49,15 @@ function resolveDefaultRole(roles, defaultRole) {
     }
     return roles[0]?.value ?? "";
 }
+function inviteUrlOf(result) {
+    if (!result || typeof result !== "object" || !("url" in result))
+        return undefined;
+    const url = result.url;
+    if (typeof url !== "string")
+        return undefined;
+    const trimmed = url.trim();
+    return trimmed ? trimmed : undefined;
+}
 /**
  * An ergonomic invite dialog for adding a member by email and role, composed
  * on top of the accessible `Dialog` primitive (focus trap, overlay, Escape).
@@ -49,9 +65,10 @@ function resolveDefaultRole(roles, defaultRole) {
  * Behavior: `onInvite` may be async — while its promise is pending the send
  * button shows a `Spinner`, both actions are disabled, and the dialog cannot be
  * dismissed so the operation can't be interrupted mid-flight. On resolve the
- * dialog closes; on reject it stays open and renders the error in a
- * `role="alert"` region. Works controlled (`open`/`onOpenChange`) or
- * uncontrolled (`defaultOpen`).
+ * dialog closes, unless the result is `{ url }` — then it stays open on a
+ * success surface with a copyable link. On reject it stays open and renders
+ * the error in a `role="alert"` region. Works controlled (`open`/`onOpenChange`)
+ * or uncontrolled (`defaultOpen`).
  *
  * Performance/a11y: late promise settlements are ignored after unmount via a
  * mounted ref. The spinner is decorative (`aria-hidden`) with loading state
@@ -69,10 +86,12 @@ export function InviteDialog({ trigger, open, defaultOpen, onOpenChange, roles,
     const [role, setRole] = useState(initialRole);
     const [loading, setLoading] = useState(false);
     const [error, setError] = useState(null);
+    const [sentUrl, setSentUrl] = useState(null);
     const loadingRef = useRef(false);
     const mountedRef = useRef(true);
     const emailId = useId();
     const roleId = useId();
+    const linkId = useId();
     useEffect(() => {
         mountedRef.current = true;
         return () => {
@@ -93,6 +112,7 @@ export function InviteDialog({ trigger, open, defaultOpen, onOpenChange, roles,
             setError(null);
             setEmail("");
             setRole(initialRole);
+            setSentUrl(null);
         }
         setOpen(next);
     }, [initialRole, setOpen]);
@@ -116,17 +136,25 @@ export function InviteDialog({ trigger, open, defaultOpen, onOpenChange, roles,
         }
         const result = onInvite({ email: trimmed, role });
         if (!(result instanceof Promise)) {
-            setOpen(false);
+            const url = inviteUrlOf(result);
+            if (url)
+                setSentUrl(url);
+            else
+                setOpen(false);
             return;
         }
         beginLoading(true);
         try {
-            await result;
+            const settled = await result;
             if (!mountedRef.current) {
                 return;
             }
             beginLoading(false);
-            setOpen(false);
+            const url = inviteUrlOf(settled);
+            if (url)
+                setSentUrl(url);
+            else
+                setOpen(false);
         }
         catch (err) {
             if (!mountedRef.current) {
@@ -136,6 +164,6 @@ export function InviteDialog({ trigger, open, defaultOpen, onOpenChange, roles,
             setError(resolveErrorMessage(err, resolvedLabels.errorFallback));
         }
     }, [beginLoading, email, onInvite, resolvedLabels.errorFallback, role, setOpen]);
-    return (_jsxs(Dialog, { open: isOpen, onOpenChange: handleOpenChange, children: [trigger ? _jsx(DialogTrigger, { asChild: true, children: trigger }) : null, _jsxs(DialogContent, { ref: ref, "data-slot": "invite-dialog", className: cn("max-w-md", className), ...contentProps, children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: resolvedLabels.title }), resolvedLabels.description ? (_jsx(DialogDescription, { children: resolvedLabels.description })) : null] }), _jsxs("form", { className: "flex flex-col gap-4", onSubmit: handleSubmit, children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: emailId, children: resolvedLabels.email }), _jsx(Input, { id: emailId, type: "email", name: "email", autoComplete: "email", required: true, value: email, onChange: (event) => setEmail(event.target.value), placeholder: resolvedLabels.emailPlaceholder, disabled: loading })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: roleId, children: resolvedLabels.role }), _jsxs(Select, { value: role, onValueChange: setRole, disabled: loading, children: [_jsx(SelectTrigger, { id: roleId, children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: resolvedRoles.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value))) })] })] }), error ? (_jsxs("div", { role: "alert", "data-slot": "invite-dialog-error", className: "flex items-start gap-2 rounded-lg border border-error/30 bg-error/10 px-3 py-2 text-start text-sm text-error-strong", children: [_jsx(CircleAlert, { "aria-hidden": true, className: "mt-0.5 size-4 shrink-0" }), _jsx("span", { children: error })] })) : null, _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "outline", disabled: loading, onClick: () => handleOpenChange(false), children: resolvedLabels.cancel }), _jsxs(Button, { type: "submit", "data-slot": "invite-dialog-send", disabled: loading, "aria-busy": loading, className: "min-w-24", children: [loading ? _jsx(Spinner, { size: "sm", "aria-hidden": true }) : null, loading ? resolvedLabels.sending : resolvedLabels.send] })] })] })] })] }));
+    return (_jsxs(Dialog, { open: isOpen, onOpenChange: handleOpenChange, children: [trigger ? _jsx(DialogTrigger, { asChild: true, children: trigger }) : null, _jsx(DialogContent, { ref: ref, "data-slot": "invite-dialog", className: cn("max-w-md", className), ...contentProps, children: sentUrl ? (_jsxs("div", { "data-slot": "invite-dialog-success", className: "flex flex-col gap-4", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: resolvedLabels.sentTitle }), resolvedLabels.sentDescription ? (_jsx(DialogDescription, { children: resolvedLabels.sentDescription })) : null] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: linkId, children: resolvedLabels.link }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { id: linkId, readOnly: true, value: sentUrl, autoComplete: "off" }), _jsx(CopyButton, { value: sentUrl, copyLabel: resolvedLabels.copy, copiedLabel: resolvedLabels.copied, variant: "outline", size: "icon" })] })] }), _jsx(DialogFooter, { children: _jsx(Button, { type: "button", onClick: () => handleOpenChange(false), children: resolvedLabels.done }) })] })) : (_jsxs(_Fragment, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: resolvedLabels.title }), resolvedLabels.description ? (_jsx(DialogDescription, { children: resolvedLabels.description })) : null] }), _jsxs("form", { className: "flex flex-col gap-4", onSubmit: handleSubmit, children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: emailId, children: resolvedLabels.email }), _jsx(Input, { id: emailId, type: "email", name: "email", autoComplete: "email", required: true, value: email, onChange: (event) => setEmail(event.target.value), placeholder: resolvedLabels.emailPlaceholder, disabled: loading })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: roleId, children: resolvedLabels.role }), _jsxs(Select, { value: role, onValueChange: setRole, disabled: loading, children: [_jsx(SelectTrigger, { id: roleId, children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: resolvedRoles.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value))) })] })] }), error ? (_jsxs("div", { role: "alert", "data-slot": "invite-dialog-error", className: "flex items-start gap-2 rounded-lg border border-error/30 bg-error/10 px-3 py-2 text-start text-sm text-error-strong", children: [_jsx(CircleAlert, { "aria-hidden": true, className: "mt-0.5 size-4 shrink-0" }), _jsx("span", { children: error })] })) : null, _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "outline", disabled: loading, onClick: () => handleOpenChange(false), children: resolvedLabels.cancel }), _jsxs(Button, { type: "submit", "data-slot": "invite-dialog-send", disabled: loading, "aria-busy": loading, className: "min-w-24", children: [loading ? _jsx(Spinner, { size: "sm", "aria-hidden": true }) : null, loading ? resolvedLabels.sending : resolvedLabels.send] })] })] })] })) })] }));
 }
 //# sourceMappingURL=invite-dialog.js.map

package/dist/index.d.ts

@@ -142,7 +142,7 @@ export { Input } from "./components/input.js";
 export type { InputGroupAddonProps, InputGroupProps } from "./components/input-group.js";
 export { InputGroup, InputGroupAddon } from "./components/input-group.js";
 export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, } from "./components/input-otp.js";
-export type { InviteDialogLabels, InviteDialogProps, InviteRole, } from "./components/invite-dialog.js";
+export type { InviteDialogLabels, InviteDialogProps, InviteResult, InviteRole, } from "./components/invite-dialog.js";
 export { InviteDialog } from "./components/invite-dialog.js";
 export type { JsonViewerProps } from "./components/json-viewer.js";
 export { JsonViewer } from "./components/json-viewer.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cronus-ui/ui",
-  "version": "0.6.8",
+  "version": "0.6.11",
   "description": "Cronus UI — themeable, accessible React components (Radix + CVA + Tailwind v4).",
   "type": "module",
   "exports": {
@@ -759,7 +759,7 @@
     "vaul": "^1.1.2"
   },
   "peerDependencies": {
-    "@cronus-ui/theme": "0.6.8",
+    "@cronus-ui/theme": "0.6.11",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
@@ -903,7 +903,7 @@
     }
   },
   "devDependencies": {
-    "@cronus-ui/theme": "0.6.8",
+    "@cronus-ui/theme": "0.6.11",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",