@burdenoff/microfe-vibecontrols 2026.602.1 → 2026.602.3

package/dist/components/vibedeck/VibeDeckShareDialog.js

@@ -1,341 +1,25 @@
-import { useCreateVibeDeckShareLinkMutation as e, useListVibeDeckShareLinksQuery as t, useRevokeVibeDeckShareLinkMutation as n } from "../../generated/wspace-operations.js";
-import { useTr as ee } from "../../shared/hooks/useTr.js";
-import { buildEmbedUrl as r, copyTextToClipboard as i, escapeHtmlAttribute as a, normalizeShareUrl as o } from "../../utils/shareUrl.js";
-import { useCallback as s, useState as c } from "react";
-import { Check as l, Code as u, Copy as d, Eye as f, Globe as p, Link2 as m, Loader2 as h, Lock as g, Play as _, Shield as v, Trash2 as te, Users as ne, X as y } from "lucide-react";
-import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
+import { useEntityShareController as e } from "../sharing/useEntityShareController.js";
+import { getStoredWorkspaceId as t } from "@burdenoff/fe-libs/shared/graphql";
+import { jsx as n } from "react/jsx-runtime";
+import { ShareDialog as r } from "@burdenoff/fe-libs/sharing";
 //#region src/components/vibedeck/VibeDeckShareDialog.tsx
