@astryxdesign/core 0.7.6-canary.f73623d → 0.7.6-canary.f77aaf2

package/src/Chat/ChatMessageList.spec.md

@@ -1,222 +0,0 @@
----
-schema_version: 3
-template_version: 6
-kind: component
-id: component:ChatMessageList
-authority: draft
-archive_reason: null
-superseded_by: null
-approved_by: null
-approved_at: null
-owners: [cixzhang]
-review_triggers:
-  [public-api, behavior, layout, scrolling, accessibility, theming, testing]
-verified_by:
-  [
-    packages/core/src/Chat/ChatMessageList.test.tsx,
-    packages/core/src/Chat/__tests__/ChatMessageList.a11y.chromium.spec.ts,
-    apps/storybook/stories/ChatMessageList.stories.tsx,
-    packages/core/src/theme/themingTargets.test.ts,
-  ]
-modules: []
-families: []
-design_specs: []
-architecture:
-  [
-    architecture:public-component-api,
-    architecture:component-test-sufficiency,
-    architecture:component-style-authoring,
-    architecture:component-theming-surface,
-    architecture:react-component-runtime,
-    architecture:knowledge-contracts,
-  ]
-contributing: []
-system_specs: [spec:AST-029]
----
-
-# ChatMessageList component contract
-
-This draft is an observational account of shipped `core/ChatMessageList`. Its
-candidate invariants name their source and evidence; they do not decide any
-new API, default, loading protocol, or visual direction. The current shared
-records linked above continue to govern independently.
-
-## Contract at a glance
-
-| Area                    | Contract                                                                                                                                                                           |
-| ----------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| Public contract         | `children`, `emptyState`, `scrollToTopAction`, `density`, `gap`, `align`, `isStreaming`, the root's `BaseProps<HTMLDivElement>`, and `ref`.                                        |
-| Behavior                | A polite log holds caller messages. Density selects row spacing and passes through context. A top sentinel can request older messages. A spacer moves short lists down by default. |
-| End-user impact         | A reader with a numeric empty-state value sees `0`; other transcript arrangements remain unchanged.                                                                                |
-| Builder impact          | None. No new caller choice or migration is introduced.                                                                                                                             |
-| Compatibility/readiness | The published `./Chat` subpath and its defaults remain unchanged. This is a draft pending verification and exact-head owner review.                                                |
-| Review checks           | Reject a claim that the list owns ChatLayout auto-scroll, that a draft settles an unobserved loading policy, or that DOM `aria-busy` proves spoken output.                         |
-| Governing rules         | `architecture:public-component-api/INV1, INV5–INV8`; `architecture:react-component-runtime/INV3, INV5–INV6`; `spec:AST-029/FR2–FR5`.                                               |
-
-This table is a review projection; the body below describes the observed
-surface rather than creating new authority.
-
-## Intent
-
-ChatMessageList is the presentational message container within the Chat
-composition. It owns a flex-column transcript, spacing/density context, an
-optional empty state and older-message sentinel, and the log's rendered ARIA
-attributes. `ChatLayout` owns auto-follow scrolling and the dock; message and
-bubble components own sender presentation and content.
-
-Consumer prop syntax and examples remain in `ChatMessageList.doc.mjs`.
-
-## Compatibility and migration
-
-- Released default preserved: yes. The published Core package exposes `./Chat`
-  with `ChatMessageList` and `ChatMessageListProps`.
-- Compatibility class: no new API, default, or migration. Visible numeric
-  empty-state content follows the existing `ReactNode` type.
-- Controlled/uncontrolled behavior: not applicable; there is no controlled
-  value on this component.
-- Migration decision: none.
-
-## Ownership boundary
-
-**Owns**
-
-- The outer log element, its public DOM/ref/style passthrough, and the
-  `chat-message-list` target with its `density` selector.
-- The inner flex-column message box and density-based padding and gap.
-- The short-list block spacer when `align` is `bottom`.
-- The optional `emptyState` substitution and older-message sentinel/loading
-  indicator.
-- Passing the inner content element to `ChatLayoutContext.contentRef` while a
-  layout is present.
-
-**Does not own / non-goals**
-
-- Auto-scroll, scroll-to-bottom, dock, and scroll-owner selection, which belong
-  to `component:ChatLayout` and its scroll hooks.
-- Sender identity, message alignment, bubbles, metadata, and text semantics,
-  which belong to their child components.
-- The caller's region landmark or an accessible name for arbitrary transcript
-  context; no new naming policy is made by this draft.
-
-## Public concepts
-
-| Concept             | Closed values or states                         | Meaning observed                                                | Availability  | Default    | Owner     | Stability | Invalid-value behavior                             |
-| ------------------- | ----------------------------------------------- | --------------------------------------------------------------- | ------------- | ---------- | --------- | --------- | -------------------------------------------------- |
-| `children`          | `ReactNode`                                     | Top-level transcript content                                    | every render  | required   | caller    | released  | null, false, or `[]` counts empty at the top level |
-| `emptyState`        | `ReactNode`; omitted                            | Substitutes for top-level empty children                        | empty state   | omitted    | caller    | released  | absent renders no substitute                       |
-| `scrollToTopAction` | async function; omitted                         | Invoked when the top sentinel intersects                        | when supplied | omitted    | caller    | released  | absent creates no sentinel or observer             |
-| `density`           | `compact`; `balanced`; `spacious`               | Chooses message spacing and child density context               | every render  | `balanced` | component | released  | closed type union                                  |
-| `gap`               | published `SpacingStep`; omitted                | Overrides the list's top-level row gap independently of density | every render  | omitted    | caller    | released  | closed type union                                  |
-| `align`             | `top`; `bottom`                                 | Positions short content at the start or block end               | every render  | `bottom`   | component | released  | closed type union                                  |
-| `isStreaming`       | `true`; `false`                                 | Exposes `aria-busy` on the polite log while streaming           | every render  | `false`    | caller    | released  | boolean                                            |
-| root passthrough    | `ref`, accepted DOM/data/ARIA and styling props | Extends the outer log element                                   | every render  | omitted    | caller    | released  | owned role/live/busy attributes retain precedence  |
-
-The table records the implementation's top-level emptiness test; it does not
-promise recursive child inspection or resolve the meaning of arbitrary
-non-rendering React nodes.
-
-## Behavioral and layout contract
-
-These candidate invariants record observable shipped behavior. A `verify`
-state means the audit has not upgraded implementation into policy.
-
-| ID  | Candidate invariant                                                                                                                                                      | Basis                                                  | Draft review state |
-| --- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------ | ------------------ |
-| FR1 | The outer root renders `role="log"`, `aria-live="polite"`, and `tabIndex=0`; `isStreaming=true` adds `aria-busy="true"`, which is absent otherwise.                      | Shipped source, colocated DOM tests and consumer docs  | verify             |
-| FR2 | The chosen density is reflected as `data-density` on the root and flows to child messages through `ChatListContext`; it selects three spacing groups.                    | Shipped source, colocated density test, family docs    | verify             |
-| FR3 | The optional `gap` replaces only the top-level row gap; density still selects padding and context.                                                                       | Shipped source and consumer docs                       | verify             |
-| FR4 | `emptyState` renders only when `children` is nullish, `false`, or an empty top-level array. Otherwise the passed children render unchanged.                              | Shipped source, empty-array and numeric-zero tests     | verify             |
-| FR5 | `align="bottom"` includes a flex spacer before messages; `align="top"` omits it. Overflowing content is not given a different rendering path.                            | Shipped source, colocated tests, existing family story | verify             |
-| FR6 | Supplying `scrollToTopAction` creates an observed top sentinel. An intersection starts its async transition, and a top-positioned spinner renders while it is pending.   | Shipped source, consumer docs, focused async test      | verify             |
-| FR7 | Inside ChatLayout, the inner content element is passed to the layout's `contentRef` and removed from that registration on cleanup; standalone lists have no layout ref.  | Shipped source and context definition                  | verify             |
-| FR8 | The root receives `ref`, accepted DOM/data/ARIA props, and composed `className`, `style`, and `xstyle`; component-owned log semantics are applied after forwarded props. | Shipped source and shared public API authority         | verify             |
-
-For the `emptyState` slot, numeric `0` is visible content. Nullish values,
-booleans, and an empty string do not create an empty wrapper. This describes
-scalar output only; it does not decide how to inspect nested children.
-
-### Allowed variation
-
-- **AV1 - Content.** Any caller-owned ReactNode may be placed in the list; the
-  list does not infer sender metadata from children.
-- **AV2 - Spacing.** Density selects token-based defaults; the optional `gap`
-  selects a published spacing step without changing the child density.
-- **AV3 - Scroll ownership.** The list may be used alone or inside ChatLayout;
-  auto-follow behavior remains outside this component.
-
-### Representative states
-
-| State                         | Observed result                                       | Allowed variation                          |
-| ----------------------------- | ----------------------------------------------------- | ------------------------------------------ |
-| Two messages and a system row | Polite log with messages in source order              | Caller controls row content                |
-| Empty top-level children      | Optional centered empty state                         | An omitted empty state leaves an empty log |
-| Compact/balanced/spacious     | Different token-derived row spacing and child density | `gap` may override only row spacing        |
-| Short top/bottom list         | Bottom includes a spacer, top omits it                | Container height is caller-owned           |
-| Streaming                     | Log has `aria-busy=true`                              | Message content remains caller-owned       |
-| Top action pending            | Spinner above content while transition is pending     | Async action result is caller-owned        |
-
-### Performance and resources
-
-- An `IntersectionObserver` is installed only when `scrollToTopAction` exists,
-  and disconnected on cleanup. Its root is ChatLayout's scroll container when
-  available, otherwise the document viewport.
-- An Effect registers the inner content element with ChatLayout, then clears
-  that registration on cleanup. This draft does not prescribe an internal hook
-  or listener implementation.
-
-## Accessibility contract
-
-- The shipped root is a focusable polite log with `aria-busy` reflecting
-  `isStreaming`; this describes browser-exposed semantics, not an observed
-  screen-reader announcement transcript.
-- The loading spinner is a separate child of the log. The list adds no
-  interactive button or directional keyboard behavior of its own.
-- Caller-supplied content remains responsible for names and semantics inside
-  messages. This record does not claim one browser/AT pairing proves another.
-
-## Design relationships
-
-No current component-local design decision is added by this observational
-backfill. Spacing uses portable semantic token steps. The family consumer doc
-owns the published `chat-message-list` theme target and its `density` axis.
-This record does not choose a new visual representation or a new theming target.
-
-## Family and system relationships
-
-- No `family:chat` authority record currently exists. `Chat.doc.mjs` is the
-  consumer family document, not a product-authority family contract.
-- `ChatLayout` owns the scroll container and provides `contentRef`; the list
-  registers its content element without taking over ChatLayout's scrolling.
-- `spec:AST-029` governs observational audit backfills and keeps their
-  evidence inventory separate from component policy.
-
-## Verification map
-
-| Contract | Evidence                                                            | Representative states              | Mutation or failure expectation                          | Audit section              |
-| -------- | ------------------------------------------------------------------- | ---------------------------------- | -------------------------------------------------------- | -------------------------- |
-| FR1      | `ChatMessageList.test.tsx` ARIA assertions; Chromium audit receipts | rest, streaming                    | Dropping busy or the log role changes the exposed state  | `audit:ChatMessageList/§1` |
-| FR2–FR3  | density test, theming-target guard, rendered comparison             | three densities and gap override   | Losing density reflection or row spacing becomes visible | `audit:ChatMessageList/§2` |
-| FR4–FR5  | empty/align tests, component-owned Storybook and Chromium receipts  | empty, top and bottom              | Empty substitute or short-list placement changes         | `audit:ChatMessageList/§4` |
-| FR6      | `ChatMessageList.test.tsx` async action/status test                 | sentinel absent, pending, settled  | Action loss or stuck spinner fails the focused test      | `audit:ChatMessageList/§6` |
-| FR7      | ChatLayout integration and source review                            | standalone, inside layout, unmount | Content observation can lose registration                | `audit:ChatMessageList/§7` |
-| FR8      | `themingTargets.test.ts`, focused root passthrough inspection       | ref, DOM/ARIA, styling             | Consumer inputs fail to reach or compose on the root     | `audit:ChatMessageList/§3` |
-
-## Decision log
-
-None. This draft settles no component-local product decision.
-
-## Open questions
-
-- **OQ1 - What is the intended overlap policy for repeated top-sentinel
-  intersections while an async load remains pending?** (`human-api`) The current
-  source invokes the action on intersection; this record does not add a
-  single-flight, initial-load, or exhaustion guarantee.
-- **OQ2 - Should emptiness inspect nested non-rendering ReactNode values?**
-  (`human-api`) The shipped test is limited to the top-level `children` value.
-  Do not reinterpret that test as a policy about generators, fragments,
-  promised children, or arrays of non-rendering values.
-
-## Content boundary
-
-This file contains no audit score, screenshot matrix, run transcript, consumer
-prop example, new public API, or cross-component visual policy.

