@agent-native/dispatch 0.1.1

package/dist/components/create-app-popover.js

@@ -0,0 +1,188 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from "react";
+import { PromptComposer, agentNativePath, appBasePath, isInBuilderFrame, sendToAgentChat, useDevMode, } from "@agent-native/core/client";
+import { getWorkspaceAppIdValidationError } from "@agent-native/core/shared";
+import { IconArrowLeft, IconArrowUpRight, IconCheck, IconChevronDown, IconKey, IconLoader2, IconPlus, } from "@tabler/icons-react";
+import { Popover, PopoverContent, PopoverTrigger, } from "../components/ui/popover";
+import { Button } from "../components/ui/button";
+function slugify(value) {
+    return value
+        .toLowerCase()
+        .replace(/[^a-z0-9]+/g, "-")
+        .replace(/^-+|-+$/g, "")
+        .replace(/^[^a-z]+/, "")
+        .slice(0, 48);
+}
+function titleFromPrompt(prompt) {
+    const cleaned = prompt
+        .replace(/\b(build|create|make|an?|the|app|tool|dashboard)\b/gi, " ")
+        .replace(/\s+/g, " ")
+        .trim();
+    return slugify(cleaned || "new-app") || "new-app";
+}
+function buildAppCreationPrompt(input) {
+    const keyList = input.selectedKeys.join(", ");
+    const grantRequest = keyList
+        ? `Requested Dispatch vault key grants for this app: ${keyList}`
+        : `Requested Dispatch vault key grants for this app: none`;
+    return [
+        `Create a new agent-native app in this workspace.`,
+        ``,
+        `Suggested app name: ${input.appId} (you may adjust the slug if it conflicts)`,
+        `User prompt: ${input.prompt.trim()}`,
+        grantRequest,
+        ``,
+        `Pick a starter template that fits the user's prompt — analytics, calendar, content, design, dispatch, forms, mail, slides, videos, clips, or starter when none of the others fit.`,
+        `Use the workspace app layout: create it under apps/${input.appId}, mount it at /${input.appId}, keep it on the shared workspace database/hosting model, and avoid table-name collisions by namespacing any new domain tables to the app.`,
+        keyList
+            ? `After the app exists, grant the selected Dispatch vault keys to appId "${input.appId}" and sync them once the app server is available. Treat these as requested grants, not active grants before creation succeeds.`
+            : `Do not grant any Dispatch vault keys unless the user asks later.`,
+        ``,
+        `App readiness requirements before handing off:`,
+        `- Update the workspace app registry metadata for "${input.appId}" so Dispatch lists the app at /${input.appId} after merge/deploy.`,
+        `- Update the app manifest/package/deploy metadata needed by the existing workspace deployment model.`,
+        `- Verify the app's agent card/A2A metadata is ready so Dispatch can discover and delegate to the app after deployment.`,
+        `When it is ready, start or update the workspace dev server and navigate the user to /${input.appId}.`,
+    ].join("\n");
+}
+async function fetchJson(url, init) {
+    const res = await fetch(url, init);
+    const data = await res.json().catch(() => null);
+    if (!res.ok) {
+        throw new Error(data?.error || data?.message || `Request failed ${res.status}`);
+    }
+    return data;
+}
+function defaultDispatchBasePath() {
+    const base = appBasePath();
+    if (base === "/dispatch")
+        return null;
+    return null;
+}
+function actionUrl(basePath, action) {
+    const path = `/_agent-native/actions/${action}`;
+    if (basePath === null)
+        return agentNativePath(path);
+    const normalized = basePath.replace(/\/+$/, "");
+    return `${normalized}${path}`;
+}
+/**
+ * Inline two-step app-creation flow: prompt → optional key picker → submit.
+ * Used both in the popover form and in the dedicated `/new-app` page so the
+ * same UX shows up everywhere a teammate kicks off a new workspace app.
+ */
+export function CreateAppFlow({ onClose, className = "", }) {
+    const [step, setStep] = useState("prompt");
+    const [prompt, setPrompt] = useState("");
+    const [selectedSecretIds, setSelectedSecretIds] = useState([]);
+    const [secrets, setSecrets] = useState([]);
+    const [secretsError, setSecretsError] = useState(null);
+    const [statusMessage, setStatusMessage] = useState(null);
+    const [branchUrl, setBranchUrl] = useState(null);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const { isDevMode } = useDevMode();
+    const basePath = useMemo(() => defaultDispatchBasePath(), []);
+    // Fetch the vault keys eagerly so step 2 has them ready the moment the user
+    // taps "Choose keys" — no spinner, no pause between steps.
+    useEffect(() => {
+        let cancelled = false;
+        fetchJson(actionUrl(basePath, "list-vault-secret-options"))
+            .then((data) => {
+            if (cancelled)
+                return;
+            setSecrets(Array.isArray(data) ? data : []);
+            setSecretsError(null);
+        })
+            .catch((err) => {
+            if (cancelled)
+                return;
+            setSecrets([]);
+            setSecretsError(err?.message || "Could not load Dispatch keys");
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [basePath]);
+    const selectedSecrets = useMemo(() => secrets.filter((s) => selectedSecretIds.includes(s.id)), [secrets, selectedSecretIds]);
+    const selectedSecretLabel = selectedSecretIds.length === 0
+        ? "no keys"
+        : `${selectedSecretIds.length} key${selectedSecretIds.length === 1 ? "" : "s"}`;
+    function toggleSecret(id) {
+        setSelectedSecretIds((cur) => cur.includes(id) ? cur.filter((x) => x !== id) : [...cur, id]);
+    }
+    async function submit(rawPrompt, selectedKeys) {
+        const trimmed = rawPrompt.trim();
+        if (!trimmed || isSubmitting)
+            return;
+        const appId = titleFromPrompt(trimmed);
+        const validationError = getWorkspaceAppIdValidationError(appId);
+        if (validationError) {
+            setStatusMessage(validationError);
+            return;
+        }
+        const message = buildAppCreationPrompt({
+            appId,
+            prompt: trimmed,
+            selectedKeys,
+        });
+        setIsSubmitting(true);
+        setStatusMessage(null);
+        setBranchUrl(null);
+        try {
+            if (isInBuilderFrame()) {
+                sendToAgentChat({ message, submit: true, type: "code" });
+                setStatusMessage("Sent to Builder chat.");
+                onClose?.();
+            }
+            else if (isDevMode) {
+                sendToAgentChat({ message, submit: true, type: "code", newTab: true });
+                setStatusMessage("Sent to the local agent.");
+                onClose?.();
+            }
+            else {
+                const result = await fetchJson(actionUrl(basePath, "start-workspace-app-creation"), {
+                    method: "POST",
+                    headers: { "Content-Type": "application/json" },
+                    body: JSON.stringify({
+                        prompt: trimmed,
+                        appId,
+                        secretIds: selectedKeys.length > 0 ? selectedSecretIds : [],
+                    }),
+                });
+                if (result?.mode === "builder") {
+                    setBranchUrl(result?.url || null);
+                    setStatusMessage("Builder branch created.");
+                }
+                else {
+                    setStatusMessage(result?.message ||
+                        "Builder app creation is coming soon. Open this workspace in Builder to create an app from this prompt.");
+                }
+            }
+        }
+        catch (err) {
+            setStatusMessage(err?.message || "Could not start the new app flow.");
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    }
+    const submitWithSelectedKeys = () => submit(prompt, selectedSecrets.map((s) => s.credentialKey));
+    return (_jsxs("div", { className: `flex flex-col gap-3 ${className}`, children: [step === "prompt" ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center justify-between gap-2 px-1", children: [_jsx("p", { className: "text-sm font-semibold text-foreground", children: "Create app" }), _jsxs("button", { type: "button", onClick: () => setStep("keys"), className: "inline-flex cursor-pointer items-center gap-1 rounded-md border border-border bg-background/40 px-2 py-1 text-[11px] text-muted-foreground hover:text-foreground hover:bg-accent/50", children: [_jsx(IconKey, { size: 11 }), selectedSecretLabel] })] }), _jsx(PromptComposer, { autoFocus: true, disabled: isSubmitting, placeholder: "Describe the app your teammate should be able to use...", draftScope: "dispatch:create-app", onSubmit: (text) => {
+                            setPrompt(text);
+                            submit(text, selectedSecrets.map((s) => s.credentialKey));
+                        } })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center justify-between gap-2 px-1", children: [_jsxs("button", { type: "button", onClick: () => setStep("prompt"), className: "inline-flex cursor-pointer items-center gap-1 text-xs text-muted-foreground hover:text-foreground", children: [_jsx(IconArrowLeft, { size: 12 }), "Back"] }), _jsxs("span", { className: "text-[11px] text-muted-foreground/70", children: [selectedSecretLabel, " selected"] })] }), _jsx("div", { className: "max-h-[340px] space-y-2 overflow-y-auto rounded-md border border-border bg-card p-2", children: secretsError ? (_jsx("p", { className: "rounded-md border border-dashed border-border px-3 py-3 text-xs text-muted-foreground", children: secretsError })) : secrets.length === 0 ? (_jsx("p", { className: "rounded-md border border-dashed border-border px-3 py-3 text-xs text-muted-foreground", children: "No Dispatch vault keys found yet." })) : (secrets.map((secret) => {
+                            const selected = selectedSecretIds.includes(secret.id);
+                            return (_jsxs("div", { className: `group rounded-md border text-sm ${selected
+                                    ? "border-primary/45 bg-primary/5"
+                                    : "border-border hover:border-muted-foreground/40 hover:bg-accent/35"}`, children: [_jsxs("button", { type: "button", "aria-pressed": selected, onClick: () => toggleSecret(secret.id), className: "flex w-full cursor-pointer items-start gap-3 rounded-md px-3 py-2 text-left", children: [_jsx("span", { className: `mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded border ${selected
+                                                    ? "border-primary/60 bg-primary/10 text-primary"
+                                                    : "border-muted-foreground/35 text-transparent"}`, children: selected ? _jsx(IconCheck, { className: "h-3 w-3" }) : null }), _jsxs("span", { className: "min-w-0 flex-1", children: [_jsx("span", { className: "block truncate font-medium", children: secret.credentialKey }), _jsx("span", { className: "block truncate text-xs text-muted-foreground/70", children: selected
+                                                            ? "Will be requested for this app"
+                                                            : "Click to request" })] })] }), (secret.provider || secret.name) && (_jsxs("details", { className: "group/details border-t border-border/60 px-3 py-1.5 text-xs text-muted-foreground/75", children: [_jsxs("summary", { className: "flex cursor-pointer list-none items-center gap-1.5 text-[11px] hover:text-muted-foreground [&::-webkit-details-marker]:hidden", children: [_jsx(IconChevronDown, { className: "h-3 w-3 transition-transform group-open/details:rotate-180" }), "Details"] }), _jsxs("div", { className: "mt-1.5 space-y-1 pb-0.5 pl-4", children: [_jsxs("div", { className: "truncate", children: ["Provider: ", secret.provider || "Not specified"] }), _jsxs("div", { className: "truncate", children: ["Name: ", secret.name] })] })] }))] }, secret.id));
+                        })) }), _jsx("div", { className: "flex items-center justify-end gap-2", children: _jsxs(Button, { type: "button", size: "sm", onClick: submitWithSelectedKeys, disabled: !prompt.trim() || isSubmitting, children: [isSubmitting ? (_jsx(IconLoader2, { className: "h-3.5 w-3.5 animate-spin" })) : (_jsx(IconPlus, { className: "h-3.5 w-3.5" })), "Create app"] }) }), !prompt.trim() ? (_jsx("p", { className: "px-1 text-[11px] text-muted-foreground/70", children: "Add a prompt on the previous step before creating the app." })) : null] })), statusMessage ? (_jsxs("div", { className: "rounded-md border border-border bg-muted/40 px-3 py-2 text-xs text-muted-foreground", children: [statusMessage, branchUrl ? (_jsxs("a", { href: branchUrl, target: "_blank", rel: "noreferrer", className: "ml-2 inline-flex items-center gap-1 font-medium text-foreground underline", children: ["Open branch ", _jsx(IconArrowUpRight, { className: "h-3 w-3" })] })) : null] })) : null] }));
+}
+export function CreateAppPopover({ trigger, align = "center", }) {
+    const [open, setOpen] = useState(false);
+    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: trigger ?? (_jsx("button", { type: "button", className: "flex min-h-32 cursor-pointer items-center justify-center rounded-lg border border-dashed bg-card p-4 text-sm font-medium text-muted-foreground transition hover:border-foreground/30 hover:text-foreground", children: _jsxs("span", { className: "inline-flex items-center gap-2", children: [_jsx(IconPlus, { size: 16 }), "Create app"] }) })) }), _jsx(PopoverContent, { align: align, sideOffset: 10, className: "w-[calc(100vw-2rem)] rounded-xl p-3 shadow-xl sm:w-[460px]", children: _jsx(CreateAppFlow, { onClose: () => setOpen(false) }) })] }));
+}
+//# sourceMappingURL=create-app-popover.js.map

