@nanisoft/prism-ui 0.5.1 → 0.7.0

package/dist/blocks/site-footer/index.d.ts

@@ -0,0 +1,3 @@
+export { SiteFooter, default } from './site-footer';
+export type { SiteFooterProps, SiteFooterColumn, SiteFooterLink, SiteFooterSocial } from './site-footer';
+//# sourceMappingURL=index.d.ts.map

package/dist/blocks/site-footer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/site-footer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACnD,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA"}

package/dist/blocks/site-footer/index.js

@@ -0,0 +1 @@
+export { SiteFooter, default } from './site-footer';

package/dist/blocks/site-footer/site-footer.d.ts

@@ -0,0 +1,135 @@
+import type { ReactNode } from 'react';
+import { type ProductMarkProps } from '../../components/ui/product-mark';
+/**
+ * One destination in a footer column.
+ *
+ * `href` is required. A footer link with no destination is a label, and a column
+ * of labels in a footer reads as a broken page rather than as an omission.
+ */
+export type SiteFooterLink = {
+    /** The text of the link. */
+    label: string;
+    /** Where the link goes. */
+    href: string;
+    /**
+     * Opens the destination in a new browsing context, which defaults the link
+     * relationship to `noopener noreferrer`. Prism does not decide what counts as
+     * external, so the caller declares it.
+     */
+    newTab?: boolean;
+};
+/**
+ * One column of a footer's destinations: a title and the links under it.
+ *
+ * The title is required, because a column of links with no heading is a list
+ * that gives a reader no clue what the group is, and a footer's whole job is to
+ * be scannable rather than read.
+ */
+export type SiteFooterColumn = {
+    /** The heading of the column, which names the group. */
+    title: string;
+    /** The destinations in the group, in the order a reader should meet them. */
+    links: readonly SiteFooterLink[];
+};
+/**
+ * One link out of the site: a destination with an icon beside its label.
+ *
+ * The icon is a `ReactNode` rather than a component name, because the icon is
+ * the consumer's: it is their brand's mark for a destination, not one of a set
+ * Prism owns. The label is still required, because an icon alone is not a
+ * destination a screen reader can announce.
+ */
+export type SiteFooterSocial = {
+    /** The accessible name of the link, and the text beside the icon. */
+    label: string;
+    /** Where the link goes. */
+    href: string;
+    /**
+     * The mark drawn beside the label. `aria-hidden` is applied to it here, so an
+     * icon is a shape beside a word and never a second reading of the word.
+     */
+    icon?: ReactNode;
+    /**
+     * Opens the destination in a new browsing context, which defaults the link
+     * relationship to `noopener noreferrer`. A destination off the site is
+     * declared by the caller, because Prism does not parse URLs.
+     */
+    newTab?: boolean;
+};
+/**
+ * The props a SiteFooter takes.
+ *
+ * The product is required and nothing else is. A footer with no columns, no
+ * social links and no legal line is a valid footer: it is a brand lockup and
+ * nothing else, and one of the four NaniSoft sites is exactly that.
+ */
+export type SiteFooterProps = {
+    /**
+     * The product this footer belongs to: the id, name and pack its `ProductMark`
+     * is drawn from. The footer renders the mark rather than taking a slot,
+     * because the brand lockup is the one part of a footer that is never
+     * product-specific and every consumer would otherwise reimplement it.
+     */
+    product: Pick<ProductMarkProps, 'id' | 'name' | 'pack'>;
+    /**
+     * The groups of destinations: the sections of this site, its documentation, and
+     * anywhere else the site sends a reader. Omit it for a footer that carries only
+     * the brand lockup.
+     */
+    columns?: readonly SiteFooterColumn[];
+    /**
+     * The links that leave the site. A `ReactNode` icon is drawn beside each label
+     * and hidden from assistive technology, so a screen reader announces the label
+     * once.
+     */
+    social?: readonly SiteFooterSocial[];
+    /**
+     * A slot for the line at the foot of the footer: a copyright, a licence, a
+     * version, a legal link. A slot rather than a prop, because every one of those
+     * is a fact about a specific product and about the year it was published, and a
+     * Block that held a year would be a Block that went stale.
+     */
+    legal?: ReactNode;
+    /**
+     * Layout only, exactly as on every Component. Changing a Prism-owned visual
+     * property from here is prohibited.
+     */
+    className?: string;
+};
+/**
+ * The footer of a product site: a brand lockup, grouped destinations, the links
+ * that leave the site, and an optional slot for the legal line.
+ *
+ * It is a Block and not a Component because it is a region of a page: it
+ * composes a `ProductMark` and two sets of links and owns the block they sit in.
+ * All four NaniSoft sites compose this exact footer in their root layout, and
+ * each one wrote its own column model, its own mark and its own current-page
+ * treatment.
+ *
+ * Every string is a prop and the Block ships none. There is no site name, no
+ * copyright, no year, no "built with" line and no default column: a footer that
+ * hardcoded any of them would hand every consumer a claim about a product that
+ * is not theirs and a year that was not this one.
+ *
+ * The columns are a grid that collapses to one column, and the brand lockup
+ * stays above them at every width. A footer read as three columns on a phone is
+ * three unreadable columns; a footer read as one column is a list a reader can
+ * scan, which is the only job a footer has on a narrow viewport.
+ *
+ * Each column is a `nav` with its own accessible name, taken from the column's
+ * title. A reader who navigates by landmark can therefore reach "Documentation"
+ * rather than arriving at one anonymous list of links.
+ *
+ * The social links open in a new browsing context by default, because a link that
+ * leaves the site and comes back is a reader who has lost the page they were on.
+ * That default is a decision this Block makes, and `newTab={false}` on one link
+ * overrides it: Prism does not decide which destinations are external, so the
+ * per-link prop wins over the default rather than the other way round.
+ *
+ * It is a server Component. It fetches nothing, it holds no state, and it
+ * imports no router: a consumer renders it from a server file and the links are
+ * plain anchors the consumer's own router can intercept.
+ */
+export declare function SiteFooter({ product, columns, social, legal, className, }: SiteFooterProps): import("react").JSX.Element;
+export default SiteFooter;
+//# sourceMappingURL=site-footer.d.ts.map

