@nanisoft/prism-ui 0.10.2 → 0.13.0

package/dist/blocks/site-navbar/site-navbar.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ProductMark } from '../../components/ui/product-mark.js';
+import { cn } from '../../lib/utils.js';
+import { NavbarControls } from './navbar-controls.js';
+/**
+ * The bar at the top of a product site, with the controls a reader needs on every
+ * page of it.
+ *
+ * It is `SiteHeader` plus the four controls that were missing from it, and it
+ * exists because all five NaniSoft sites had the same bar and every one of them had
+ * written the missing four separately: Prism's own site had search and a colour
+ * chooser and no way to reach its four siblings, and each of the four had a row of
+ * product marks where a menu belongs and no search, no mode control and no
+ * navigation at all below the width its own row stopped fitting. Five bars, one
+ * design language, and no two of them the same bar.
+ *
+ * Every string is a prop and the Block ships none. There is no site name, no
+ * default navigation, no "Search", no list of packs and no list of sites: a bar
+ * that hardcoded any of them would hand every consumer a claim about a product that
+ * is not theirs, which is the defect this Block exists to remove. The one piece of
+ * copy it derives is a pack's own name from its own identifier, and only when the
+ * caller names none.
+ *
+ * **The bar is one flex row that wraps, and it fits by measurement.** The brand
+ * lockup and the controls hold their ends, the navigation sits in the middle, and
+ * the navigation row is hidden below `lg` where the panel takes over. The brand
+ * lockup is the one element that never wraps: a wordmark broken across two lines is
+ * not a wordmark, and it is also the one element that yields rather than pushing a
+ * control off the right edge of the viewport, which is the harm a header-fit test
+ * exists to catch.
+ *
+ * **The navigation is a `nav` and the sites menu is a second landmark of its own.**
+ * A reader who navigates by landmark needs two regions rather than one region with
+ * two lists in it, and the two sets are different places: one is where this site
+ * goes and the other is where the family goes. The controls are not a region at
+ * all, because they are whatever this bar composed plus whatever the consumer put
+ * in `actions`, and wrapping them in a landmark would be a claim about content the
+ * Block does not own.
+ *
+ * The bottom hairline is `border-border`, so the bar separates from the page by a
+ * line rather than by a fill change, which is how every surface in this system is
+ * separated: in the base pack `background` and `card` resolve to the same value, so
+ * a fill is not available as a separator. The bar is translucent and blurred, so the
+ * content scrolling under it is legible through it rather than hidden by it, which
+ * is the reason a sticky bar can be translucent at all.
+ *
+ * **It is a server Component with one client island inside it.** The lockup and the
+ * navigation are rendered on the server and ship no JavaScript; the controls are a
+ * single boundary, because a control's state is a reader's state. A site that
+ * passes no `search`, `sites`, `theme`, `mode` or `nav` renders the whole bar on the
+ * server and ships none, which is the arrangement a static site wants and the reason
+ * those props are optional rather than required.
+ */
+export function SiteNavbar({ product, homeHref = '/', defaultPack, defaultMode, nav, navLabel, currentPath, sites, currentSiteId, sitesLabel, search, theme, mode, mobileLabels, actions, sticky = true, className, }) {
+    const links = nav ?? [];
+    const isCurrent = (link) => link.current ?? (currentPath !== undefined && link.href === currentPath);
+    return (_jsx("header", { "data-slot": "site-navbar", className: cn('border-border/80 bg-background/80 sticky top-0 z-20 w-full border-b backdrop-blur', className), children: _jsxs("div", { className: "mx-auto flex h-14 w-full max-w-page items-center gap-2 px-6", children: [_jsx("a", { href: homeHref, className: "focus-visible:border-ring focus-visible:ring-ring shrink-0 rounded-sm focus-visible:ring-[3px] focus-visible:outline-none", children: _jsx(ProductMark, { id: product.id, name: product.name, pack: product.pack, size: "sm" }) }), links.length > 0 ? (_jsx("nav", { "aria-label": navLabel, className: "hidden items-center lg:flex", children: links.map((link) => (_jsx("a", { href: link.href, "aria-current": isCurrent(link) ? 'page' : undefined, rel: link.newTab ? 'noopener noreferrer' : undefined, target: link.newTab ? '_blank' : undefined, className: isCurrent(link)
+                            ? 'bg-accent text-accent-foreground focus-visible:border-ring focus-visible:ring-ring rounded-md px-2 py-1.5 text-sm font-medium transition-colors focus-visible:ring-[3px] focus-visible:outline-none'
+                            : 'text-muted-foreground hover:bg-accent hover:text-accent-foreground focus-visible:border-ring focus-visible:ring-ring rounded-md px-2 py-1.5 text-sm font-medium transition-colors focus-visible:ring-[3px] focus-visible:outline-none', children: link.label }, link.href))) })) : null, _jsx(NavbarControls, { product: product, nav: links.map((link) => ({ ...link, current: isCurrent(link) })), navLabel: navLabel, sites: sites, currentSiteId: currentSiteId, sitesLabel: sitesLabel, search: search, theme: theme, mode: mode, mobileLabels: mobileLabels, defaultPack: defaultPack, defaultMode: defaultMode, actions: actions })] }) }));
+}
+export default SiteNavbar;