package/dist/components/create-app-popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-app-popover.js","sourceRoot":"","sources":["../../src/components/create-app-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useMemo, useState, type ReactNode } from \"react\";\nimport {\n  PromptComposer,\n  agentNativePath,\n  appBasePath,\n  isInBuilderFrame,\n  sendToAgentChat,\n  useDevMode,\n} from \"@agent-native/core/client\";\nimport { getWorkspaceAppIdValidationError } from \"@agent-native/core/shared\";\nimport {\n  IconArrowLeft,\n  IconArrowUpRight,\n  IconCheck,\n  IconChevronDown,\n  IconKey,\n  IconLoader2,\n  IconPlus,\n} from \"@tabler/icons-react\";\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"@/components/ui/popover\";\nimport { Button } from \"@/components/ui/button\";\n\ninterface VaultSecretOption {\n  id: string;\n  name: string;\n  credentialKey: string;\n  provider?: string | null;\n  description?: string | null;\n}\n\ninterface CreateAppPopoverProps {\n  /**\n   * Custom trigger element. Defaults to a dashed-border tile that matches the\n   * apps grid empty state.\n   */\n  trigger?: ReactNode;\n  /**\n   * Override the popover alignment. Defaults to \"center\" with a 10px offset.\n   */\n  align?: \"start\" | \"center\" | \"end\";\n}\n\nfunction slugify(value: string): string {\n  return value\n    .toLowerCase()\n    .replace(/[^a-z0-9]+/g, \"-\")\n    .replace(/^-+|-+$/g, \"\")\n    .replace(/^[^a-z]+/, \"\")\n    .slice(0, 48);\n}\n\nfunction titleFromPrompt(prompt: string): string {\n  const cleaned = prompt\n    .replace(/\\b(build|create|make|an?|the|app|tool|dashboard)\\b/gi, \" \")\n    .replace(/\\s+/g, \" \")\n    .trim();\n  return slugify(cleaned || \"new-app\") || \"new-app\";\n}\n\nfunction buildAppCreationPrompt(input: {\n  appId: string;\n  prompt: string;\n  selectedKeys: string[];\n}): string {\n  const keyList = input.selectedKeys.join(\", \");\n  const grantRequest = keyList\n    ? `Requested Dispatch vault key grants for this app: ${keyList}`\n    : `Requested Dispatch vault key grants for this app: none`;\n\n  return [\n    `Create a new agent-native app in this workspace.`,\n    ``,\n    `Suggested app name: ${input.appId} (you may adjust the slug if it conflicts)`,\n    `User prompt: ${input.prompt.trim()}`,\n    grantRequest,\n    ``,\n    `Pick a starter template that fits the user's prompt — analytics, calendar, content, design, dispatch, forms, mail, slides, videos, clips, or starter when none of the others fit.`,\n    `Use the workspace app layout: create it under apps/${input.appId}, mount it at /${input.appId}, keep it on the shared workspace database/hosting model, and avoid table-name collisions by namespacing any new domain tables to the app.`,\n    keyList\n      ? `After the app exists, grant the selected Dispatch vault keys to appId \"${input.appId}\" and sync them once the app server is available. Treat these as requested grants, not active grants before creation succeeds.`\n      : `Do not grant any Dispatch vault keys unless the user asks later.`,\n    ``,\n    `App readiness requirements before handing off:`,\n    `- Update the workspace app registry metadata for \"${input.appId}\" so Dispatch lists the app at /${input.appId} after merge/deploy.`,\n    `- Update the app manifest/package/deploy metadata needed by the existing workspace deployment model.`,\n    `- Verify the app's agent card/A2A metadata is ready so Dispatch can discover and delegate to the app after deployment.`,\n    `When it is ready, start or update the workspace dev server and navigate the user to /${input.appId}.`,\n  ].join(\"\\n\");\n}\n\nasync function fetchJson(url: string, init?: RequestInit): Promise<any> {\n  const res = await fetch(url, init);\n  const data = await res.json().catch(() => null);\n  if (!res.ok) {\n    throw new Error(\n      data?.error || data?.message || `Request failed ${res.status}`,\n    );\n  }\n  return data;\n}\n\nfunction defaultDispatchBasePath(): string | null {\n  const base = appBasePath();\n  if (base === \"/dispatch\") return null;\n  return null;\n}\n\nfunction actionUrl(basePath: string | null, action: string): string {\n  const path = `/_agent-native/actions/${action}`;\n  if (basePath === null) return agentNativePath(path);\n  const normalized = basePath.replace(/\\/+$/, \"\");\n  return `${normalized}${path}`;\n}\n\n/**\n * Inline two-step app-creation flow: prompt → optional key picker → submit.\n * Used both in the popover form and in the dedicated `/new-app` page so the\n * same UX shows up everywhere a teammate kicks off a new workspace app.\n */\nexport function CreateAppFlow({\n  onClose,\n  className = \"\",\n}: {\n  onClose?: () => void;\n  className?: string;\n}) {\n  const [step, setStep] = useState<\"prompt\" | \"keys\">(\"prompt\");\n  const [prompt, setPrompt] = useState(\"\");\n  const [selectedSecretIds, setSelectedSecretIds] = useState<string[]>([]);\n  const [secrets, setSecrets] = useState<VaultSecretOption[]>([]);\n  const [secretsError, setSecretsError] = useState<string | null>(null);\n  const [statusMessage, setStatusMessage] = useState<string | null>(null);\n  const [branchUrl, setBranchUrl] = useState<string | null>(null);\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const { isDevMode } = useDevMode();\n\n  const basePath = useMemo(() => defaultDispatchBasePath(), []);\n\n  // Fetch the vault keys eagerly so step 2 has them ready the moment the user\n  // taps \"Choose keys\" — no spinner, no pause between steps.\n  useEffect(() => {\n    let cancelled = false;\n    fetchJson(actionUrl(basePath, \"list-vault-secret-options\"))\n      .then((data) => {\n        if (cancelled) return;\n        setSecrets(Array.isArray(data) ? data : []);\n        setSecretsError(null);\n      })\n      .catch((err) => {\n        if (cancelled) return;\n        setSecrets([]);\n        setSecretsError(err?.message || \"Could not load Dispatch keys\");\n      });\n    return () => {\n      cancelled = true;\n    };\n  }, [basePath]);\n\n  const selectedSecrets = useMemo(\n    () => secrets.filter((s) => selectedSecretIds.includes(s.id)),\n    [secrets, selectedSecretIds],\n  );\n  const selectedSecretLabel =\n    selectedSecretIds.length === 0\n      ? \"no keys\"\n      : `${selectedSecretIds.length} key${selectedSecretIds.length === 1 ? \"\" : \"s\"}`;\n\n  function toggleSecret(id: string) {\n    setSelectedSecretIds((cur) =>\n      cur.includes(id) ? cur.filter((x) => x !== id) : [...cur, id],\n    );\n  }\n\n  async function submit(rawPrompt: string, selectedKeys: string[]) {\n    const trimmed = rawPrompt.trim();\n    if (!trimmed || isSubmitting) return;\n    const appId = titleFromPrompt(trimmed);\n    const validationError = getWorkspaceAppIdValidationError(appId);\n    if (validationError) {\n      setStatusMessage(validationError);\n      return;\n    }\n\n    const message = buildAppCreationPrompt({\n      appId,\n      prompt: trimmed,\n      selectedKeys,\n    });\n    setIsSubmitting(true);\n    setStatusMessage(null);\n    setBranchUrl(null);\n\n    try {\n      if (isInBuilderFrame()) {\n        sendToAgentChat({ message, submit: true, type: \"code\" });\n        setStatusMessage(\"Sent to Builder chat.\");\n        onClose?.();\n      } else if (isDevMode) {\n        sendToAgentChat({ message, submit: true, type: \"code\", newTab: true });\n        setStatusMessage(\"Sent to the local agent.\");\n        onClose?.();\n      } else {\n        const result = await fetchJson(\n          actionUrl(basePath, \"start-workspace-app-creation\"),\n          {\n            method: \"POST\",\n            headers: { \"Content-Type\": \"application/json\" },\n            body: JSON.stringify({\n              prompt: trimmed,\n              appId,\n              secretIds: selectedKeys.length > 0 ? selectedSecretIds : [],\n            }),\n          },\n        );\n        if (result?.mode === \"builder\") {\n          setBranchUrl(result?.url || null);\n          setStatusMessage(\"Builder branch created.\");\n        } else {\n          setStatusMessage(\n            result?.message ||\n              \"Builder app creation is coming soon. Open this workspace in Builder to create an app from this prompt.\",\n          );\n        }\n      }\n    } catch (err: any) {\n      setStatusMessage(err?.message || \"Could not start the new app flow.\");\n    } finally {\n      setIsSubmitting(false);\n    }\n  }\n\n  const submitWithSelectedKeys = () =>\n    submit(\n      prompt,\n      selectedSecrets.map((s) => s.credentialKey),\n    );\n\n  return (\n    <div className={`flex flex-col gap-3 ${className}`}>\n      {step === \"prompt\" ? (\n        <>\n          <div className=\"flex items-center justify-between gap-2 px-1\">\n            <p className=\"text-sm font-semibold text-foreground\">Create app</p>\n            <button\n              type=\"button\"\n              onClick={() => setStep(\"keys\")}\n              className=\"inline-flex cursor-pointer items-center gap-1 rounded-md border border-border bg-background/40 px-2 py-1 text-[11px] text-muted-foreground hover:text-foreground hover:bg-accent/50\"\n            >\n              <IconKey size={11} />\n              {selectedSecretLabel}\n            </button>\n          </div>\n          <PromptComposer\n            autoFocus\n            disabled={isSubmitting}\n            placeholder=\"Describe the app your teammate should be able to use...\"\n            draftScope=\"dispatch:create-app\"\n            onSubmit={(text) => {\n              setPrompt(text);\n              submit(\n                text,\n                selectedSecrets.map((s) => s.credentialKey),\n              );\n            }}\n          />\n        </>\n      ) : (\n        <>\n          <div className=\"flex items-center justify-between gap-2 px-1\">\n            <button\n              type=\"button\"\n              onClick={() => setStep(\"prompt\")}\n              className=\"inline-flex cursor-pointer items-center gap-1 text-xs text-muted-foreground hover:text-foreground\"\n            >\n              <IconArrowLeft size={12} />\n              Back\n            </button>\n            <span className=\"text-[11px] text-muted-foreground/70\">\n              {selectedSecretLabel} selected\n            </span>\n          </div>\n          <div className=\"max-h-[340px] space-y-2 overflow-y-auto rounded-md border border-border bg-card p-2\">\n            {secretsError ? (\n              <p className=\"rounded-md border border-dashed border-border px-3 py-3 text-xs text-muted-foreground\">\n                {secretsError}\n              </p>\n            ) : secrets.length === 0 ? (\n              <p className=\"rounded-md border border-dashed border-border px-3 py-3 text-xs text-muted-foreground\">\n                No Dispatch vault keys found yet.\n              </p>\n            ) : (\n              secrets.map((secret) => {\n                const selected = selectedSecretIds.includes(secret.id);\n                return (\n                  <div\n                    key={secret.id}\n                    className={`group rounded-md border text-sm ${\n                      selected\n                        ? \"border-primary/45 bg-primary/5\"\n                        : \"border-border hover:border-muted-foreground/40 hover:bg-accent/35\"\n                    }`}\n                  >\n                    <button\n                      type=\"button\"\n                      aria-pressed={selected}\n                      onClick={() => toggleSecret(secret.id)}\n                      className=\"flex w-full cursor-pointer items-start gap-3 rounded-md px-3 py-2 text-left\"\n                    >\n                      <span\n                        className={`mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded border ${\n                          selected\n                            ? \"border-primary/60 bg-primary/10 text-primary\"\n                            : \"border-muted-foreground/35 text-transparent\"\n                        }`}\n                      >\n                        {selected ? <IconCheck className=\"h-3 w-3\" /> : null}\n                      </span>\n                      <span className=\"min-w-0 flex-1\">\n                        <span className=\"block truncate font-medium\">\n                          {secret.credentialKey}\n                        </span>\n                        <span className=\"block truncate text-xs text-muted-foreground/70\">\n                          {selected\n                            ? \"Will be requested for this app\"\n                            : \"Click to request\"}\n                        </span>\n                      </span>\n                    </button>\n                    {(secret.provider || secret.name) && (\n                      <details className=\"group/details border-t border-border/60 px-3 py-1.5 text-xs text-muted-foreground/75\">\n                        <summary className=\"flex cursor-pointer list-none items-center gap-1.5 text-[11px] hover:text-muted-foreground [&::-webkit-details-marker]:hidden\">\n                          <IconChevronDown className=\"h-3 w-3 transition-transform group-open/details:rotate-180\" />\n                          Details\n                        </summary>\n                        <div className=\"mt-1.5 space-y-1 pb-0.5 pl-4\">\n                          <div className=\"truncate\">\n                            Provider: {secret.provider || \"Not specified\"}\n                          </div>\n                          <div className=\"truncate\">Name: {secret.name}</div>\n                        </div>\n                      </details>\n                    )}\n                  </div>\n                );\n              })\n            )}\n          </div>\n          <div className=\"flex items-center justify-end gap-2\">\n            <Button\n              type=\"button\"\n              size=\"sm\"\n              onClick={submitWithSelectedKeys}\n              disabled={!prompt.trim() || isSubmitting}\n            >\n              {isSubmitting ? (\n                <IconLoader2 className=\"h-3.5 w-3.5 animate-spin\" />\n              ) : (\n                <IconPlus className=\"h-3.5 w-3.5\" />\n              )}\n              Create app\n            </Button>\n          </div>\n          {!prompt.trim() ? (\n            <p className=\"px-1 text-[11px] text-muted-foreground/70\">\n              Add a prompt on the previous step before creating the app.\n            </p>\n          ) : null}\n        </>\n      )}\n\n      {statusMessage ? (\n        <div className=\"rounded-md border border-border bg-muted/40 px-3 py-2 text-xs text-muted-foreground\">\n          {statusMessage}\n          {branchUrl ? (\n            <a\n              href={branchUrl}\n              target=\"_blank\"\n              rel=\"noreferrer\"\n              className=\"ml-2 inline-flex items-center gap-1 font-medium text-foreground underline\"\n            >\n              Open branch <IconArrowUpRight className=\"h-3 w-3\" />\n            </a>\n          ) : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nexport function CreateAppPopover({\n  trigger,\n  align = \"center\",\n}: CreateAppPopoverProps) {\n  const [open, setOpen] = useState(false);\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        {trigger ?? (\n          <button\n            type=\"button\"\n            className=\"flex min-h-32 cursor-pointer items-center justify-center rounded-lg border border-dashed bg-card p-4 text-sm font-medium text-muted-foreground transition hover:border-foreground/30 hover:text-foreground\"\n          >\n            <span className=\"inline-flex items-center gap-2\">\n              <IconPlus size={16} />\n              Create app\n            </span>\n          </button>\n        )}\n      </PopoverTrigger>\n      <PopoverContent\n        align={align}\n        sideOffset={10}\n        className=\"w-[calc(100vw-2rem)] rounded-xl p-3 shadow-xl sm:w-[460px]\"\n      >\n        <CreateAppFlow onClose={() => setOpen(false)} />\n      </PopoverContent>\n    </Popover>\n  );\n}\n"]}