-var C = [
-	{
-		value: "SIGNED_LINK",
-		label: "Anyone with the link",
-		description: "Anyone who has the link can access, no login required",
-		icon: m
-	},
-	{
-		value: "PUBLIC",
-		label: "Public",
-		description: "Anyone can discover and access this deck",
-		icon: p
-	},
-	{
-		value: "RESTRICTED",
-		label: "Restricted",
-		description: "Only people with permission can access (requires login)",
-		icon: g
-	}
-], w = [{
-	value: "VIEW",
-	label: "Viewer",
-	description: "Can view the deck",
-	icon: f
-}, {
-	value: "EXECUTE",
-	label: "Can execute",
-	description: "Can view and execute buttons",
-	icon: _
-}], T = ({ vibeDeckId: T, vibeDeckName: E, onClose: D }) => {
-	let O = ee(), [k, A] = c(null), [re, j] = c(null), [M, N] = c(null), [P, F] = c(null), [I, L] = c("SIGNED_LINK"), [R, z] = c("EXECUTE"), [B, V] = c(""), [H, U] = c(""), [W, G] = c(!1), [K, q] = c(""), { data: J, loading: Y, refetch: ie } = t({ variables: { vibeDeckId: T } }), [X, { loading: Z }] = e({ refetchQueries: ["ListVibeDeckShareLinks"] }), [Q] = n({ refetchQueries: ["ListVibeDeckShareLinks"] }), $ = J?.vibeDeckShareLinks || [], ae = s(async () => {
-		try {
-			await X({ variables: { input: {
-				vibeDeckId: T,
-				name: K || null,
-				visibility: I,
-				permission: R,
-				expiresInHours: B ? parseInt(B, 10) : null,
-				password: H || null,
-				allowIframe: W
-			} } }), q(""), U(""), V(""), G(!1);
-		} catch {}
-	}, [
-		X,
-		T,
-		K,
-		I,
-		R,
-		B,
-		H,
-		W
-	]), oe = s(async (e) => {
-		try {
-			await Q({ variables: { id: e } });
-		} catch {}
-	}, [Q]), se = s(async (e, t) => {
-		let n = await i(o(t)).then(() => !0, (e) => (console.warn("Failed to copy VibeDeck share link:", e), !1));
-		A(n ? e : null), N(n ? null : e), setTimeout(() => {
-			A(null), N(null);
-		}, 2e3);
-	}, []), ce = s(async (e, t) => {
-		let n = await i(`<iframe src="${a(r(t))}" width="100%" height="600" frameborder="0" allow="clipboard-write" style="border-radius: 8px; border: 1px solid var(--color-border-subtle);"></iframe>`).then(() => !0, (e) => (console.warn("Failed to copy VibeDeck embed code:", e), !1));
-		j(n ? e : null), F(n ? null : e), setTimeout(() => {
-			j(null), F(null);
-		}, 2e3);
-	}, []), le = (e) => {
-		switch (e) {
-			case "PUBLIC": return /* @__PURE__ */ x(p, {
-				size: 14,
-				className: "text-status-success-text"
-			});
-			case "RESTRICTED": return /* @__PURE__ */ x(g, {
-				size: 14,
-				className: "text-status-warning-text"
-			});
-			default: return /* @__PURE__ */ x(m, {
-				size: 14,
-				className: "text-status-info-text"
-			});
-		}
-	};
-	return /* @__PURE__ */ x("div", {
-		className: "fixed inset-0 z-50 flex items-center justify-center bg-bg-elevated/60 backdrop-blur-sm",
-		children: /* @__PURE__ */ S("div", {
-			className: "bg-bg-surface border border-border-default rounded-xl shadow-2xl w-full max-w-lg mx-4 max-h-[85vh] flex flex-col",
-			children: [/* @__PURE__ */ S("div", {
-				className: "flex items-center justify-between px-6 py-4 border-b border-border-default",
-				children: [/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ S("h2", {
-					className: "text-lg font-semibold text-text-primary",
-					children: [
-						"Share \"",
-						E,
-						"\""
-					]
-				}), /* @__PURE__ */ x("p", {
-					className: "text-sm text-text-secondary mt-0.5",
-					children: O("vibecontrols.vibedeck.share.manageAccess", "Manage access to this VibeDeck")
-				})] }), /* @__PURE__ */ x("button", {
-					type: "button",
-					onClick: D,
-					className: "p-1.5 rounded-lg hover:bg-bg-tertiary text-text-tertiary hover:text-text-primary transition-colors",
-					children: /* @__PURE__ */ x(y, { size: 18 })
-				})]
-			}), /* @__PURE__ */ S("div", {
-				className: "overflow-y-auto flex-1 px-6 py-4 space-y-6",
-				children: [/* @__PURE__ */ S("div", {
-					className: "space-y-4",
-					children: [
-						/* @__PURE__ */ S("h3", {
-							className: "text-sm font-medium text-text-primary flex items-center gap-2",
-							children: [/* @__PURE__ */ x(m, { size: 14 }), O("vibecontrols.vibedeck.share.createShareLink", "Create share link")]
-						}),
-						/* @__PURE__ */ x("input", {
-							"aria-label": "Link name (optional)",
-							type: "text",
-							value: K,
-							onChange: (e) => q(e.target.value),
-							placeholder: "Link name (optional)",
-							className: "w-full px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-lg text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
-						}),
-						/* @__PURE__ */ S("div", {
-							className: "space-y-2",
-							children: [/* @__PURE__ */ x("label", {
-								htmlFor: "vibedecksharedialog-37",
-								className: "text-xs font-medium text-text-secondary uppercase tracking-wider",
-								children: "Access"
-							}), /* @__PURE__ */ x("div", {
-								className: "grid grid-cols-3 gap-2",
-								children: C.map((e) => {
-									let t = e.icon;
-									return /* @__PURE__ */ S("button", {
-										type: "button",
-										onClick: () => L(e.value),
-										className: `flex flex-col items-center gap-1.5 p-3 rounded-lg border-2 text-xs font-medium transition-all ${I === e.value ? "border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg" : "border-border-default text-text-secondary hover:border-border-default hover:bg-bg-secondary"}`,
-										title: e.description,
-										children: [/* @__PURE__ */ x(t, { size: 16 }), /* @__PURE__ */ x("span", {
-											className: "text-center leading-tight",
-											children: e.label
-										})]
-									}, e.value);
-								})
-							})]
-						}),
-						/* @__PURE__ */ S("div", {
-							className: "space-y-2",
-							children: [/* @__PURE__ */ x("label", {
-								htmlFor: "vibedecksharedialog-37",
-								className: "text-xs font-medium text-text-secondary uppercase tracking-wider",
-								children: "Permission"
-							}), /* @__PURE__ */ x("div", {
-								className: "grid grid-cols-2 gap-2",
-								children: w.map((e) => {
-									let t = e.icon;
-									return /* @__PURE__ */ S("button", {
-										type: "button",
-										onClick: () => z(e.value),
-										className: `flex items-center gap-2 p-3 rounded-lg border-2 text-sm font-medium transition-all ${R === e.value ? "border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg" : "border-border-default text-text-secondary hover:border-border-default hover:bg-bg-secondary"}`,
-										children: [/* @__PURE__ */ x(t, { size: 14 }), e.label]
-									}, e.value);
-								})
-							})]
-						}),
-						/* @__PURE__ */ S("div", {
-							className: "grid grid-cols-2 gap-3",
-							children: [/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("label", {
-								htmlFor: "vibedecksharedialog-37",
-								className: "text-xs font-medium text-text-secondary",
-								children: "Expires in (hours)"
-							}), /* @__PURE__ */ x("input", {
-								id: "vibedecksharedialog-37",
-								"aria-label": "Never",
-								type: "number",
-								min: "1",
-								value: B,
-								onChange: (e) => V(e.target.value),
-								placeholder: "Never",
-								className: "w-full mt-1 px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-lg text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
-							})] }), /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("label", {
-								htmlFor: "vibedecksharedialog-36",
-								className: "text-xs font-medium text-text-secondary",
-								children: "Password (optional)"
-							}), /* @__PURE__ */ x("input", {
-								id: "vibedecksharedialog-36",
-								"aria-label": "No password",
-								type: "password",
-								value: H,
-								onChange: (e) => U(e.target.value),
-								placeholder: "No password",
-								className: "w-full mt-1 px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-lg text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg"
-							})] })]
-						}),
-						/* @__PURE__ */ S("label", {
-							className: "flex items-center gap-3 cursor-pointer",
-							children: [/* @__PURE__ */ x("input", {
-								"aria-label": "control",
-								type: "checkbox",
-								checked: W,
-								onChange: (e) => G(e.target.checked),
-								className: "size-4 rounded border-border-default text-action-primary-bg focus:ring-action-primary-bg"
-							}), /* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("span", {
-								className: "text-sm text-text-primary",
-								children: "Allow iframe embedding"
-							}), /* @__PURE__ */ x("p", {
-								className: "text-xs text-text-tertiary",
-								children: "Enable embedding this deck in other websites"
-							})] })]
-						}),
-						/* @__PURE__ */ S("button", {
-							type: "button",
-							onClick: ae,
-							disabled: Z,
-							className: "w-full px-4 py-2.5 rounded-lg bg-action-primary-bg text-action-primary-text text-sm font-medium hover:bg-action-primary-bg-hover disabled:opacity-50 transition-colors flex items-center justify-center gap-2",
-							children: [Z ? /* @__PURE__ */ x(h, {
-								size: 14,
-								className: "animate-spin"
-							}) : /* @__PURE__ */ x(m, { size: 14 }), O("vibecontrols.vibedeck.share.createLink", "Create Link")]
-						})
-					]
-				}), Y ? /* @__PURE__ */ x("div", {
-					className: "flex items-center justify-center py-6",
-					children: /* @__PURE__ */ x(h, {
-						size: 20,
-						className: "animate-spin text-text-tertiary"
-					})
-				}) : $.length > 0 ? /* @__PURE__ */ S("div", {
-					className: "space-y-3",
-					children: [/* @__PURE__ */ S("h3", {
-						className: "text-sm font-medium text-text-primary flex items-center gap-2",
-						children: [
-							/* @__PURE__ */ x(v, { size: 14 }),
-							"Active links (",
-							$.length,
-							")"
-						]
-					}), $.map((e) => /* @__PURE__ */ S("div", {
-						className: `rounded-lg border p-3 space-y-2 ${e.status === "ACTIVE" ? "border-border-default bg-bg-secondary" : "border-border-default/50 bg-bg-secondary/50 opacity-60"}`,
-						children: [/* @__PURE__ */ S("div", {
-							className: "flex items-center justify-between",
-							children: [/* @__PURE__ */ S("div", {
-								className: "flex items-center gap-2",
-								children: [
-									le(e.visibility),
-									/* @__PURE__ */ x("span", {
-										className: "text-sm font-medium text-text-primary",
-										children: e.name || "Unnamed link"
-									}),
-									/* @__PURE__ */ x("span", {
-										className: `text-[10px] font-bold uppercase px-1.5 py-0.5 rounded ${e.status === "ACTIVE" ? "bg-status-success-bg/20 text-status-success-text" : e.status === "REVOKED" ? "bg-status-error-bg/20 text-status-error-text" : "bg-status-warning-bg/20 text-status-warning-text"}`,
-										children: e.status
-									})
-								]
-							}), /* @__PURE__ */ x("div", {
-								className: "flex items-center gap-1",
-								children: e.status === "ACTIVE" && /* @__PURE__ */ S(b, { children: [
-									/* @__PURE__ */ x("button", {
-										type: "button",
-										onClick: () => se(e.id, e.shareUrl),
-										className: "p-1.5 rounded hover:bg-bg-tertiary text-text-tertiary hover:text-text-primary transition-colors",
-										title: "Copy link",
-										children: k === e.id ? /* @__PURE__ */ x(l, {
-											size: 14,
-											className: "text-status-success-text"
-										}) : M === e.id ? /* @__PURE__ */ x(y, {
-											size: 14,
-											className: "text-status-error-text"
-										}) : /* @__PURE__ */ x(d, { size: 14 })
-									}),
-									e.allowIframe && /* @__PURE__ */ x("button", {
-										type: "button",
-										onClick: () => ce(e.id, e.shareUrl),
-										className: "p-1.5 rounded hover:bg-bg-tertiary text-text-tertiary hover:text-text-primary transition-colors",
-										title: "Copy embed code",
-										children: re === e.id ? /* @__PURE__ */ x(l, {
-											size: 14,
-											className: "text-status-success-text"
-										}) : P === e.id ? /* @__PURE__ */ x(y, {
-											size: 14,
-											className: "text-status-error-text"
-										}) : /* @__PURE__ */ x(u, { size: 14 })
-									}),
-									/* @__PURE__ */ x("button", {
-										type: "button",
-										onClick: () => oe(e.id),
-										className: "p-1.5 rounded hover:bg-bg-tertiary text-text-tertiary hover:text-status-error-text transition-colors",
-										title: "Revoke link",
-										children: /* @__PURE__ */ x(te, { size: 14 })
-									})
-								] })
-							})]
-						}), /* @__PURE__ */ S("div", {
-							className: "flex items-center gap-3 text-xs text-text-tertiary",
-							children: [
-								/* @__PURE__ */ S("span", {
-									className: "flex items-center gap-1",
-									children: [e.permission === "EXECUTE" ? /* @__PURE__ */ x(_, { size: 10 }) : /* @__PURE__ */ x(f, { size: 10 }), e.permission === "EXECUTE" ? "Can execute" : "View only"]
-								}),
-								e.hasPassword && /* @__PURE__ */ S("span", {
-									className: "flex items-center gap-1",
-									children: [/* @__PURE__ */ x(g, { size: 10 }), "Password"]
-								}),
-								e.allowIframe && /* @__PURE__ */ S("span", {
-									className: "flex items-center gap-1",
-									children: [/* @__PURE__ */ x(u, { size: 10 }), "Embeddable"]
-								}),
-								/* @__PURE__ */ S("span", { children: [e.useCount, " uses"] }),
-								e.expiresAt && /* @__PURE__ */ S("span", { children: ["Expires ", new Date(e.expiresAt).toLocaleDateString()] })
-							]
-						})]
-					}, e.id))]
-				}) : /* @__PURE__ */ S("div", {
-					className: "text-center py-6",
-					children: [
-						/* @__PURE__ */ x(ne, {
-							size: 24,
-							className: "mx-auto text-text-tertiary mb-2"
-						}),
-						/* @__PURE__ */ x("p", {
-							className: "text-sm text-text-secondary",
-							children: O("vibecontrols.vibedeck.share.noLinks", "No share links yet")
-						}),
-						/* @__PURE__ */ x("p", {
-							className: "text-xs text-text-tertiary mt-1",
-							children: O("vibecontrols.vibedeck.share.createLinkHint", "Create a link above to share this VibeDeck")
-						})
-					]
-				})]
-			})]
-		})
+var i = ({ vibeDeckId: i, vibeDeckName: a, onClose: o }) => {
+	let s = e("vibedeck", { id: i });
+	return /* @__PURE__ */ n(r, {
+		resource: {
+			type: "vibedeck",
+			id: i,
+			name: a
+		},
+		controller: s,
+		open: !0,
+		onOpenChange: (e) => {
+			e || o();
+		},
+		workspaceId: t() ?? void 0
 	});
 };
 //#endregion