package/dist/blocks/site-navbar/sites-menu.d.ts

@@ -0,0 +1,40 @@
+import type { SwitcherProduct } from '../../components/ui/product-switcher.js';
+/** The props the sites menu takes. */
+export type SitesMenuProps = {
+    /** The set to move between, in the order a reader should meet it. */
+    sites: readonly SwitcherProduct[];
+    /** The `id` of the site the reader is on. Marked `aria-current="page"`. */
+    currentId?: string;
+    /** The accessible name of the menu and of its trigger. A word a reader hears. */
+    label: string;
+};
+/**
+ * The set of sites, as a menu.
+ *
+ * Prism's own site had no way to reach its four siblings and each of the four had
+ * written its own way to reach the other four, so a reader on one site had to know
+ * that four other hosts existed before they could be found. This is the one control
+ * that states the set, and every site that composes it states the same five.
+ *
+ * **The trigger is an icon rather than a word, for the same reason Prism's search
+ * trigger is.** The bar carries the brand, the site's own destinations and a row of
+ * controls, and at the width the row is authored to fit, a fourth labelled control
+ * is the difference between fitting and folding the brand onto two lines. A control
+ * that is not a destination is the right place to spend that width, because a
+ * reader who does not recognise the icon is losing a word rather than a route.
+ *
+ * **The items are links, not commands, and the current one is marked rather than
+ * styled.** A menu item that navigated was a command wearing a link's clothes, and
+ * the cost of that is a reader with a middle-click expecting a new tab and getting
+ * nothing. `aria-current="page"` on the member the reader is on is the state a
+ * screen reader announces, and it is why the set is a list of anchors inside a menu
+ * rather than a `ProductSwitcher` row: the switcher renders every mark at once and
+ * this renders them on demand, which is what makes room for the icon-only trigger.
+ *
+ * Each item carries the site's own `ProductMark`, so a reader recognises a
+ * destination by its colour before they read its name, and the mark is where a
+ * pack boundary is safe: it is a fully rounded disc, so repointing the pack's corner
+ * radius beneath it moves nothing about its shape.
+ */
+export declare function SitesMenu({ sites, currentId, label }: SitesMenuProps): import("react").JSX.Element | null;
+//# sourceMappingURL=sites-menu.d.ts.map

package/dist/blocks/site-navbar/sites-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sites-menu.d.ts","sourceRoot":"","sources":["../../../src/blocks/site-navbar/sites-menu.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAA;AAE3E,sCAAsC;AACtC,MAAM,MAAM,cAAc,GAAG;IAC3B,qEAAqE;IACrE,KAAK,EAAE,SAAS,eAAe,EAAE,CAAA;IACjC,2EAA2E;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,iFAAiF;IACjF,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,cAAc,sCAmDpE"}

package/dist/blocks/site-navbar/sites-menu.js