package/dist/components/dispatch-shell.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from "react";
+/**
+ * DispatchShell renders the per-page title (with optional description tooltip)
+ * into the global header via the HeaderActions store. The actual chrome
+ * (sidebar, AgentSidebar, header bar with AgentToggleButton) is provided by
+ * `Layout` mounted in `root.tsx`.
+ */
+export declare function DispatchShell({ title, description, children, }: {
+    title: string;
+    description?: string;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=dispatch-shell.d.ts.map

package/dist/components/dispatch-shell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dispatch-shell.d.ts","sourceRoot":"","sources":["../../src/components/dispatch-shell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASvC;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,WAAW,EACX,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;CACrB,2CA6BA"}

package/dist/components/dispatch-shell.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Tooltip, TooltipContent, TooltipTrigger, } from "../components/ui/tooltip";
+import { IconInfoCircle } from "@tabler/icons-react";
+import { useSetPageTitle } from "../components/layout/HeaderActions";
+/**
+ * DispatchShell renders the per-page title (with optional description tooltip)
+ * into the global header via the HeaderActions store. The actual chrome
+ * (sidebar, AgentSidebar, header bar with AgentToggleButton) is provided by
+ * `Layout` mounted in `root.tsx`.
+ */
+export function DispatchShell({ title, description, children, }) {
+    useSetPageTitle(_jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [_jsx("h1", { className: "text-lg font-semibold tracking-tight truncate text-foreground", children: title }), description ? (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", className: "text-muted-foreground/60 hover:text-foreground cursor-pointer", "aria-label": `About ${title}`, children: _jsx(IconInfoCircle, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { side: "bottom", className: "max-w-72 text-xs leading-relaxed", children: description })] })) : null] }));
+    return _jsx(_Fragment, { children: children });
+}
+//# sourceMappingURL=dispatch-shell.js.map

package/dist/components/dispatch-shell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dispatch-shell.js","sourceRoot":"","sources":["../../src/components/dispatch-shell.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,OAAO,EACP,cAAc,EACd,cAAc,GACf,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AAEpE;;;;;GAKG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,KAAK,EACL,WAAW,EACX,QAAQ,GAKT;IACC,eAAe,CACb,eAAK,SAAS,EAAC,iCAAiC,aAC9C,aAAI,SAAS,EAAC,+DAA+D,YAC1E,KAAK,GACH,EACJ,WAAW,CAAC,CAAC,CAAC,CACb,MAAC,OAAO,eACN,KAAC,cAAc,IAAC,OAAO,kBACrB,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,+DAA+D,gBAC7D,SAAS,KAAK,EAAE,YAE5B,KAAC,cAAc,IAAC,SAAS,EAAC,aAAa,GAAG,GACnC,GACM,EACjB,KAAC,cAAc,IACb,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,kCAAkC,YAE3C,WAAW,GACG,IACT,CACX,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC;IAEF,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,CAAC","sourcesContent":["import { type ReactNode } from \"react\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipTrigger,\n} from \"@/components/ui/tooltip\";\nimport { IconInfoCircle } from \"@tabler/icons-react\";\nimport { useSetPageTitle } from \"@/components/layout/HeaderActions\";\n\n/**\n * DispatchShell renders the per-page title (with optional description tooltip)\n * into the global header via the HeaderActions store. The actual chrome\n * (sidebar, AgentSidebar, header bar with AgentToggleButton) is provided by\n * `Layout` mounted in `root.tsx`.\n */\nexport function DispatchShell({\n  title,\n  description,\n  children,\n}: {\n  title: string;\n  description?: string;\n  children: ReactNode;\n}) {\n  useSetPageTitle(\n    <div className=\"flex items-center gap-2 min-w-0\">\n      <h1 className=\"text-lg font-semibold tracking-tight truncate text-foreground\">\n        {title}\n      </h1>\n      {description ? (\n        <Tooltip>\n          <TooltipTrigger asChild>\n            <button\n              type=\"button\"\n              className=\"text-muted-foreground/60 hover:text-foreground cursor-pointer\"\n              aria-label={`About ${title}`}\n            >\n              <IconInfoCircle className=\"h-3.5 w-3.5\" />\n            </button>\n          </TooltipTrigger>\n          <TooltipContent\n            side=\"bottom\"\n            className=\"max-w-72 text-xs leading-relaxed\"\n          >\n            {description}\n          </TooltipContent>\n        </Tooltip>\n      ) : null}\n    </div>,\n  );\n\n  return <>{children}</>;\n}\n"]}

package/dist/components/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Public dispatch UI components. Most consumers only use `dispatchRoutes`
+ * and never import from here directly — components are exported as a
+ * customization escape hatch for embedding (e.g. mount `<DispatchShell>`
+ * inside a parent layout, or render `<AppKeysPopover>` next to a custom
+ * card list).
+ */
+export { DispatchShell } from "./dispatch-shell.js";
+export { Layout, NavContent } from "./layout/Layout.js";
+export { CreateAppPopover, CreateAppFlow } from "./create-app-popover.js";
+export { AppKeysPopover } from "./app-keys-popover.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC"}

package/dist/components/index.js

@@ -0,0 +1,12 @@
+/**
+ * Public dispatch UI components. Most consumers only use `dispatchRoutes`
+ * and never import from here directly — components are exported as a
+ * customization escape hatch for embedding (e.g. mount `<DispatchShell>`
+ * inside a parent layout, or render `<AppKeysPopover>` next to a custom
+ * card list).
+ */
+export { DispatchShell } from "./dispatch-shell.js";
+export { Layout, NavContent } from "./layout/Layout.js";
+export { CreateAppPopover, CreateAppFlow } from "./create-app-popover.js";
+export { AppKeysPopover } from "./app-keys-popover.js";
+//# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC","sourcesContent":["/**\n * Public dispatch UI components. Most consumers only use `dispatchRoutes`\n * and never import from here directly — components are exported as a\n * customization escape hatch for embedding (e.g. mount `<DispatchShell>`\n * inside a parent layout, or render `<AppKeysPopover>` next to a custom\n * card list).\n */\nexport { DispatchShell } from \"./dispatch-shell.js\";\nexport { Layout, NavContent } from \"./layout/Layout.js\";\nexport { CreateAppPopover, CreateAppFlow } from \"./create-app-popover.js\";\nexport { AppKeysPopover } from \"./app-keys-popover.js\";\n"]}

package/dist/components/layout/Header.d.ts

@@ -0,0 +1,5 @@
+export declare function Header({ onOpenMobile, showAgentToggle, }: {
+    onOpenMobile?: () => void;
+    showAgentToggle?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Header.d.ts.map

package/dist/components/layout/Header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../src/components/layout/Header.tsx"],"names":[],"mappings":"AA6BA,wBAAgB,MAAM,CAAC,EACrB,YAAY,EACZ,eAAsB,GACvB,EAAE;IACD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,2CAiCA"}

package/dist/components/layout/Header.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLocation } from "react-router";
+import { useHeaderTitle, useHeaderActions } from "./HeaderActions";
+import { AgentToggleButton } from "@agent-native/core/client";
+import { Button } from "../../components/ui/button";
+import { IconLayoutSidebar } from "@tabler/icons-react";
+const pageTitles = {
+    "/": "Overview",
+    "/overview": "Overview",
+    "/vault": "Vault",
+    "/integrations": "Integrations",
+    "/workspace": "Resources",
+    "/messaging": "Messaging",
+    "/agents": "Agents",
+    "/destinations": "Destinations",
+    "/identities": "Identities",
+    "/approvals": "Approvals",
+    "/audit": "Audit",
+    "/team": "Team",
+};
+function resolveTitle(pathname) {
+    if (pageTitles[pathname])
+        return pageTitles[pathname];
+    if (pathname.startsWith("/tools"))
+        return "Tools";
+    return "Dispatch";
+}
+export function Header({ onOpenMobile, showAgentToggle = true, }) {
+    const location = useLocation();
+    const title = useHeaderTitle();
+    const actions = useHeaderActions();
+    return (_jsxs("header", { className: "flex h-12 shrink-0 items-center gap-3 border-b border-border bg-background px-4 lg:px-6", children: [onOpenMobile ? (_jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 2xl:hidden cursor-pointer", onClick: onOpenMobile, "aria-label": "Open navigation", children: _jsx(IconLayoutSidebar, {}) })) : null, _jsx("div", { className: "flex items-center gap-3 flex-1 min-w-0", children: title ?? (_jsx("h1", { className: "text-lg font-semibold tracking-tight truncate", children: resolveTitle(location.pathname) })) }), _jsxs("div", { className: "flex items-center gap-2 shrink-0", children: [actions, showAgentToggle ? (_jsx(AgentToggleButton, { className: "h-8 w-8 rounded-md hover:bg-accent" })) : null] })] }));
+}
+//# sourceMappingURL=Header.js.map

package/dist/components/layout/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../src/components/layout/Header.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,MAAM,UAAU,GAA2B;IACzC,GAAG,EAAE,UAAU;IACf,WAAW,EAAE,UAAU;IACvB,QAAQ,EAAE,OAAO;IACjB,eAAe,EAAE,cAAc;IAC/B,YAAY,EAAE,WAAW;IACzB,YAAY,EAAE,WAAW;IACzB,SAAS,EAAE,QAAQ;IACnB,eAAe,EAAE,cAAc;IAC/B,aAAa,EAAE,YAAY;IAC3B,YAAY,EAAE,WAAW;IACzB,QAAQ,EAAE,OAAO;IACjB,OAAO,EAAE,MAAM;CAChB,CAAC;AAEF,SAAS,YAAY,CAAC,QAAgB;IACpC,IAAI,UAAU,CAAC,QAAQ,CAAC;QAAE,OAAO,UAAU,CAAC,QAAQ,CAAC,CAAC;IAEtD,IAAI,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC;QAAE,OAAO,OAAO,CAAC;IAElD,OAAO,UAAU,CAAC;AACpB,CAAC;AAED,MAAM,UAAU,MAAM,CAAC,EACrB,YAAY,EACZ,eAAe,GAAG,IAAI,GAIvB;IACC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,KAAK,GAAG,cAAc,EAAE,CAAC;IAC/B,MAAM,OAAO,GAAG,gBAAgB,EAAE,CAAC;IAEnC,OAAO,CACL,kBAAQ,SAAS,EAAC,yFAAyF,aACxG,YAAY,CAAC,CAAC,CAAC,CACd,KAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,mCAAmC,EAC7C,OAAO,EAAE,YAAY,gBACV,iBAAiB,YAE5B,KAAC,iBAAiB,KAAG,GACd,CACV,CAAC,CAAC,CAAC,IAAI,EACR,cAAK,SAAS,EAAC,wCAAwC,YACpD,KAAK,IAAI,CACR,aAAI,SAAS,EAAC,+CAA+C,YAC1D,YAAY,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAC7B,CACN,GACG,EACN,eAAK,SAAS,EAAC,kCAAkC,aAC9C,OAAO,EACP,eAAe,CAAC,CAAC,CAAC,CACjB,KAAC,iBAAiB,IAAC,SAAS,EAAC,oCAAoC,GAAG,CACrE,CAAC,CAAC,CAAC,IAAI,IACJ,IACC,CACV,CAAC;AACJ,CAAC","sourcesContent":["import { useLocation } from \"react-router\";\nimport { useHeaderTitle, useHeaderActions } from \"./HeaderActions\";\nimport { AgentToggleButton } from \"@agent-native/core/client\";\nimport { Button } from \"@/components/ui/button\";\nimport { IconLayoutSidebar } from \"@tabler/icons-react\";\n\nconst pageTitles: Record<string, string> = {\n  \"/\": \"Overview\",\n  \"/overview\": \"Overview\",\n  \"/vault\": \"Vault\",\n  \"/integrations\": \"Integrations\",\n  \"/workspace\": \"Resources\",\n  \"/messaging\": \"Messaging\",\n  \"/agents\": \"Agents\",\n  \"/destinations\": \"Destinations\",\n  \"/identities\": \"Identities\",\n  \"/approvals\": \"Approvals\",\n  \"/audit\": \"Audit\",\n  \"/team\": \"Team\",\n};\n\nfunction resolveTitle(pathname: string): string {\n  if (pageTitles[pathname]) return pageTitles[pathname];\n\n  if (pathname.startsWith(\"/tools\")) return \"Tools\";\n\n  return \"Dispatch\";\n}\n\nexport function Header({\n  onOpenMobile,\n  showAgentToggle = true,\n}: {\n  onOpenMobile?: () => void;\n  showAgentToggle?: boolean;\n}) {\n  const location = useLocation();\n  const title = useHeaderTitle();\n  const actions = useHeaderActions();\n\n  return (\n    <header className=\"flex h-12 shrink-0 items-center gap-3 border-b border-border bg-background px-4 lg:px-6\">\n      {onOpenMobile ? (\n        <Button\n          variant=\"ghost\"\n          size=\"icon\"\n          className=\"h-8 w-8 2xl:hidden cursor-pointer\"\n          onClick={onOpenMobile}\n          aria-label=\"Open navigation\"\n        >\n          <IconLayoutSidebar />\n        </Button>\n      ) : null}\n      <div className=\"flex items-center gap-3 flex-1 min-w-0\">\n        {title ?? (\n          <h1 className=\"text-lg font-semibold tracking-tight truncate\">\n            {resolveTitle(location.pathname)}\n          </h1>\n        )}\n      </div>\n      <div className=\"flex items-center gap-2 shrink-0\">\n        {actions}\n        {showAgentToggle ? (\n          <AgentToggleButton className=\"h-8 w-8 rounded-md hover:bg-accent\" />\n        ) : null}\n      </div>\n    </header>\n  );\n}\n"]}

package/dist/components/layout/HeaderActions.d.ts

@@ -0,0 +1,18 @@
+import { type ReactNode, type FC } from "react";
+/** Consumed only by <Header /> — returns the current title. */
+export declare function useHeaderTitle(): ReactNode;
+/** Consumed only by <Header /> — returns the current actions slot. */
+export declare function useHeaderActions(): ReactNode;
+/**
+ * Provider is now a no-op wrapper for backwards compatibility — the state
+ * lives in the module-level store above. Kept as a component so callers of
+ * <HeaderActionsProvider> don't need to change.
+ */
+export declare const HeaderActionsProvider: FC<{
+    children: ReactNode;
+}>;
+/** Mount a custom title into the app header. Cleans up on unmount. */
+export declare function useSetPageTitle(node: ReactNode): void;
+/** Mount ReactNode into the header's actions slot. Cleans up on unmount. */
+export declare function useSetHeaderActions(node: ReactNode): void;
+//# sourceMappingURL=HeaderActions.d.ts.map

package/dist/components/layout/HeaderActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderActions.d.ts","sourceRoot":"","sources":["../../../src/components/layout/HeaderActions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,SAAS,EACd,KAAK,EAAE,EACR,MAAM,OAAO,CAAC;AA6Bf,+DAA+D;AAC/D,wBAAgB,cAAc,IAAI,SAAS,CAM1C;AAED,sEAAsE;AACtE,wBAAgB,gBAAgB,IAAI,SAAS,CAM5C;AAED;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,CAEzC,CAAC;AAEtB,sEAAsE;AACtE,wBAAgB,eAAe,CAAC,IAAI,EAAE,SAAS,QAS9C;AAED,4EAA4E;AAC5E,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,SAAS,QASlD"}

package/dist/components/layout/HeaderActions.js

@@ -0,0 +1,52 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useSyncExternalStore, } from "react";
+let currentTitle = null;
+let currentActions = null;
+const listeners = new Set();
+function notify() {
+    for (const l of listeners)
+        l();
+}
+function subscribe(l) {
+    listeners.add(l);
+    return () => {
+        listeners.delete(l);
+    };
+}
+/** Consumed only by <Header /> — returns the current title. */
+export function useHeaderTitle() {
+    return useSyncExternalStore(subscribe, () => currentTitle, () => currentTitle);
+}
+/** Consumed only by <Header /> — returns the current actions slot. */
+export function useHeaderActions() {
+    return useSyncExternalStore(subscribe, () => currentActions, () => currentActions);
+}
+/**
+ * Provider is now a no-op wrapper for backwards compatibility — the state
+ * lives in the module-level store above. Kept as a component so callers of
+ * <HeaderActionsProvider> don't need to change.
+ */
+export const HeaderActionsProvider = ({ children, }) => _jsx(_Fragment, { children: children });
+/** Mount a custom title into the app header. Cleans up on unmount. */
+export function useSetPageTitle(node) {
+    useEffect(() => {
+        currentTitle = node;
+        notify();
+        return () => {
+            currentTitle = null;
+            notify();
+        };
+    });
+}
+/** Mount ReactNode into the header's actions slot. Cleans up on unmount. */
+export function useSetHeaderActions(node) {
+    useEffect(() => {
+        currentActions = node;
+        notify();
+        return () => {
+            currentActions = null;
+            notify();
+        };
+    });
+}
+//# sourceMappingURL=HeaderActions.js.map

package/dist/components/layout/HeaderActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderActions.js","sourceRoot":"","sources":["../../../src/components/layout/HeaderActions.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,SAAS,EACT,oBAAoB,GAGrB,MAAM,OAAO,CAAC;AAcf,IAAI,YAAY,GAAc,IAAI,CAAC;AACnC,IAAI,cAAc,GAAc,IAAI,CAAC;AACrC,MAAM,SAAS,GAAG,IAAI,GAAG,EAAY,CAAC;AAEtC,SAAS,MAAM;IACb,KAAK,MAAM,CAAC,IAAI,SAAS;QAAE,CAAC,EAAE,CAAC;AACjC,CAAC;AAED,SAAS,SAAS,CAAC,CAAW;IAC5B,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;IACjB,OAAO,GAAG,EAAE;QACV,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC,CAAC;AACJ,CAAC;AAED,+DAA+D;AAC/D,MAAM,UAAU,cAAc;IAC5B,OAAO,oBAAoB,CACzB,SAAS,EACT,GAAG,EAAE,CAAC,YAAY,EAClB,GAAG,EAAE,CAAC,YAAY,CACnB,CAAC;AACJ,CAAC;AAED,sEAAsE;AACtE,MAAM,UAAU,gBAAgB;IAC9B,OAAO,oBAAoB,CACzB,SAAS,EACT,GAAG,EAAE,CAAC,cAAc,EACpB,GAAG,EAAE,CAAC,cAAc,CACrB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAgC,CAAC,EACjE,QAAQ,GACT,EAAE,EAAE,CAAC,4BAAG,QAAQ,GAAI,CAAC;AAEtB,sEAAsE;AACtE,MAAM,UAAU,eAAe,CAAC,IAAe;IAC7C,SAAS,CAAC,GAAG,EAAE;QACb,YAAY,GAAG,IAAI,CAAC;QACpB,MAAM,EAAE,CAAC;QACT,OAAO,GAAG,EAAE;YACV,YAAY,GAAG,IAAI,CAAC;YACpB,MAAM,EAAE,CAAC;QACX,CAAC,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC;AAED,4EAA4E;AAC5E,MAAM,UAAU,mBAAmB,CAAC,IAAe;IACjD,SAAS,CAAC,GAAG,EAAE;QACb,cAAc,GAAG,IAAI,CAAC;QACtB,MAAM,EAAE,CAAC;QACT,OAAO,GAAG,EAAE;YACV,cAAc,GAAG,IAAI,CAAC;YACtB,MAAM,EAAE,CAAC;QACX,CAAC,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC","sourcesContent":["import {\n  useEffect,\n  useSyncExternalStore,\n  type ReactNode,\n  type FC,\n} from \"react\";\n\n/**\n * External store for the page's header title + actions. We use an external\n * store (not React context) so that pages can inject ReactNode without\n * subscribing to the header state themselves — subscribing would trigger a\n * re-render on every update, which in turn creates new JSX, which updates\n * the store again, which re-renders… an infinite loop.\n *\n * Only <Header /> reads the store via useSyncExternalStore; pages only write.\n */\n\ntype Listener = () => void;\n\nlet currentTitle: ReactNode = null;\nlet currentActions: ReactNode = null;\nconst listeners = new Set<Listener>();\n\nfunction notify() {\n  for (const l of listeners) l();\n}\n\nfunction subscribe(l: Listener): () => void {\n  listeners.add(l);\n  return () => {\n    listeners.delete(l);\n  };\n}\n\n/** Consumed only by <Header /> — returns the current title. */\nexport function useHeaderTitle(): ReactNode {\n  return useSyncExternalStore(\n    subscribe,\n    () => currentTitle,\n    () => currentTitle,\n  );\n}\n\n/** Consumed only by <Header /> — returns the current actions slot. */\nexport function useHeaderActions(): ReactNode {\n  return useSyncExternalStore(\n    subscribe,\n    () => currentActions,\n    () => currentActions,\n  );\n}\n\n/**\n * Provider is now a no-op wrapper for backwards compatibility — the state\n * lives in the module-level store above. Kept as a component so callers of\n * <HeaderActionsProvider> don't need to change.\n */\nexport const HeaderActionsProvider: FC<{ children: ReactNode }> = ({\n  children,\n}) => <>{children}</>;\n\n/** Mount a custom title into the app header. Cleans up on unmount. */\nexport function useSetPageTitle(node: ReactNode) {\n  useEffect(() => {\n    currentTitle = node;\n    notify();\n    return () => {\n      currentTitle = null;\n      notify();\n    };\n  });\n}\n\n/** Mount ReactNode into the header's actions slot. Cleans up on unmount. */\nexport function useSetHeaderActions(node: ReactNode) {\n  useEffect(() => {\n    currentActions = node;\n    notify();\n    return () => {\n      currentActions = null;\n      notify();\n    };\n  });\n}\n"]}

package/dist/components/layout/Layout.d.ts

@@ -0,0 +1,8 @@
+import { type ReactNode } from "react";
+export declare function NavContent({ onNavigate }: {
+    onNavigate?: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function Layout({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Layout.d.ts.map

package/dist/components/layout/Layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../../../src/components/layout/Layout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AA+EjD,wBAAgB,UAAU,CAAC,EAAE,UAAU,EAAE,EAAE;IAAE,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,2CA2FrE;AAED,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAsE3D"}

package/dist/components/layout/Layout.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import { NavLink, useLocation } from "react-router";
+import { AgentSidebar, FeedbackButton, appPath, useActionQuery, } from "@agent-native/core/client";
+import { InvitationBanner } from "@agent-native/core/client/org";
+import { ToolsSidebarSection } from "@agent-native/core/client/tools";
+import { IconArrowUpRight, IconApps, IconBrandTelegram, IconKey, IconChevronDown, IconLayersSubtract, IconPlugConnected, IconBroadcast, IconFingerprint, IconHistory, IconPuzzle, IconShieldCheck, IconUsersGroup, } from "@tabler/icons-react";
+import { cn } from "../../lib/utils";
+import { Sheet, SheetContent, SheetDescription, SheetTitle, } from "../../components/ui/sheet";
+import { Header } from "./Header";
+import { HeaderActionsProvider } from "./HeaderActions";
+const PRIMARY_NAV_ITEMS = [
+    { to: "/overview", label: "Overview", icon: IconBroadcast },
+    { to: "/apps", label: "Apps", icon: IconApps },
+    { to: "/vault", label: "Vault", icon: IconKey },
+    { to: "/integrations", label: "Integrations", icon: IconPuzzle },
+    { to: "/agents", label: "Agents", icon: IconPlugConnected },
+];
+const OPERATIONS_NAV_ITEMS = [
+    { to: "/workspace", label: "Resources", icon: IconLayersSubtract },
+    { to: "/messaging", label: "Messaging", icon: IconBrandTelegram },
+    { to: "/destinations", label: "Destinations", icon: IconArrowUpRight },
+    { to: "/identities", label: "Identities", icon: IconFingerprint },
+    { to: "/approvals", label: "Approvals", icon: IconShieldCheck },
+    { to: "/audit", label: "Audit", icon: IconHistory },
+    { to: "/team", label: "Team", icon: IconUsersGroup },
+];
+const SIDEBAR_SUGGESTIONS = [
+    "Create a new app",
+    "Grant a key to an app",
+    "Check integration health",
+];
+const CHROMELESS_PATHS = ["/approval"];
+// Routes whose page renders its own toolbar (with NotificationsBell + AgentToggleButton).
+// Layout still mounts the sidebar + AgentSidebar, but skips its own Header so
+// there's no double-header.
+function pageOwnsToolbar(pathname) {
+    if (pathname === "/tools" || pathname.startsWith("/tools/"))
+        return true;
+    return false;
+}
+export function NavContent({ onNavigate }) {
+    const location = useLocation();
+    const { data: workspace } = useActionQuery("get-workspace-info", {}, { staleTime: 60_000 });
+    const ws = workspace;
+    const workspaceLabel = ws?.displayName ?? ws?.name ?? null;
+    const operationsOpen = OPERATIONS_NAV_ITEMS.some((item) => location.pathname === item.to ||
+        location.pathname.startsWith(`${item.to}/`));
+    const renderNavItem = (item) => {
+        const Icon = item.icon;
+        return (_jsx("li", { children: _jsxs(NavLink, { to: item.to, onClick: onNavigate, className: ({ isActive }) => cn("flex h-8 w-full items-center gap-2 rounded-md px-2 text-sm", isActive
+                    ? "bg-sidebar-accent font-medium text-sidebar-accent-foreground"
+                    : "text-sidebar-foreground/70 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground"), children: [_jsx(Icon, { size: 16, className: "shrink-0" }), _jsx("span", { className: "truncate", children: item.label })] }) }, item.to));
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "border-b px-4 py-3", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("div", { className: "flex h-9 w-9 items-center justify-center rounded-xl border bg-card text-foreground", children: [_jsx("img", { src: appPath("/agent-native-icon-light.svg"), alt: "", "aria-hidden": "true", className: "block h-4 w-auto shrink-0 dark:hidden" }), _jsx("img", { src: appPath("/agent-native-icon-dark.svg"), alt: "", "aria-hidden": "true", className: "hidden h-4 w-auto shrink-0 dark:block" })] }), _jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "truncate text-sm font-semibold text-foreground", children: workspaceLabel ?? "Dispatch" }), _jsx("div", { className: "truncate text-xs text-muted-foreground", children: workspaceLabel
+                                        ? `Workspace · ${ws?.appCount ?? 0} app${ws?.appCount === 1 ? "" : "s"}`
+                                        : "Workspace control plane" })] })] }) }), _jsxs("nav", { className: "flex-1 overflow-y-auto px-2 py-3", children: [_jsx("ul", { className: "space-y-0.5", children: PRIMARY_NAV_ITEMS.map(renderNavItem) }), _jsxs("details", { className: "group mt-4", open: operationsOpen, children: [_jsxs("summary", { className: "flex h-8 cursor-pointer list-none items-center justify-between rounded-md px-2 text-xs font-medium uppercase text-sidebar-foreground/50 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground [&::-webkit-details-marker]:hidden", children: [_jsx("span", { children: "Operations" }), _jsx(IconChevronDown, { size: 14, className: "transition-transform group-open:rotate-180" })] }), _jsx("ul", { className: "mt-1 space-y-0.5", children: OPERATIONS_NAV_ITEMS.map(renderNavItem) })] })] }), _jsxs("div", { className: "border-t px-2 py-2", children: [_jsx(ToolsSidebarSection, {}), _jsx(FeedbackButton, {})] })] }));
+}
+export function Layout({ children }) {
+    const location = useLocation();
+    const [mobileOpen, setMobileOpen] = useState(false);
+    const hasEmbeddedAgentChat = location.pathname === "/" || location.pathname === "/overview";
+    if (CHROMELESS_PATHS.some((path) => location.pathname === path)) {
+        return _jsx(_Fragment, { children: children });
+    }
+    const showHeader = !pageOwnsToolbar(location.pathname);
+    const appContent = (_jsxs("div", { className: "flex h-full flex-1 flex-col overflow-hidden", children: [showHeader ? (_jsx(Header, { onOpenMobile: () => setMobileOpen(true), showAgentToggle: !hasEmbeddedAgentChat })) : null, _jsx(InvitationBanner, {}), _jsx("main", { className: "flex-1 overflow-y-auto", children: showHeader ? (_jsx("div", { className: "mx-auto max-w-7xl space-y-5 px-4 py-6 sm:px-6", children: children })) : (children) })] }));
+    return (_jsx(HeaderActionsProvider, { children: _jsxs("div", { className: "flex h-screen w-full overflow-hidden bg-background", children: [_jsx("aside", { className: "hidden 2xl:flex w-64 shrink-0 flex-col border-r bg-sidebar text-sidebar-foreground", children: _jsx(NavContent, {}) }), _jsx(Sheet, { open: mobileOpen, onOpenChange: setMobileOpen, children: _jsxs(SheetContent, { side: "left", className: "w-72 p-0 bg-sidebar text-sidebar-foreground [&>button]:hidden", children: [_jsx(SheetTitle, { className: "sr-only", children: "Navigation" }), _jsx(SheetDescription, { className: "sr-only", children: "Workspace navigation links" }), _jsx("div", { className: "flex h-full w-full flex-col", children: _jsx(NavContent, { onNavigate: () => setMobileOpen(false) }) })] }) }), _jsx(AgentSidebar, { position: "right", defaultOpen: false, emptyStateText: "Create apps, grant keys, and route work across the workspace.", suggestions: SIDEBAR_SUGGESTIONS, children: appContent })] }) }));
+}
+//# sourceMappingURL=Layout.js.map

