@nanisoft/prism-ui 0.5.0 → 0.6.0

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

@@ -0,0 +1,118 @@
+import { type HeadingLevel } from '../../components/ui/section';
+/**
+ * One part a product is assembled from: its name 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.
+ */
+export type StackPart = {
+    /** The part's own name, as its authors spell it. */
+    name: 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
+     * feature list, and a role that runs to a sentence turns a survey into prose.
+     */
+    role: string;
+};
+/**
+ * One thing a product built itself, rather than assembled: its name and one line
+ * about it.
+ *
+ * The two are required for the same reason `StackPart`'s are, and for one more:
+ * a grid of in-house work beside a grid of assembled parts is a claim that the
+ * work was NaniSoft's own, and that claim needs a name and a line under it to be
+ * a claim a reader can check.
+ */
+export type StackOwn = {
+    /** The component's own name. */
+    name: string;
+    /** One line about what it does and why it is not assembled. */
+    blurb: string;
+};
+/**
+ * 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.
+ */
+export type StackGrid01Props = {
+    /** Optional label above the section title. See the No-Default-Eyebrow Rule. */
+    eyebrow?: string;
+    /** The section title. Omit it for a grid composed under its own heading. */
+    title?: string;
+    /** One or two sentences under the title. */
+    description?: string;
+    /**
+     * The parts the product is assembled from, in the order a reader should meet
+     * them. Order is the caller's because it is a claim about which part matters
+     * first.
+     */
+    parts: readonly StackPart[];
+    /**
+     * The things the product built itself, in the order a reader should meet them.
+     * Omit it for a product that assembled everything, and pass it when the claim
+     * is that some of the work is its own.
+     */
+    own?: readonly StackOwn[];
+    /**
+     * The label on the in-house group, which is the claim the group makes. Omit it
+     * when the group is titled by the section itself, and pass a word you mean:
+     * "built in-house", "built by Nanisoft" and "our own" are three different
+     * claims and the Block does not choose between them.
+     */
+    ownLabel?: string;
+    /**
+     * The line under the grid, for the sentence that qualifies it: what is not
+     * here, or where to read the full list.
+     */
+    caption?: string;
+    /** Heading level for the section title. See `HeadingLevel`. */
+    headingLevel?: HeadingLevel;
+    /**
+     * Layout only, exactly as on every Component. Changing a Prism-owned visual
+     * property from here is prohibited.
+     */
+    className?: string;
+};
+/**
+ * A survey of what a product is assembled from, and what it built itself.
+ *
+ * Three of the four NaniSoft sites publish this section, and each one drew it by
+ * hand with the same two groups: a survey grid of composed parts, each a name
+ * and a role, and below it a second grid of the components the product wrote
+ * itself, each a name and a line about it. Three of them also drew the second
+ * group differently from the first - a dashed border, a different tile, a mark
+ * above the name - because the visual difference is the claim: *this part is
+ * ours*.
+ *
+ * That is what the `own` group is here. It is a separate prop and a separate
+ * grid rather than a flag on the part, because the difference is a claim about
+ * provenance and a claim is not a property of a row: a part that is assembled and
+ * a part that is built are the same kind of thing with a different answer to "who
+ * wrote it", and putting the answer in the row would make the two groups
+ * indistinguishable in the data as well as on screen.
+ *
+ * The two groups differ in weight rather than in colour. The composed parts are
+ * tiles on the muted surface; the in-house parts sit on the page with a
+ * `border-primary` hairline, which is the one place in this system where a border
+ * carries a pack's hue and it is paired with `shadow-md` because it is the one
+ * element that means *lifted*. No step in either group is a pastel fill: a pastel
+ * is a fill for a large area and never a signal, and a tile of pastel behind one
+ * word is a signal a reader has to learn.
+ *
+ * `ownLabel` is required when `own` is passed, because the group is a claim and
+ * 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.
+ *
+ * It is a server Component: no hook, no state and no client code.
+ */
+export declare function StackGrid01({ eyebrow, title, description, parts, own, ownLabel, caption, headingLevel, className, }: StackGrid01Props): import("react").JSX.Element;
+export default StackGrid01;
+//# sourceMappingURL=stack-grid.d.ts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,49 @@
+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';
+/**
+ * A survey of what a product is assembled from, and what it built itself.
+ *
+ * Three of the four NaniSoft sites publish this section, and each one drew it by
+ * hand with the same two groups: a survey grid of composed parts, each a name
+ * and a role, and below it a second grid of the components the product wrote
+ * itself, each a name and a line about it. Three of them also drew the second
+ * group differently from the first - a dashed border, a different tile, a mark
+ * above the name - because the visual difference is the claim: *this part is
+ * ours*.
+ *
+ * That is what the `own` group is here. It is a separate prop and a separate
+ * grid rather than a flag on the part, because the difference is a claim about
+ * provenance and a claim is not a property of a row: a part that is assembled and
+ * a part that is built are the same kind of thing with a different answer to "who
+ * wrote it", and putting the answer in the row would make the two groups
+ * indistinguishable in the data as well as on screen.
+ *
+ * The two groups differ in weight rather than in colour. The composed parts are
+ * tiles on the muted surface; the in-house parts sit on the page with a
+ * `border-primary` hairline, which is the one place in this system where a border
+ * carries a pack's hue and it is paired with `shadow-md` because it is the one
+ * element that means *lifted*. No step in either group is a pastel fill: a pastel
+ * is a fill for a large area and never a signal, and a tile of pastel behind one
+ * word is a signal a reader has to learn.
+ *
+ * `ownLabel` is required when `own` is passed, because the group is a claim and
+ * 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.
+ *
+ * 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, }) {
+    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] }));
+}
+export default StackGrid01;

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

@@ -0,0 +1,2 @@
+export { Stats01, default } from './stats';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1 @@
+export { Stats01, default } from './stats';

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

@@ -0,0 +1,28 @@
+import { type HeadingLevel } from '../../components/ui/section';
+export type Stat = {
+    label: string;
+    value: string;
+    /** Percentage change. Positive reads as growth, negative as decline. */
+    delta?: number;
+    /** Period the delta compares against, e.g. "vs last month". */
+    hint?: string;
+};
+export type Stats01Props = {
+    eyebrow?: string;
+    title?: string;
+    stats: Stat[];
+    /** Heading level for the section title. See `HeadingLevel`. */
+    headingLevel?: HeadingLevel;
+};
+/**
+ * A KPI row. Every number is a prop.
+ *
+ * This block used to carry a hardcoded set reading "128 blocks shipped" and "9.4k
+ * weekly installs". Those were invented figures about a library nobody installs
+ * yet, and because they lived in the component rather than at the call site, a
+ * consumer who installed the block shipped fabricated metrics into their own
+ * dashboard. A stat block with invented stats in it is worse than no stat block.
+ */
+export declare function Stats01({ eyebrow, title, stats, headingLevel }: Stats01Props): import("react").JSX.Element;
+export default Stats01;
+//# sourceMappingURL=stats.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"stats.d.ts","sourceRoot":"","sources":["../../../src/blocks/stats-01/stats.tsx"],"names":[],"mappings":"AAGA,OAAO,EAA2B,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAExF,MAAM,MAAM,IAAI,GAAG;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,+DAA+D;IAC/D,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IACzB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,IAAI,EAAE,CAAA;IACb,+DAA+D;IAC/D,YAAY,CAAC,EAAE,YAAY,CAAA;CAC5B,CAAA;AA2BD;;;;;;;;GAQG;AACH,wBAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,YAAmB,EAAE,EAAE,YAAY,+BAiCnF;AAED,eAAe,OAAO,CAAA"}

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

