@cloudgrid-io/ui 0.0.2 → 0.2.0

package/dist/blocks/plug-method.d.ts

@@ -0,0 +1,76 @@
+import * as React from "react";
+/**
+ * One install method rendered as the terminal session it becomes: the command as
+ * a prompt line, the steps as a transcript, the tools as a marks rail. The
+ * operator killed an earlier card-and-form layout for this (2026-08-06 in v0):
+ * three near-identical cards over a two-column form read as settings, a session
+ * reads as the thing actually happening.
+ *
+ * Ported from v0's `site/PlugMethod`, the last component of the #7 inventory.
+ *
+ * ## It owns no surface, on purpose
+ *
+ * v0 rendered this inside the /plug console's ink and hardcoded thirteen
+ * white-derived rgba() values on that assumption. Here every colour is a semantic
+ * token or derived from `currentColor`, so the component is honest on ink AND on
+ * panel, and the caller supplies the surface:
+ *
+ *     <div data-cg-surface="ink" className="bg-code text-ink ...">
+ *       <PlugMethod ... />
+ *     </div>
+ *
+ * `text-ink` on the container is required, not decorative (rule 3: text does not
+ * flip by inheritance).
+ *
+ * ## What changed from v0's API
+ *
+ * - v0 passed a `method` object because the console maps CMS tabs onto it, and
+ *   its `label` was the tab's, rendered by the console rather than here. The
+ *   registry version takes flat props and no tab label, per the batch
+ *   convention: site CMS shapes stay on the site.
+ * - v0's tools were bare names resolved against marks shipped with the library.
+ *   This library ships no third-party marks (#47), so each tool optionally
+ *   carries its own `mark`, passed through to `ToolLogo`, whose monogram
+ *   fallback covers the rest.
+ * - The copy interaction matches `AgentPrompt`, not v0: the result is also
+ *   written to a polite live region, because a flipped label is invisible to a
+ *   screen reader that has already read the button. The failure path stays
+ *   honest: "copy blocked by browser" beats a button that appears to do nothing.
+ *
+ * The transcript keeps StepItem's accessibility shape rather than composing it:
+ * the numerals are `aria-hidden` because the `<ol>` does the numbering, and the
+ * `role="list"` is explicit because WebKit drops the implicit role when
+ * list-style is none. Not composed, because StepItem's title is `heading-sm` and
+ * this transcript is deliberately body-sized: a session, not a pitch.
+ */
+type PlugMethodStep = {
+    title: string;
+    body: string;
+};
+type PlugMethodTool = {
+    name: string;
+    /** The vendor's mark, if the caller has one to show. Monogram otherwise. */
+    mark?: React.ReactNode;
+};
+declare function PlugMethod({ lead, command, commandLabel, exampleLabel, steps, prompt, tools, toolsLabel, note, copyLabel, className, ...props }: Omit<React.ComponentProps<"div">, "ref"> & {
+    lead: string;
+    /** The one command. Rendered as a prompt line with a copy button. */
+    command: string;
+    /** Mono comment above the command, e.g. "run it from the repo you already have". */
+    commandLabel: string;
+    /** Mono comment introducing the transcript, e.g. "what happens next". */
+    exampleLabel: string;
+    steps: PlugMethodStep[];
+    /** The dashed pill: a first prompt to hand an agent, copied on press. */
+    prompt: {
+        command: string;
+        label: string;
+    };
+    tools: PlugMethodTool[];
+    toolsLabel: string;
+    note: string;
+    copyLabel?: string;
+}): React.JSX.Element;
+export { PlugMethod };
+export type { PlugMethodStep, PlugMethodTool };
+//# sourceMappingURL=plug-method.d.ts.map

package/dist/blocks/plug-method.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"plug-method.d.ts","sourceRoot":"","sources":["../../src/blocks/plug-method.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AAEH,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,KAAK,cAAc,GAAG;IACpB,IAAI,EAAE,MAAM,CAAA;IACZ,4EAA4E;IAC5E,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB,CAAA;AAED,iBAAS,UAAU,CAAC,EAClB,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,KAAK,EACL,MAAM,EACN,KAAK,EACL,UAAU,EACV,IAAI,EACJ,SAAkB,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,GAAG;IAC5C,IAAI,EAAE,MAAM,CAAA;IACZ,qEAAqE;IACrE,OAAO,EAAE,MAAM,CAAA;IACf,oFAAoF;IACpF,YAAY,EAAE,MAAM,CAAA;IACpB,yEAAyE;IACzE,YAAY,EAAE,MAAM,CAAA;IACpB,KAAK,EAAE,cAAc,EAAE,CAAA;IACvB,yEAAyE;IACzE,MAAM,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAA;IAC1C,KAAK,EAAE,cAAc,EAAE,CAAA;IACvB,UAAU,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,qBA0GA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA;AACrB,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,CAAA"}

