50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T1a0b,"use client"; import type { ComponentProps, ReactNode } from "react"; import { useState } from "react"; import { AnimatedWash } from "@/components/animated-wash/animated-wash"; import { NeonLoader } from "@/components/neon-loader/neon-loader"; import { Button } from "@/components/ui/button"; import { cn } from "@/lib/utils"; export type ProvisioningState = "provisioning" | "waking" | "error"; export type ProvisioningStatusProps = Omit< ComponentProps<"div">, "title" | "children" > & { /** Lifecycle state the panel narrates. */ state?: ProvisioningState; /** Override the state's default headline. */ title?: string; /** * The status detail line, e.g. "Creating Neon project…". Swapping it * crossfades in place — feed it live progress from your API. */ detail?: string; /** Renders the retry action in the error state. */ onRetry?: () => void; /** Label for the retry action. */ retryLabel?: string; /** * "panel" draws the house surface; "bare" renders naked for * embedding inside an already-bordered pane. */ variant?: "panel" | "bare"; /** Vertical breathing room. */ size?: "sm" | "md" | "lg"; /** Extra content under the detail line, e.g. a cancel link. */ footer?: ReactNode; }; /* ───────────────────────────────────────────────────────── * PANEL STORYBOARD * * One quiet stage, three acts. The frame and rhythm never * change between states — only the voice does. * * provisioning the NeonLoader resolves out of grain, the * headline holds foreground, and the detail * line shimmers; swap `detail` as your API * reports progress and the old step rolls * out the top as the new one rises in * (300ms, same row, zero shift) * waking identical staging, wake copy — the * sandbox exists, it's just cold * ambience the AnimatedWash breathes under * everything at low intensity — primary * green while working, destructive and * dimmer for the error act (the panel * cools, it doesn't shout); always well * below the loader's grain * error the loader yields to the mono error tag + * foreground sentence, the detail cools to * muted, and a retry action appears where * the shimmer was * ───────────────────────────────────────────────────────── */ const COPY: Record = { error: { detail: "The last attempt didn't complete.", title: "Something went wrong", }, provisioning: { detail: "Creating Neon project…", title: "Provisioning your app", }, waking: { detail: "Restoring compute…", title: "Waking sandbox", }, }; const SIZE_PADDING: Record< NonNullable, string > = { lg: "px-8 py-20", md: "px-6 py-14", sm: "px-4 py-8", }; export const ProvisioningStatus = ({ className, detail, footer, onRetry, retryLabel = "Try again", size = "md", state = "provisioning", title, variant = "panel", ...props }: ProvisioningStatusProps) => { const copy = COPY[state]; const heading = title ?? copy.title; const line = detail ?? copy.detail; const failed = state === "error"; // Remember the outgoing line so it can roll out while the new one // rolls in. const [roll, setRoll] = useState<{ current: string; previous: string | null; }>({ current: line, previous: null }); if (roll.current !== line) { setRoll({ current: line, previous: roll.current }); } const { previous } = roll; return (

{/* Same wash grammar as AppCard's shader slot: default shader at native intensity, status tint, bottom band. Only the error act dims it — the panel cools, it doesn't shout. */} {failed ? (

error {heading}

) : ( <>

{heading}

)} {/* The detail roll: old step exits up, new step rises in — both live in one grid cell so the row never moves. */}

{previous ? ( ) : null} {line}

{failed && onRetry ? ( ) : null} {footer}

); }; 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L50",null,{"namespace":"@neon-ui","registryDependencies":["utils","https://ui.neon.com/r/neon-tokens.json","https://ui.neon.com/r/button.json","https://ui.neon.com/r/neon-loader.json","https://ui.neon.com/r/animated-wash.json"]}]]}],null]}],["$","$L51",null,{"files":[{"path":"src/components/provisioning-status/provisioning-status.tsx","content":"$52","type":"registry:component"}],"className":"h-[70svh] min-h-80"}]]}]