@@ -0,0 +1,48 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { LayoutGrid } from 'lucide-react';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuTrigger, } from '../../components/ui/dropdown-menu.js';
+import { ProductMark } from '../../components/ui/product-mark.js';
+/**
+ * The set of sites, as a menu.
+ *
+ * Prism's own site had no way to reach its four siblings and each of the four had
+ * written its own way to reach the other four, so a reader on one site had to know
+ * that four other hosts existed before they could be found. This is the one control
+ * that states the set, and every site that composes it states the same five.
+ *
+ * **The trigger is an icon rather than a word, for the same reason Prism's search
+ * trigger is.** The bar carries the brand, the site's own destinations and a row of
+ * controls, and at the width the row is authored to fit, a fourth labelled control
+ * is the difference between fitting and folding the brand onto two lines. A control
+ * that is not a destination is the right place to spend that width, because a
+ * reader who does not recognise the icon is losing a word rather than a route.
+ *
+ * **The items are links, not commands, and the current one is marked rather than
+ * styled.** A menu item that navigated was a command wearing a link's clothes, and
+ * the cost of that is a reader with a middle-click expecting a new tab and getting
+ * nothing. `aria-current="page"` on the member the reader is on is the state a
+ * screen reader announces, and it is why the set is a list of anchors inside a menu
+ * rather than a `ProductSwitcher` row: the switcher renders every mark at once and
+ * this renders them on demand, which is what makes room for the icon-only trigger.
+ *
+ * Each item carries the site's own `ProductMark`, so a reader recognises a
+ * destination by its colour before they read its name, and the mark is where a
+ * pack boundary is safe: it is a fully rounded disc, so repointing the pack's corner
+ * radius beneath it moves nothing about its shape.
+ */
+export function SitesMenu({ sites, currentId, label }) {
+    if (sites.length === 0)
+        return null;
+    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { "data-slot": "site-navbar-sites-trigger", "aria-label": label, className: "border-border bg-card text-muted-foreground hover:bg-accent hover:text-accent-foreground data-[popup-open]:bg-accent data-[popup-open]:text-accent-foreground size-11 shrink-0 rounded-full border", children: _jsx(LayoutGrid, { "aria-hidden": true, className: "size-4" }) }), _jsx(DropdownMenuContent, { align: "end", sideOffset: 8, className: "min-w-56", children: _jsxs(DropdownMenuGroup, { children: [_jsx(DropdownMenuLabel, { children: label }), sites.map((site) => {
+                            const current = site.id === currentId;
+                            return (_jsx(DropdownMenuItem, { 
+                                /*
+                                 * Rendered AS the link rather than wrapping one. A focusable menu
+                                 * item with an anchor inside it is two tab stops for one row, and a
+                                 * reader who middle-clicks a row that only looks like a link gets no
+                                 * new tab and no way to tell that the row was a link at all.
+                                 */
+                                render: _jsx("a", { href: site.href, target: "_blank", rel: "noopener noreferrer", "aria-current": current ? 'page' : undefined, "data-current": current ? 'true' : undefined }), children: _jsx(ProductMark, { id: site.id, name: site.name, pack: site.pack, size: "sm" }) }, site.id));
+                        })] }) })] }));
+}

package/dist/blocks/site-navbar/theme-menu.d.ts

@@ -0,0 +1,47 @@
+import { type PackId } from '../../theming/index.js';
+/** One pack the menu offers, and the word a reader reads for it. */
+export type ThemePack = {
+    /** The pack identifier, which is a token rather than a string. */
+    id: PackId;
+    /** The pack's own name. */
+    name: string;
+};
+/** The props the theme menu takes. */
+export type ThemeMenuProps = {
+    /** The packs to choose between. Defaults to every published pack. */
+    packs?: readonly ThemePack[];
+    /** The accessible name of the menu, and of the word on its trigger. */
+    label: string;
+};
+/**
+ * The pack chooser, as a menu.
+ *
+ * **The swatch is a pack boundary rather than a literal colour, and that is the
+ * whole of how this component avoids a runtime token read.** The obvious
+ * implementation reads each pack's compiled `--primary` and paints it as an inline
+ * style, which is what Prism's own documentation site did. A token resolved at
+ * runtime does not follow the cascade, so the dot holding a pack's colour is right
+ * in one mode and stale in the other, and it is the exact defect the
+ * `runtime-token-read` law names: the disagreement is between what is painted and
+ * what the cascade says, and only a program that reads the read can see it.
+ *
+ * `data-pack` on a span carrying `bg-primary` resolves through the cascade, holds
+ * every pack at once, and ships no client code. The boundary is safe on this shape
+ * and only this shape: a pack repoints its own corner radius as well as its colour,
+ * so a boundary on anything that is not fully rounded would quietly restyle that
+ * element's corners. A disc is fully rounded, so the radius axis is a no-op here.
+ *
+ * **It is a radio group rather than a list of commands.** One pack is active at a
+ * time out of a known set, which is what a radio group is for, and it is what
+ * gives the menu its announced state: a reader who opens the chooser hears which
+ * of the packs is in use, where a list of commands would announce six buttons and
+ * leave them to work out which one took effect.
+ *
+ * **The trigger shows the active pack's name, and drops it below `sm`.** Six
+ * options side by side need about 380 pixels, which is why this is a menu at all
+ * rather than a row of pills, and the name on the trigger is the one place the
+ * choice stays visible once the menu is closed. It is hidden rather than shortened
+ * below `sm` because a truncated pack name is a word that names nothing.
+ */
+export declare function ThemeMenu({ packs, label }: ThemeMenuProps): import("react").JSX.Element | null;
+//# sourceMappingURL=theme-menu.d.ts.map