package/dist/components/layout/Layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../../../src/components/layout/Layout.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { NavLink, useLocation } from \"react-router\";\nimport {\n  AgentSidebar,\n  FeedbackButton,\n  appPath,\n  useActionQuery,\n} from \"@agent-native/core/client\";\nimport { InvitationBanner } from \"@agent-native/core/client/org\";\nimport { ToolsSidebarSection } from \"@agent-native/core/client/tools\";\nimport {\n  IconArrowUpRight,\n  IconApps,\n  IconBrandTelegram,\n  IconKey,\n  IconChevronDown,\n  IconLayersSubtract,\n  IconPlugConnected,\n  IconBroadcast,\n  IconFingerprint,\n  IconHistory,\n  IconPuzzle,\n  IconShieldCheck,\n  IconUsersGroup,\n} from \"@tabler/icons-react\";\nimport { cn } from \"@/lib/utils\";\nimport {\n  Sheet,\n  SheetContent,\n  SheetDescription,\n  SheetTitle,\n} from \"@/components/ui/sheet\";\nimport { Header } from \"./Header\";\nimport { HeaderActionsProvider } from \"./HeaderActions\";\n\nconst PRIMARY_NAV_ITEMS = [\n  { to: \"/overview\", label: \"Overview\", icon: IconBroadcast },\n  { to: \"/apps\", label: \"Apps\", icon: IconApps },\n  { to: \"/vault\", label: \"Vault\", icon: IconKey },\n  { to: \"/integrations\", label: \"Integrations\", icon: IconPuzzle },\n  { to: \"/agents\", label: \"Agents\", icon: IconPlugConnected },\n] as const;\n\nconst OPERATIONS_NAV_ITEMS = [\n  { to: \"/workspace\", label: \"Resources\", icon: IconLayersSubtract },\n  { to: \"/messaging\", label: \"Messaging\", icon: IconBrandTelegram },\n  { to: \"/destinations\", label: \"Destinations\", icon: IconArrowUpRight },\n  { to: \"/identities\", label: \"Identities\", icon: IconFingerprint },\n  { to: \"/approvals\", label: \"Approvals\", icon: IconShieldCheck },\n  { to: \"/audit\", label: \"Audit\", icon: IconHistory },\n  { to: \"/team\", label: \"Team\", icon: IconUsersGroup },\n] as const;\n\ntype NavItem =\n  | (typeof PRIMARY_NAV_ITEMS)[number]\n  | (typeof OPERATIONS_NAV_ITEMS)[number];\n\nconst SIDEBAR_SUGGESTIONS = [\n  \"Create a new app\",\n  \"Grant a key to an app\",\n  \"Check integration health\",\n];\n\nconst CHROMELESS_PATHS = [\"/approval\"];\n\n// Routes whose page renders its own toolbar (with NotificationsBell + AgentToggleButton).\n// Layout still mounts the sidebar + AgentSidebar, but skips its own Header so\n// there's no double-header.\nfunction pageOwnsToolbar(pathname: string): boolean {\n  if (pathname === \"/tools\" || pathname.startsWith(\"/tools/\")) return true;\n  return false;\n}\n\ninterface WorkspaceInfo {\n  name: string | null;\n  displayName: string | null;\n  appCount: number;\n}\n\nexport function NavContent({ onNavigate }: { onNavigate?: () => void }) {\n  const location = useLocation();\n  const { data: workspace } = useActionQuery(\n    \"get-workspace-info\",\n    {},\n    { staleTime: 60_000 },\n  );\n  const ws = workspace as WorkspaceInfo | undefined;\n  const workspaceLabel = ws?.displayName ?? ws?.name ?? null;\n  const operationsOpen = OPERATIONS_NAV_ITEMS.some(\n    (item) =>\n      location.pathname === item.to ||\n      location.pathname.startsWith(`${item.to}/`),\n  );\n\n  const renderNavItem = (item: NavItem) => {\n    const Icon = item.icon;\n    return (\n      <li key={item.to}>\n        <NavLink\n          to={item.to}\n          onClick={onNavigate}\n          className={({ isActive }) =>\n            cn(\n              \"flex h-8 w-full items-center gap-2 rounded-md px-2 text-sm\",\n              isActive\n                ? \"bg-sidebar-accent font-medium text-sidebar-accent-foreground\"\n                : \"text-sidebar-foreground/70 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\",\n            )\n          }\n        >\n          <Icon size={16} className=\"shrink-0\" />\n          <span className=\"truncate\">{item.label}</span>\n        </NavLink>\n      </li>\n    );\n  };\n\n  return (\n    <>\n      <div className=\"border-b px-4 py-3\">\n        <div className=\"flex items-center gap-3\">\n          <div className=\"flex h-9 w-9 items-center justify-center rounded-xl border bg-card text-foreground\">\n            <img\n              src={appPath(\"/agent-native-icon-light.svg\")}\n              alt=\"\"\n              aria-hidden=\"true\"\n              className=\"block h-4 w-auto shrink-0 dark:hidden\"\n            />\n            <img\n              src={appPath(\"/agent-native-icon-dark.svg\")}\n              alt=\"\"\n              aria-hidden=\"true\"\n              className=\"hidden h-4 w-auto shrink-0 dark:block\"\n            />\n          </div>\n          <div className=\"min-w-0\">\n            <div className=\"truncate text-sm font-semibold text-foreground\">\n              {workspaceLabel ?? \"Dispatch\"}\n            </div>\n            <div className=\"truncate text-xs text-muted-foreground\">\n              {workspaceLabel\n                ? `Workspace · ${ws?.appCount ?? 0} app${ws?.appCount === 1 ? \"\" : \"s\"}`\n                : \"Workspace control plane\"}\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <nav className=\"flex-1 overflow-y-auto px-2 py-3\">\n        <ul className=\"space-y-0.5\">{PRIMARY_NAV_ITEMS.map(renderNavItem)}</ul>\n        <details className=\"group mt-4\" open={operationsOpen}>\n          <summary className=\"flex h-8 cursor-pointer list-none items-center justify-between rounded-md px-2 text-xs font-medium uppercase text-sidebar-foreground/50 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground [&::-webkit-details-marker]:hidden\">\n            <span>Operations</span>\n            <IconChevronDown\n              size={14}\n              className=\"transition-transform group-open:rotate-180\"\n            />\n          </summary>\n          <ul className=\"mt-1 space-y-0.5\">\n            {OPERATIONS_NAV_ITEMS.map(renderNavItem)}\n          </ul>\n        </details>\n      </nav>\n\n      <div className=\"border-t px-2 py-2\">\n        <ToolsSidebarSection />\n        <FeedbackButton />\n      </div>\n    </>\n  );\n}\n\nexport function Layout({ children }: { children: ReactNode }) {\n  const location = useLocation();\n  const [mobileOpen, setMobileOpen] = useState(false);\n  const hasEmbeddedAgentChat =\n    location.pathname === \"/\" || location.pathname === \"/overview\";\n\n  if (CHROMELESS_PATHS.some((path) => location.pathname === path)) {\n    return <>{children}</>;\n  }\n\n  const showHeader = !pageOwnsToolbar(location.pathname);\n  const appContent = (\n    <div className=\"flex h-full flex-1 flex-col overflow-hidden\">\n      {showHeader ? (\n        <Header\n          onOpenMobile={() => setMobileOpen(true)}\n          showAgentToggle={!hasEmbeddedAgentChat}\n        />\n      ) : null}\n      <InvitationBanner />\n      <main className=\"flex-1 overflow-y-auto\">\n        {showHeader ? (\n          <div className=\"mx-auto max-w-7xl space-y-5 px-4 py-6 sm:px-6\">\n            {children}\n          </div>\n        ) : (\n          children\n        )}\n      </main>\n    </div>\n  );\n\n  return (\n    <HeaderActionsProvider>\n      <div className=\"flex h-screen w-full overflow-hidden bg-background\">\n        <aside className=\"hidden 2xl:flex w-64 shrink-0 flex-col border-r bg-sidebar text-sidebar-foreground\">\n          <NavContent />\n        </aside>\n\n        <Sheet open={mobileOpen} onOpenChange={setMobileOpen}>\n          <SheetContent\n            side=\"left\"\n            className=\"w-72 p-0 bg-sidebar text-sidebar-foreground [&>button]:hidden\"\n          >\n            <SheetTitle className=\"sr-only\">Navigation</SheetTitle>\n            <SheetDescription className=\"sr-only\">\n              Workspace navigation links\n            </SheetDescription>\n            <div className=\"flex h-full w-full flex-col\">\n              <NavContent onNavigate={() => setMobileOpen(false)} />\n            </div>\n          </SheetContent>\n        </Sheet>\n\n        {/*\n         * Always mount AgentSidebar so home composer's sendToAgentChat\n         * fallback can pop it via agent-panel:open. The toggle button stays\n         * hidden on overview because the home composer is the primary input.\n         */}\n        <AgentSidebar\n          position=\"right\"\n          defaultOpen={false}\n          emptyStateText=\"Create apps, grant keys, and route work across the workspace.\"\n          suggestions={SIDEBAR_SUGGESTIONS}\n        >\n          {appContent}\n        </AgentSidebar>\n      </div>\n    </HeaderActionsProvider>\n  );\n}\n"]}