package/dist/blocks/site-footer/site-footer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"site-footer.d.ts","sourceRoot":"","sources":["../../../src/blocks/site-footer/site-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,kCAAkC,CAAA;AAGrF;;;;;GAKG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,4BAA4B;IAC5B,KAAK,EAAE,MAAM,CAAA;IACb,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,wDAAwD;IACxD,KAAK,EAAE,MAAM,CAAA;IACb,6EAA6E;IAC7E,KAAK,EAAE,SAAS,cAAc,EAAE,CAAA;CACjC,CAAA;AAED;;;;;;;GAOG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAA;IACb,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;;;;OAKG;IACH,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA;IACvD;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,gBAAgB,EAAE,CAAA;IACrC;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,gBAAgB,EAAE,CAAA;IACpC;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,OAAO,EACP,MAAM,EACN,KAAK,EACL,SAAS,GACV,EAAE,eAAe,+BA8DjB;AAED,eAAe,UAAU,CAAA"}

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

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ProductMark } from '../../components/ui/product-mark';
+import { cn } from '../../lib/utils';
+/**
+ * The footer of a product site: a brand lockup, grouped destinations, the links
+ * that leave the site, and an optional slot for the legal line.
+ *
+ * It is a Block and not a Component because it is a region of a page: it
+ * composes a `ProductMark` and two sets of links and owns the block they sit in.
+ * All four NaniSoft sites compose this exact footer in their root layout, and
+ * each one wrote its own column model, its own mark and its own current-page
+ * treatment.
+ *
+ * Every string is a prop and the Block ships none. There is no site name, no
+ * copyright, no year, no "built with" line and no default column: a footer that
+ * hardcoded any of them would hand every consumer a claim about a product that
+ * is not theirs and a year that was not this one.
+ *
+ * The columns are a grid that collapses to one column, and the brand lockup
+ * stays above them at every width. A footer read as three columns on a phone is
+ * three unreadable columns; a footer read as one column is a list a reader can
+ * scan, which is the only job a footer has on a narrow viewport.
+ *
+ * Each column is a `nav` with its own accessible name, taken from the column's
+ * title. A reader who navigates by landmark can therefore reach "Documentation"
+ * rather than arriving at one anonymous list of links.
+ *
+ * The social links open in a new browsing context by default, because a link that
+ * leaves the site and comes back is a reader who has lost the page they were on.
+ * That default is a decision this Block makes, and `newTab={false}` on one link
+ * overrides it: Prism does not decide which destinations are external, so the
+ * per-link prop wins over the default rather than the other way round.
+ *
+ * It is a server Component. It fetches nothing, it holds no state, and it
+ * imports no router: a consumer renders it from a server file and the links are
+ * plain anchors the consumer's own router can intercept.
+ */
+export function SiteFooter({ product, columns, social, legal, className, }) {
+    return (_jsx("footer", { "data-slot": "site-footer", className: cn('border-border bg-background w-full border-t', className), children: _jsxs("div", { className: "mx-auto flex w-full max-w-6xl flex-col gap-10 px-6 py-12 lg:px-8", children: [_jsxs("div", { className: "flex flex-col gap-10 md:flex-row md:justify-between", children: [_jsxs("div", { className: "flex flex-col gap-4", children: [_jsx(ProductMark, { id: product.id, name: product.name, pack: product.pack, size: "lg" }), social && social.length > 0 ? (_jsx("ul", { className: "flex flex-wrap items-center gap-4", children: social.map((link) => (_jsx("li", { children: _jsxs("a", { href: link.href, rel: link.newTab === false ? undefined : 'noopener noreferrer', target: link.newTab === false ? undefined : '_blank', className: "text-muted-foreground hover:text-foreground inline-flex items-center gap-2 rounded-sm text-sm font-medium transition-colors duration-fast ease-out", children: [link.icon ? (_jsx("span", { "aria-hidden": true, className: "inline-flex items-center", children: link.icon })) : null, link.label] }) }, link.href))) })) : null] }), columns && columns.length > 0 ? (_jsx("div", { className: "grid gap-8 sm:grid-cols-2 lg:grid-cols-3", children: columns.map((column) => (_jsxs("nav", { "aria-label": column.title, className: "flex flex-col gap-3", children: [_jsx("h2", { className: "text-sm font-semibold", children: column.title }), _jsx("ul", { className: "flex flex-col gap-2", children: column.links.map((link) => (_jsx("li", { children: _jsx("a", { href: link.href, rel: link.newTab ? 'noopener noreferrer' : undefined, target: link.newTab ? '_blank' : undefined, className: "text-muted-foreground hover:text-foreground rounded-sm text-sm transition-colors duration-fast ease-out", children: link.label }) }, link.href))) })] }, column.title))) })) : null] }), legal ? _jsx("div", { className: "text-muted-foreground text-sm", children: legal }) : null] }) }));
+}
+export default SiteFooter;