package/src/Chat/ChatMessageList.test.tsx

@@ -1,198 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-/**
- * @file ChatMessageList.test.tsx
- * @input React Testing Library, Vitest, and the public ChatMessageList surface
- * @output Observable log, empty-state, alignment, and async-loading regressions
- * @position Colocated component behavior tests
- */
-
-import {describe, it, expect, vi} from 'vitest';
-import {act, render, screen} from '@testing-library/react';
-import {ChatMessageList} from './ChatMessageList';
-import {ChatMessage} from './ChatMessage';
-import {ChatMessageBubble} from './ChatMessageBubble';
-
-describe('ChatMessageList', () => {
-  it('renders children', () => {
-    render(
-      <ChatMessageList>
-        <ChatMessage sender="assistant">
-          <ChatMessageBubble>Hello</ChatMessageBubble>
-        </ChatMessage>
-      </ChatMessageList>,
-    );
-    expect(screen.getByText('Hello')).toBeTruthy();
-  });
-
-  it('renders with role="log"', () => {
-    render(
-      <ChatMessageList data-testid="list">
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    const el = screen.getByTestId('list');
-    expect(el.getAttribute('role')).toBe('log');
-  });
-
-  it('is not aria-busy by default', () => {
-    render(
-      <ChatMessageList data-testid="list">
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    expect(screen.getByTestId('list')).not.toHaveAttribute('aria-busy');
-  });
-
-  it('marks the log aria-busy while streaming', () => {
-    render(
-      <ChatMessageList data-testid="list" isStreaming>
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    expect(screen.getByTestId('list')).toHaveAttribute('aria-busy', 'true');
-  });
-
-  it('renders empty state when no children', () => {
-    render(
-      <ChatMessageList emptyState={<div>No messages yet</div>}>
-        {[]}
-      </ChatMessageList>,
-    );
-    expect(screen.getByText('No messages yet')).toBeTruthy();
-  });
-
-  it('renders an accepted numeric empty state', () => {
-    render(<ChatMessageList emptyState={0}>{[]}</ChatMessageList>);
-    expect(screen.getByRole('log')).toHaveTextContent('0');
-  });
-
-  it('applies density class', () => {
-    render(
-      <ChatMessageList density="compact" data-testid="list">
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    const el = screen.getByTestId('list');
-    expect(el).toHaveAttribute('data-density', 'compact');
-  });
-
-  it('accepts gap independently from density', () => {
-    render(
-      <ChatMessageList density="compact" gap={6} data-testid="list">
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    const el = screen.getByTestId('list');
-    expect(el).toHaveAttribute('data-density', 'compact');
-  });
-
-  it('applies data-testid', () => {
-    render(
-      <ChatMessageList data-testid="chat-list">
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    expect(screen.getByTestId('chat-list')).toBeTruthy();
-  });
-
-  // With no scrollToTopAction the spacer is the only aria-hidden element in
-  // the list, so its presence maps 1:1 to the aria-hidden count.
-  it('renders the bottom spacer by default', () => {
-    render(
-      <ChatMessageList data-testid="list">
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    expect(
-      screen.getByTestId('list').querySelectorAll('[aria-hidden]'),
-    ).toHaveLength(1);
-  });
-
-  it('renders the bottom spacer when align="bottom"', () => {
-    render(
-      <ChatMessageList align="bottom" data-testid="list">
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    expect(
-      screen.getByTestId('list').querySelectorAll('[aria-hidden]'),
-    ).toHaveLength(1);
-  });
-
-  it('omits the spacer when align="top"', () => {
-    render(
-      <ChatMessageList align="top" data-testid="list">
-        <div>msg</div>
-      </ChatMessageList>,
-    );
-    expect(
-      screen.getByTestId('list').querySelectorAll('[aria-hidden]'),
-    ).toHaveLength(0);
-  });
-
-  it('still renders children when align="top"', () => {
-    render(
-      <ChatMessageList align="top">
-        <ChatMessage sender="assistant">
-          <ChatMessageBubble>Hello</ChatMessageBubble>
-        </ChatMessage>
-      </ChatMessageList>,
-    );
-    expect(screen.getByText('Hello')).toBeTruthy();
-  });
-
-  it('loads older messages through the top sentinel and exposes pending status', async () => {
-    let notify!: IntersectionObserverCallback;
-    let complete!: () => void;
-    const observeSentinel = vi.fn();
-    const disconnect = vi.fn();
-    const action = vi.fn(
-      async () =>
-        new Promise<void>(resolve => {
-          complete = resolve;
-        }),
-    );
-    class Observer {
-      constructor(callback: IntersectionObserverCallback) {
-        notify = callback;
-      }
-      observe = observeSentinel;
-      disconnect = disconnect;
-    }
-    vi.stubGlobal('IntersectionObserver', Observer);
-    try {
-      const {unmount} = render(
-        <ChatMessageList scrollToTopAction={action}>
-          <div>Earlier message</div>
-        </ChatMessageList>,
-      );
-      expect(observeSentinel).toHaveBeenCalledTimes(1);
-      act(() => {
-        notify(
-          [{isIntersecting: false} as IntersectionObserverEntry],
-          {} as IntersectionObserver,
-        );
-      });
-      expect(action).not.toHaveBeenCalled();
-      act(() => {
-        notify(
-          [{isIntersecting: true} as IntersectionObserverEntry],
-          {} as IntersectionObserver,
-        );
-      });
-      expect(action).toHaveBeenCalledTimes(1);
-      // The loader Spinner inside the log is silent (spec:AST-086 FR4, FR8).
-      expect(document.querySelector('.astryx-spinner')).toHaveAttribute(
-        'aria-hidden',
-        'true',
-      );
-      await act(async () => complete());
-      expect(document.querySelector('.astryx-spinner')).toBeNull();
-      unmount();
-      expect(disconnect).toHaveBeenCalledTimes(1);
-    } finally {
-      vi.unstubAllGlobals();
-    }
-  });
-});

package/src/Chat/ChatMessageMetadata.spec.md

@@ -1,220 +0,0 @@
----
-schema_version: 3
-template_version: 6
-kind: component
-id: component:ChatMessageMetadata
-authority: draft
-archive_reason: null
-superseded_by: null
-approved_by: null
-approved_at: null
-owners: [cixzhang]
-review_triggers: [public-api, behavior, layout, accessibility, theming, testing]
-verified_by:
-  [
-    packages/core/src/Chat/ChatMessageMetadata.test.tsx,
-    packages/core/src/Chat/__tests__/ChatMessageMetadata.a11y.chromium.spec.ts,
-    apps/storybook/stories/ChatMessageMetadata.stories.tsx,
-    packages/core/src/theme/themingTargets.test.ts,
-  ]
-modules: []
-families: []
-design_specs: []
-architecture:
-  [
-    architecture:public-component-api,
-    architecture:component-test-sufficiency,
-    architecture:component-theming-surface,
-    architecture:component-style-authoring,
-    architecture:react-component-runtime,
-    architecture:knowledge-contracts,
-  ]
-contributing: []
-system_specs: [spec:AST-029]
----
-
-# ChatMessageMetadata component contract
-
-This is an observational draft of the existing Core chat metadata surface and
-its tested empty-scalar correction. It creates no new prop, status meaning,
-announcement guarantee, or visual policy. Current shared records govern their
-own scopes independently of this draft.
-
-## Contract at a glance
-
-| Area                    | Contract                                                                                                                                                                                                            |
-| ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| Public contract         | Optional `timestamp` and `footer` ReactNode slots, optional closed `status` union, root `BaseProps<HTMLDivElement>` and `ref`, exported through `./Chat`.                                                           |
-| Behavior                | The row renders its present slots in timestamp, footer, status order, with a separator only between present slots; user sender reverses the flex row. Five delivery statuses have localized icon-and-text displays. |
-| End-user impact         | Non-rendering scalar slot values no longer leave a standalone dot, a blank metadata row, or a separator without adjacent content. Visible numeric zero remains.                                                     |
-| Builder impact          | No new inputs, defaults, or migration. Caller-supplied footer controls remain caller-owned.                                                                                                                         |
-| Compatibility/readiness | Patch-compatible scalar correction to a released `./Chat` subpath; draft pending exact-head observational verification and owner review.                                                                            |
-| Review checks           | Reject a lost visible zero, stranded separator, omitted translated status label, dropped root passthrough, or claim that a static DOM attribute proves an AT announcement.                                          |
-| Governing rules         | `architecture:public-component-api/INV1, INV3, INV5–INV9`; `architecture:component-test-sufficiency/INV1–INV7`; `spec:AST-029/FR2–FR5`.                                                                             |
-
-The table is a review projection. Consumer syntax belongs in
-`ChatMessageMetadata.doc.mjs` and the Chat family consumer documentation.
-
-## Intent
-
-ChatMessageMetadata is the optional compact line below a chat message. It
-projects caller-owned timestamp/footer content and an optional delivery status
-inside the sender-aware Chat composition. It is not the message article, the
-bubble surface, the transcript, or the footer control owner.
-
-## Compatibility and migration
-
-- Released default preserved: yes. Core `0.6.3` exports `./Chat` with this
-  component, props, and status type.
-- Compatibility class: patch correction for non-rendering scalar ReactNode
-  values, preserving numeric `0` and the published props.
-- Controlled/uncontrolled behavior: not applicable; the component stores no
-  delivery state.
-- Migration decision: none. Existing callers need no new option.
-
-Consumer migration instructions, when needed, belong in release notes rather
-than this record.
-
-## Ownership boundary
-
-**Owns**
-
-- The optional metadata root, its `chat-message-metadata` painting target,
-  ref, neutral DOM passthrough, and composed styling inputs.
-- Presence checks and separators among timestamp, footer, and status.
-- Sender-relative row order from the nearest Chat message context, with an
-  assistant fallback outside that context.
-- Status-to-glyph and translated-caption selection and the local sending/error
-  paint path.
-
-**Does not own / non-goals**
-
-- Sender identity, article semantics, avatar, name, and body alignment:
-  `ChatMessage` owns these.
-- Bubble inset and placement: `ChatMessageBubble` owns these.
-- Footer action semantics, button focus, and callback behavior: the caller's
-  supplied content owns them.
-- Transcript scrolling, loading, or delivery-state transitions: the surrounding
-  composition owns these.
-- A new public rule for inspecting composite, lazy, or asynchronous ReactNode
-  values, or a screen-reader announcement-timing guarantee.
-
-## Public concepts
-
-| Concept        | Closed values or states                                            | Observed meaning                                                  | Availability                                        | Default                                     | Owner                               | Stability     | Invalid-value behavior                                                                               |
-| -------------- | ------------------------------------------------------------------ | ----------------------------------------------------------------- | --------------------------------------------------- | ------------------------------------------- | ----------------------------------- | ------------- | ---------------------------------------------------------------------------------------------------- |
-| `timestamp`    | Omitted or caller ReactNode                                        | Optional first item, normally a time                              | Any composition                                     | Omitted                                     | Caller                              | Released      | Null, booleans, and empty string do not render a scalar slot; `0` renders; non-scalars remain opaque |
-| `footer`       | Omitted or caller ReactNode                                        | Optional middle item such as model information or caller controls | Any composition                                     | Omitted                                     | Caller                              | Released      | Same scalar treatment as timestamp                                                                   |
-| `status`       | `sending`, `sent`, `delivered`, `read`, `error`, omitted           | Optional delivery caption and glyph                               | Any composition                                     | Omitted                                     | Component/caller input              | Released      | Closed type union; omitted contributes no item                                                       |
-| Sender context | `user`, `assistant`, `system`, absent                              | Selects user-reversed or other forward row order                  | Within `ChatMessage` or standalone                  | Assistant when absent                       | `ChatMessage` / local fallback      | Observational | Non-user values share the forward path                                                               |
-| Root surface   | `BaseProps<HTMLDivElement>`, `ref`, `xstyle`, `className`, `style` | Extends the metadata row when it exists                           | Slot passes scalar-presence check or status present | Absent for empty scalar slots and no status | `architecture:public-component-api` | Released      | Non-scalar values remain opaque; target and consumer styles combine                                  |
-
-## Behavioral and layout contract
-
-The following candidate invariants name their evidence. They are observations
-for review, not current product policy created by this draft.
-
-| ID  | Candidate invariant                                                                                                                                                                          | Basis                                                                                               | Draft review state |
-| --- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- | ------------------ |
-| FR1 | The root appears when at least one slot passes the shared scalar-presence predicate or `status` is present. Non-scalar values are treated as present without inspecting their inner content. | Public ReactNode seam, shared `isRenderable` scalar utility, focused red/green and browser evidence | Verify correction  |
-| FR2 | Accepted slot values render in timestamp, footer, status order with dots between values considered present; numeric `0` is visible in either slot, and non-scalar nodes remain opaque.       | Shipped ordering, shared scalar utility, focused tests, light/dark browser cases                    | Verify correction  |
-| FR3 | A `user` message reverses row direction; `assistant`, `system`, and absent context use the forward path.                                                                                     | Source, Chat context, sender and RTL browser fixtures                                               | Verify observation |
-| FR4 | Status selects one of five registry icons and localized labels; failure uses the error text token, and sending has a CSS pulse suppressed under reduced motion.                              | Source, locale catalog, owned browser status matrix                                                 | Verify observation |
-| FR5 | The root merges the target, default StyleX output, and consumer `xstyle`, `className`, and `style`; accepted neutral DOM/ARIA inputs and `ref` reach that root.                              | Source, public API authority, existing passthrough test                                             | Verify observation |
-| FR6 | A status item has a translated title and author-supplied `aria-label`, an icon and visible localized text. The row declares no live-region role or imperative announcement.                  | Source, DOM tests and axe fixtures; no real-AT timing claim                                         | Verify observation |
-
-### Allowed variation
-
-- **AV1 - Slot content.** The caller decides the structure and semantics inside
-  timestamp and footer slots. This component does not inspect non-scalar nodes.
-- **AV2 - Theme.** Semantic colors, typography, and spacing resolve through the
-  active Theme; the root remains the public metadata painting target.
-- **AV3 - Context.** Standalone use takes the assistant ordering fallback.
-
-### Representative states
-
-| State                       | Observed result                                                             | Allowed variation                      |
-| --------------------------- | --------------------------------------------------------------------------- | -------------------------------------- |
-| Standalone timestamp        | One root and one visible item                                               | Caller content                         |
-| User or assistant message   | Sender-relative row order                                                   | Text direction inherited from the page |
-| Timestamp + footer + status | Items separated according to scalar presence; composite nodes remain opaque | Caller footer content                  |
-| Each delivery status        | Distinct localized caption and mapped icon                                  | Active translation and theme tokens    |
-| Non-rendering scalar slots  | No stranded dot; no row when all items are empty                            | Composite nodes remain opaque          |
-| Numeric `0`                 | Visible content, not an empty marker                                        | Either slot                            |
-| Long footer at narrow width | Content reflows within its container                                        | Caller text may wrap                   |
-
-### Transformation and precedence order
-
-- **ORD1 - Presence before separators.** Decide scalar presence with the shared
-  predicate while treating non-scalar caller nodes as opaque, then place
-  punctuation between values considered present. The status check remains
-  independent of the slot checks.
-- **ORD2 - Composition.** Resolve sender context, select flex order, and compose
-  component StyleX and theme target with consumer styling inputs on one root.
-
-### Performance and resources
-
-- **PR1 - Render derivation.** The component creates no local React state,
-  Effects, timers, observer, or event listeners. Its local animation is CSS and
-  suppressed for reduced motion.
-
-## Accessibility contract
-
-- **AR1 - Display semantics.** The metadata line does not add a button, focus
-  target, list role, or live region of its own. Interactive footer content retains
-  its own semantics and keyboard behavior.
-- **AR2 - Visible delivery state.** The status caption accompanies the glyph so
-  state identification does not rely on color or the icon alone.
-- **AR3 - Evidence boundary.** Browser-exposed markup and axe coverage do not
-  establish spoken output or announcement timing; any such future claim follows
-  `spec:AST-009` and its named AT evidence rule.
-
-## Design relationships
-
-| Anatomy or state | Design requirement                                               | Representation authority                     | Hierarchy role | Component contract |
-| ---------------- | ---------------------------------------------------------------- | -------------------------------------------- | -------------- | ------------------ |
-| Metadata row     | Semantic supporting typography and sender-relative reading order | Local representation unsettled               | Supporting     | FR2–FR3            |
-| Delivery status  | Registry glyph, caption, and semantic error token                | Local prominence and motion choice unsettled | Supporting     | FR4, AR2           |
-
-No current component-local ChatMessageMetadata design decision is introduced.
-The draft `design:motion` and `design:system-states` records are not adopted as
-current authority by this record.
-
-## Family and system relationships
-
-- There is no current `family:chat` product-authority record. `Chat.doc.mjs` is
-  consumer composition guidance, not a family contract.
-- `architecture:public-component-api` owns root export and passthrough;
-  `architecture:component-theming-surface` owns the public painting target;
-  `architecture:component-test-sufficiency` owns bounded evidence coverage.
-- `spec:AST-029` keeps the closed audit inventory and score outside this
-  component draft.
-
-## Verification map
-
-| Contract     | Evidence                                               | Representative states                       | Mutation or failure expectation                                   | Audit section                             |
-| ------------ | ------------------------------------------------------ | ------------------------------------------- | ----------------------------------------------------------------- | ----------------------------------------- |
-| FR1–FR2      | `ChatMessageMetadata.test.tsx`; Chromium receipts      | empty scalar, zero, timestamp/footer/status | A nullish-only guard reintroduces a stray separator or blank row  | `audit:ChatMessageMetadata/behavior`      |
-| FR3          | Storybook sender fixtures and Chromium RTL frames      | user, assistant, standalone in LTR/RTL      | Wrong relative ordering becomes visible                           | `audit:ChatMessageMetadata/rtl`           |
-| FR4, AR2     | Status fixtures, locale catalog, Chromium/axe receipts | five statuses, light/dark, reduced motion   | A dropped status label or failed theme paint is visible           | `audit:ChatMessageMetadata/accessibility` |
-| FR5          | Existing passthrough test and theming-target guard     | DOM/data/ARIA and styling                   | Root drops accepted caller inputs or target                       | `audit:ChatMessageMetadata/public-api`    |
-| FR6, AR1–AR3 | Axe and browser semantic receipts                      | static status and caller button             | Missing text/icon or falsely claimed AT timing remains detectable | `audit:ChatMessageMetadata/testing`       |
-
-## Decision log
-
-None. This draft makes no new component-local product decision.
-
-## Open questions
-
-- **OQ1 - Should non-scalar ReactNode slots ever be normalized for emptiness?**
-  (`human-api`) Arrays, Fragments, lazy content, and promises remain opaque under
-  the existing scalar predicate; this audit does not consume or inspect them.
-- **OQ2 - Should standalone delivery-status changes be announced, and if so by
-  which owner?** (`human-api`) The current row is display-only. No spoken-timing
-  claim is made without a current owner and applicable AT evidence.
-
-## Content boundary
-
-This record does not store an audit score, screenshot manifest, CI transcript,
-consumer prop example, new public API, or shared visual policy. Those remain in
-the audit PR evidence, consumer docs, and their canonical owners.