@@ -0,0 +1,27 @@
+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';
+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%"] }));
+    }
+    const up = value > 0;
+    const Icon = up ? ArrowUpRight : ArrowDownRight;
+    return (_jsxs("span", { className: up
+            ? 'text-success flex items-center gap-1 text-xs'
+            : 'text-destructive flex items-center gap-1 text-xs', children: [_jsx(Icon, { className: "size-3" }), Math.abs(value), "%"] }));
+}
+/**
+ * A KPI row. Every number is a prop.
+ *
+ * This block used to carry a hardcoded set reading "128 blocks shipped" and "9.4k
+ * weekly installs". Those were invented figures about a library nobody installs
+ * yet, and because they lived in the component rather than at the call site, a
+ * consumer who installed the block shipped fabricated metrics into their own
+ * dashboard. A stat block with invented stats in it is worse than no stat block.
+ */
+export function Stats01({ eyebrow, title, stats, headingLevel = 'h2' }) {
+    return (_jsxs(Section, { children: [title ? (_jsx(SectionHeading, { as: headingLevel, eyebrow: eyebrow, title: title, align: "left", className: "mb-10" })) : null, _jsx("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: stats.map((stat) => (_jsx(Card, { className: "gap-2 py-5", children: _jsxs(CardContent, { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-muted-foreground text-sm", children: stat.label }), _jsx("span", { className: "text-2xl font-semibold tracking-tight", children: stat.value }), stat.delta === undefined && !stat.hint ? null : (_jsxs("div", { className: "flex items-center gap-2", children: [stat.delta === undefined ? null : _jsx(Delta, { value: stat.delta }), stat.hint ? (_jsx("span", { className: "text-muted-foreground text-xs", children: stat.hint })) : null] }))] }) }, stat.label))) })] }));
+}
+export default Stats01;

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/status-ledger-01/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACvE,YAAY,EAAE,mBAAmB,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA"}

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

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

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