package/dist/blocks/site-navbar/theme-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-menu.d.ts","sourceRoot":"","sources":["../../../src/blocks/site-navbar/theme-menu.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAS,KAAK,MAAM,EAAE,MAAM,eAAe,CAAA;AAElD,oEAAoE;AACpE,MAAM,MAAM,SAAS,GAAG;IACtB,kEAAkE;IAClE,EAAE,EAAE,MAAM,CAAA;IACV,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,sCAAsC;AACtC,MAAM,MAAM,cAAc,GAAG;IAC3B,qEAAqE;IACrE,KAAK,CAAC,EAAE,SAAS,SAAS,EAAE,CAAA;IAC5B,uEAAuE;IACvE,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAcD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,cAAc,sCA8CzD"}

package/dist/blocks/site-navbar/theme-menu.js

@@ -0,0 +1,55 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronDown } from 'lucide-react';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuTrigger, } from '../../components/ui/dropdown-menu.js';
+import { usePrismTheme } from '../../provider/provider.js';
+import { PACKS } from '../../theming/index.js';
+/**
+ * The name a pack is offered under when the caller names none.
+ *
+ * Capitalising the identifier is enough rather than a table, because the pack
+ * vocabulary is closed and every id in it is the lowercased form of its own name.
+ * The alternative is a lookup that could fall through for a pack added after this
+ * line was written, and a fallthrough here is a menu item with no readable name.
+ */
+function nameOf(pack) {
+    return pack.charAt(0).toUpperCase() + pack.slice(1);
+}
+/**
+ * The pack chooser, as a menu.
+ *
+ * **The swatch is a pack boundary rather than a literal colour, and that is the
+ * whole of how this component avoids a runtime token read.** The obvious
+ * implementation reads each pack's compiled `--primary` and paints it as an inline
+ * style, which is what Prism's own documentation site did. A token resolved at
+ * runtime does not follow the cascade, so the dot holding a pack's colour is right
+ * in one mode and stale in the other, and it is the exact defect the
+ * `runtime-token-read` law names: the disagreement is between what is painted and
+ * what the cascade says, and only a program that reads the read can see it.
+ *
+ * `data-pack` on a span carrying `bg-primary` resolves through the cascade, holds
+ * every pack at once, and ships no client code. The boundary is safe on this shape
+ * and only this shape: a pack repoints its own corner radius as well as its colour,
+ * so a boundary on anything that is not fully rounded would quietly restyle that
+ * element's corners. A disc is fully rounded, so the radius axis is a no-op here.
+ *
+ * **It is a radio group rather than a list of commands.** One pack is active at a
+ * time out of a known set, which is what a radio group is for, and it is what
+ * gives the menu its announced state: a reader who opens the chooser hears which
+ * of the packs is in use, where a list of commands would announce six buttons and
+ * leave them to work out which one took effect.
+ *
+ * **The trigger shows the active pack's name, and drops it below `sm`.** Six
+ * options side by side need about 380 pixels, which is why this is a menu at all
+ * rather than a row of pills, and the name on the trigger is the one place the
+ * choice stays visible once the menu is closed. It is hidden rather than shortened
+ * below `sm` because a truncated pack name is a word that names nothing.
+ */
+export function ThemeMenu({ packs, label }) {
+    const { pack, setPack } = usePrismTheme();
+    const options = packs ?? PACKS.map((id) => ({ id, name: nameOf(id) }));
+    const active = options.find((option) => option.id === pack) ?? options[0];
+    if (!active)
+        return null;
+    return (_jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { "data-slot": "site-navbar-theme-trigger", "aria-label": `${label}: ${active.name}`, className: "border-border bg-card text-foreground hover:bg-accent hover:text-accent-foreground data-[popup-open]:bg-accent data-[popup-open]:text-accent-foreground h-11 shrink-0 gap-2 rounded-full border pr-2.5 pl-3", children: [_jsx("span", { "data-pack": active.id, "aria-hidden": true, className: "border-border/60 bg-primary size-3.5 rounded-full border" }), _jsx("span", { className: "hidden sm:inline", children: active.name }), _jsx(ChevronDown, { "aria-hidden": true, className: "size-3.5" })] }), _jsx(DropdownMenuContent, { align: "end", sideOffset: 8, className: "min-w-52", children: _jsxs(DropdownMenuRadioGroup, { value: active.id, onValueChange: (value) => setPack(value), children: [_jsx(DropdownMenuLabel, { children: label }), options.map((option) => (_jsxs(DropdownMenuRadioItem, { value: option.id, closeOnClick: true, children: [_jsx("span", { "data-pack": option.id, "aria-hidden": true, className: "border-border/60 bg-primary size-3.5 shrink-0 rounded-full border" }), _jsx("span", { className: "flex-1", children: option.name })] }, option.id)))] }) })] }));
+}