package/dist/blocks/site-header/index.d.ts

@@ -0,0 +1,3 @@
+export { SiteHeader, default } from './site-header';
+export type { SiteHeaderProps, SiteHeaderLink } from './site-header';
+//# sourceMappingURL=index.d.ts.map

package/dist/blocks/site-header/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/site-header/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACnD,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA"}

package/dist/blocks/site-header/index.js

@@ -0,0 +1 @@
+export { SiteHeader, default } from './site-header';

package/dist/blocks/site-header/site-header.d.ts

@@ -0,0 +1,142 @@
+import type { ReactNode } from 'react';
+import { type SwitcherProduct } from '../../components/ui/product-switcher';
+import { type ProductMarkProps } from '../../components/ui/product-mark';
+/**
+ * One destination in the header's own navigation.
+ *
+ * `href` is required and `current` is opt-in. The header marks the current page
+ * with `aria-current="page"` rather than with a colour, so a link's state is
+ * carried by the attribute every assistive technology already reads and a reader
+ * who cannot see the colour still knows where they are.
+ */
+export type SiteHeaderLink = {
+    /** The text of the link. */
+    label: string;
+    /** Where the link goes. */
+    href: string;
+    /**
+     * Marks this link as the page the reader is on. Set it on the one link whose
+     * destination is the current route; leave it off every other link.
+     */
+    current?: boolean;
+    /**
+     * Opens the destination in a new browsing context, which defaults the link
+     * relationship to `noopener noreferrer`. Prism does not decide what counts as
+     * external: a cross-origin destination is not by itself a reason to open a tab.
+     */
+    newTab?: boolean;
+};
+/**
+ * The props a SiteHeader takes.
+ *
+ * There is no product directory in this package, so the product the header is on
+ * is passed as the three facts its mark is drawn from rather than as an id this
+ * package would have to resolve. That is the same answer `ProductMark` gives,
+ * and for the same reason: a consumer that composes a set of its own products
+ * composes the header too.
+ *
+ * The product is the only required field but one. A header with no navigation, no
+ * switcher and no actions is a valid header: it is a brand lockup and nothing
+ * else, and one of the four NaniSoft sites is exactly that.
+ */
+export type SiteHeaderProps = {
+    /**
+     * The product this header belongs to: the id, name and pack its `ProductMark`
+     * is drawn from. The header renders the mark itself rather than a slot, because
+     * a header whose brand lockup is a slot is a header every consumer has to
+     * reimplement, and that is the one part of a site header that is never
+     * product-specific.
+     */
+    product: Pick<ProductMarkProps, 'id' | 'name' | 'pack'>;
+    /**
+     * The set of products to move between, rendered as a `ProductSwitcher` between
+     * the mark and the navigation. Omit it on a site that is the only product, and
+     * pass it on a site that is one of several. A set of one renders one mark, so
+     * pass nothing rather than a switcher with a single member.
+     */
+    products?: readonly SwitcherProduct[];
+    /**
+     * The header's own destinations: the sections of this site. Omit it for a
+     * header that carries only the brand lockup.
+     */
+    nav?: readonly SiteHeaderLink[];
+    /**
+     * The accessible name of the site navigation, which is also the visible word a
+     * screen reader announces before the list.
+     *
+     * It is required rather than defaulted because it is a word a reader hears, and
+     * a Block that ships no copy ships no reader-facing copy either. A header that
+     * defaulted this would put its own name on every consumer's site navigation, and
+     * "Site" is right for a company site and wrong for a product that has a docs
+     * section it wants called something else.
+     */
+    navLabel: string;
+    /**
+     * The accessible name of the product switcher. Required whenever `products` is
+     * passed, for the same reason `navLabel` is: it is a word a reader hears, and a
+     * Block that ships no copy ships none of those either. Omit it and the switcher
+     * takes the site navigation's name, which is right when the two are the same set
+     * of places and wrong when they are not.
+     */
+    productsLabel?: string;
+    /**
+     * A slot for the controls a product owns on the right: an account menu, a sign
+     * in link, a mode toggle, a theme picker. A slot rather than a prop, because
+     * every one of those is application state and none of them is a fact a header
+     * can be told.
+     */
+    actions?: ReactNode;
+    /**
+     * Keeps the header at the top of the viewport as the page scrolls. Off by
+     * default, because a sticky header is a decision about a page rather than about
+     * a header, and a header that is sticky on a page with no scroll costs the
+     * reader a strip of their viewport.
+     */
+    sticky?: boolean;
+    /**
+     * Layout only, exactly as on every Component. Changing a Prism-owned visual
+     * property from here is prohibited.
+     */
+    className?: string;
+};
+/**
+ * The header of a product site: a brand lockup, an optional product switcher, the
+ * site's own navigation and an optional slot for application controls.
+ *
+ * It is a Block and not a Component because it is a region of a page rather than
+ * a control: it composes a `ProductMark`, a `ProductSwitcher` and a set of
+ * links, and it owns the bar they sit in. All four NaniSoft sites compose this
+ * exact bar in their root layout, and each one wrote its own: the mark in one
+ * place, the switcher in a popover in another, the navigation in a third, and
+ * each wrote the focus and current-page wiring separately.
+ *
+ * Every string is a prop and the Block ships none. There is no site name, no
+ * default navigation, no "sign in" and no product list: a header 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 bar is one flex row that wraps. The brand lockup and the actions hold
+ * their ends, the switcher and the navigation sit in the middle and wrap onto a
+ * second line rather than overflowing, so a narrow viewport gets a taller header
+ * and never a clipped one. The brand lockup is the one element that never
+ * wraps: a wordmark broken across two lines is not a wordmark.
+ *
+ * The navigation is a `nav` with an accessible name and the switcher is a second
+ * `nav`, because a reader who navigates by landmark needs two regions rather than
+ * one region with two lists in it. The actions slot is not a region at all: it is
+ * whatever the consumer composed, and wrapping it in a landmark would be a claim
+ * about content this 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.
+ *
+ * It is a server Component. It fetches nothing, it holds no state, and a page
+ * that renders it in a server file needs nothing from the provider mounted: the
+ * pack it wears is the pack of whatever boundary is above it, which is the
+ * mechanism the whole system uses.
+ */
+export declare function SiteHeader({ product, products, nav, navLabel, productsLabel, actions, sticky, className, }: SiteHeaderProps): import("react").JSX.Element;
+export default SiteHeader;
+//# sourceMappingURL=site-header.d.ts.map