package/dist/blocks/plug-method.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cloudgrid-cn.js";
+import { ToolLogo } from "./tool-logo.js";
+function PlugMethod({ lead, command, commandLabel, exampleLabel, steps, prompt, tools, toolsLabel, note, copyLabel = "Copy", className, ...props }) {
+    // One feedback slot per copy surface, so copying the command does not flip the
+    // prompt pill's hint. Same 1600ms window as AgentPrompt and v0's copy island.
+    const [feedback, setFeedback] = React.useState({});
+    const timer = React.useRef(undefined);
+    // Cleared on unmount, or the timeout fires a state update against a component
+    // that is gone when someone navigates within the window.
+    React.useEffect(() => () => clearTimeout(timer.current), []);
+    const copy = (slot, text) => async () => {
+        let message;
+        try {
+            await navigator.clipboard.writeText(text);
+            message = "copied ✓";
+        }
+        catch {
+            message = "copy blocked by browser";
+        }
+        setFeedback({ [slot]: message });
+        clearTimeout(timer.current);
+        timer.current = setTimeout(() => setFeedback({}), 1600);
+    };
+    return (_jsxs("div", { "data-slot": "plug-method", className: cn("grid gap-6", className), ...props, children: [_jsx("p", { className: "m-0 max-w-measure text-body-md text-body", children: lead }), _jsxs("div", { className: "grid gap-2", children: [_jsxs("span", { className: "font-mono text-caption text-faint", children: ["# ", commandLabel] }), _jsxs("div", { className: "flex items-center gap-3 rounded-md border border-hairline bg-[color-mix(in_oklch,currentColor_4%,transparent)] py-3 pr-3 pl-4", children: [_jsx("span", { "aria-hidden": "true", className: "shrink-0 font-mono font-bold text-lime", children: "$" }), _jsx("code", { className: "min-w-0 flex-1 overflow-x-auto font-mono text-mono whitespace-nowrap text-ink [scrollbar-width:none]", children: command }), _jsx("button", { type: "button", onClick: copy("cmd", command), className: "ml-auto shrink-0 rounded-pill bg-lime px-3.5 py-1 text-caption font-bold text-on-accent transition-colors hover:bg-lime-press focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: feedback.cmd ?? copyLabel })] })] }), _jsxs("p", { className: "-mb-3 m-0 font-mono text-caption text-faint", children: ["# ", exampleLabel] }), _jsx("ol", { role: "list", className: "m-0 grid list-none gap-4 p-0", children: steps.map((step, i) => (_jsxs("li", { className: "flex items-start gap-4", children: [_jsx("span", { "aria-hidden": "true", className: "mt-0.5 flex size-6 shrink-0 items-center justify-center rounded-pill bg-cyan font-mono text-caption font-bold text-on-accent", children: i + 1 }), _jsxs("span", { className: "grid gap-0.5", children: [_jsx("span", { className: "font-medium text-ink", children: step.title }), _jsx("span", { className: "text-body-sm text-body", children: step.body })] })] }, step.title))) }), _jsxs("button", { type: "button", onClick: copy("prompt", prompt.command), className: "inline-flex w-fit max-w-full flex-wrap items-center gap-3 rounded-pill border border-dashed border-[color-mix(in_oklch,currentColor_30%,transparent)] bg-transparent px-5 py-3 text-left font-mono text-mono text-body transition-colors hover:border-cyan hover:text-ink focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: [_jsx("span", { "aria-hidden": "true", className: "shrink-0 font-bold text-lime", children: ">" }), prompt.command, _jsx("span", { className: "font-sans text-caption font-bold text-cyan", children: feedback.prompt ?? prompt.label })] }), _jsxs("div", { className: "grid gap-3 border-t border-hairline pt-5", children: [_jsx("span", { className: "text-caption font-medium text-faint", children: toolsLabel }), _jsx("ul", { role: "list", className: "m-0 flex list-none flex-wrap gap-2 p-0", children: tools.map((tool) => (_jsxs("li", { className: "inline-flex items-center gap-2 rounded-pill border border-hairline px-3 py-1 text-caption text-body", children: [_jsx(ToolLogo, { name: tool.name, mark: tool.mark, size: 15 }), tool.name] }, tool.name))) })] }), _jsx("p", { className: "m-0 max-w-measure text-caption text-faint", children: note }), _jsx("span", { "aria-live": "polite", className: "sr-only", children: feedback.cmd ?? feedback.prompt })] }));
+}
+export { PlugMethod };
+//# sourceMappingURL=plug-method.js.map

package/dist/blocks/plug-method.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plug-method.js","sourceRoot":"","sources":["../../src/blocks/plug-method.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAA;AA0DlD,SAAS,UAAU,CAAC,EAClB,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,KAAK,EACL,MAAM,EACN,KAAK,EACL,UAAU,EACV,IAAI,EACJ,SAAS,GAAG,MAAM,EAClB,SAAS,EACT,GAAG,KAAK,EAgBT;IACC,+EAA+E;IAC/E,8EAA8E;IAC9E,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAoC,EAAE,CAAC,CAAA;IACrF,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAA4C,SAAS,CAAC,CAAA;IAEhF,8EAA8E;IAC9E,yDAAyD;IACzD,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,CAAC,CAAA;IAE5D,MAAM,IAAI,GAAG,CAAC,IAAsB,EAAE,IAAY,EAAE,EAAE,CAAC,KAAK,IAAI,EAAE;QAChE,IAAI,OAAe,CAAA;QACnB,IAAI,CAAC;YACH,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,CAAA;YACzC,OAAO,GAAG,UAAU,CAAA;QACtB,CAAC;QAAC,MAAM,CAAC;YACP,OAAO,GAAG,yBAAyB,CAAA;QACrC,CAAC;QACD,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,CAAC,CAAA;QAChC,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,CAAA;QAC3B,KAAK,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,CAAA;IACzD,CAAC,CAAA;IAED,OAAO,CACL,4BAAe,aAAa,EAAC,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,KAAM,KAAK,aAC5E,YAAG,SAAS,EAAC,0CAA0C,YAAE,IAAI,GAAK,EAElE,eAAK,SAAS,EAAC,YAAY,aACzB,gBAAM,SAAS,EAAC,mCAAmC,mBAAI,YAAY,IAAQ,EAC3E,eAAK,SAAS,EAAC,+HAA+H,aAC5I,8BAAkB,MAAM,EAAC,SAAS,EAAC,wCAAwC,kBAEpE,EAKP,eAAM,SAAS,EAAC,sGAAsG,YACnH,OAAO,GACH,EACP,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,EAC7B,SAAS,EAAC,iNAAiN,YAE1N,QAAQ,CAAC,GAAG,IAAI,SAAS,GACnB,IACL,IACF,EAEN,aAAG,SAAS,EAAC,6CAA6C,mBAAI,YAAY,IAAK,EAC/E,aAAI,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,8BAA8B,YACrD,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,cAAqB,SAAS,EAAC,wBAAwB,aACrD,8BACc,MAAM,EAClB,SAAS,EAAC,8HAA8H,YAEvI,CAAC,GAAG,CAAC,GACD,EACP,gBAAM,SAAS,EAAC,cAAc,aAC5B,eAAM,SAAS,EAAC,sBAAsB,YAAE,IAAI,CAAC,KAAK,GAAQ,EAC1D,eAAM,SAAS,EAAC,wBAAwB,YAAE,IAAI,CAAC,IAAI,GAAQ,IACtD,KAVA,IAAI,CAAC,KAAK,CAWd,CACN,CAAC,GACC,EAEL,kBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,EACvC,SAAS,EAAC,6VAA6V,aAEvW,8BAAkB,MAAM,EAAC,SAAS,EAAC,8BAA8B,kBAE1D,EACN,MAAM,CAAC,OAAO,EACf,eAAM,SAAS,EAAC,4CAA4C,YACzD,QAAQ,CAAC,MAAM,IAAI,MAAM,CAAC,KAAK,GAC3B,IACA,EAET,eAAK,SAAS,EAAC,0CAA0C,aACvD,eAAM,SAAS,EAAC,qCAAqC,YAAE,UAAU,GAAQ,EACzE,aAAI,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,wCAAwC,YAC/D,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,cAEE,SAAS,EAAC,qGAAqG,aAE/G,KAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,GAAI,EACvD,IAAI,CAAC,IAAI,KAJL,IAAI,CAAC,IAAI,CAKX,CACN,CAAC,GACC,IACD,EAEN,YAAG,SAAS,EAAC,2CAA2C,YAAE,IAAI,GAAK,EAInE,4BAAgB,QAAQ,EAAC,SAAS,EAAC,SAAS,YACzC,QAAQ,CAAC,GAAG,IAAI,QAAQ,CAAC,MAAM,GAC3B,IACH,CACP,CAAA;AACH,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/blocks/pricing-tier-cards.d.ts

@@ -0,0 +1,47 @@
+/**
+ * Pricing tiers as cards. Ported from v0's `site/PricingTierCards`.
+ *
+ * Prices are honest text from the caller's data, never numbers computed here. The
+ * featured tier gets the accent ring, which matches the compare matrix's CloudGrid
+ * column.
+ *
+ * ## Three changes from v0
+ *
+ * The check mark was a Phosphor SVG inlined as a string and rendered with
+ * `dangerouslySetInnerHTML`. It is lucide's `Check` now, for the same two reasons
+ * as `FeatureCells`: this registry declares lucide and already depends on it, and
+ * innerHTML for decoration is a sharp tool used for nothing.
+ *
+ * The CTA is a real anchor wearing `buttonVariants` rather than a `Button` with an
+ * `href` prop. Our `Button` is a Base UI button and has no `href`; a link that
+ * looks like a button should be an `<a>`, so it works with middle-click, "open in
+ * new tab" and a screen reader announcing a link rather than a button. The href
+ * comes from the caller's own tier data, so no route is being guessed.
+ *
+ * `dataCta` is dropped, as in `OptionCard`: the site's analytics vocabulary does
+ * not belong in a registry component's API. It still works through the anchor's
+ * own props if a caller wants it.
+ *
+ * The price uses `font-heavy`, which only exists because the display weight was
+ * unreachable until #42 — `--font-display` and `--font-weight-display` both
+ * compile to `font-display` and the family wins.
+ */
+type PricingTier = {
+    name: string;
+    audience: string;
+    price: string;
+    priceNote: string;
+    blurb: string;
+    bullets: string[];
+    cta: {
+        label: string;
+        href: string;
+    };
+    featured: boolean;
+};
+declare function PricingTierCards({ tiers, className, ...props }: Omit<React.ComponentProps<"div">, "ref"> & {
+    tiers: PricingTier[];
+}): import("react").JSX.Element;
+export { PricingTierCards };
+export type { PricingTier };
+//# sourceMappingURL=pricing-tier-cards.d.ts.map

package/dist/blocks/pricing-tier-cards.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pricing-tier-cards.d.ts","sourceRoot":"","sources":["../../src/blocks/pricing-tier-cards.tsx"],"names":[],"mappings":"AAKA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,MAAM,CAAA;IAChB,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,EAAE,CAAA;IACjB,GAAG,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;IACpC,QAAQ,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,GAAG;IAC5C,KAAK,EAAE,WAAW,EAAE,CAAA;CACrB,+BA8DA;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAA;AAC3B,YAAY,EAAE,WAAW,EAAE,CAAA"}

package/dist/blocks/pricing-tier-cards.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Check } from "lucide-react";
+import { buttonVariants } from "../ui/button.js";
+import { cn } from "../lib/cloudgrid-cn.js";
+function PricingTierCards({ tiers, className, ...props }) {
+    return (_jsx("div", { "data-slot": "pricing-tier-cards", 
+        // auto-fit rather than a fixed column count: the number of tiers is the
+        // caller's, so the grid has to work for two as well as five.
+        className: cn("grid gap-5 [grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr))]", className), ...props, children: tiers.map((tier) => (_jsxs("article", { "data-featured": tier.featured || undefined, className: cn("flex flex-col gap-3 rounded-xl border border-hairline bg-card p-6 text-ink", tier.featured && "border-brand bg-brand-tint"), children: [_jsx("p", { className: "m-0 text-label font-medium text-ink", children: tier.name }), tier.audience ? (_jsx("p", { className: "m-0 text-body-sm text-faint", children: tier.audience })) : null, _jsxs("p", { className: "m-0 font-display text-display-sm font-heavy text-ink", children: [tier.price, tier.priceNote ? (_jsx("span", { className: "ml-1 font-body text-body-sm font-medium text-body", children: tier.priceNote })) : null] }), _jsx("p", { className: "m-0 text-body-sm text-body", children: tier.blurb }), _jsx("ul", { role: "list", className: "m-0 grid list-none gap-2 p-0", children: tier.bullets.map((line) => (_jsxs("li", { className: "flex items-start gap-2 text-body-sm text-body", children: [_jsx(Check, { "aria-hidden": "true", className: "mt-1 size-3.5 shrink-0 text-brand" }), line] }, line))) }), _jsx("a", { href: tier.cta.href, className: cn(buttonVariants({ variant: tier.featured ? "default" : "outline" }), "mt-auto w-full no-underline"), children: tier.cta.label })] }, tier.name))) }));
+}
+export { PricingTierCards };
+//# sourceMappingURL=pricing-tier-cards.js.map

package/dist/blocks/pricing-tier-cards.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pricing-tier-cards.js","sourceRoot":"","sources":["../../src/blocks/pricing-tier-cards.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAA;AAEpC,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AACrD,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AAyCvC,SAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EAGT;IACC,OAAO,CACL,2BACY,oBAAoB;QAC9B,wEAAwE;QACxE,6DAA6D;QAC7D,SAAS,EAAE,EAAE,CACX,iFAAiF,EACjF,SAAS,CACV,KACG,KAAK,YAER,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,oCAEiB,IAAI,CAAC,QAAQ,IAAI,SAAS,EACzC,SAAS,EAAE,EAAE,CACX,4EAA4E,EAC5E,IAAI,CAAC,QAAQ,IAAI,4BAA4B,CAC9C,aAED,YAAG,SAAS,EAAC,qCAAqC,YAAE,IAAI,CAAC,IAAI,GAAK,EACjE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CACf,YAAG,SAAS,EAAC,6BAA6B,YAAE,IAAI,CAAC,QAAQ,GAAK,CAC/D,CAAC,CAAC,CAAC,IAAI,EAER,aAAG,SAAS,EAAC,sDAAsD,aAChE,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAChB,eAAM,SAAS,EAAC,mDAAmD,YAChE,IAAI,CAAC,SAAS,GACV,CACR,CAAC,CAAC,CAAC,IAAI,IACN,EAEJ,YAAG,SAAS,EAAC,4BAA4B,YAAE,IAAI,CAAC,KAAK,GAAK,EAE1D,aAAI,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,8BAA8B,YACrD,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC1B,cAAe,SAAS,EAAC,+CAA+C,aACtE,KAAC,KAAK,mBAAa,MAAM,EAAC,SAAS,EAAC,mCAAmC,GAAG,EACzE,IAAI,KAFE,IAAI,CAGR,CACN,CAAC,GACC,EAKL,YACE,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EACnB,SAAS,EAAE,EAAE,CACX,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,EAClE,6BAA6B,CAC9B,YAEA,IAAI,CAAC,GAAG,CAAC,KAAK,GACb,KA3CC,IAAI,CAAC,IAAI,CA4CN,CACX,CAAC,GACE,CACP,CAAA;AACH,CAAC;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/blocks/pricing-tiers.d.ts

@@ -0,0 +1,29 @@
+import { type PricingTier } from "./pricing-tier-cards.js";
+/**
+ * A titled pricing section. Ported from v0's `core/PricingTiers`.
+ *
+ * It is deliberately thin, and worth saying why it exists at all rather than
+ * telling callers to write two lines themselves.
+ *
+ * v0's version was a `band` plus a `container` plus an optional `h2` plus a
+ * max-width plus `PricingTierCards`. Strip the page wrappers, as every port here
+ * does, and what remains is a heading and a width. Its own header admitted the
+ * awkwardness: *"the band is generic and lives in core, the cards were flagged
+ * site-flavored during the extraction, and this import crosses that line
+ * internally."*
+ *
+ * It is kept because the width is not arbitrary. `--cg-column-wide` is a SOURCE
+ * measurement from the 1440px frames, and a pricing grid set to the full page
+ * width reads wrong at large sizes in a way that is not obvious until you see it.
+ * Encoding that once is the whole value; a caller reaching for
+ * `max-w-wide` themselves is a caller who has to know it exists.
+ *
+ * Compose `PricingTierCards` directly for a bespoke pricing page, which is what v0
+ * did too.
+ */
+declare function PricingTiers({ title, tiers, className, ...props }: Omit<React.ComponentProps<"section">, "ref"> & {
+    title?: string;
+    tiers: PricingTier[];
+}): import("react").JSX.Element;
+export { PricingTiers };
+//# sourceMappingURL=pricing-tiers.d.ts.map

package/dist/blocks/pricing-tiers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pricing-tiers.d.ts","sourceRoot":"","sources":["../../src/blocks/pricing-tiers.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAGrF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,iBAAS,YAAY,CAAC,EACpB,KAAK,EACL,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG;IAChD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,WAAW,EAAE,CAAA;CACrB,+BAWA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/dist/blocks/pricing-tiers.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PricingTierCards } from "./pricing-tier-cards.js";
+import { cn } from "../lib/cloudgrid-cn.js";
+/**
+ * A titled pricing section. Ported from v0's `core/PricingTiers`.
+ *
+ * It is deliberately thin, and worth saying why it exists at all rather than
+ * telling callers to write two lines themselves.
+ *
+ * v0's version was a `band` plus a `container` plus an optional `h2` plus a
+ * max-width plus `PricingTierCards`. Strip the page wrappers, as every port here
+ * does, and what remains is a heading and a width. Its own header admitted the
+ * awkwardness: *"the band is generic and lives in core, the cards were flagged
+ * site-flavored during the extraction, and this import crosses that line
+ * internally."*
+ *
+ * It is kept because the width is not arbitrary. `--cg-column-wide` is a SOURCE
+ * measurement from the 1440px frames, and a pricing grid set to the full page
+ * width reads wrong at large sizes in a way that is not obvious until you see it.
+ * Encoding that once is the whole value; a caller reaching for
+ * `max-w-wide` themselves is a caller who has to know it exists.
+ *
+ * Compose `PricingTierCards` directly for a bespoke pricing page, which is what v0
+ * did too.
+ */
+function PricingTiers({ title, tiers, className, ...props }) {
+    return (_jsxs("section", { "data-slot": "pricing-tiers", className: cn("flex flex-col gap-8", className), ...props, children: [title ? _jsx("h2", { className: "m-0 text-heading-lg font-medium text-ink", children: title }) : null, _jsx(PricingTierCards, { tiers: tiers, className: "max-w-wide" })] }));
+}
+export { PricingTiers };
+//# sourceMappingURL=pricing-tiers.js.map

package/dist/blocks/pricing-tiers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pricing-tiers.js","sourceRoot":"","sources":["../../src/blocks/pricing-tiers.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAoB,MAAM,kCAAkC,CAAA;AACrF,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AAEvC;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,SAAS,YAAY,CAAC,EACpB,KAAK,EACL,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EAIT;IACC,OAAO,CACL,gCACY,eAAe,EACzB,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,KAC3C,KAAK,aAER,KAAK,CAAC,CAAC,CAAC,aAAI,SAAS,EAAC,0CAA0C,YAAE,KAAK,GAAM,CAAC,CAAC,CAAC,IAAI,EACrF,KAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAC,YAAY,GAAG,IACjD,CACX,CAAA;AACH,CAAC;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/dist/blocks/quote.d.ts

@@ -0,0 +1,27 @@
+/**
+ * A pull quote on the reading measure, with an optional mono attribution.
+ *
+ * Ported from v0's `core/Quote`. Two deliberate changes.
+ *
+ * v0 wrapped this in its own `band` and `container` classes, which are the
+ * site's page-level layout. A registry component has no business imposing page
+ * layout on a consumer, so they are dropped: this renders a `<figure>` on the
+ * measure and nothing more. Put it inside whatever section wrapper the
+ * consuming page already has.
+ *
+ * v0's `mx-auto` went with them, for the same reason: centring is page layout.
+ * On the measure inside a left-aligned section it read as a mistake. Add
+ * `className="mx-auto"` if the page wants it centred.
+ *
+ * v0 sized the quote with `clamp(1.25rem, 3vw, 1.75rem)`, which is 20px to 28px
+ * and lands on no step of the brand scale. Expressed here as a responsive pair
+ * that does: heading-md (20px) to heading-lg (24px). Slightly smaller at the top
+ * end than v0, and on the ramp, which the brand asks for. An arbitrary
+ * `text-[clamp(...)]` would also be caught by the type-scale assertion.
+ */
+declare function Quote({ text, attribution, className, ...props }: React.ComponentProps<"figure"> & {
+    text: string;
+    attribution?: string;
+}): import("react").JSX.Element;
+export { Quote };
+//# sourceMappingURL=quote.d.ts.map

package/dist/blocks/quote.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"quote.d.ts","sourceRoot":"","sources":["../../src/blocks/quote.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,iBAAS,KAAK,CAAC,EACb,IAAI,EACJ,WAAW,EACX,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAG;IAClC,IAAI,EAAE,MAAM,CAAA;IACZ,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,+BAiBA;AAED,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/blocks/quote.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cloudgrid-cn.js";
+/**
+ * A pull quote on the reading measure, with an optional mono attribution.
+ *
+ * Ported from v0's `core/Quote`. Two deliberate changes.
+ *
+ * v0 wrapped this in its own `band` and `container` classes, which are the
+ * site's page-level layout. A registry component has no business imposing page
+ * layout on a consumer, so they are dropped: this renders a `<figure>` on the
+ * measure and nothing more. Put it inside whatever section wrapper the
+ * consuming page already has.
+ *
+ * v0's `mx-auto` went with them, for the same reason: centring is page layout.
+ * On the measure inside a left-aligned section it read as a mistake. Add
+ * `className="mx-auto"` if the page wants it centred.
+ *
+ * v0 sized the quote with `clamp(1.25rem, 3vw, 1.75rem)`, which is 20px to 28px
+ * and lands on no step of the brand scale. Expressed here as a responsive pair
+ * that does: heading-md (20px) to heading-lg (24px). Slightly smaller at the top
+ * end than v0, and on the ramp, which the brand asks for. An arbitrary
+ * `text-[clamp(...)]` would also be caught by the type-scale assertion.
+ */
+function Quote({ text, attribution, className, ...props }) {
+    return (_jsxs("figure", { "data-slot": "quote", className: cn("max-w-(--cg-measure) text-ink", className), ...props, children: [_jsx("blockquote", { className: "m-0 text-heading-md leading-snug text-balance md:text-heading-lg", children: text }), attribution ? (_jsx("figcaption", { className: "mt-4 font-mono text-mono text-body", children: attribution })) : null] }));
+}
+export { Quote };
+//# sourceMappingURL=quote.js.map

package/dist/blocks/quote.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"quote.js","sourceRoot":"","sources":["../../src/blocks/quote.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AAEvC;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,SAAS,KAAK,CAAC,EACb,IAAI,EACJ,WAAW,EACX,SAAS,EACT,GAAG,KAAK,EAIT;IACC,OAAO,CACL,+BACY,OAAO,EACjB,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,CAAC,KACrD,KAAK,aAIT,qBAAY,SAAS,EAAC,kEAAkE,YACrF,IAAI,GACM,EACZ,WAAW,CAAC,CAAC,CAAC,CACb,qBAAY,SAAS,EAAC,oCAAoC,YAAE,WAAW,GAAc,CACtF,CAAC,CAAC,CAAC,IAAI,IACD,CACV,CAAA;AACH,CAAC;AAED,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/blocks/rich-text.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Typography for HTML you did not write: the output of a markdown parser or a CMS,
+ * where the tags arrive as-is and there is nowhere to put a class.
+ *
+ * The styling is `@cloudgrid-io/ui/prose.css`, which this component's registry
+ * entry imports for you. It is plain CSS in the tokens package rather than here, so
+ * the Astro site can use the same recipe without pulling a React component.
+ *
+ * ## It does not parse markdown, and that is the point
+ *
+ * v0's version took a markdown string, ran `marked.parse()`, and injected the
+ * result. Its own header carried the warning:
+ *
+ * > TRUST NOTE: the result is injected as HTML. Markdown permits raw HTML, so
+ * > `markdown` must come from a trusted source, never unsanitised user input.
+ *
+ * A registry ships source into other people's repositories. Shipping a component
+ * that runs a parser and injects the output, with a comment asking the reader to
+ * only pass trusted input, is putting a footgun in someone else's codebase and
+ * hoping they read the label. It would also drag `marked` into every consumer's
+ * dependencies for a component many of them would use with a CMS instead.
+ *
+ * So this takes **already-rendered HTML**. The parse stays at the call site, where
+ * the caller already knows where the content came from, which is the only place
+ * that judgement can honestly be made. `dangerouslySetInnerHTML` is still what
+ * renders it, and it is still on the caller to have sanitised anything untrusted:
+ * the difference is that the decision is now visible in their code rather than
+ * buried in ours.
+ *
+ * Prefer `children` where you have real elements. It skips the innerHTML path
+ * entirely and still gets the typography.
+ */
+declare function RichText({ html, className, children, ...props }: Omit<React.ComponentProps<"div">, "ref" | "dangerouslySetInnerHTML"> & {
+    /** Rendered, trusted HTML. Sanitise before this if the source is not yours. */
+    html?: string;
+}): import("react").JSX.Element;
+export { RichText };
+//# sourceMappingURL=rich-text.d.ts.map

package/dist/blocks/rich-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rich-text.d.ts","sourceRoot":"","sources":["../../src/blocks/rich-text.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,iBAAS,QAAQ,CAAC,EAChB,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,yBAAyB,CAAC,GAAG;IACxE,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,+BAcA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/blocks/rich-text.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../lib/cloudgrid-cn.js";
+/**
+ * Typography for HTML you did not write: the output of a markdown parser or a CMS,
+ * where the tags arrive as-is and there is nowhere to put a class.
+ *
+ * The styling is `@cloudgrid-io/ui/prose.css`, which this component's registry
+ * entry imports for you. It is plain CSS in the tokens package rather than here, so
+ * the Astro site can use the same recipe without pulling a React component.
+ *
+ * ## It does not parse markdown, and that is the point
+ *
+ * v0's version took a markdown string, ran `marked.parse()`, and injected the
+ * result. Its own header carried the warning:
+ *
+ * > TRUST NOTE: the result is injected as HTML. Markdown permits raw HTML, so
+ * > `markdown` must come from a trusted source, never unsanitised user input.
+ *
+ * A registry ships source into other people's repositories. Shipping a component
+ * that runs a parser and injects the output, with a comment asking the reader to
+ * only pass trusted input, is putting a footgun in someone else's codebase and
+ * hoping they read the label. It would also drag `marked` into every consumer's
+ * dependencies for a component many of them would use with a CMS instead.
+ *
+ * So this takes **already-rendered HTML**. The parse stays at the call site, where
+ * the caller already knows where the content came from, which is the only place
+ * that judgement can honestly be made. `dangerouslySetInnerHTML` is still what
+ * renders it, and it is still on the caller to have sanitised anything untrusted:
+ * the difference is that the decision is now visible in their code rather than
+ * buried in ours.
+ *
+ * Prefer `children` where you have real elements. It skips the innerHTML path
+ * entirely and still gets the typography.
+ */
+function RichText({ html, className, children, ...props }) {
+    return (_jsx("div", { "data-slot": "rich-text", className: cn("prose", className), ...(html !== undefined ? { dangerouslySetInnerHTML: { __html: html } } : {}), ...props, children: html !== undefined ? undefined : children }));
+}
+export { RichText };
+//# sourceMappingURL=rich-text.js.map

package/dist/blocks/rich-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rich-text.js","sourceRoot":"","sources":["../../src/blocks/rich-text.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AAEvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,SAAS,QAAQ,CAAC,EAChB,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EAIT;IACC,OAAO,CACL,2BACY,WAAW,EACrB,SAAS,EAAE,EAAE,CAAC,OAAO,EAAE,SAAS,CAAC,KAI7B,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KACzE,KAAK,YAER,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,GACtC,CACP,CAAA;AACH,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/blocks/stage-panel.d.ts

@@ -0,0 +1,5 @@
+declare function StagePanel({ shadow, className, children, ...props }: Omit<React.ComponentProps<"section">, "ref"> & {
+    shadow?: boolean;
+}): import("react").JSX.Element;
+export { StagePanel };
+//# sourceMappingURL=stage-panel.d.ts.map

package/dist/blocks/stage-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stage-panel.d.ts","sourceRoot":"","sources":["../../src/blocks/stage-panel.tsx"],"names":[],"mappings":"AA4BA,iBAAS,UAAU,CAAC,EAClB,MAAa,EACb,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG;IAChD,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,+BAyBA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/blocks/stage-panel.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Panel } from "../ui/panel.js";
+import { cn } from "../lib/cloudgrid-cn.js";
+/**
+ * The purple stage: a `Panel` carrying its own texture, a white hairline grid plus
+ * the wordmark's socket, both drawn in CSS and inline SVG so nothing loads.
+ *
+ * Ported from v0's `site/StagePanel`. Kept on the operator's instruction recorded
+ * in its header: the first-seats pitch left the homepage, but "definitely keep
+ * this element in our design system", especially the background.
+ *
+ * v0 drew the texture with `rgba(255, 255, 255, 0.07)` and `rgba(255, 255, 255,
+ * 0.1)`. Both are literal colours, which the literal gate correctly refuses. They
+ * are derived from `currentColor` here instead, which inside a panel already
+ * resolves to the flipped text colour, so the texture is white on purple without a
+ * hardcoded white anywhere, and it follows the surface if this is ever used on
+ * ink. `color-mix(in oklch, ...)` rather than `oklch(...)`, which the gate also
+ * bans, and the same construction `button.tsx` already uses.
+ *
+ * The socket is `aria-hidden`, as is the grid: both are texture, and a screen
+ * reader announcing a decorative wordmark twice per page is noise.
+ */
+/** The socket from the brand wordmark, the "o" of CloudGrid. Same path the favicon
+ *  carries, so it is replaced from the brand asset rather than edited. */
+const SOCKET_PATH = "M73.507 15.918C79.2174 15.918 83.9637 17.7685 87.6718 21.3962C91.4541 25.0239 93.3088 29.6883 93.3088 35.4631C93.3088 41.2378 91.454 45.9761 87.6718 49.6038C85.0356 52.1829 81.8742 53.8602 78.215 54.6154C77.054 54.855 76.0252 53.9204 76.0252 52.7349V47.5482C76.0252 46.6336 76.6575 45.8569 77.493 45.4848C81.0368 43.9067 83.2962 40.1577 83.2962 35.4872C83.2962 34.0556 83.0947 32.7167 82.7167 31.5015C82.5932 31.1043 82.2168 30.8479 81.8008 30.8479H80.8927V27.1501C80.8923 25.785 79.7842 24.6784 78.4167 24.6783C77.0492 24.6783 75.941 25.785 75.9407 27.1501V30.8479H71.3901V27.1501C71.3897 25.785 70.2801 24.6783 68.9126 24.6783C67.5454 24.6787 66.4369 25.7852 66.4366 27.1501V30.8479H65.2899C64.88 30.8479 64.5075 31.0968 64.381 31.4867C63.9866 32.7028 63.7916 34.0384 63.7916 35.4872C63.7916 38.5967 64.6821 41.188 66.5362 43.261C67.4434 44.239 68.4572 44.9856 69.5949 45.4935C70.4337 45.868 71.0717 46.6457 71.0717 47.5643V52.7493C71.0717 53.9323 70.0469 54.8663 68.8877 54.6302C65.2186 53.8826 62.07 52.2003 59.416 49.6038C55.708 45.9761 53.8545 41.2377 53.8545 35.4631C53.8545 29.6884 55.708 25.0239 59.416 21.3962C63.1241 17.7685 67.7966 15.918 73.507 15.918Z";
+function StagePanel({ shadow = true, className, children, ...props }) {
+    return (_jsxs(Panel, { inset: "flush", shadow: shadow, "data-slot": "stage-panel", className: cn("relative overflow-hidden", className), ...props, children: [_jsx("span", { "aria-hidden": "true", className: "pointer-events-none absolute inset-0 [background-image:repeating-linear-gradient(to_right,color-mix(in_oklch,currentColor_7%,transparent)_0_1px,transparent_1px_64px),repeating-linear-gradient(to_bottom,color-mix(in_oklch,currentColor_7%,transparent)_0_1px,transparent_1px_64px)]" }), _jsx("span", { "aria-hidden": "true", className: "pointer-events-none absolute -right-[3%] -bottom-[14%] w-[clamp(180px,24vw,300px)] text-[color-mix(in_oklch,currentColor_10%,transparent)]", children: _jsx("svg", { viewBox: "41.58 3.28 64 64", fill: "currentColor", className: "h-auto w-full", children: _jsx("path", { d: SOCKET_PATH }) }) }), _jsx("div", { className: "relative", children: children })] }));
+}
+export { StagePanel };
+//# sourceMappingURL=stage-panel.js.map

package/dist/blocks/stage-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stage-panel.js","sourceRoot":"","sources":["../../src/blocks/stage-panel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAA;AAC3C,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AAEvC;;;;;;;;;;;;;;;;;;GAkBG;AAEH;0EAC0E;AAC1E,MAAM,WAAW,GACf,+oCAA+oC,CAAA;AAEjpC,SAAS,UAAU,CAAC,EAClB,MAAM,GAAG,IAAI,EACb,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EAGT;IACC,OAAO,CACL,MAAC,KAAK,IACJ,KAAK,EAAC,OAAO,EACb,MAAM,EAAE,MAAM,eACJ,aAAa,EACvB,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,SAAS,CAAC,KAChD,KAAK,aAET,8BACc,MAAM,EAClB,SAAS,EAAC,wRAAwR,GAClS,EACF,8BACc,MAAM,EAClB,SAAS,EAAC,4IAA4I,YAEtJ,cAAK,OAAO,EAAC,kBAAkB,EAAC,IAAI,EAAC,cAAc,EAAC,SAAS,EAAC,eAAe,YAC3E,eAAM,CAAC,EAAE,WAAW,GAAI,GACpB,GACD,EAEP,cAAK,SAAS,EAAC,UAAU,YAAE,QAAQ,GAAO,IACpC,CACT,CAAA;AACH,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/blocks/step-item.d.ts

@@ -0,0 +1,24 @@
+/**
+ * One numbered step. Renders an `<li>`, so wrap a set in an `<ol>`.
+ *
+ * That wrapping is not cosmetic. The numeral badge is `aria-hidden`, because the
+ * `<ol>` already numbers the list for a screen reader and reading "1 1 Plug it"
+ * is worse than reading "1 Plug it". Drop one of these outside an `<ol>` and the
+ * numbers stop existing for anyone not looking at the screen. `StepList` below
+ * exists so that is the easy path rather than the remembered one.
+ *
+ * Ported from v0's `core/StepItem`, keeping its note: the numeral is the cyan
+ * "go" accent, so a step list is usually the one cyan thing on its page. Do not
+ * put an accent button beside one.
+ *
+ * One deliberate change. v0's badge is 26px, which is on no step of the 4px
+ * spacing ramp. This is 24px (`size-6`), which is. Two pixels, and it stops the
+ * component being the reason someone thinks the ramp has exceptions.
+ */
+declare function StepList({ className, ...props }: React.ComponentProps<"ol">): import("react").JSX.Element;
+declare function StepItem({ index, title, className, children, ...props }: React.ComponentProps<"li"> & {
+    index: number;
+    title: string;
+}): import("react").JSX.Element;
+export { StepItem, StepList };
+//# sourceMappingURL=step-item.d.ts.map

package/dist/blocks/step-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"step-item.d.ts","sourceRoot":"","sources":["../../src/blocks/step-item.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,+BAepE;AAED,iBAAS,QAAQ,CAAC,EAChB,KAAK,EACL,KAAK,EACL,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd,+BAqBA;AAED,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAA"}

package/dist/blocks/step-item.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cloudgrid-cn.js";
+/**
+ * One numbered step. Renders an `<li>`, so wrap a set in an `<ol>`.
+ *
+ * That wrapping is not cosmetic. The numeral badge is `aria-hidden`, because the
+ * `<ol>` already numbers the list for a screen reader and reading "1 1 Plug it"
+ * is worse than reading "1 Plug it". Drop one of these outside an `<ol>` and the
+ * numbers stop existing for anyone not looking at the screen. `StepList` below
+ * exists so that is the easy path rather than the remembered one.
+ *
+ * Ported from v0's `core/StepItem`, keeping its note: the numeral is the cyan
+ * "go" accent, so a step list is usually the one cyan thing on its page. Do not
+ * put an accent button beside one.
+ *
+ * One deliberate change. v0's badge is 26px, which is on no step of the 4px
+ * spacing ramp. This is 24px (`size-6`), which is. Two pixels, and it stops the
+ * component being the reason someone thinks the ramp has exceptions.
+ */
+function StepList({ className, ...props }) {
+    return (_jsx("ol", { 
+        // Explicit, and load-bearing. WebKit drops the implicit `list` role from an
+        // <ol> when list-style is none, and the numeral in each item is aria-hidden
+        // because the list is supposed to be doing the numbering. Without this,
+        // VoiceOver gets neither: the badge is hidden and the enumeration is gone,
+        // which is the exact outcome StepItem's comment exists to prevent. Raised
+        // in review on #42.
+        role: "list", "data-slot": "step-list", className: cn("flex list-none flex-col gap-5 p-0", className), ...props }));
+}
+function StepItem({ index, title, className, children, ...props }) {
+    return (_jsxs("li", { "data-slot": "step-item", className: cn("flex items-start gap-4", className), ...props, children: [_jsx("span", { "aria-hidden": "true", className: "flex size-6 shrink-0 items-center justify-center rounded-pill bg-cyan text-caption font-bold text-on-accent", children: index }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [_jsx("span", { className: "text-heading-sm font-medium text-ink", children: title }), children ? _jsx("div", { className: "text-body-sm text-body", children: children }) : null] })] }));
+}
+export { StepItem, StepList };
+//# sourceMappingURL=step-item.js.map

package/dist/blocks/step-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step-item.js","sourceRoot":"","sources":["../../src/blocks/step-item.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AAEvC;;;;;;;;;;;;;;;;GAgBG;AACH,SAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA8B;IACnE,OAAO,CACL;QACE,4EAA4E;QAC5E,4EAA4E;QAC5E,wEAAwE;QACxE,2EAA2E;QAC3E,0EAA0E;QAC1E,oBAAoB;QACpB,IAAI,EAAC,MAAM,eACD,WAAW,EACrB,SAAS,EAAE,EAAE,CAAC,mCAAmC,EAAE,SAAS,CAAC,KACzD,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,QAAQ,CAAC,EAChB,KAAK,EACL,KAAK,EACL,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EAIT;IACC,OAAO,CACL,2BACY,WAAW,EACrB,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,SAAS,CAAC,KAC9C,KAAK,aAET,8BACc,MAAM,EAClB,SAAS,EAAC,6GAA6G,YAEtH,KAAK,GACD,EACP,eAAK,SAAS,EAAC,oCAAoC,aACjD,eAAM,SAAS,EAAC,sCAAsC,YAAE,KAAK,GAAQ,EAGpE,QAAQ,CAAC,CAAC,CAAC,cAAK,SAAS,EAAC,wBAAwB,YAAE,QAAQ,GAAO,CAAC,CAAC,CAAC,IAAI,IACvE,IACH,CACN,CAAA;AACH,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAA"}

package/dist/blocks/tool-logo.d.ts

@@ -0,0 +1,15 @@
+declare function ToolLogo({ name, mark, hex, size, tone, opticalScale, className, ...props }: Omit<React.ComponentProps<"span">, "ref"> & {
+    /** Display name. Used for the monogram fallback and nothing else. */
+    name: string;
+    /** The vendor's own mark. An inline SVG, sized by this component. */
+    mark?: React.ReactNode;
+    /** The vendor's brand hex, without the leading #. Ignored if too dark for ink. */
+    hex?: string;
+    size?: number;
+    /** `ink` ignores the brand hex and follows currentColor everywhere. */
+    tone?: "brand" | "ink";
+    /** Nudge for artwork that sits deep in its viewBox. 1.16 suits some sets. */
+    opticalScale?: number;
+}): import("react").JSX.Element;
+export { ToolLogo };
+//# sourceMappingURL=tool-logo.d.ts.map

package/dist/blocks/tool-logo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tool-logo.d.ts","sourceRoot":"","sources":["../../src/blocks/tool-logo.tsx"],"names":[],"mappings":"AAgDA,iBAAS,QAAQ,CAAC,EAChB,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,IAAS,EACT,IAAc,EACd,YAAgB,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG;IAC7C,qEAAqE;IACrE,IAAI,EAAE,MAAM,CAAA;IACZ,qEAAqE;IACrE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,kFAAkF;IAClF,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,uEAAuE;IACvE,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IACtB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,+BA8CA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}