@@ -0,0 +1,131 @@
+import { type HeadingLevel } from '../../components/ui/section';
+/**
+ * The four tiers a StatusLedger01 row can be in.
+ *
+ * Four, and the fifth is refused deliberately. All four NaniSoft sites publish a
+ * ledger of the same kind - what a product can do today, what is designed, what
+ * is planned, and what is only a direction - and between them they use eight
+ * different words for those four states: `live`, `available` and `complete` all
+ * mean the same thing; `approved`, `specified` and `designed` all mean the next
+ * one; `planned` means the one after; and `direction` means a research direction
+ * that is explicitly not a capability. Eight words for four states is four tiers
+ * with a per-product vocabulary, and the vocabulary belongs in the row's
+ * `statusLabel`, not in the type.
+ *
+ * A fifth tier would be the one that splits a state that does not need splitting -
+ * `deprecated` over `retired`, or a `live` that is not `complete`. Each such tier
+ * is a colour a reader must learn and a word a maintainer must keep true, and a
+ * ladder with more rungs than states is how a status column stops being readable.
+ * The four below are the states; the words are the caller's.
+ */
+export declare const STATUS_TIERS: readonly ["live", "designed", "planned", "direction"];
+/**
+ * One of the four tiers a StatusLedger01 row is in.
+ */
+export type StatusTier = (typeof STATUS_TIERS)[number];
+/**
+ * One row of the ledger: a thing, the state it is in, the words for that state,
+ * and an optional list of what it does.
+ *
+ * `statusLabel` is required and separate from `status` because the tier is a
+ * colour and the words are a claim. A consumer that passed the tier alone would
+ * ship four identical-looking rows to a reader who cannot see colour at all, and
+ * a consumer that passed only the words would have no tier to draw.
+ */
+export type StatusRow = {
+    /**
+     * The name of the thing: a use case, a capability, a stage, a direction. It is
+     * the anchor of the row, so it is the first thing a reader reads.
+     */
+    name: string;
+    /**
+     * Which of the four tiers the thing is in. This is what the dot is drawn from;
+     * it is not the text a reader sees. See `STATUS_TIERS`.
+     */
+    status: StatusTier;
+    /**
+     * The words for the tier, in the product's own vocabulary. Required, and
+     * deliberately not derived from `status`: a site that says "Flagship -
+     * available today" and a site that says "Live" are both describing the same
+     * tier, and neither word is Prism's to choose.
+     */
+    statusLabel: string;
+    /**
+     * The detail line under the name, when the row needs one sentence about what
+     * the thing does.
+     */
+    detail?: string;
+    /**
+     * The bullets the row lists, when the row needs more than one line. A list
+     * rather than a paragraph, because a row that lists four things and describes
+     * them in prose is a paragraph with a bullet glyph.
+     */
+    bullets?: readonly string[];
+};
+/**
+ * The props a StatusLedger01 takes.
+ *
+ * Every string is a prop and the Block ships none: no status word, no tier, no
+ * row and no bullet. A ledger that hardcoded "available" would make every
+ * consumer publish a claim about their own roadmap that they may not be able to
+ * keep.
+ */
+export type StatusLedger01Props = {
+    /** Optional label above the section title. See the No-Default-Eyebrow Rule. */
+    eyebrow?: string;
+    /** The section title. Omit it for a ledger composed under its own heading. */
+    title?: string;
+    /** One or two sentences under the title. */
+    description?: string;
+    /**
+     * The rows, in the order a reader should meet them. Order is the caller's
+     * because it is a claim about what matters first, and a ledger that sorted
+     * itself would be making that claim on the caller's behalf.
+     */
+    rows: readonly StatusRow[];
+    /**
+     * The line under the ledger, for the sentence that qualifies it: what is not
+     * here, or where to read more.
+     */
+    caption?: string;
+    /** Heading level for the section title. See `HeadingLevel`. */
+    headingLevel?: HeadingLevel;
+};
+/**
+ * A ledger of things and the state each is in: a hairline row per entry, a mark
+ * for the tier, and the words for the state beside the name.
+ *
+ * All four NaniSoft sites publish this section, and three of them publish it as a
+ * ledger of rows while the fourth publishes the same shape as a list of products;
+ * the ledger appears twice in the fourth site as well, once for use cases and
+ * once for research directions. Five ledgers across four sites, each one written
+ * by hand, each one re-deciding the same four things: which tier words to use,
+ * how the tier is drawn, whether the tier is announced, and whether the row
+ * carries a detail line or a bullet list.
+ *
+ * **The tier is four and the words are the caller's.** The `status` prop takes
+ * one of four tiers and the `statusLabel` prop takes the words. That split is the
+ * whole design: the tier is a colour, and colour is not information a reader can
+ * act on; the words are the information, and the words belong to the product. A
+ * Block that rendered the tier's own name would force one vocabulary on five
+ * products that between them already use eight, and a Block that took only the
+ * words would have nothing to draw.
+ *
+ * The mark is a ring around a fill rather than a filled dot, which is the
+ * contested shape this Block ships and the reason is a measurement: a filled
+ * pastel dot fails contrast against a light card, and a dot that fails contrast
+ * is a dot that does not exist for the reader it was meant to reassure. The ring
+ * is in the brand ink, the fill is the tier's own semantic token, and the whole
+ * mark is `aria-hidden`, so the row's `statusLabel` is the state a screen reader
+ * hears and a reader who cannot see the dot at all still gets the same fact.
+ *
+ * A row is a `li` inside an `ol`, so the ledger is a list in the document's
+ * outline rather than a grid of divs, and the detail line and the bullet list are
+ * the two shapes a row takes. A row with neither is a name and a state and is a
+ * valid row: most ledgers are mostly those.
+ *
+ * It is a server Component: no hook, no state, no client code and no router.
+ */
+export declare function StatusLedger01({ eyebrow, title, description, rows, caption, headingLevel, }: StatusLedger01Props): import("react").JSX.Element;
+export default StatusLedger01;
+//# sourceMappingURL=status-ledger.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"status-ledger.d.ts","sourceRoot":"","sources":["../../../src/blocks/status-ledger-01/status-ledger.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA2B,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAGxF;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,YAAY,uDAAwD,CAAA;AAEjF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,MAAM,CAAC,CAAA;AAqBtD;;;;;;;;GAQG;AACH,MAAM,MAAM,SAAS,GAAG;IACtB;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;;OAGG;IACH,MAAM,EAAE,UAAU,CAAA;IAClB;;;;;OAKG;IACH,WAAW,EAAE,MAAM,CAAA;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;CAC5B,CAAA;AAED;;;;;;;GAOG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,+EAA+E;IAC/E,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,IAAI,EAAE,SAAS,SAAS,EAAE,CAAA;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,YAAY,CAAA;CAC5B,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAmB,GACpB,EAAE,mBAAmB,+BAsDrB;AAED,eAAe,cAAc,CAAA"}

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