package/dist/blocks/stack-grid-01/index.d.ts

@@ -1,3 +1,3 @@
-export { StackGrid01, default } from './stack-grid';
-export type { StackGrid01Props, StackPart, StackOwn } from './stack-grid';
+export { StackGrid01, default } from './stack-grid.js';
+export type { StackGrid01Props, StackPart, StackOwn } from './stack-grid.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/blocks/stack-grid-01/index.js

@@ -1 +1 @@
-export { StackGrid01, default } from './stack-grid';
+export { StackGrid01, default } from './stack-grid.js';

package/dist/blocks/stack-grid-01/stack-grid.d.ts

@@ -1,14 +1,40 @@
-import { type HeadingLevel } from '../../components/ui/section';
+import { type HeadingLevel } from '../../components/ui/section.js';
 /**
- * One part a product is assembled from: its name and the role it plays.
+ * One part a product is assembled from: its name, the product it wraps when the
+ * name is a codename, and the role it plays.
  *
- * Both are required, and a part with no role is a logo and a part with no name
- * is a role. A survey grid is a claim that a set of parts is sufficient, and both
- * halves of that claim are the caller's to make.
+ * `name` and `role` are required, and a part with no role is a logo and a part
+ * with no name is a role. A survey grid is a claim that a set of parts is
+ * sufficient, and both halves of that claim are the caller's to make.
  */
 export type StackPart = {
     /** The part's own name, as its authors spell it. */
     name: string;
+    /**
+     * The real product underneath a codename, when the name above is not a name a
+     * reader could look up.
+     *
+     * Optional and additive: a part whose name already is its product's own name
+     * omits it, and a tile that omits it renders the two elements it rendered
+     * before this field existed, with no line and no space held open for one.
+     *
+     * It is a field and not a slot, because the value goes inside the tile this
+     * Block already draws. A slot is a value that goes in an element the Block does
+     * not own, and a `StackPart` is a part's data, which is the `li` the Block
+     * renders. It is the same shape as `ProductGrid01`'s `pack` and
+     * `StatusLedger01`'s `detail`: one more value in a row the caller owns.
+     *
+     * Three of the four NaniSoft sites publish their stack under a codename with
+     * the product printed beneath it, and the missing field is what made the
+     * migration drop eight published names rather than move them. It is also the
+     * evidence for the claim the section makes: a grid that says it composes rather
+     * than forks can only be checked by a reader who can see what it composed.
+     *
+     * Pass it when it differs from `name`. The Block renders what it is handed and
+     * does not compare the two, so a caller that passes one name twice prints it
+     * twice.
+     */
+    realName?: string;
     /**
      * One phrase about what the part does here. It is a role rather than a
      * description: the grid is a survey of what a product is built from, not a
@@ -34,9 +60,9 @@ export type StackOwn = {
 /**
  * The props a StackGrid01 takes.
  *
- * Every string is a prop and the Block ships none: no part, no role, no blurb
- * and no default "built in-house" mark. A grid that hardcoded a part list would
- * hand every consumer a survey of somebody else's stack.
+ * Every string is a prop and the Block ships none: no part, no role, no
+ * realName, no blurb and no default "built in-house" mark. A grid that hardcoded
+ * a part list would hand every consumer a survey of somebody else's stack.
  */
 export type StackGrid01Props = {
     /** Optional label above the section title. See the No-Default-Eyebrow Rule. */
@@ -107,9 +133,14 @@ export type StackGrid01Props = {
  * the claim is the caller's words. Three of the four sites write three different
  * ones, and the Block does not choose.
  *
- * A tile carries a name and a role and nothing else. A part whose role needs two
- * lines belongs in the section's `description`, where it applies to the group
- * rather than to one tile.
+ * A tile carries a name, the real product behind it when the name is a codename,
+ * and a role. The middle value is optional and additive: eight of the sixteen
+ * parts on the three sites that draw this section are a codename over a product
+ * its reader could look up, and before the field existed the honest answer
+ * inside this surface was to lose those names. A part whose *role* needs two
+ * lines still belongs in the section's `description`, where it applies to the
+ * group rather than to one tile, because that is a claim about every tile rather
+ * than a second name for one of them.
  *
  * It is a server Component: no hook, no state and no client code.
  */

package/dist/blocks/stack-grid-01/stack-grid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stack-grid.d.ts","sourceRoot":"","sources":["../../../src/blocks/stack-grid-01/stack-grid.tsx"],"names":[],"mappings":"AACA,OAAO,EAA2B,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAGxF;;;;;;GAMG;AACH,MAAM,MAAM,SAAS,GAAG;IACtB,oDAAoD;IACpD,IAAI,EAAE,MAAM,CAAA;IACZ;;;;OAIG;IACH,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED;;;;;;;;GAQG;AACH,MAAM,MAAM,QAAQ,GAAG;IACrB,gCAAgC;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,+DAA+D;IAC/D,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,+EAA+E;IAC/E,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,KAAK,EAAE,SAAS,SAAS,EAAE,CAAA;IAC3B;;;;OAIG;IACH,GAAG,CAAC,EAAE,SAAS,QAAQ,EAAE,CAAA;IACzB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,KAAK,EACL,WAAW,EACX,KAAK,EACL,GAAG,EACH,QAAQ,EACR,OAAO,EACP,YAAmB,EACnB,SAAS,GACV,EAAE,gBAAgB,+BA4DlB;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"stack-grid.d.ts","sourceRoot":"","sources":["../../../src/blocks/stack-grid-01/stack-grid.tsx"],"names":[],"mappings":"AACA,OAAO,EAAuC,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAGpG;;;;;;;GAOG;AACH,MAAM,MAAM,SAAS,GAAG;IACtB,oDAAoD;IACpD,IAAI,EAAE,MAAM,CAAA;IACZ;;;;;;;;;;;;;;;;;;;;;;;OAuBG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;;OAIG;IACH,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED;;;;;;;;GAQG;AACH,MAAM,MAAM,QAAQ,GAAG;IACrB,gCAAgC;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,+DAA+D;IAC/D,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,+EAA+E;IAC/E,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,KAAK,EAAE,SAAS,SAAS,EAAE,CAAA;IAC3B;;;;OAIG;IACH,GAAG,CAAC,EAAE,SAAS,QAAQ,EAAE,CAAA;IACzB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,KAAK,EACL,WAAW,EACX,KAAK,EACL,GAAG,EACH,QAAQ,EACR,OAAO,EACP,YAAmB,EACnB,SAAS,GACV,EAAE,gBAAgB,+BA6ElB;AAED,eAAe,WAAW,CAAA"}

package/dist/blocks/stack-grid-01/stack-grid.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Card, CardContent, CardHeader, CardTitle } from '../../components/ui/card';
-import { Section, SectionHeading } from '../../components/ui/section';
-import { cn } from '../../lib/utils';
+import { Card, CardContent, CardHeader, CardTitle } from '../../components/ui/card.js';
+import { Section, SectionHeading, childLevel } from '../../components/ui/section.js';
+import { cn } from '../../lib/utils.js';
 /**
  * A survey of what a product is assembled from, and what it built itself.
  *
@@ -32,18 +32,26 @@ import { cn } from '../../lib/utils';
  * the claim is the caller's words. Three of the four sites write three different
  * ones, and the Block does not choose.
  *
- * A tile carries a name and a role and nothing else. A part whose role needs two
- * lines belongs in the section's `description`, where it applies to the group
- * rather than to one tile.
+ * A tile carries a name, the real product behind it when the name is a codename,
+ * and a role. The middle value is optional and additive: eight of the sixteen
+ * parts on the three sites that draw this section are a codename over a product
+ * its reader could look up, and before the field existed the honest answer
+ * inside this surface was to lose those names. A part whose *role* needs two
+ * lines still belongs in the section's `description`, where it applies to the
+ * group rather than to one tile, because that is a claim about every tile rather
+ * than a second name for one of them.
  *
  * It is a server Component: no hook, no state and no client code.
  */
 export function StackGrid01({ eyebrow, title, description, parts, own, ownLabel, caption, headingLevel = 'h2', className, }) {
+    // Both groups are sets of tiles under one section, so a tile name is a heading
+    // one step below it rather than a sibling of it.
+    const Title = childLevel(headingLevel);
     if (own !== undefined && own.length > 0 && !ownLabel) {
         throw new Error('StackGrid01: the in-house group was passed with no ownLabel, so the grid would make the claim ' +
             '"this part is ours" in a shape and leave the words to a reader to infer. Pass the words you mean, ' +
             'or omit the group.');
     }
-    return (_jsxs(Section, { children: [title ? (_jsx(SectionHeading, { as: headingLevel, align: "left", eyebrow: eyebrow, title: title, description: description, className: "mb-12" })) : null, _jsxs("div", { "data-slot": "stack-grid", className: cn('flex flex-col gap-10', className), children: [_jsx("ul", { className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-4", children: parts.map((part) => (_jsx("li", { children: _jsxs(Card, { className: "bg-muted h-full gap-2 py-4", children: [_jsx(CardHeader, { className: "gap-1", children: _jsx(CardTitle, { className: "text-sm", children: part.name }) }), _jsx(CardContent, { children: _jsx("p", { className: "text-muted-foreground text-pretty text-xs", children: part.role }) })] }) }, part.name))) }), own && own.length > 0 ? (_jsx("ul", { "data-slot": "stack-grid-own", className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-4", children: own.map((entry) => (_jsx("li", { children: _jsxs(Card, { className: "border-primary shadow-md h-full gap-2 py-4", children: [_jsxs(CardHeader, { className: "gap-1", children: [_jsx("span", { className: "text-muted-foreground font-mono text-xs", children: ownLabel }), _jsx(CardTitle, { className: "text-sm", children: entry.name })] }), _jsx(CardContent, { children: _jsx("p", { className: "text-muted-foreground text-pretty text-xs", children: entry.blurb }) })] }) }, entry.name))) })) : null] }), caption ? _jsx("p", { className: "text-muted-foreground mt-6 text-pretty text-sm", children: caption }) : null] }));
+    return (_jsxs(Section, { children: [title ? (_jsx(SectionHeading, { as: headingLevel, align: "left", eyebrow: eyebrow, title: title, description: description, className: "mb-12" })) : null, _jsxs("div", { "data-slot": "stack-grid", className: cn('flex flex-col gap-10', className), children: [_jsx("ul", { className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-4", children: parts.map((part) => (_jsx("li", { children: _jsxs(Card, { className: "bg-muted h-full gap-2 py-4", children: [_jsxs(CardHeader, { className: "gap-1", children: [_jsx(CardTitle, { className: "text-sm", children: _jsx(Title, { children: part.name }) }), part.realName ? (_jsx("span", { className: "text-muted-foreground font-mono text-xs", children: part.realName })) : null] }), _jsx(CardContent, { children: _jsx("p", { className: "text-muted-foreground text-pretty text-xs", children: part.role }) })] }) }, part.name))) }), own && own.length > 0 ? (_jsx("ul", { "data-slot": "stack-grid-own", className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-4", children: own.map((entry) => (_jsx("li", { children: _jsxs(Card, { className: "border-primary shadow-md h-full gap-2 py-4", children: [_jsxs(CardHeader, { className: "gap-1", children: [_jsx("span", { className: "text-muted-foreground font-mono text-xs", children: ownLabel }), _jsx(CardTitle, { className: "text-sm", children: _jsx(Title, { children: entry.name }) })] }), _jsx(CardContent, { children: _jsx("p", { className: "text-muted-foreground text-pretty text-xs", children: entry.blurb }) })] }) }, entry.name))) })) : null] }), caption ? _jsx("p", { className: "text-muted-foreground mt-6 text-pretty text-sm", children: caption }) : null] }));
 }
 export default StackGrid01;

