@nadicodeai/ui 12.1.61 → 12.1.63

package/dist/components/object-workspace.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import type { ComponentProps, ReactNode } from "react";
 export type ObjectFact = {
     label: string;
     value: ReactNode;
@@ -9,20 +9,32 @@ export type ObjectFact = {
      */
     block?: boolean;
 };
-export type ObjectIdentitySupportFacts = {
-    facts: readonly ObjectFact[];
+export type ObjectIdentityFact = {
     label: string;
+    value: ReactNode;
 };
-export declare function ObjectIdentity({ visual, title, description, metadata, action, editAction, layout, support, }: {
+/**
+ * An object's page opens with this header on the page ground, never in a card:
+ * its picture, its name, one line saying what it is, a row of key facts, and at
+ * the trailing edge the page's one primary action and its three dots. The
+ * sections below it are the cards. On a page it opens, the header is the page's
+ * title and its name is the h1; elsewhere the name is text at heading size.
+ */
+export declare function ObjectIdentity({ visual, title, description, facts, action, menu, headingProps, }: {
     /** The object's picture: an Agent's orb, an app's mark. A skill, which is text, has none. */
     visual?: ReactNode;
     title: ReactNode;
     description?: ReactNode;
-    metadata?: ReactNode;
+    facts?: readonly ObjectIdentityFact[];
+    /** The page's single primary action. */
     action?: ReactNode;
-    editAction?: ReactNode;
-    layout?: "inline" | "stacked";
-    support?: ObjectIdentitySupportFacts;
+    /** The three dots holding every other action on the object. */
+    menu?: ReactNode;
+    /**
+     * Given on a page this header opens, where the name is the page's title: the
+     * name is then its h1, with these attributes. Without it the name is text.
+     */
+    headingProps?: Omit<ComponentProps<"h1">, "children">;
 }): import("react").JSX.Element;
 export declare function ObjectOverview({ primary, supporting, }: {
     primary: ReactNode;

package/dist/components/object-workspace.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"object-workspace.d.ts","sourceRoot":"","sources":["../../src/components/object-workspace.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACvC,KAAK,EAAE,SAAS,UAAU,EAAE,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,UAAU,EACV,MAAiB,EACjB,OAAO,GACR,EAAE;IACD,6FAA6F;IAC7F,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,0BAA0B,CAAC;CACtC,+BAsCA;AAED,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,UAAU,GACX,EAAE;IACD,OAAO,EAAE,SAAS,CAAC;IACnB,UAAU,EAAE,SAAS,CAAC;CACvB,+BAUA;AAED,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,WAAW,EACX,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,YAAgB,GACjB,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,sFAAsF;IACtF,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;CAC1B,+BAkBA;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAmB,GACpB,EAAE;IACD,KAAK,EAAE,SAAS,UAAU,EAAE,CAAC;IAC7B,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC,+BAkCA"}
+{"version":3,"file":"object-workspace.d.ts","sourceRoot":"","sources":["../../src/components/object-workspace.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvD,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,SAAS,CAAA;CAAE,CAAC;AAErE;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,KAAK,EACL,WAAW,EACX,KAAK,EACL,MAAM,EACN,IAAI,EACJ,YAAY,GACb,EAAE;IACD,6FAA6F;IAC7F,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,KAAK,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACtC,wCAAwC;IACxC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,+DAA+D;IAC/D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,YAAY,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC;CACvD,+BA0CA;AAED,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,UAAU,GACX,EAAE;IACD,OAAO,EAAE,SAAS,CAAC;IACnB,UAAU,EAAE,SAAS,CAAC;CACvB,+BAUA;AAED,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,WAAW,EACX,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,YAAgB,GACjB,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,sFAAsF;IACtF,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;CAC1B,+BAkBA;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAmB,GACpB,EAAE;IACD,KAAK,EAAE,SAAS,UAAU,EAAE,CAAC;IAC7B,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC,+BAkCA"}

package/dist/components/object-workspace.js

@@ -1,11 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
 import { Card, CardAction, CardContent, CardDescription, CardHeader, CardTitle } from "./card.js";
-import { ObjectIdentitySupport } from "../internal/object-identity-support.js";
-export function ObjectIdentity({ visual, title, description, metadata, action, editAction, layout = "inline", support, }) {
-    return (_jsxs(Card, { className: layout === "inline" && support
-            ? "min-w-0 lg:grid lg:grid-cols-[minmax(0,1fr)_minmax(0,1.25fr)] lg:items-center"
-            : "min-w-0", render: _jsx("header", { "data-slot": "object-identity" }), size: "sm", children: [_jsxs(CardHeader, { children: [_jsxs("div", { className: "flex min-w-0 items-center gap-4", children: [visual ? _jsx("div", { className: "shrink-0", children: visual }) : null, _jsxs("div", { className: "grid min-w-0 gap-1.5", children: [_jsx(CardTitle, { className: "break-words", children: title }), description ? _jsx(CardDescription, { children: description }) : null, metadata ? (_jsx("div", { className: "flex flex-wrap items-center gap-x-4 gap-y-1 text-xs text-muted-foreground", children: metadata })) : null] })] }), editAction ? _jsx(CardAction, { children: editAction }) : null] }), support || action ? (_jsxs(CardContent, { className: "flex min-w-0 flex-wrap items-start gap-4", children: [support ? (_jsx(ObjectIdentitySupport, { label: support.label, children: _jsx(ObjectFacts, { density: "compact", facts: support.facts }) })) : null, action ? _jsx("div", { className: "min-w-0 flex-1 basis-full", children: action }) : null] })) : null] }));
+/**
+ * An object's page opens with this header on the page ground, never in a card:
+ * its picture, its name, one line saying what it is, a row of key facts, and at
+ * the trailing edge the page's one primary action and its three dots. The
+ * sections below it are the cards. On a page it opens, the header is the page's
+ * title and its name is the h1; elsewhere the name is text at heading size.
+ */
+export function ObjectIdentity({ visual, title, description, facts, action, menu, headingProps, }) {
+    const nameClass = "text-2xl leading-8 font-semibold break-words text-foreground";
+    return (_jsxs("header", { className: "grid min-w-0 gap-5", "data-slot": "object-identity", children: [_jsxs("div", { className: "flex min-w-0 flex-wrap items-center justify-between gap-x-6 gap-y-4", children: [_jsxs("div", { className: "flex min-w-0 flex-1 basis-72 items-center gap-4", children: [visual ? _jsx("div", { className: "shrink-0", children: visual }) : null, _jsxs("div", { className: "grid min-w-0 gap-1", children: [headingProps ? (_jsx("h1", { ...headingProps, className: cn(nameClass, "outline-none", headingProps.className), children: title })) : (_jsx("p", { className: nameClass, children: title })), description ? (_jsx("div", { className: "min-w-0 text-base text-muted-foreground", children: description })) : null] })] }), action || menu ? (_jsxs("div", { className: "flex shrink-0 items-center gap-2", "data-slot": "object-identity-actions", children: [action, menu] })) : null] }), facts && facts.length > 0 ? (_jsx("dl", { className: "flex min-w-0 flex-wrap gap-x-10 gap-y-4", "data-slot": "object-identity-facts", children: facts.map((fact) => (_jsxs("div", { className: "grid min-w-0 gap-1", children: [_jsx("dt", { className: "text-xs text-muted-foreground", children: fact.label }), _jsx("dd", { className: "flex min-h-6 min-w-0 items-center text-sm", children: fact.value })] }, fact.label))) })) : null] }));
 }
 export function ObjectOverview({ primary, supporting, }) {
     return (_jsxs("div", { "data-slot": "object-overview", className: "grid min-w-0 items-start gap-6 xl:grid-cols-[minmax(0,1.6fr)_minmax(0,1fr)]", children: [_jsx("div", { className: "grid min-w-0 gap-6", children: primary }), _jsx("div", { className: "grid min-w-0 gap-6", children: supporting })] }));

package/dist/components/page-actions.d.ts

@@ -0,0 +1,65 @@
+import { type MouseEvent, type ReactElement, type ReactNode } from "react";
+export type PageCommandAction = {
+    onClick: (event: MouseEvent<HTMLElement>) => void;
+    render?: never;
+}
+/**
+ * The element the command is, such as the product's router link, which keeps
+ * its own role and behaviour and takes the slot's look.
+ */
+ | {
+    render: ReactElement;
+    onClick?: never;
+};
+/** A command drawn as a button on the title's row. Its variant is its slot's. */
+export type PageCommand = PageCommandAction & {
+    label: string;
+    icon?: ReactElement;
+    /** Opens outside the product, marked with the arrow at its end. */
+    external?: boolean;
+    disabled?: boolean;
+};
+export type PageMenuCommand = PageCommandAction & {
+    label: string;
+    icon?: ReactElement;
+    disabled?: boolean;
+    destructive?: boolean;
+};
+/** The page's three dots, which open only for two commands or more. */
+export type PageMenu = {
+    label: string;
+    commands: readonly [PageMenuCommand, PageMenuCommand, ...PageMenuCommand[]];
+};
+/**
+ * A page's actions (DESIGN.md "Page compositions"): the three dots, then at
+ * most one `outline` button, then the one `default` primary, rightmost.
+ */
+export type PageActionsProps = {
+    primary?: PageCommand | undefined;
+    secondary?: PageCommand | undefined;
+    menu?: PageMenu | undefined;
+};
+/** One command as a button in a given slot's variant. */
+export declare function PageCommandButton({ command, variant, }: {
+    command: PageCommand;
+    variant: "default" | "outline" | "ghost";
+}): import("react").JSX.Element;
+/** The row of a page's actions where it stands, for a page whose header is its own card. */
+export declare function PageActionsRow({ primary, secondary, menu }: PageActionsProps): import("react").JSX.Element | null;
+/**
+ * Holds the place on the title's row where the open page puts its actions. The
+ * product's chrome draws the row (`PageHeader`) and the page below draws its
+ * commands (`PageActions`), so the two meet here rather than through props.
+ */
+export declare function PageActionsHostProvider({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** The element on `PageHeader`'s title row that the page's `PageActions` render into. */
+export declare function PageActionsSlot(): import("react").JSX.Element;
+/**
+ * A page's actions, drawn on its title's row. Only the page shown last owns
+ * the row: a page kept hidden for a quick return gives the row back. Outside a
+ * `PageActionsHostProvider`, they render where they stand.
+ */
+export declare function PageActions(props: PageActionsProps): import("react").JSX.Element | null;
+//# sourceMappingURL=page-actions.d.ts.map

package/dist/components/page-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-actions.d.ts","sourceRoot":"","sources":["../../src/components/page-actions.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,KAAK,UAAU,EACf,KAAK,YAAY,EACjB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAOf,MAAM,MAAM,iBAAiB,GACzB;IAAE,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAAC,MAAM,CAAC,EAAE,KAAK,CAAA;CAAE;AACvE;;;GAGG;GACD;IAAE,MAAM,EAAE,YAAY,CAAC;IAAC,OAAO,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAE9C,iFAAiF;AACjF,MAAM,MAAM,WAAW,GAAG,iBAAiB,GAAG;IAC5C,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,mEAAmE;IACnE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,iBAAiB,GAAG;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,uEAAuE;AACvE,MAAM,MAAM,QAAQ,GAAG;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC,eAAe,EAAE,eAAe,EAAE,GAAG,eAAe,EAAE,CAAC,CAAC;CAC7E,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC;IAClC,SAAS,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC;IACpC,IAAI,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;CAC7B,CAAC;AAwBF,yDAAyD;AACzD,wBAAgB,iBAAiB,CAAC,EAChC,OAAO,EACP,OAAO,GACR,EAAE;IACD,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;CAC1C,+BAoBA;AAsBD,4FAA4F;AAC5F,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,gBAAgB,sCAe5E;AAYD;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAa5E;AAED,yFAAyF;AACzF,wBAAgB,eAAe,gCAS9B;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,sCAoBlD"}

package/dist/components/page-actions.js

@@ -0,0 +1,76 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRender } from "@base-ui/react/use-render";
+import { ArrowUpRight } from "lucide-react";
+import { createContext, useCallback, useContext, useEffect, useId, useState, } from "react";
+import { createPortal } from "react-dom";
+import { ActionMenu } from "./action-menu.js";
+import { Button, buttonVariants } from "./button.js";
+import { DropdownMenuItem, DropdownMenuSeparator } from "./dropdown-menu.js";
+function CommandElement({ children, disabled, element, variant, }) {
+    return useRender({
+        render: element,
+        props: {
+            "aria-disabled": disabled || undefined,
+            children,
+            className: buttonVariants({ variant }),
+            "data-slot": "button",
+        },
+    });
+}
+/** One command as a button in a given slot's variant. */
+export function PageCommandButton({ command, variant, }) {
+    const content = (_jsxs(_Fragment, { children: [command.icon ? _jsx("span", { "data-icon": "inline-start", children: command.icon }) : null, command.label, command.external ? _jsx(ArrowUpRight, { "aria-hidden": "true", "data-icon": "inline-end" }) : null] }));
+    if (command.render) {
+        return (_jsx(CommandElement, { disabled: command.disabled, element: command.render, variant: variant, children: content }));
+    }
+    return (_jsx(Button, { disabled: command.disabled, onClick: command.onClick, type: "button", variant: variant, children: content }));
+}
+function MenuCommand({ command }) {
+    return (_jsxs(_Fragment, { children: [command.destructive ? _jsx(DropdownMenuSeparator, {}) : null, _jsxs(DropdownMenuItem, { disabled: command.disabled, variant: command.destructive ? "destructive" : "default", ...(command.render ? { render: command.render } : { onClick: command.onClick }), children: [command.label, command.icon ? (_jsx("span", { "aria-hidden": "true", className: "ml-auto flex items-center", children: command.icon })) : null] })] }));
+}
+/** The row of a page's actions where it stands, for a page whose header is its own card. */
+export function PageActionsRow({ primary, secondary, menu }) {
+    if (!primary && !secondary && !menu)
+        return null;
+    return (_jsxs("div", { "data-slot": "page-actions", className: "flex shrink-0 flex-wrap items-center gap-2", children: [menu ? (_jsx(ActionMenu, { label: menu.label, children: menu.commands.map((command) => (_jsx(MenuCommand, { command: command }, command.label))) })) : null, secondary ? _jsx(PageCommandButton, { command: secondary, variant: "outline" }) : null, primary ? _jsx(PageCommandButton, { command: primary, variant: "default" }) : null] }));
+}
+const PageActionsHostContext = createContext(null);
+/**
+ * Holds the place on the title's row where the open page puts its actions. The
+ * product's chrome draws the row (`PageHeader`) and the page below draws its
+ * commands (`PageActions`), so the two meet here rather than through props.
+ */
+export function PageActionsHostProvider({ children }) {
+    const [element, attach] = useState(null);
+    const [owner, setOwner] = useState(null);
+    const claim = useCallback((next) => setOwner(next), []);
+    const release = useCallback((previous) => setOwner((current) => (current === previous ? null : current)), []);
+    return (_jsx(PageActionsHostContext, { value: { element, attach, owner, claim, release }, children: children }));
+}
+/** The element on `PageHeader`'s title row that the page's `PageActions` render into. */
+export function PageActionsSlot() {
+    const host = useContext(PageActionsHostContext);
+    return (_jsx("div", { "data-slot": "page-header-actions", className: "flex shrink-0 items-center empty:hidden", ref: host?.attach }));
+}
+/**
+ * A page's actions, drawn on its title's row. Only the page shown last owns
+ * the row: a page kept hidden for a quick return gives the row back. Outside a
+ * `PageActionsHostProvider`, they render where they stand.
+ */
+export function PageActions(props) {
+    const host = useContext(PageActionsHostContext);
+    const id = useId();
+    const claim = host?.claim;
+    const release = host?.release;
+    useEffect(() => {
+        claim?.(id);
+        return () => release?.(id);
+    }, [claim, release, id]);
+    if (!host) {
+        return (_jsx("div", { className: "flex justify-end empty:hidden", children: _jsx(PageActionsRow, { ...props }) }));
+    }
+    if (!host.element || host.owner !== id)
+        return null;
+    return createPortal(_jsx(PageActionsRow, { ...props }), host.element);
+}

package/dist/components/page-header.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+/**
+ * The top of a product page (DESIGN.md "Page compositions"): its title at
+ * heading size on the left, the page's actions on the title's row at the right,
+ * which the page draws with `PageActions`. Nothing explains the page under its
+ * title. The path above it is the top bar's; the toolbar below it holds only
+ * filters, search and sort.
+ */
+declare function PageHeader({ title, headingProps, className, ...props }: Omit<React.ComponentProps<"header">, "title" | "children"> & {
+    title: React.ReactNode;
+    headingProps?: Omit<React.ComponentProps<"h1">, "children">;
+}): React.JSX.Element;
+export { PageHeader };
+//# sourceMappingURL=page-header.d.ts.map

package/dist/components/page-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header.d.ts","sourceRoot":"","sources":["../../src/components/page-header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B;;;;;;GAMG;AACH,iBAAS,UAAU,CAAC,EAClB,KAAK,EACL,YAAY,EACZ,SAAS,EACT,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IAC9D,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,YAAY,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC;CAC7D,qBAiBA;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/components/page-header.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/utils.js";
+import { PageActionsSlot } from "./page-actions.js";
+/**
+ * The top of a product page (DESIGN.md "Page compositions"): its title at
+ * heading size on the left, the page's actions on the title's row at the right,
+ * which the page draws with `PageActions`. Nothing explains the page under its
+ * title. The path above it is the top bar's; the toolbar below it holds only
+ * filters, search and sort.
+ */
+function PageHeader({ title, headingProps, className, ...props }) {
+    return (_jsx("header", { "data-slot": "page-header", className: cn("min-w-0", className), ...props, children: _jsxs("div", { className: "flex min-h-9 min-w-0 flex-wrap items-center justify-between gap-x-6 gap-y-3", children: [_jsx("h1", { ...headingProps, className: cn("min-w-0 flex-1 basis-48 truncate nc-type-heading-md text-foreground outline-none", headingProps?.className), children: title }), _jsx(PageActionsSlot, {})] }) }));
+}
+export { PageHeader };

package/dist/components/platform-mark.d.ts

@@ -0,0 +1,36 @@
+import { type IconifyIcon, type IconProps } from "@iconify/react/offline";
+import * as React from "react";
+/**
+ * The platforms the products name, operating systems, messaging channels and
+ * sign-in providers, each by its mark in Iconify's `logos` set, one module per
+ * mark, so a page carries these and no other.
+ */
+declare const PLATFORMS: {
+    apple: IconifyIcon;
+    discord: IconifyIcon;
+    google: IconifyIcon;
+    linux: IconifyIcon;
+    microsoft: IconifyIcon;
+    slack: IconifyIcon;
+    teams: IconifyIcon;
+    telegram: IconifyIcon;
+    whatsapp: IconifyIcon;
+    windows: IconifyIcon;
+};
+type PlatformName = keyof typeof PLATFORMS;
+/** Whether a name, such as a channel a record reports, is a platform with a mark. */
+declare function isPlatform(name: string): name is PlatformName;
+type PlatformMarkProps = Omit<IconProps, "children" | "icon" | "ref"> & {
+    platform: PlatformName;
+    /** The box in CSS pixels; the artwork keeps its own ratio inside it. */
+    size?: number;
+};
+/**
+ * A platform's genuine mark, drawn at once on the server and in the browser.
+ * It always sits beside the name that reads it, so assistive technology skips
+ * it.
+ */
+declare function PlatformMark({ platform, size, ...props }: PlatformMarkProps): React.JSX.Element;
+export { PlatformMark, isPlatform };
+export type { PlatformMarkProps, PlatformName };
+//# sourceMappingURL=platform-mark.d.ts.map

package/dist/components/platform-mark.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"platform-mark.d.ts","sourceRoot":"","sources":["../../src/components/platform-mark.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAWhF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B;;;;GAIG;AACH,QAAA,MAAM,SAAS;;;;;;;;;;;CAWwB,CAAC;AAExC,KAAK,YAAY,GAAG,MAAM,OAAO,SAAS,CAAC;AAE3C,qFAAqF;AACrF,iBAAS,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,IAAI,YAAY,CAEtD;AAOD,KAAK,iBAAiB,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,GAAG,MAAM,GAAG,KAAK,CAAC,GAAG;IACtE,QAAQ,EAAE,YAAY,CAAC;IACvB,wEAAwE;IACxE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF;;;;GAIG;AACH,iBAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,IAAS,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,qBAgBzE;AAED,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,CAAC;AACpC,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/platform-mark.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon } from "@iconify/react/offline";
+import apple from "@iconify-icons/logos/apple";
+import discord from "@iconify-icons/logos/discord-icon";
+import google from "@iconify-icons/logos/google-icon";
+import linux from "@iconify-icons/logos/linux-tux";
+import microsoft from "@iconify-icons/logos/microsoft-icon";
+import teams from "@iconify-icons/logos/microsoft-teams";
+import windows from "@iconify-icons/logos/microsoft-windows-icon";
+import slack from "@iconify-icons/logos/slack-icon";
+import telegram from "@iconify-icons/logos/telegram";
+import whatsapp from "@iconify-icons/logos/whatsapp-icon";
+import * as React from "react";
+/**
+ * The platforms the products name, operating systems, messaging channels and
+ * sign-in providers, each by its mark in Iconify's `logos` set, one module per
+ * mark, so a page carries these and no other.
+ */
+const PLATFORMS = {
+    apple,
+    discord,
+    google,
+    linux,
+    microsoft,
+    slack,
+    teams,
+    telegram,
+    whatsapp,
+    windows,
+};
+/** Whether a name, such as a channel a record reports, is a platform with a mark. */
+function isPlatform(name) {
+    return Object.hasOwn(PLATFORMS, name);
+}
+/** A mark that declares no paint of its own is one silhouette, so it takes the text colour. */
+function silhouette(icon) {
+    return !/\b(?:fill|stroke|stop-color)=/.test(icon.body);
+}
+/**
+ * A platform's genuine mark, drawn at once on the server and in the browser.
+ * It always sits beside the name that reads it, so assistive technology skips
+ * it.
+ */
+function PlatformMark({ platform, size = 24, ...props }) {
+    const icon = PLATFORMS[platform];
+    const scope = React.useId().replace(/[^\w]/g, "");
+    return (_jsx(Icon, { ...props, "aria-hidden": "true", "data-platform": platform, "data-slot": "platform-mark", fill: silhouette(icon) ? "currentColor" : undefined, height: size, icon: icon, id: scope, width: size }));
+}
+export { PlatformMark, isPlatform };

package/dist/components/popover.js

@@ -9,7 +9,7 @@ function PopoverTrigger({ ...props }) {
     return _jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
 }
 function PopoverContent({ className, align = "center", alignOffset = 0, side = "bottom", sideOffset = 4, anchor, ...props }) {
-    return (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Positioner, { align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, anchor: anchor, className: "isolate z-50", children: _jsx(PopoverPrimitive.Popup, { "data-slot": "popover-content", className: cn("z-50 flex w-72 flex-col gap-control-padding-inline rounded-md border-0 nc-glass p-control-padding-inline text-sm text-popover-foreground nc-elevation-floating outline-hidden", anchoredOverlayMotion, className), ...props }) }) }));
+    return (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Positioner, { align: align, alignOffset: alignOffset, side: side, sideOffset: sideOffset, anchor: anchor, className: "isolate z-50", children: _jsx(PopoverPrimitive.Popup, { "data-slot": "popover-content", className: cn("z-50 flex w-72 flex-col gap-control-padding-inline rounded-lg border-0 nc-glass p-control-padding-inline text-sm text-popover-foreground nc-elevation-floating outline-hidden", anchoredOverlayMotion, className), ...props }) }) }));
 }
 function PopoverHeader({ className, ...props }) {
     return (_jsx("div", { "data-slot": "popover-header", className: cn("flex flex-col gap-0.5 text-sm", className), ...props }));

package/dist/components/product-message.d.ts

@@ -0,0 +1,33 @@
+import type { PageCommand } from "./page-actions.js";
+/**
+ * A failure or notice a person reads, as data: a code from the product's
+ * catalogue, the values its words take, and the raw text behind it, which is
+ * logged and never shown (docs/adr/2026-10-08-every-message-a-customer-reads-is-a-code-its-products-catalogue-words.md).
+ */
+export type MessageParams = Readonly<Record<string, string | number>>;
+export type ProductMessage<Code extends string = string> = {
+    readonly code: Code;
+    readonly params?: MessageParams;
+    readonly diagnostic?: string;
+};
+/** A control of a message, labelled with its result. */
+export type MessageAction = PageCommand;
+declare const worded: unique symbol;
+/** A message in the reader's words, which only the product's catalogue makes through `wordMessage`. */
+export type ResolvedMessage = {
+    readonly code: string;
+    readonly title: string;
+    readonly body: string;
+    readonly actions: readonly MessageAction[];
+    readonly [worded]: true;
+};
+export declare function wordMessage(parts: {
+    code: string;
+    title: string;
+    body: string;
+    actions?: readonly MessageAction[];
+}): ResolvedMessage;
+/** The body a surface shows: none when it would repeat the title. */
+export declare function bodyBeyondTitle(message: ResolvedMessage): string | null;
+export {};
+//# sourceMappingURL=product-message.d.ts.map

package/dist/components/product-message.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-message.d.ts","sourceRoot":"","sources":["../../src/components/product-message.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC;AAEtE,MAAM,MAAM,cAAc,CAAC,IAAI,SAAS,MAAM,GAAG,MAAM,IAAI;IACzD,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC;IACpB,QAAQ,CAAC,MAAM,CAAC,EAAE,aAAa,CAAC;IAChC,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC;AAEF,wDAAwD;AACxD,MAAM,MAAM,aAAa,GAAG,WAAW,CAAC;AAExC,OAAO,CAAC,MAAM,MAAM,EAAE,OAAO,MAAM,CAAC;AAEpC,uGAAuG;AACvG,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,OAAO,EAAE,SAAS,aAAa,EAAE,CAAC;IAC3C,QAAQ,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC;CACzB,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,SAAS,aAAa,EAAE,CAAC;CACpC,GAAG,eAAe,CAElB;AAED,qEAAqE;AACrE,wBAAgB,eAAe,CAAC,OAAO,EAAE,eAAe,GAAG,MAAM,GAAG,IAAI,CAGvE"}

package/dist/components/product-message.js

@@ -0,0 +1,8 @@
+export function wordMessage(parts) {
+    return { ...parts, actions: parts.actions ?? [] };
+}
+/** The body a surface shows: none when it would repeat the title. */
+export function bodyBeyondTitle(message) {
+    const body = message.body.trim();
+    return body && body !== message.title.trim() ? body : null;
+}

package/dist/components/select.js

@@ -15,7 +15,7 @@ function SelectTrigger({ className, size = "default", children, ...props }) {
     return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": size, className: cn("flex h-control-height min-h-touch-target w-fit items-center justify-between gap-1.5 rounded-md border border-input bg-background py-2 pr-2 pl-control-padding-inline text-sm whitespace-nowrap transition-colors select-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive data-placeholder:text-placeholder data-[size=sm]:h-7 [@media(hover:hover)_and_(pointer:fine)]:min-h-0 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { render: _jsx(ChevronDownIcon, { className: "pointer-events-none size-4 text-muted-foreground" }) })] }));
 }
 function SelectContent({ className, children, side = "bottom", sideOffset = 4, align = "center", alignOffset = 0, alignItemWithTrigger = true, ...props }) {
-    return (_jsx(SelectPrimitive.Portal, { children: _jsx(SelectPrimitive.Positioner, { side: side, sideOffset: sideOffset, align: align, alignOffset: alignOffset, alignItemWithTrigger: alignItemWithTrigger, className: "isolate z-50", children: _jsxs(SelectPrimitive.Popup, { "data-slot": "select-content", "data-align-trigger": alignItemWithTrigger, className: cn("relative isolate z-50 max-h-(--available-height) w-auto max-w-(--available-width) min-w-(--anchor-width) overflow-x-hidden overflow-y-auto rounded-md border-0 nc-glass text-popover-foreground nc-elevation-floating data-[align-trigger=true]:transition-none", anchoredOverlayMotion, className), ...props, children: [_jsx(SelectScrollUpButton, {}), _jsx(SelectPrimitive.List, { children: children }), _jsx(SelectScrollDownButton, {})] }) }) }));
+    return (_jsx(SelectPrimitive.Portal, { children: _jsx(SelectPrimitive.Positioner, { side: side, sideOffset: sideOffset, align: align, alignOffset: alignOffset, alignItemWithTrigger: alignItemWithTrigger, className: "isolate z-50", children: _jsxs(SelectPrimitive.Popup, { "data-slot": "select-content", "data-align-trigger": alignItemWithTrigger, className: cn("relative isolate z-50 max-h-(--available-height) w-auto max-w-(--available-width) min-w-(--anchor-width) overflow-x-hidden overflow-y-auto rounded-lg border-0 nc-glass text-popover-foreground nc-elevation-floating data-[align-trigger=true]:transition-none", anchoredOverlayMotion, className), ...props, children: [_jsx(SelectScrollUpButton, {}), _jsx(SelectPrimitive.List, { children: children }), _jsx(SelectScrollDownButton, {})] }) }) }));
 }
 function SelectLabel({ className, ...props }) {
     return (_jsx(SelectPrimitive.GroupLabel, { "data-slot": "select-label", className: cn("px-1.5 py-1 text-xs text-muted-foreground", className), ...props }));

package/dist/components/settings-facts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"settings-facts.d.ts","sourceRoot":"","sources":["../../src/components/settings-facts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKjE,OAAO,EACL,IAAI,EAOJ,KAAK,WAAW,EACjB,MAAM,QAAQ,CAAC;AAEhB,MAAM,MAAM,YAAY,GAAG;IACzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC1C,wBAAwB,CAAC,SAAS,CAAC,EACnC,UAAU,GAAG,WAAW,CACzB,GAAG;IACF,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,SAAS,YAAY,EAAE,CAAC;IAC/B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,iBAAiB,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,wBAAwB,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC;CACtD,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,EACnC,MAAM,EACN,WAAW,EACX,KAAK,EACL,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,KAAK,EACL,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,yBAAyB,+BAqC3B"}
+{"version":3,"file":"settings-facts.d.ts","sourceRoot":"","sources":["../../src/components/settings-facts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMjE,OAAO,EACL,IAAI,EAOJ,KAAK,WAAW,EACjB,MAAM,QAAQ,CAAC;AAEhB,MAAM,MAAM,YAAY,GAAG;IACzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC1C,wBAAwB,CAAC,SAAS,CAAC,EACnC,UAAU,GAAG,WAAW,CACzB,GAAG;IACF,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,SAAS,YAAY,EAAE,CAAC;IAC/B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,iBAAiB,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,wBAAwB,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC;CACtD,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,EACnC,MAAM,EACN,WAAW,EACX,KAAK,EACL,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,KAAK,EACL,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,yBAAyB,+BAqC3B"}

package/dist/components/settings-facts.js

@@ -1,11 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ObjectFacts } from "./object-workspace.js";
 import { Separator } from "./separator.js";
+import { TableValue } from "./table-value.js";
 import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from "./card.js";
 export function SettingsFactsSection({ action, description, facts, footer, missingValueLabel, headingId, title, surface = "resting", size = "default", ...props }) {
     return (_jsxs(Card, { render: _jsx("section", {}), ...props, "aria-labelledby": headingId, surface: surface, size: size, className: "min-w-0", children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: _jsx("h2", { id: headingId, tabIndex: -1, children: title }) }), description ? _jsx(CardDescription, { children: description }) : null, action ? _jsx(CardAction, { children: action }) : null] }), _jsx(Separator, {}), _jsx(CardContent, { children: _jsx(ObjectFacts, { facts: facts.map((fact) => ({
                         label: fact.label,
                         block: fact.block,
-                        value: fact.value == null || fact.value === "" ? (_jsx("span", { className: "text-muted-foreground", children: missingValueLabel })) : (fact.value),
+                        value: fact.value == null || fact.value === "" ? (_jsx(TableValue, { missingLabel: missingValueLabel, value: null })) : (fact.value),
                     })) }) }), footer ? _jsx(CardFooter, { className: "flex-wrap gap-3", children: footer }) : null] }));
 }