-export { T as VibeDeckShareDialog };
+export { i as VibeDeckShareDialog };
 
 //# sourceMappingURL=VibeDeckShareDialog.js.map

package/dist/components/vibedeck/VibeDeckShareDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"VibeDeckShareDialog.js","names":[],"sources":["../../../src/components/vibedeck/VibeDeckShareDialog.tsx"],"sourcesContent":["import { type FC, useState, useCallback } from 'react';\nimport {\n  X,\n  Link2,\n  Copy,\n  Check,\n  Trash2,\n  Globe,\n  Lock,\n  Users,\n  Code,\n  Eye,\n  Play,\n  Shield,\n  Loader2,\n} from 'lucide-react';\nimport { type VibeDeckShareLink } from '@/generated/wspace-types';\nimport {\n  useListVibeDeckShareLinksQuery,\n  useCreateVibeDeckShareLinkMutation,\n  useRevokeVibeDeckShareLinkMutation,\n} from '@/generated/wspace-operations';\nimport { useTr } from '../../shared/hooks/useTr';\nimport {\n  buildEmbedUrl,\n  copyTextToClipboard,\n  escapeHtmlAttribute,\n  normalizeShareUrl,\n} from '../../utils/shareUrl';\n\ninterface VibeDeckShareDialogProps {\n  vibeDeckId: string;\n  vibeDeckName: string;\n  onClose: () => void;\n}\n\nconst VISIBILITY_OPTIONS = [\n  {\n    value: 'SIGNED_LINK' as const,\n    label: 'Anyone with the link',\n    description: 'Anyone who has the link can access, no login required',\n    icon: Link2,\n  },\n  {\n    value: 'PUBLIC' as const,\n    label: 'Public',\n    description: 'Anyone can discover and access this deck',\n    icon: Globe,\n  },\n  {\n    value: 'RESTRICTED' as const,\n    label: 'Restricted',\n    description: 'Only people with permission can access (requires login)',\n    icon: Lock,\n  },\n];\n\nconst PERMISSION_OPTIONS = [\n  {\n    value: 'VIEW' as const,\n    label: 'Viewer',\n    description: 'Can view the deck',\n    icon: Eye,\n  },\n  {\n    value: 'EXECUTE' as const,\n    label: 'Can execute',\n    description: 'Can view and execute buttons',\n    icon: Play,\n  },\n];\n\nexport const VibeDeckShareDialog: FC<VibeDeckShareDialogProps> = ({\n  vibeDeckId,\n  vibeDeckName,\n  onClose,\n}) => {\n  const tr = useTr();\n  const [copiedId, setCopiedId] = useState<string | null>(null);\n  const [copiedEmbed, setCopiedEmbed] = useState<string | null>(null);\n  const [copyFailedId, setCopyFailedId] = useState<string | null>(null);\n  const [copyFailedEmbed, setCopyFailedEmbed] = useState<string | null>(null);\n\n  // New link form state\n  const [visibility, setVisibility] = useState<'SIGNED_LINK' | 'PUBLIC' | 'RESTRICTED'>(\n    'SIGNED_LINK'\n  );\n  const [permission, setPermission] = useState<'VIEW' | 'EXECUTE'>('EXECUTE');\n  const [expiresInHours, setExpiresInHours] = useState<string>('');\n  const [password, setPassword] = useState('');\n  const [allowIframe, setAllowIframe] = useState(false);\n  const [linkName, setLinkName] = useState('');\n\n  const { data, loading, refetch } = useListVibeDeckShareLinksQuery({\n    variables: { vibeDeckId },\n  });\n\n  const [createShareLink, { loading: creating }] = useCreateVibeDeckShareLinkMutation({\n    refetchQueries: ['ListVibeDeckShareLinks'],\n  });\n\n  const [revokeShareLink] = useRevokeVibeDeckShareLinkMutation({\n    refetchQueries: ['ListVibeDeckShareLinks'],\n  });\n\n  const shareLinks = data?.vibeDeckShareLinks || [];\n\n  const handleCreate = useCallback(async () => {\n    try {\n      await createShareLink({\n        variables: {\n          input: {\n            vibeDeckId,\n            name: linkName || null,\n            visibility,\n            permission,\n            expiresInHours: expiresInHours ? parseInt(expiresInHours, 10) : null,\n            password: password || null,\n            allowIframe,\n          },\n        },\n      });\n      // Reset form\n      setLinkName('');\n      setPassword('');\n      setExpiresInHours('');\n      setAllowIframe(false);\n    } catch {\n      // Error handled by Apollo\n    }\n  }, [\n    createShareLink,\n    vibeDeckId,\n    linkName,\n    visibility,\n    permission,\n    expiresInHours,\n    password,\n    allowIframe,\n  ]);\n\n  const handleRevoke = useCallback(\n    async (id: string) => {\n      try {\n        await revokeShareLink({ variables: { id } });\n      } catch {\n        // Error handled by Apollo\n      }\n    },\n    [revokeShareLink]\n  );\n\n  const handleCopyUrl = useCallback(async (id: string, url: string) => {\n    const ok = await copyTextToClipboard(normalizeShareUrl(url)).then(\n      () => true,\n      (error) => {\n        console.warn('Failed to copy VibeDeck share link:', error);\n        return false;\n      }\n    );\n    setCopiedId(ok ? id : null);\n    setCopyFailedId(ok ? null : id);\n    setTimeout(() => {\n      setCopiedId(null);\n      setCopyFailedId(null);\n    }, 2000);\n  }, []);\n\n  const handleCopyEmbed = useCallback(async (id: string, url: string) => {\n    const embedCode = `<iframe src=\"${escapeHtmlAttribute(buildEmbedUrl(url))}\" width=\"100%\" height=\"600\" frameborder=\"0\" allow=\"clipboard-write\" style=\"border-radius: 8px; border: 1px solid var(--color-border-subtle);\"></iframe>`;\n    const ok = await copyTextToClipboard(embedCode).then(\n      () => true,\n      (error) => {\n        console.warn('Failed to copy VibeDeck embed code:', error);\n        return false;\n      }\n    );\n    setCopiedEmbed(ok ? id : null);\n    setCopyFailedEmbed(ok ? null : id);\n    setTimeout(() => {\n      setCopiedEmbed(null);\n      setCopyFailedEmbed(null);\n    }, 2000);\n  }, []);\n\n  const visibilityIcon = (v: string) => {\n    switch (v) {\n      case 'PUBLIC':\n        return <Globe size={14} className=\"text-status-success-text\" />;\n      case 'RESTRICTED':\n        return <Lock size={14} className=\"text-status-warning-text\" />;\n      default:\n        return <Link2 size={14} className=\"text-status-info-text\" />;\n    }\n  };\n\n  return (\n    <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-bg-elevated/60 backdrop-blur-sm\">\n      <div className=\"bg-bg-surface border border-border-default rounded-xl shadow-2xl w-full max-w-lg mx-4 max-h-[85vh] flex flex-col\">\n        {/* Header */}\n        <div className=\"flex items-center justify-between px-6 py-4 border-b border-border-default\">\n          <div>\n            <h2 className=\"text-lg font-semibold text-text-primary\">Share \"{vibeDeckName}\"</h2>\n            <p className=\"text-sm text-text-secondary mt-0.5\">\n              {tr('vibecontrols.vibedeck.share.manageAccess', 'Manage access to this VibeDeck')}\n            </p>\n          </div>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            className=\"p-1.5 rounded-lg hover:bg-bg-tertiary text-text-tertiary hover:text-text-primary transition-colors\"\n          >\n            <X size={18} />\n          </button>\n        </div>\n\n        <div className=\"overflow-y-auto flex-1 px-6 py-4 space-y-6\">\n          {/* Create new link section */}\n          <div className=\"space-y-4\">\n            <h3 className=\"text-sm font-medium text-text-primary flex items-center gap-2\">\n              <Link2 size={14} />\n              {tr('vibecontrols.vibedeck.share.createShareLink', 'Create share link')}\n            </h3>\n\n            {/* Link name (optional) */}\n            <input\n              aria-label=\"Link name (optional)\"\n              type=\"text\"\n              value={linkName}\n              onChange={(e) => setLinkName(e.target.value)}\n              placeholder=\"Link name (optional)\"\n              className=\"w-full px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-lg text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg\"\n            />\n\n            {/* Visibility selector */}\n            <div className=\"space-y-2\">\n              <label\n                htmlFor=\"vibedecksharedialog-37\"\n                className=\"text-xs font-medium text-text-secondary uppercase tracking-wider\"\n              >\n                Access\n              </label>\n              <div className=\"grid grid-cols-3 gap-2\">\n                {VISIBILITY_OPTIONS.map((opt) => {\n                  const Icon = opt.icon;\n                  const isSelected = visibility === opt.value;\n                  return (\n                    <button\n                      type=\"button\"\n                      key={opt.value}\n                      onClick={() => setVisibility(opt.value)}\n                      className={`flex flex-col items-center gap-1.5 p-3 rounded-lg border-2 text-xs font-medium transition-all ${\n                        isSelected\n                          ? 'border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg'\n                          : 'border-border-default text-text-secondary hover:border-border-default hover:bg-bg-secondary'\n                      }`}\n                      title={opt.description}\n                    >\n                      <Icon size={16} />\n                      <span className=\"text-center leading-tight\">{opt.label}</span>\n                    </button>\n                  );\n                })}\n              </div>\n            </div>\n\n            {/* Permission selector */}\n            <div className=\"space-y-2\">\n              <label\n                htmlFor=\"vibedecksharedialog-37\"\n                className=\"text-xs font-medium text-text-secondary uppercase tracking-wider\"\n              >\n                Permission\n              </label>\n              <div className=\"grid grid-cols-2 gap-2\">\n                {PERMISSION_OPTIONS.map((opt) => {\n                  const Icon = opt.icon;\n                  const isSelected = permission === opt.value;\n                  return (\n                    <button\n                      type=\"button\"\n                      key={opt.value}\n                      onClick={() => setPermission(opt.value)}\n                      className={`flex items-center gap-2 p-3 rounded-lg border-2 text-sm font-medium transition-all ${\n                        isSelected\n                          ? 'border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg'\n                          : 'border-border-default text-text-secondary hover:border-border-default hover:bg-bg-secondary'\n                      }`}\n                    >\n                      <Icon size={14} />\n                      {opt.label}\n                    </button>\n                  );\n                })}\n              </div>\n            </div>\n\n            {/* Options row */}\n            <div className=\"grid grid-cols-2 gap-3\">\n              <div>\n                <label\n                  htmlFor=\"vibedecksharedialog-37\"\n                  className=\"text-xs font-medium text-text-secondary\"\n                >\n                  Expires in (hours)\n                </label>\n                <input\n                  id=\"vibedecksharedialog-37\"\n                  aria-label=\"Never\"\n                  type=\"number\"\n                  min=\"1\"\n                  value={expiresInHours}\n                  onChange={(e) => setExpiresInHours(e.target.value)}\n                  placeholder=\"Never\"\n                  className=\"w-full mt-1 px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-lg text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg\"\n                />\n              </div>\n              <div>\n                <label\n                  htmlFor=\"vibedecksharedialog-36\"\n                  className=\"text-xs font-medium text-text-secondary\"\n                >\n                  Password (optional)\n                </label>\n                <input\n                  id=\"vibedecksharedialog-36\"\n                  aria-label=\"No password\"\n                  type=\"password\"\n                  value={password}\n                  onChange={(e) => setPassword(e.target.value)}\n                  placeholder=\"No password\"\n                  className=\"w-full mt-1 px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-lg text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg\"\n                />\n              </div>\n            </div>\n\n            {/* Allow iframe toggle */}\n            <label className=\"flex items-center gap-3 cursor-pointer\">\n              <input\n                aria-label=\"control\"\n                type=\"checkbox\"\n                checked={allowIframe}\n                onChange={(e) => setAllowIframe(e.target.checked)}\n                className=\"size-4 rounded border-border-default text-action-primary-bg focus:ring-action-primary-bg\"\n              />\n              <div>\n                <span className=\"text-sm text-text-primary\">Allow iframe embedding</span>\n                <p className=\"text-xs text-text-tertiary\">\n                  Enable embedding this deck in other websites\n                </p>\n              </div>\n            </label>\n\n            {/* Create button */}\n            <button\n              type=\"button\"\n              onClick={handleCreate}\n              disabled={creating}\n              className=\"w-full px-4 py-2.5 rounded-lg bg-action-primary-bg text-action-primary-text text-sm font-medium hover:bg-action-primary-bg-hover disabled:opacity-50 transition-colors flex items-center justify-center gap-2\"\n            >\n              {creating ? <Loader2 size={14} className=\"animate-spin\" /> : <Link2 size={14} />}\n              {tr('vibecontrols.vibedeck.share.createLink', 'Create Link')}\n            </button>\n          </div>\n\n          {/* Existing links */}\n          {loading ? (\n            <div className=\"flex items-center justify-center py-6\">\n              <Loader2 size={20} className=\"animate-spin text-text-tertiary\" />\n            </div>\n          ) : shareLinks.length > 0 ? (\n            <div className=\"space-y-3\">\n              <h3 className=\"text-sm font-medium text-text-primary flex items-center gap-2\">\n                <Shield size={14} />\n                Active links ({shareLinks.length})\n              </h3>\n              {shareLinks.map((link: VibeDeckShareLink) => (\n                <div\n                  key={link.id}\n                  className={`rounded-lg border p-3 space-y-2 ${\n                    link.status === 'ACTIVE'\n                      ? 'border-border-default bg-bg-secondary'\n                      : 'border-border-default/50 bg-bg-secondary/50 opacity-60'\n                  }`}\n                >\n                  <div className=\"flex items-center justify-between\">\n                    <div className=\"flex items-center gap-2\">\n                      {visibilityIcon(link.visibility)}\n                      <span className=\"text-sm font-medium text-text-primary\">\n                        {link.name || 'Unnamed link'}\n                      </span>\n                      <span\n                        className={`text-[10px] font-bold uppercase px-1.5 py-0.5 rounded ${\n                          link.status === 'ACTIVE'\n                            ? 'bg-status-success-bg/20 text-status-success-text'\n                            : link.status === 'REVOKED'\n                              ? 'bg-status-error-bg/20 text-status-error-text'\n                              : 'bg-status-warning-bg/20 text-status-warning-text'\n                        }`}\n                      >\n                        {link.status}\n                      </span>\n                    </div>\n                    <div className=\"flex items-center gap-1\">\n                      {link.status === 'ACTIVE' && (\n                        <>\n                          <button\n                            type=\"button\"\n                            onClick={() => handleCopyUrl(link.id, link.shareUrl)}\n                            className=\"p-1.5 rounded hover:bg-bg-tertiary text-text-tertiary hover:text-text-primary transition-colors\"\n                            title=\"Copy link\"\n                          >\n                            {copiedId === link.id ? (\n                              <Check size={14} className=\"text-status-success-text\" />\n                            ) : copyFailedId === link.id ? (\n                              <X size={14} className=\"text-status-error-text\" />\n                            ) : (\n                              <Copy size={14} />\n                            )}\n                          </button>\n                          {link.allowIframe && (\n                            <button\n                              type=\"button\"\n                              onClick={() => handleCopyEmbed(link.id, link.shareUrl)}\n                              className=\"p-1.5 rounded hover:bg-bg-tertiary text-text-tertiary hover:text-text-primary transition-colors\"\n                              title=\"Copy embed code\"\n                            >\n                              {copiedEmbed === link.id ? (\n                                <Check size={14} className=\"text-status-success-text\" />\n                              ) : copyFailedEmbed === link.id ? (\n                                <X size={14} className=\"text-status-error-text\" />\n                              ) : (\n                                <Code size={14} />\n                              )}\n                            </button>\n                          )}\n                          <button\n                            type=\"button\"\n                            onClick={() => handleRevoke(link.id)}\n                            className=\"p-1.5 rounded hover:bg-bg-tertiary text-text-tertiary hover:text-status-error-text transition-colors\"\n                            title=\"Revoke link\"\n                          >\n                            <Trash2 size={14} />\n                          </button>\n                        </>\n                      )}\n                    </div>\n                  </div>\n                  <div className=\"flex items-center gap-3 text-xs text-text-tertiary\">\n                    <span className=\"flex items-center gap-1\">\n                      {link.permission === 'EXECUTE' ? <Play size={10} /> : <Eye size={10} />}\n                      {link.permission === 'EXECUTE' ? 'Can execute' : 'View only'}\n                    </span>\n                    {link.hasPassword && (\n                      <span className=\"flex items-center gap-1\">\n                        <Lock size={10} />\n                        Password\n                      </span>\n                    )}\n                    {link.allowIframe && (\n                      <span className=\"flex items-center gap-1\">\n                        <Code size={10} />\n                        Embeddable\n                      </span>\n                    )}\n                    <span>{link.useCount} uses</span>\n                    {link.expiresAt && (\n                      <span>Expires {new Date(link.expiresAt).toLocaleDateString()}</span>\n                    )}\n                  </div>\n                </div>\n              ))}\n            </div>\n          ) : (\n            <div className=\"text-center py-6\">\n              <Users size={24} className=\"mx-auto text-text-tertiary mb-2\" />\n              <p className=\"text-sm text-text-secondary\">\n                {tr('vibecontrols.vibedeck.share.noLinks', 'No share links yet')}\n              </p>\n              <p className=\"text-xs text-text-tertiary mt-1\">\n                {tr(\n                  'vibecontrols.vibedeck.share.createLinkHint',\n                  'Create a link above to share this VibeDeck'\n                )}\n              </p>\n            </div>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"VibeDeckShareDialog.js","names":[],"sources":["../../../src/components/vibedeck/VibeDeckShareDialog.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { ShareDialog } from '@burdenoff/fe-libs/sharing';\nimport { getStoredWorkspaceId } from '@burdenoff/fe-libs/shared/graphql';\n\nimport { useEntityShareController } from '../sharing/useEntityShareController';\n\ninterface VibeDeckShareDialogProps {\n  vibeDeckId: string;\n  vibeDeckName: string;\n  onClose: () => void;\n}\n\n/**\n * VibeDeckShareDialog — thin wrapper around the generic fe-libs `<ShareDialog>`\n * for a VibeDeck.\n *\n * It previously hosted a bespoke link-only share UI (legacy\n * `createVibeDeckShareLink` + `VibeDeckShareLink` table). That surface was pure\n * share-record management with no realtime entanglement, so the body has been\n * replaced with the richer generic dialog (email invite + accept-gate + four\n * visibility modes + expiry + public link) backed by the generic\n * `shareVibeDeckGrant` grant mutations.\n *\n * The mount-to-open `{ vibeDeckId, vibeDeckName, onClose }` API is preserved so\n * the page's existing triggers (header button, deck-card share action) keep\n * working unchanged. `vibeId` is resolved by the controller's own read query\n * (the deck list fragment does not project it), enabling \"Everyone with Vibe\".\n */\nexport const VibeDeckShareDialog: FC<VibeDeckShareDialogProps> = ({\n  vibeDeckId,\n  vibeDeckName,\n  onClose,\n}) => {\n  const controller = useEntityShareController('vibedeck', { id: vibeDeckId });\n\n  return (\n    <ShareDialog\n      resource={{ type: 'vibedeck', id: vibeDeckId, name: vibeDeckName }}\n      controller={controller}\n      open\n      onOpenChange={(next) => {\n        if (!next) onClose();\n      }}\n      workspaceId={getStoredWorkspaceId() ?? undefined}\n    />\n  );\n};\n"],"mappings":";;;;;AA4BA,IAAa,KAAqD,EAChE,eACA,iBACA,iBACI;CACJ,IAAM,IAAa,EAAyB,YAAY,EAAE,IAAI,GAAY,CAAC;AAE3E,QACE,kBAAC,GAAD;EACE,UAAU;GAAE,MAAM;GAAY,IAAI;GAAY,MAAM;GAAc;EACtD;EACZ,MAAA;EACA,eAAe,MAAS;AACtB,GAAK,KAAM,GAAS;;EAEtB,aAAa,GAAsB,IAAI,KAAA;EACvC,CAAA"}

package/dist/components/vibes/DeleteVibeDialog.js

@@ -0,0 +1,130 @@
+import { useEffect as e, useMemo as t, useRef as n, useState as r } from "react";
+import { useI18n as i } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AlertTriangle as a, Loader2 as o, Trash2 as s } from "lucide-react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/components/vibes/DeleteVibeDialog.tsx
+var u = ({ vibe: u, deleting: d = !1, onConfirm: f, onCancel: p }) => {
+	let { t: m } = i(), h = (e, t) => {
+		let n = m(e);
+		return n === e ? t : n;
+	}, [g, _] = r(!1), [v, y] = r(""), b = n(null);
+	e(() => {
+		if (u) {
+			_(!1), y("");
+			let e = window.setTimeout(() => b.current?.focus(), 0);
+			return () => window.clearTimeout(e);
+		}
+	}, [u]);
+	let x = t(() => !!u && v.trim() === u.name, [v, u]) && !d;
+	if (!u) return null;
+	let S = () => {
+		x && f(g);
+	};
+	return /* @__PURE__ */ c("div", {
+		tabIndex: 0,
+		onKeyDown: (e) => {
+			e.key === "Escape" && !d && (e.preventDefault(), p());
+		},
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-labelledby": "delete-vibe-title",
+		className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
+		onClick: (e) => {
+			e.target === e.currentTarget && !d && p();
+		},
+		children: /* @__PURE__ */ l("div", {
+			className: "w-full max-w-md rounded-lg bg-bg-elevated border border-border-default shadow-xl p-5",
+			children: [
+				/* @__PURE__ */ l("div", {
+					className: "flex items-start gap-3 mb-3",
+					children: [/* @__PURE__ */ c("div", {
+						className: "flex-shrink-0 size-9 rounded-full bg-status-error-bg flex items-center justify-center",
+						children: /* @__PURE__ */ c(s, { className: "size-4 text-status-error-text" })
+					}), /* @__PURE__ */ l("div", {
+						className: "min-w-0",
+						children: [/* @__PURE__ */ c("h2", {
+							id: "delete-vibe-title",
+							className: "text-base font-semibold text-text-primary",
+							children: h("vibeDelete.title", "Delete this vibe?")
+						}), /* @__PURE__ */ c("p", {
+							className: "text-sm text-text-secondary mt-1",
+							children: h("vibeDelete.body", "This permanently deletes the vibe and all of its sub-vibes. This action cannot be undone.")
+						})]
+					})]
+				}),
+				/* @__PURE__ */ c("p", {
+					className: "text-xs text-text-secondary mb-4",
+					children: h("vibeDelete.detachNote", "By default, related items (sessions, notes, tunnels, decks, actions, AI prompts & contexts, instruction files) are kept and simply detached from this vibe.")
+				}),
+				/* @__PURE__ */ l("label", {
+					className: "flex items-start gap-2 mb-3 cursor-pointer select-none",
+					children: [/* @__PURE__ */ c("input", {
+						type: "checkbox",
+						checked: g,
+						disabled: d,
+						onChange: (e) => _(e.target.checked),
+						className: "mt-0.5 size-4 rounded border-border-default cursor-pointer"
+					}), /* @__PURE__ */ c("span", {
+						className: "text-sm text-text-primary",
+						children: h("vibeDelete.alsoDeleteRelated", "Also permanently delete all related items")
+					})]
+				}),
+				g && /* @__PURE__ */ l("div", {
+					className: "flex items-start gap-2 mb-4 rounded-md border border-status-error-border bg-status-error-bg px-3 py-2",
+					children: [/* @__PURE__ */ c(a, { className: "size-4 mt-0.5 flex-shrink-0 text-status-error-text" }), /* @__PURE__ */ c("p", {
+						className: "text-xs text-status-error-text",
+						children: h("vibeDelete.relatedWarning", "Every session, note, tunnel, deck, action, AI prompt, AI context and instruction file linked to this vibe will be permanently deleted. This is irreversible.")
+					})]
+				}),
+				/* @__PURE__ */ l("label", {
+					htmlFor: "delete-vibe-confirm-name",
+					className: "block text-xs font-medium text-text-secondary mb-1",
+					children: [
+						h("vibeDelete.retypePrompt", "Type the vibe name to confirm:"),
+						" ",
+						/* @__PURE__ */ c("span", {
+							className: "font-mono text-text-primary break-all",
+							children: u.name
+						})
+					]
+				}),
+				/* @__PURE__ */ c("input", {
+					id: "delete-vibe-confirm-name",
+					ref: b,
+					type: "text",
+					value: v,
+					disabled: d,
+					onChange: (e) => y(e.target.value),
+					onKeyDown: (e) => {
+						e.key === "Enter" && (e.preventDefault(), S());
+					},
+					autoComplete: "off",
+					spellCheck: !1,
+					"aria-label": h("vibeDelete.retypeAria", "Vibe name confirmation"),
+					placeholder: u.name,
+					className: "w-full text-sm px-3 py-2 mb-4 rounded-md bg-bg-surface border border-border-default text-text-primary placeholder:text-text-tertiary focus:outline-none focus:ring-2 focus:ring-status-error-text/40"
+				}),
+				/* @__PURE__ */ l("div", {
+					className: "flex justify-end gap-2",
+					children: [/* @__PURE__ */ c("button", {
+						type: "button",
+						onClick: p,
+						disabled: d,
+						className: "text-sm px-3 py-1.5 rounded-md border border-border-default text-text-primary hover:bg-action-ghost-bg-hover disabled:opacity-50",
+						children: h("common.cancel", "Cancel")
+					}), /* @__PURE__ */ l("button", {
+						type: "button",
+						onClick: S,
+						disabled: !x,
+						className: "inline-flex items-center gap-1.5 text-sm px-3 py-1.5 rounded-md bg-status-error-bg text-status-error-text hover:opacity-80 disabled:opacity-40 disabled:cursor-not-allowed",
+						children: [d ? /* @__PURE__ */ c(o, { className: "size-4 animate-spin" }) : /* @__PURE__ */ c(s, { className: "size-4" }), g ? h("vibeDelete.confirmAll", "Delete vibe & related") : h("vibeDelete.confirm", "Delete vibe")]
+					})]
+				})
+			]
+		})
+	});
+};
+//#endregion
+export { u as DeleteVibeDialog };
+
+//# sourceMappingURL=DeleteVibeDialog.js.map