package/dist/blocks/stats-01/index.d.ts

@@ -1,2 +1,10 @@
-export { Stats01, default } from './stats';
+/**
+ * The subpath exports the Block and its props, and the props are exported because
+ * a caller that builds a `Stat[]` has to be able to name the type it is building.
+ * A Block whose prop types are only reachable through inference is a Block whose
+ * callers annotate their arrays as `any`, which is the point at which a rename
+ * stops being caught by the compiler.
+ */
+export { Stats01, default } from './stats.js';
+export type { Stat, Stats01Props } from './stats.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/blocks/stats-01/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/stats-01/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/stats-01/index.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AAC1C,YAAY,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA"}

package/dist/blocks/stats-01/index.js

@@ -1 +1,8 @@
-export { Stats01, default } from './stats';
+/**
+ * The subpath exports the Block and its props, and the props are exported because
+ * a caller that builds a `Stat[]` has to be able to name the type it is building.
+ * A Block whose prop types are only reachable through inference is a Block whose
+ * callers annotate their arrays as `any`, which is the point at which a rename
+ * stops being caught by the compiler.
+ */
+export { Stats01, default } from './stats.js';

package/dist/blocks/stats-01/stats.d.ts

@@ -1,4 +1,4 @@
-import { type HeadingLevel } from '../../components/ui/section';
+import { type HeadingLevel } from '../../components/ui/section.js';
 export type Stat = {
     label: string;
     value: string;

package/dist/blocks/stats-01/stats.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ArrowDownRight, ArrowUpRight, Minus } from 'lucide-react';
-import { Card, CardContent } from '../../components/ui/card';
-import { Section, SectionHeading } from '../../components/ui/section';
+import { Card, CardContent } from '../../components/ui/card.js';
+import { Section, SectionHeading } from '../../components/ui/section.js';
 function Delta({ value }) {
     if (value === 0) {
         return (_jsxs("span", { className: "text-muted-foreground flex items-center gap-1 text-xs", children: [_jsx(Minus, { className: "size-3" }), "0%"] }));

package/dist/blocks/status-ledger-01/index.d.ts

@@ -1,3 +1,3 @@
-export { StatusLedger01, STATUS_TIERS, default } from './status-ledger';
-export type { StatusLedger01Props, StatusRow, StatusTier } from './status-ledger';
+export { StatusLedger01, STATUS_TIERS, default } from './status-ledger.js';
+export type { StatusLedger01Props, StatusRow, StatusTier } from './status-ledger.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/blocks/status-ledger-01/index.js

@@ -1 +1 @@
-export { StatusLedger01, STATUS_TIERS, default } from './status-ledger';
+export { StatusLedger01, STATUS_TIERS, default } from './status-ledger.js';

package/dist/blocks/status-ledger-01/status-ledger.d.ts

@@ -1,4 +1,4 @@
-import { type HeadingLevel } from '../../components/ui/section';
+import { type HeadingLevel } from '../../components/ui/section.js';
 /**
  * The four tiers a StatusLedger01 row can be in.
  *

package/dist/blocks/status-ledger-01/status-ledger.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Section, SectionHeading } from '../../components/ui/section';
-import { cn } from '../../lib/utils';
+import { Section, SectionHeading } from '../../components/ui/section.js';
+import { cn } from '../../lib/utils.js';
 /**
  * The four tiers a StatusLedger01 row can be in.
  *

package/dist/catalog.d.ts

@@ -7,7 +7,7 @@
  * the reverse, so the internal shadcn registry stays derived rather than
  * authoritative. Tooling only: a consumer's runtime UI must not import this.
  */
-export declare const CATALOG_KINDS: readonly ["component", "block", "page"];
+export declare const CATALOG_KINDS: readonly ["component", "block", "page", "live"];
 export type CatalogKind = (typeof CATALOG_KINDS)[number];
 export declare const COMPONENT_CATEGORIES: readonly ["Call to action", "Forms and inputs", "Feedback", "Layout", "Data display", "Typography", "Miscellaneous"];
 export type ComponentCategory = (typeof COMPONENT_CATEGORIES)[number];

package/dist/catalog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"catalog.d.ts","sourceRoot":"","sources":["../src/catalog.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,eAAO,MAAM,aAAa,yCAA0C,CAAA;AACpE,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAA;AAExD,eAAO,MAAM,oBAAoB,sHAQvB,CAAA;AACV,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAA;AAErE,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,WAAW,CAAA;IACjB,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAA;IAClC,WAAW,EAAE,MAAM,CAAA;IACnB,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,MAAM,EAAE,CAAA;IACjB,MAAM,EAAE,QAAQ,GAAG,YAAY,CAAA;CAChC;AAED,eAAO,MAAM,OAAO,EAAE,SAAS,WAAW,EAouBzC,CAAA;AAED,sEAAsE;AACtE,wBAAgB,YAAY,CAAC,KAAK,GAAE,SAAS,WAAW,EAAY,GAAG,WAAW,EAAE,CAEnF;AAED,eAAO,MAAM,aAAa,EAAE,WAAW,CAAC,MAAM,EAAE,WAAW,CAE1D,CAAA"}
+{"version":3,"file":"catalog.d.ts","sourceRoot":"","sources":["../src/catalog.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,eAAO,MAAM,aAAa,iDAAkD,CAAA;AAC5E,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAA;AAExD,eAAO,MAAM,oBAAoB,sHAQvB,CAAA;AACV,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAA;AAErE,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,WAAW,CAAA;IACjB,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAA;IAClC,WAAW,EAAE,MAAM,CAAA;IACnB,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,MAAM,EAAE,CAAA;IACjB,MAAM,EAAE,QAAQ,GAAG,YAAY,CAAA;CAChC;AAED,eAAO,MAAM,OAAO,EAAE,SAAS,WAAW,EAisCzC,CAAA;AAED,sEAAsE;AACtE,wBAAgB,YAAY,CAAC,KAAK,GAAE,SAAS,WAAW,EAAY,GAAG,WAAW,EAAE,CAEnF;AAED,eAAO,MAAM,aAAa,EAAE,WAAW,CAAC,MAAM,EAAE,WAAW,CAE1D,CAAA"}