@@ -0,0 +1,80 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Section, SectionHeading } from '../../components/ui/section';
+import { cn } from '../../lib/utils';
+/**
+ * The four tiers a StatusLedger01 row can be in.
+ *
+ * Four, and the fifth is refused deliberately. All four NaniSoft sites publish a
+ * ledger of the same kind - what a product can do today, what is designed, what
+ * is planned, and what is only a direction - and between them they use eight
+ * different words for those four states: `live`, `available` and `complete` all
+ * mean the same thing; `approved`, `specified` and `designed` all mean the next
+ * one; `planned` means the one after; and `direction` means a research direction
+ * that is explicitly not a capability. Eight words for four states is four tiers
+ * with a per-product vocabulary, and the vocabulary belongs in the row's
+ * `statusLabel`, not in the type.
+ *
+ * A fifth tier would be the one that splits a state that does not need splitting -
+ * `deprecated` over `retired`, or a `live` that is not `complete`. Each such tier
+ * is a colour a reader must learn and a word a maintainer must keep true, and a
+ * ladder with more rungs than states is how a status column stops being readable.
+ * The four below are the states; the words are the caller's.
+ */
+export const STATUS_TIERS = ['live', 'designed', 'planned', 'direction'];
+/**
+ * The dot each tier draws, and the ring around it.
+ *
+ * The dot is `aria-hidden` and the row's words carry the state, so a tier is
+ * never colour alone: a reader who cannot separate success from warning still
+ * reads the label. The ring is `border-brand-ink` rather than `border-border`
+ * because the mark is a signal, and a signal that reads as a hairline on a card
+ * is not a signal. This is the mark the four sites draw by hand, and the reason
+ * it is a ring around a fill rather than a filled dot is a measurement: a filled
+ * pastel dot fails contrast against a light card, while a hairline ring in the
+ * brand ink does not.
+ */
+const TIER_DOT = {
+    live: 'bg-success border-success',
+    designed: 'bg-warning border-warning',
+    planned: 'border-muted-foreground',
+    direction: 'border-border',
+};
+/**
+ * A ledger of things and the state each is in: a hairline row per entry, a mark
+ * for the tier, and the words for the state beside the name.
+ *
+ * All four NaniSoft sites publish this section, and three of them publish it as a
+ * ledger of rows while the fourth publishes the same shape as a list of products;
+ * the ledger appears twice in the fourth site as well, once for use cases and
+ * once for research directions. Five ledgers across four sites, each one written
+ * by hand, each one re-deciding the same four things: which tier words to use,
+ * how the tier is drawn, whether the tier is announced, and whether the row
+ * carries a detail line or a bullet list.
+ *
+ * **The tier is four and the words are the caller's.** The `status` prop takes
+ * one of four tiers and the `statusLabel` prop takes the words. That split is the
+ * whole design: the tier is a colour, and colour is not information a reader can
+ * act on; the words are the information, and the words belong to the product. A
+ * Block that rendered the tier's own name would force one vocabulary on five
+ * products that between them already use eight, and a Block that took only the
+ * words would have nothing to draw.
+ *
+ * The mark is a ring around a fill rather than a filled dot, which is the
+ * contested shape this Block ships and the reason is a measurement: a filled
+ * pastel dot fails contrast against a light card, and a dot that fails contrast
+ * is a dot that does not exist for the reader it was meant to reassure. The ring
+ * is in the brand ink, the fill is the tier's own semantic token, and the whole
+ * mark is `aria-hidden`, so the row's `statusLabel` is the state a screen reader
+ * hears and a reader who cannot see the dot at all still gets the same fact.
+ *
+ * A row is a `li` inside an `ol`, so the ledger is a list in the document's
+ * outline rather than a grid of divs, and the detail line and the bullet list are
+ * the two shapes a row takes. A row with neither is a name and a state and is a
+ * valid row: most ledgers are mostly those.
+ *
+ * It is a server Component: no hook, no state, no client code and no router.
+ */
+export function StatusLedger01({ eyebrow, title, description, rows, caption, headingLevel = 'h2', }) {
+    return (_jsxs(Section, { children: [title ? (_jsx(SectionHeading, { as: headingLevel, align: "left", eyebrow: eyebrow, title: title, description: description, className: "mb-12" })) : null, _jsx("ol", { "data-slot": "status-ledger", className: "flex flex-col", children: rows.map((row) => (_jsxs("li", { "data-slot": "status-ledger-row", "data-status": row.status, className: "border-border flex flex-col gap-2 border-b py-5 first:border-t sm:flex-row sm:items-baseline sm:gap-6", children: [_jsxs("div", { className: "flex shrink-0 items-center gap-3 sm:w-64", children: [_jsx("span", { "aria-hidden": true, "data-tier": row.status, className: cn('border-brand-ink inline-block size-3 shrink-0 rounded-full border', TIER_DOT[row.status]) }), _jsx("span", { className: "text-sm font-semibold", children: row.name })] }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [_jsx("span", { className: "text-muted-foreground font-mono text-xs", children: row.statusLabel }), row.detail ? (_jsx("span", { className: "text-muted-foreground text-pretty text-sm", children: row.detail })) : null, row.bullets && row.bullets.length > 0 ? (_jsx("ul", { className: "text-muted-foreground mt-1 flex list-disc flex-col gap-1 pl-5 text-sm", children: row.bullets.map((bullet) => (_jsx("li", { children: bullet }, bullet))) })) : null] })] }, row.name))) }), caption ? _jsx("p", { className: "text-muted-foreground mt-6 text-pretty text-sm", children: caption }) : null] }));
+}
+export default StatusLedger01;

package/dist/catalog.d.ts

@@ -0,0 +1,28 @@
+/**
+ * The checked Prism catalogue: the single list of Components, Blocks and Pages.
+ *
+ * This is the shape fixed by tickets 09 and 19, not the finished 28-item roster.
+ * The v1 build grows it one authored entry at a time; `source` and `exports` are
+ * the fields the build checks against disk and the emitted declarations, never
+ * 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 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];
+export interface CatalogItem {
+    name: string;
+    slug: string;
+    kind: CatalogKind;
+    category: ComponentCategory | null;
+    description: string;
+    source: string;
+    exports: string[];
+    status: 'stable' | 'deprecated';
+}
+export declare const catalog: readonly CatalogItem[];
+/** Returns the catalogue ordered for display and keyed for lookup. */
+export declare function buildCatalog(items?: readonly CatalogItem[]): CatalogItem[];
+export declare const catalogBySlug: ReadonlyMap<string, CatalogItem>;
+//# sourceMappingURL=catalog.d.ts.map

package/dist/catalog.d.ts.map

@@ -0,0 +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,EA0pBzC,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"}