package/dist/components/sheet.js

@@ -21,7 +21,7 @@ function SheetOverlay({ className, ...props }) {
     return (_jsx(SheetPrimitive.Backdrop, { "data-slot": "sheet-overlay", className: cn("fixed inset-0 z-50 bg-scrim/scrim", overlayBackdropMotion, className), ...props }));
 }
 function SheetContent({ className, children, side = "right", showCloseButton = true, closeLabel = "Close", ...props }) {
-    return (_jsxs(SheetPortal, { children: [_jsx(SheetOverlay, {}), _jsxs(SheetPrimitive.Popup, { "data-slot": "sheet-content", "data-side": side, className: cn("fixed z-50 flex max-h-[calc(100%-var(--nc-lg))] flex-col gap-nadicode-md rounded-md border-0 bg-popover bg-clip-padding text-sm text-popover-foreground nc-elevation-modal transition-[opacity,translate] duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-opacity data-[side=bottom]:inset-x-nadicode-sm data-[side=bottom]:bottom-nadicode-sm data-[side=bottom]:h-auto data-[side=bottom]:data-ending-style:translate-y-nadicode-md data-[side=bottom]:data-starting-style:translate-y-nadicode-md motion-reduce:data-[side=bottom]:data-ending-style:translate-none motion-reduce:data-[side=bottom]:data-starting-style:translate-none data-[side=left]:inset-y-nadicode-sm data-[side=left]:left-nadicode-sm data-[side=left]:w-3/4 data-[side=left]:data-ending-style:-translate-x-nadicode-md data-[side=left]:data-starting-style:-translate-x-nadicode-md motion-reduce:data-[side=left]:data-ending-style:translate-none motion-reduce:data-[side=left]:data-starting-style:translate-none data-[side=right]:inset-y-nadicode-sm data-[side=right]:right-nadicode-sm data-[side=right]:w-3/4 data-[side=right]:data-ending-style:translate-x-nadicode-md data-[side=right]:data-starting-style:translate-x-nadicode-md motion-reduce:data-[side=right]:data-ending-style:translate-none motion-reduce:data-[side=right]:data-starting-style:translate-none data-[side=top]:inset-x-nadicode-sm data-[side=top]:top-nadicode-sm data-[side=top]:h-auto data-[side=top]:data-ending-style:-translate-y-nadicode-md data-[side=top]:data-starting-style:-translate-y-nadicode-md motion-reduce:data-[side=top]:data-ending-style:translate-none motion-reduce:data-[side=top]:data-starting-style:translate-none data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", className), ...props, children: [children, showCloseButton && (_jsxs(SheetPrimitive.Close, { "data-slot": "sheet-close", render: _jsx(Button, { variant: "ghost", className: "absolute top-nadicode-md right-nadicode-md", size: "icon-sm" }), children: [_jsx(XIcon, {}), _jsx("span", { className: "sr-only", children: closeLabel })] }))] })] }));
+    return (_jsxs(SheetPortal, { children: [_jsx(SheetOverlay, {}), _jsxs(SheetPrimitive.Popup, { "data-slot": "sheet-content", "data-side": side, className: cn("fixed z-50 flex max-h-[calc(100%-var(--nc-lg))] flex-col gap-nadicode-md rounded-lg border-0 bg-popover bg-clip-padding text-sm text-popover-foreground nc-elevation-modal transition-[opacity,translate] duration-[var(--nc-duration-close)] ease-[var(--nc-ease-out-strong)] data-open:duration-[var(--nc-duration-open)] data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-opacity data-[side=bottom]:inset-x-nadicode-sm data-[side=bottom]:bottom-nadicode-sm data-[side=bottom]:h-auto data-[side=bottom]:data-ending-style:translate-y-nadicode-md data-[side=bottom]:data-starting-style:translate-y-nadicode-md motion-reduce:data-[side=bottom]:data-ending-style:translate-none motion-reduce:data-[side=bottom]:data-starting-style:translate-none data-[side=left]:inset-y-nadicode-sm data-[side=left]:left-nadicode-sm data-[side=left]:w-3/4 data-[side=left]:data-ending-style:-translate-x-nadicode-md data-[side=left]:data-starting-style:-translate-x-nadicode-md motion-reduce:data-[side=left]:data-ending-style:translate-none motion-reduce:data-[side=left]:data-starting-style:translate-none data-[side=right]:inset-y-nadicode-sm data-[side=right]:right-nadicode-sm data-[side=right]:w-3/4 data-[side=right]:data-ending-style:translate-x-nadicode-md data-[side=right]:data-starting-style:translate-x-nadicode-md motion-reduce:data-[side=right]:data-ending-style:translate-none motion-reduce:data-[side=right]:data-starting-style:translate-none data-[side=top]:inset-x-nadicode-sm data-[side=top]:top-nadicode-sm data-[side=top]:h-auto data-[side=top]:data-ending-style:-translate-y-nadicode-md data-[side=top]:data-starting-style:-translate-y-nadicode-md motion-reduce:data-[side=top]:data-ending-style:translate-none motion-reduce:data-[side=top]:data-starting-style:translate-none data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", className), ...props, children: [children, showCloseButton && (_jsxs(SheetPrimitive.Close, { "data-slot": "sheet-close", render: _jsx(Button, { variant: "ghost", className: "absolute top-nadicode-md right-nadicode-md", size: "icon-sm" }), children: [_jsx(XIcon, {}), _jsx("span", { className: "sr-only", children: closeLabel })] }))] })] }));
 }
 function SheetHeader({ className, ...props }) {
     return (_jsx("div", { "data-slot": "sheet-header", className: cn("flex flex-col gap-0.5 p-nadicode-lg", className), ...props }));

package/dist/components/sonner.js

@@ -18,7 +18,7 @@ const Toaster = ({ ...props }) => {
             "--normal-bg": "var(--popover)",
             "--normal-text": "var(--popover-foreground)",
             "--normal-border": "transparent",
-            "--border-radius": "var(--radius)",
+            "--border-radius": "var(--radius-lg)",
         }, toastOptions: {
             classNames: {
                 toast: "nc-toast nc-elevation-floating",

package/dist/components/status-badge.d.ts

@@ -0,0 +1,15 @@
+import type { ComponentProps } from "react";
+type StatusBadgeTone = "success" | "warning" | "danger" | "info" | "neutral";
+type StatusBadgeProps = Omit<ComponentProps<"span">, "children"> & {
+    tone: StatusBadgeTone;
+    label: string;
+    /** How long the status has held, set after the word in tabular figures. */
+    since?: string;
+};
+/**
+ * A status is a mark and a word in one of five tones. The caller owns which
+ * tone a state takes and the wording; this owns how the tone looks.
+ */
+declare function StatusBadge({ tone, label, since, className, ...props }: StatusBadgeProps): import("react").JSX.Element;
+export { StatusBadge, type StatusBadgeProps, type StatusBadgeTone };
+//# sourceMappingURL=status-badge.d.ts.map

package/dist/components/status-badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-badge.d.ts","sourceRoot":"","sources":["../../src/components/status-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAM5C,KAAK,eAAe,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAAC;AAsB7E,KAAK,gBAAgB,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IACjE,IAAI,EAAE,eAAe,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;;GAGG;AACH,iBAAS,WAAW,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,+BAcjF;AAED,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,KAAK,eAAe,EAAE,CAAC"}

package/dist/components/status-badge.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CircleCheck, CircleDot, CirclePause, CircleX, Clock } from "lucide-react";
+import { Badge } from "./badge.js";
+import { cn } from "../lib/utils.js";
+const VARIANT_BY_TONE = {
+    success: "green",
+    warning: "amber",
+    danger: "red",
+    info: "blue",
+    neutral: "gray",
+};
+// One mark per tone, always the same one: the tone said again as a shape, so a
+// status reads without colour. The info dot is filled and still.
+const MARK_BY_TONE = {
+    success: CircleCheck,
+    warning: Clock,
+    danger: CircleX,
+    info: CircleDot,
+    neutral: CirclePause,
+};
+/**
+ * A status is a mark and a word in one of five tones. The caller owns which
+ * tone a state takes and the wording; this owns how the tone looks.
+ */
+function StatusBadge({ tone, label, since, className, ...props }) {
+    const Mark = MARK_BY_TONE[tone];
+    return (_jsxs(Badge, { variant: VARIANT_BY_TONE[tone], className: cn("has-data-[icon=inline-start]:pl-2", className), ...props, children: [_jsx(Mark, { "aria-hidden": "true", "data-icon": "inline-start" }), label, since ? _jsx("span", { className: "tabular-nums", children: since }) : null] }));
+}
+export { StatusBadge };

package/dist/components/table.js

@@ -9,10 +9,10 @@ function TableHeader({ className, ...props }) {
     return (_jsx("thead", { "data-slot": "table-header", className: cn("[&_tr]:h-9 [&_tr]:border-b", className), ...props }));
 }
 function TableBody({ className, ...props }) {
-    return (_jsx("tbody", { "data-slot": "table-body", className: cn("[&_tr]:h-10 [&_tr:last-child]:border-0", className), ...props }));
+    return (_jsx("tbody", { "data-slot": "table-body", className: cn("[&_tr]:h-12 [&_tr:last-child]:border-0", className), ...props }));
 }
 function TableRecordGroup({ className, ...props }) {
-    return (_jsx("tbody", { "data-slot": "table-record-group", className: cn("[&_tr]:h-10 [&:hover>tr]:bg-accent [&:has(:focus-visible)>tr]:bg-accent [&:has([aria-expanded=true])>tr]:bg-accent [&:has(>tr[data-state=selected])>tr]:bg-muted [&:last-of-type>tr]:border-0", className), ...props }));
+    return (_jsx("tbody", { "data-slot": "table-record-group", className: cn("[&_tr]:h-12 [&:hover>tr]:bg-accent [&:has(:focus-visible)>tr]:bg-accent [&:has([aria-expanded=true])>tr]:bg-accent [&:has(>tr[data-state=selected])>tr]:bg-muted [&:last-of-type>tr]:border-0", className), ...props }));
 }
 function TableFooter({ className, ...props }) {
     return (_jsx("tfoot", { "data-slot": "table-footer", className: cn("border-t border-border bg-muted/50 font-medium [&>tr]:last:border-b-0", className), ...props }));

package/dist/components/tag.d.ts

@@ -0,0 +1,15 @@
+import type { ComponentProps, ReactNode } from "react";
+type TagProps = Omit<ComponentProps<"span">, "children"> & {
+    children: ReactNode;
+    /** A 12px mark at the leading edge. */
+    mark?: ReactNode;
+    /** A dashed, muted tag, for an absence such as "Direct customer". */
+    quiet?: boolean;
+};
+/**
+ * One categorical fact in a row, as a quiet outlined pill. A tag never carries
+ * a status: that is a StatusBadge.
+ */
+declare function Tag({ children, className, mark, quiet, ...props }: TagProps): import("react").JSX.Element;
+export { Tag, type TagProps };
+//# sourceMappingURL=tag.d.ts.map

package/dist/components/tag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../src/components/tag.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvD,KAAK,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IACzD,QAAQ,EAAE,SAAS,CAAC;IACpB,uCAAuC;IACvC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,qEAAqE;IACrE,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF;;;GAGG;AACH,iBAAS,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,KAAa,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,+BAyB5E;AAED,OAAO,EAAE,GAAG,EAAE,KAAK,QAAQ,EAAE,CAAC"}

package/dist/components/tag.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/utils.js";
+/**
+ * One categorical fact in a row, as a quiet outlined pill. A tag never carries
+ * a status: that is a StatusBadge.
+ */
+function Tag({ children, className, mark, quiet = false, ...props }) {
+    return (_jsxs("span", { className: cn("inline-flex h-6 max-w-full min-w-0 shrink-0 items-center gap-1.5 rounded-full border ps-2 pe-2.5 text-xs whitespace-nowrap", quiet
+            ? "border-dashed border-border text-muted-foreground"
+            : "border-border text-foreground", className), "data-quiet": quiet ? "" : undefined, "data-slot": "tag", ...props, children: [mark ? (_jsx("span", { className: "flex size-3 shrink-0 items-center justify-center text-muted-foreground [&>svg]:size-3", "data-slot": "tag-mark", children: mark })) : null, _jsx("span", { className: "truncate", children: children })] }));
+}
+export { Tag };

package/dist/components/toast.d.ts

@@ -1,3 +1,7 @@
-export { toast } from "sonner";
-export type { ExternalToast } from "sonner";
+import { type ResolvedMessage } from "./product-message.js";
+export type MessageToastTone = "success" | "info" | "warning" | "error";
+export declare function showMessageToast(message: ResolvedMessage, options: {
+    tone: MessageToastTone;
+    id?: string;
+}): void;
 //# sourceMappingURL=toast.d.ts.map

package/dist/components/toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../src/components/toast.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAC/B,YAAY,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC"}
+{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../src/components/toast.ts"],"names":[],"mappings":"AAIA,OAAO,EAAmB,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAE1E,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAExE,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,eAAe,EACxB,OAAO,EAAE;IAAE,IAAI,EAAE,gBAAgB,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,GAC/C,IAAI,CAON"}