package/dist/blocks/site-header/site-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"site-header.d.ts","sourceRoot":"","sources":["../../../src/blocks/site-header/site-header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,EAEL,KAAK,eAAe,EACrB,MAAM,sCAAsC,CAAA;AAC7C,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,kCAAkC,CAAA;AAGrF;;;;;;;GAOG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,4BAA4B;IAC5B,KAAK,EAAE,MAAM,CAAA;IACb,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;;;;;OAMG;IACH,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA;IACvD;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,eAAe,EAAE,CAAA;IACrC;;;OAGG;IACH,GAAG,CAAC,EAAE,SAAS,cAAc,EAAE,CAAA;IAC/B;;;;;;;;;OASG;IACH,QAAQ,EAAE,MAAM,CAAA;IAChB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,QAAQ,EACR,GAAG,EACH,QAAQ,EACR,aAAa,EACb,OAAO,EACP,MAAc,EACd,SAAS,GACV,EAAE,eAAe,+BA+CjB;AAED,eAAe,UAAU,CAAA"}

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

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ProductSwitcher, } from '../../components/ui/product-switcher';
+import { ProductMark } from '../../components/ui/product-mark';
+import { cn } from '../../lib/utils';
+/**
+ * The header of a product site: a brand lockup, an optional product switcher, the
+ * site's own navigation and an optional slot for application controls.
+ *
+ * It is a Block and not a Component because it is a region of a page rather than
+ * a control: it composes a `ProductMark`, a `ProductSwitcher` and a set of
+ * links, and it owns the bar they sit in. All four NaniSoft sites compose this
+ * exact bar in their root layout, and each one wrote its own: the mark in one
+ * place, the switcher in a popover in another, the navigation in a third, and
+ * each wrote the focus and current-page wiring separately.
+ *
+ * Every string is a prop and the Block ships none. There is no site name, no
+ * default navigation, no "sign in" and no product list: a header 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 bar is one flex row that wraps. The brand lockup and the actions hold
+ * their ends, the switcher and the navigation sit in the middle and wrap onto a
+ * second line rather than overflowing, so a narrow viewport gets a taller header
+ * and never a clipped one. The brand lockup is the one element that never
+ * wraps: a wordmark broken across two lines is not a wordmark.
+ *
+ * The navigation is a `nav` with an accessible name and the switcher is a second
+ * `nav`, because a reader who navigates by landmark needs two regions rather than
+ * one region with two lists in it. The actions slot is not a region at all: it is
+ * whatever the consumer composed, and wrapping it in a landmark would be a claim
+ * about content this 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.
+ *
+ * It is a server Component. It fetches nothing, it holds no state, and a page
+ * that renders it in a server file needs nothing from the provider mounted: the
+ * pack it wears is the pack of whatever boundary is above it, which is the
+ * mechanism the whole system uses.
+ */
+export function SiteHeader({ product, products, nav, navLabel, productsLabel, actions, sticky = false, className, }) {
+    return (_jsx("header", { "data-slot": "site-header", className: cn('border-border bg-background w-full border-b', sticky && 'sticky top-0 z-30', className), children: _jsxs("div", { className: "mx-auto flex w-full max-w-6xl flex-wrap items-center gap-x-6 gap-y-3 px-6 py-3 lg:px-8", children: [_jsx("a", { href: "/", className: "flex shrink-0 items-center rounded-sm", children: _jsx(ProductMark, { id: product.id, name: product.name, pack: product.pack, size: "md" }) }), products && products.length > 0 ? (_jsx(ProductSwitcher, { products: products, currentId: product.id, size: "sm", label: productsLabel ?? navLabel })) : null, nav && nav.length > 0 ? (_jsx("nav", { "aria-label": navLabel, className: "flex flex-wrap items-center gap-x-5 gap-y-2", children: nav.map((link) => (_jsx("a", { href: link.href, "aria-current": link.current ? 'page' : undefined, rel: link.newTab ? 'noopener noreferrer' : undefined, target: link.newTab ? '_blank' : undefined, className: "text-muted-foreground hover:text-foreground rounded-sm text-sm font-medium transition-colors duration-fast ease-out", children: link.label }, link.href))) })) : null, actions ? (_jsx("div", { className: "ms-auto flex items-center gap-3", children: actions })) : null] }) }));
+}
+export default SiteHeader;

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/stack-grid-01/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACnD,YAAY,EAAE,gBAAgB,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA"}

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

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

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/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';