package/dist/components/vibes/DeleteVibeDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeleteVibeDialog.js","names":[],"sources":["../../../src/components/vibes/DeleteVibeDialog.tsx"],"sourcesContent":["import { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { AlertTriangle, Loader2, Trash2 } from 'lucide-react';\nimport { type FC, useEffect, useMemo, useRef, useState } from 'react';\n\n/** Minimal vibe shape the delete dialog needs from any call site. */\nexport interface DeletableVibe {\n  id: string;\n  name: string;\n}\n\nexport interface DeleteVibeDialogProps {\n  /** The vibe being deleted. When null the dialog is closed. */\n  vibe: DeletableVibe | null;\n  /** Whether a delete request is currently in flight. */\n  deleting?: boolean;\n  /**\n   * Invoked once the user has confirmed. `deleteRelatedEntities` reflects the\n   * opt-in checkbox: when true the linked entities (sessions, notes, tunnels,\n   * decks, actions, AI prompts/contexts, instruction files) are deleted too;\n   * when false they are preserved and merely detached.\n   */\n  onConfirm: (deleteRelatedEntities: boolean) => void | Promise<void>;\n  onCancel: () => void;\n}\n\n/**\n * Confirmation dialog for permanently deleting a vibe.\n *\n * Deleting a vibe is irreversible, so the user must retype the vibe's exact\n * name before the destructive action is enabled. An explicit, unchecked-by-\n * default checkbox lets them also delete every related entity; ticking it\n * surfaces an extra danger warning so the heightened blast radius is\n * unmistakable before they confirm.\n */\nexport const DeleteVibeDialog: FC<DeleteVibeDialogProps> = ({\n  vibe,\n  deleting = false,\n  onConfirm,\n  onCancel,\n}) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string) => {\n    const v = t(key);\n    return v === key ? fallback : v;\n  };\n\n  const [deleteRelated, setDeleteRelated] = useState(false);\n  const [confirmName, setConfirmName] = useState('');\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  // Reset transient state whenever the dialog opens for a (different) vibe so a\n  // previous attempt never leaks into the next one.\n  useEffect(() => {\n    if (vibe) {\n      setDeleteRelated(false);\n      setConfirmName('');\n      // Focus the name field so the irreversible gate is front-and-centre.\n      const id = window.setTimeout(() => inputRef.current?.focus(), 0);\n      return () => window.clearTimeout(id);\n    }\n    return undefined;\n  }, [vibe]);\n\n  const nameMatches = useMemo(\n    () => !!vibe && confirmName.trim() === vibe.name,\n    [confirmName, vibe]\n  );\n  const canDelete = nameMatches && !deleting;\n\n  if (!vibe) return null;\n\n  const handleConfirm = () => {\n    if (!canDelete) return;\n    void onConfirm(deleteRelated);\n  };\n\n  return (\n    <div\n      tabIndex={0}\n      onKeyDown={(e) => {\n        if (e.key === 'Escape' && !deleting) {\n          e.preventDefault();\n          onCancel();\n        }\n      }}\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby=\"delete-vibe-title\"\n      className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4\"\n      onClick={(e) => {\n        if (e.target === e.currentTarget && !deleting) onCancel();\n      }}\n    >\n      <div className=\"w-full max-w-md rounded-lg bg-bg-elevated border border-border-default shadow-xl p-5\">\n        <div className=\"flex items-start gap-3 mb-3\">\n          <div className=\"flex-shrink-0 size-9 rounded-full bg-status-error-bg flex items-center justify-center\">\n            <Trash2 className=\"size-4 text-status-error-text\" />\n          </div>\n          <div className=\"min-w-0\">\n            <h2 id=\"delete-vibe-title\" className=\"text-base font-semibold text-text-primary\">\n              {tr('vibeDelete.title', 'Delete this vibe?')}\n            </h2>\n            <p className=\"text-sm text-text-secondary mt-1\">\n              {tr(\n                'vibeDelete.body',\n                'This permanently deletes the vibe and all of its sub-vibes. This action cannot be undone.'\n              )}\n            </p>\n          </div>\n        </div>\n\n        <p className=\"text-xs text-text-secondary mb-4\">\n          {tr(\n            'vibeDelete.detachNote',\n            'By default, related items (sessions, notes, tunnels, decks, actions, AI prompts & contexts, instruction files) are kept and simply detached from this vibe.'\n          )}\n        </p>\n\n        <label className=\"flex items-start gap-2 mb-3 cursor-pointer select-none\">\n          <input\n            type=\"checkbox\"\n            checked={deleteRelated}\n            disabled={deleting}\n            onChange={(e) => setDeleteRelated(e.target.checked)}\n            className=\"mt-0.5 size-4 rounded border-border-default cursor-pointer\"\n          />\n          <span className=\"text-sm text-text-primary\">\n            {tr('vibeDelete.alsoDeleteRelated', 'Also permanently delete all related items')}\n          </span>\n        </label>\n\n        {deleteRelated && (\n          <div className=\"flex items-start gap-2 mb-4 rounded-md border border-status-error-border bg-status-error-bg px-3 py-2\">\n            <AlertTriangle className=\"size-4 mt-0.5 flex-shrink-0 text-status-error-text\" />\n            <p className=\"text-xs text-status-error-text\">\n              {tr(\n                'vibeDelete.relatedWarning',\n                'Every session, note, tunnel, deck, action, AI prompt, AI context and instruction file linked to this vibe will be permanently deleted. This is irreversible.'\n              )}\n            </p>\n          </div>\n        )}\n\n        <label\n          htmlFor=\"delete-vibe-confirm-name\"\n          className=\"block text-xs font-medium text-text-secondary mb-1\"\n        >\n          {tr('vibeDelete.retypePrompt', 'Type the vibe name to confirm:')}{' '}\n          <span className=\"font-mono text-text-primary break-all\">{vibe.name}</span>\n        </label>\n        <input\n          id=\"delete-vibe-confirm-name\"\n          ref={inputRef}\n          type=\"text\"\n          value={confirmName}\n          disabled={deleting}\n          onChange={(e) => setConfirmName(e.target.value)}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter') {\n              e.preventDefault();\n              handleConfirm();\n            }\n          }}\n          autoComplete=\"off\"\n          spellCheck={false}\n          aria-label={tr('vibeDelete.retypeAria', 'Vibe name confirmation')}\n          placeholder={vibe.name}\n          className=\"w-full text-sm px-3 py-2 mb-4 rounded-md bg-bg-surface border border-border-default text-text-primary placeholder:text-text-tertiary focus:outline-none focus:ring-2 focus:ring-status-error-text/40\"\n        />\n\n        <div className=\"flex justify-end gap-2\">\n          <button\n            type=\"button\"\n            onClick={onCancel}\n            disabled={deleting}\n            className=\"text-sm px-3 py-1.5 rounded-md border border-border-default text-text-primary hover:bg-action-ghost-bg-hover disabled:opacity-50\"\n          >\n            {tr('common.cancel', 'Cancel')}\n          </button>\n          <button\n            type=\"button\"\n            onClick={handleConfirm}\n            disabled={!canDelete}\n            className=\"inline-flex items-center gap-1.5 text-sm px-3 py-1.5 rounded-md bg-status-error-bg text-status-error-text hover:opacity-80 disabled:opacity-40 disabled:cursor-not-allowed\"\n          >\n            {deleting ? <Loader2 className=\"size-4 animate-spin\" /> : <Trash2 className=\"size-4\" />}\n            {deleteRelated\n              ? tr('vibeDelete.confirmAll', 'Delete vibe & related')\n              : tr('vibeDelete.confirm', 'Delete vibe')}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}