@astryxdesign/core 0.7.6-canary.aa138b9 → 0.7.6-canary.b295cd5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +4 -4
- package/src/Chat/ChatSendButton.spec.md +78 -67
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@astryxdesign/core",
|
|
3
|
-
"version": "0.7.6-canary.
|
|
3
|
+
"version": "0.7.6-canary.b295cd5",
|
|
4
4
|
"displayName": "Astryx Core",
|
|
5
5
|
"description": "The component library. Accessible, themeable React components with built-in spacing, dark mode, and StyleX styling.",
|
|
6
6
|
"author": "Meta Open Source",
|
|
@@ -847,9 +847,9 @@
|
|
|
847
847
|
"react-dom": ">=19.0.0"
|
|
848
848
|
},
|
|
849
849
|
"devDependencies": {
|
|
850
|
-
"@astryxdesign/a11y-spec": "0.7.6-canary.
|
|
851
|
-
"@astryxdesign/cli": "0.7.6-canary.
|
|
852
|
-
"@astryxdesign/interaction-harness": "0.7.6-canary.
|
|
850
|
+
"@astryxdesign/a11y-spec": "0.7.6-canary.b295cd5",
|
|
851
|
+
"@astryxdesign/cli": "0.7.6-canary.b295cd5",
|
|
852
|
+
"@astryxdesign/interaction-harness": "0.7.6-canary.b295cd5",
|
|
853
853
|
"@babel/cli": "^7.29.7",
|
|
854
854
|
"@babel/core": "^7.29.7",
|
|
855
855
|
"@babel/preset-react": "^7.29.7",
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
---
|
|
2
2
|
schema_version: 3
|
|
3
|
-
template_version:
|
|
3
|
+
template_version: 7
|
|
4
4
|
kind: component
|
|
5
5
|
id: component:ChatSendButton
|
|
6
|
-
authority:
|
|
6
|
+
authority: current
|
|
7
7
|
archive_reason: null
|
|
8
8
|
superseded_by: null
|
|
9
|
-
approved_by:
|
|
10
|
-
approved_at:
|
|
9
|
+
approved_by: cixzhang
|
|
10
|
+
approved_at: 2026-10-31
|
|
11
11
|
owners: [cixzhang]
|
|
12
12
|
review_triggers: [public-api, behavior, theming, accessibility, testing]
|
|
13
13
|
verified_by:
|
|
@@ -39,18 +39,17 @@ system_specs: [spec:AST-002, spec:AST-020, spec:AST-029, spec:AST-032]
|
|
|
39
39
|
|
|
40
40
|
## Contract at a glance
|
|
41
41
|
|
|
42
|
-
| Area | Contract
|
|
43
|
-
| ----------------------- |
|
|
44
|
-
| Public contract | The exported control selects send or stop presentation from props over ChatComposer context, accepts `sm` or `md`, supports icon overrides, and extends the rendered Button with supported Button DOM, event, styling, and ref inputs.
|
|
45
|
-
| Behavior | Send is disabled from explicit or composer readiness, stop remains enabled, state-specific actions run before a composed generic click handler, and current send artwork resolves from an explicit override before the shared fallback.
|
|
46
|
-
| End-user impact | People receive a translated, state-appropriate send or stop action whose availability follows composer readiness.
|
|
47
|
-
| Builder impact |
|
|
48
|
-
| Compatibility/readiness |
|
|
49
|
-
| Review checks | Reject lost send/stop routing, consumer events that replace the state action, a disabled stop action, unlabelled icon-only output, dropped root inputs, or
|
|
50
|
-
| Governing rules | `spec:AST-032
|
|
42
|
+
| Area | Contract |
|
|
43
|
+
| ----------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
44
|
+
| Public contract | The exported control selects send or stop presentation from props over ChatComposer context, accepts `sm` or `md`, supports icon overrides, and extends the rendered Button with supported Button DOM, event, styling, and ref inputs. |
|
|
45
|
+
| Behavior | Send is disabled from explicit or composer readiness, stop remains enabled, state-specific actions run before a composed generic click handler, and current send artwork resolves from an explicit override before the shared fallback. |
|
|
46
|
+
| End-user impact | People receive a translated, state-appropriate send or stop action whose availability follows composer readiness. |
|
|
47
|
+
| Builder impact | None. |
|
|
48
|
+
| Compatibility/readiness | Records shipped behavior; no public change. One implementation gap, listed under Current-state impact. |
|
|
49
|
+
| Review checks | Reject lost send/stop routing, consumer events that replace the state action, a disabled stop action, unlabelled icon-only output, dropped root inputs, or a lost explicit-first send icon or `arrowUp` fallback. |
|
|
50
|
+
| Governing rules | `spec:AST-032` FR2–FR3; `architecture:public-component-api` INV5–INV8; `architecture:interaction-modality`; `architecture:component-test-sufficiency`; `spec:AST-020`; `spec:AST-029`. |
|
|
51
51
|
|
|
52
|
-
This table is a review projection
|
|
53
|
-
or remediated behavior and does not create product policy.
|
|
52
|
+
This table is a review projection; the body below is authoritative.
|
|
54
53
|
|
|
55
54
|
## Intent
|
|
56
55
|
|
|
@@ -60,13 +59,21 @@ icon, styling, and ref seams available for standalone composition.
|
|
|
60
59
|
|
|
61
60
|
## Compatibility and migration
|
|
62
61
|
|
|
63
|
-
- Released default preserved:
|
|
64
|
-
- Compatibility class:
|
|
65
|
-
- Controlled/uncontrolled behavior: not applicable; explicit props take
|
|
66
|
-
|
|
62
|
+
- Released default preserved: `yes`
|
|
63
|
+
- Compatibility class: records shipped behavior; no public change
|
|
64
|
+
- Controlled/uncontrolled behavior: not applicable; explicit props take
|
|
65
|
+
precedence over context-derived values
|
|
66
|
+
- Migration decision: none
|
|
67
67
|
|
|
68
68
|
Consumer migration instructions belong in consumer docs and release notes.
|
|
69
69
|
|
|
70
|
+
## Current-state impact
|
|
71
|
+
|
|
72
|
+
- **The send icon has no component-slot stage.** Send artwork resolves from
|
|
73
|
+
`sendIcon`, then the shared `arrowUp`. `spec:AST-032` FR2–FR3 put a
|
|
74
|
+
component-icon slot stage in that resolution; ChatSendButton does not offer
|
|
75
|
+
it yet (FR3).
|
|
76
|
+
|
|
70
77
|
## Ownership boundary
|
|
71
78
|
|
|
72
79
|
**Owns**
|
|
@@ -90,34 +97,34 @@ Consumer migration instructions belong in consumer docs and release notes.
|
|
|
90
97
|
Consumer syntax remains in `ChatSendButton.doc.mjs`. This inventory closes the
|
|
91
98
|
observable semantic surface without duplicating the prop table.
|
|
92
99
|
|
|
93
|
-
| Concept | Closed values or states | Meaning | Availability by variant/orientation/state | Default | Owner | Stability
|
|
94
|
-
| ------------ | -------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ----------------------------------------- | ----------------------------------------------------------- | ----------------------------------- |
|
|
95
|
-
| Action state | send; stop | Selects the name, Button variant, icon role, disabled rule, and state action. | Every render. | Composer `isStopShown`, otherwise send. | `component:ChatSendButton` |
|
|
96
|
-
| Availability | enabled; disabled | Prevents send activation when content is not ready. Stop intentionally ignores it. | Disabled applies only to send. | Explicit `isDisabled`, otherwise inverse composer canSend. | component and ChatComposer context |
|
|
97
|
-
| Action | state callback; composer fallback; composed generic click | Runs the state action and then an accepted consumer click handler. | Enabled send and stop activation. | `onSend` or submit current value; `onStop` or context stop. | component, context, and caller |
|
|
98
|
-
| Send icon | explicit content; shared fallback | Selects artwork for the send state. | Send state. | `sendIcon`, then shared `arrowUp`. | component and caller |
|
|
99
|
-
| Stop icon | explicit content; shared fallback | Selects artwork for the stop state. | Stop state. | `stopIcon`, then shared `stop`. | component and caller |
|
|
100
|
-
| Size | `sm`; `md` | Selects the delegated Button size while preserving circular treatment. | Both states. | `md`. | `component:ChatSendButton` |
|
|
101
|
-
| Root surface | ref; supported Button DOM/data/ARIA/events; style/class/xstyle | Extends and styles the rendered Button without replacing component-owned action logic. | Every render. | Omitted. | `architecture:public-component-api` |
|
|
100
|
+
| Concept | Closed values or states | Meaning | Availability by variant/orientation/state | Default | Owner | Stability | Invalid-value behavior |
|
|
101
|
+
| ------------ | -------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ----------------------------------------- | ----------------------------------------------------------- | ----------------------------------- | --------- | ------------------------------------------------------------------------------------------- |
|
|
102
|
+
| Action state | send; stop | Selects the name, Button variant, icon role, disabled rule, and state action. | Every render. | Composer `isStopShown`, otherwise send. | `component:ChatSendButton` | Stable | Values outside the boolean prop type are unsupported. |
|
|
103
|
+
| Availability | enabled; disabled | Prevents send activation when content is not ready. Stop intentionally ignores it. | Disabled applies only to send. | Explicit `isDisabled`, otherwise inverse composer canSend. | component and ChatComposer context | Stable | Values outside the boolean prop type are unsupported. |
|
|
104
|
+
| Action | state callback; composer fallback; composed generic click | Runs the state action and then an accepted consumer click handler. | Enabled send and stop activation. | `onSend` or submit current value; `onStop` or context stop. | component, context, and caller | Stable | With no state callback or matching context action, only a supplied generic click can run. |
|
|
105
|
+
| Send icon | explicit content; shared fallback | Selects artwork for the send state. | Send state. | `sendIcon`, then shared `arrowUp`. | component and caller | Stable | Unsupported React content follows the shared Button rendering boundary. |
|
|
106
|
+
| Stop icon | explicit content; shared fallback | Selects artwork for the stop state. | Stop state. | `stopIcon`, then shared `stop`. | component and caller | Stable | Unsupported React content follows the shared Button rendering boundary. |
|
|
107
|
+
| Size | `sm`; `md` | Selects the delegated Button size while preserving circular treatment. | Both states. | `md`. | `component:ChatSendButton` | Stable | Values outside the public union are rejected by TypeScript. |
|
|
108
|
+
| Root surface | ref; supported Button DOM/data/ARIA/events; style/class/xstyle | Extends and styles the rendered Button without replacing component-owned action logic. | Every render. | Omitted. | `architecture:public-component-api` | Stable | Unsupported BaseProps omissions remain unsupported; owned semantics win accidental clashes. |
|
|
102
109
|
|
|
103
110
|
## Behavioral and layout contract
|
|
104
111
|
|
|
105
|
-
| ID |
|
|
106
|
-
| --- |
|
|
107
|
-
| FR1 | The send state MUST render a primary icon-only Button named by the send translation, and it MUST be disabled when explicit or context-derived readiness is false.
|
|
108
|
-
| FR2 | The stop state MUST render a secondary icon-only Button named by the stop translation, remain enabled regardless of send readiness, and invoke explicit or context stop behavior.
|
|
109
|
-
| FR3 | Send icon resolution
|
|
110
|
-
| FR4 | Stop icon resolution
|
|
111
|
-
| FR5 | Explicit state, disabled, callback, icon, and size props MUST win over their context or component fallback. A generic accepted click handler MUST compose after the selected state action rather than replace it.
|
|
112
|
-
| FR6 | Supported Button DOM, data, ARIA, className, style, xstyle, and ref inputs MUST reach or compose on the rendered Button while component-owned label, state, and activation behavior remain intact.
|
|
113
|
-
| FR7 | The component MUST paint through the shared Button on the co-located `chat-send-button` target and preserve its circular component treatment.
|
|
112
|
+
| ID | Invariant | Basis |
|
|
113
|
+
| --- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------- |
|
|
114
|
+
| FR1 | The send state MUST render a primary icon-only Button named by the send translation, and it MUST be disabled when explicit or context-derived readiness is false. | Current implementation, docs, tests, `spec:AST-020`, and shared Button behavior |
|
|
115
|
+
| FR2 | The stop state MUST render a secondary icon-only Button named by the stop translation, remain enabled regardless of send readiness, and invoke explicit or context stop behavior. | Current implementation, docs, and tests |
|
|
116
|
+
| FR3 | Send icon resolution prefers `sendIcon` and otherwise resolves the shared `arrowUp`. Implementation gap: the component-icon slot stage `spec:AST-032` FR2–FR3 require is not offered (Current-state impact). | Current implementation, docs, tests, and current owner requirement in `spec:AST-032` |
|
|
117
|
+
| FR4 | Stop icon resolution prefers `stopIcon` and otherwise resolves the shared `stop` icon. | Current implementation, docs, and tests |
|
|
118
|
+
| FR5 | Explicit state, disabled, callback, icon, and size props MUST win over their context or component fallback. A generic accepted click handler MUST compose after the selected state action rather than replace it. | Current source and tests; `architecture:public-component-api` INV5–INV7 |
|
|
119
|
+
| FR6 | Supported Button DOM, data, ARIA, className, style, xstyle, and ref inputs MUST reach or compose on the rendered Button while component-owned label, state, and activation behavior remain intact. | Current implementation plus `architecture:public-component-api/INV5-INV8` |
|
|
120
|
+
| FR7 | The component MUST paint through the shared Button on the co-located `chat-send-button` target and preserve its circular component treatment. | Current implementation, Chat consumer docs, and `architecture:component-theming-surface` |
|
|
114
121
|
|
|
115
122
|
### Allowed variation
|
|
116
123
|
|
|
117
124
|
- **AV1 — Context or standalone composition.** A builder may rely on ChatComposer
|
|
118
125
|
context or provide all state, action, and disabled values explicitly.
|
|
119
126
|
- **AV2 — Artwork.** Explicit send and stop content and shared fallback artwork may
|
|
120
|
-
vary within the
|
|
127
|
+
vary within the icon resolution FR3 and FR4 state.
|
|
121
128
|
- **AV3 — Consumer styling.** Supported styling inputs may extend the Button while
|
|
122
129
|
component-owned state and activation behavior remain.
|
|
123
130
|
|
|
@@ -141,7 +148,9 @@ observable semantic surface without duplicating the prop table.
|
|
|
141
148
|
- **ORD3 — Resolve availability.** Stop remains enabled. Send uses explicit
|
|
142
149
|
`isDisabled`, then inverse composer readiness, then disabled outside context.
|
|
143
150
|
- **ORD4 — Resolve artwork.** In send, explicit `sendIcon` wins, then shared
|
|
144
|
-
`arrowUp`; in stop, explicit `stopIcon` wins, then shared `stop`.
|
|
151
|
+
`arrowUp`; in stop, explicit `stopIcon` wins, then shared `stop`. The
|
|
152
|
+
component-icon slot stage `spec:AST-032` FR2 requires is not offered yet
|
|
153
|
+
(FR3).
|
|
145
154
|
- **ORD5 — Compose root.** Apply component-owned Button semantics and the
|
|
146
155
|
`chat-send-button` target while preserving supported consumer root inputs.
|
|
147
156
|
|
|
@@ -163,14 +172,15 @@ observable semantic surface without duplicating the prop table.
|
|
|
163
172
|
|
|
164
173
|
## Design relationships
|
|
165
174
|
|
|
166
|
-
| Anatomy or state | Design requirement
|
|
167
|
-
| ---------------- |
|
|
168
|
-
| Action button | Circular compact Button carrying the current send or stop action.
|
|
169
|
-
| Send artwork | Upward send glyph unless explicit content wins
|
|
170
|
-
| Stop artwork | Shared stop glyph unless explicit content wins.
|
|
175
|
+
| Anatomy or state | Design requirement | Representation authority | Hierarchy role | Component contract |
|
|
176
|
+
| ---------------- | ----------------------------------------------------------------- | ------------------------------------------------------------ | ------------------------ | ------------------ |
|
|
177
|
+
| Action button | Circular compact Button carrying the current send or stop action. | Current source and consumer docs; exact tuning stays in code | Primary/secondary action | FR1, FR2, FR7 |
|
|
178
|
+
| Send artwork | Upward send glyph unless explicit content wins (FR3's gap). | Current source and docs; `spec:AST-032` FR2–FR3 | Action cue | FR3 |
|
|
179
|
+
| Stop artwork | Shared stop glyph unless explicit content wins. | Current source and consumer docs | Action cue | FR4 |
|
|
171
180
|
|
|
172
|
-
This
|
|
173
|
-
|
|
181
|
+
This record selects no new dimensions, variants, icon artwork, color roles, or
|
|
182
|
+
visual prominence. No anatomy-theming map is recorded yet; the block is
|
|
183
|
+
optional during migration, so the map is deferred.
|
|
174
184
|
|
|
175
185
|
The Chat family consumer doc catalogs `chat-send-button`. Button owns the
|
|
176
186
|
underlying painting and interaction-state styling; the component target is
|
|
@@ -183,43 +193,44 @@ co-located on that painting element.
|
|
|
183
193
|
- `architecture:public-component-api` owns BaseProps reachability, style/ref
|
|
184
194
|
composition, and deliberate event composition.
|
|
185
195
|
- `architecture:icon-resolution-and-component-slots` owns the shared slot model;
|
|
186
|
-
`spec:AST-032
|
|
187
|
-
|
|
188
|
-
the unshipped stage as current behavior.
|
|
196
|
+
`spec:AST-032` FR2–FR3 put a component-slot stage in send resolution, which is
|
|
197
|
+
not shipped (Current-state impact).
|
|
189
198
|
- `architecture:component-theming-surface` owns the qualification and placement
|
|
190
199
|
of the co-located `chat-send-button` target.
|
|
191
200
|
- `architecture:interaction-modality` and `spec:AST-020` own pointer, keyboard,
|
|
192
201
|
focus, and accessibility parity inherited through Button.
|
|
193
202
|
- `architecture:component-test-sufficiency` owns public-seam regression coverage.
|
|
194
|
-
- `spec:AST-029` owns
|
|
195
|
-
|
|
203
|
+
- `spec:AST-029` owns the audit evidence inventory this record's verification
|
|
204
|
+
map follows.
|
|
196
205
|
|
|
197
206
|
## Verification map
|
|
198
207
|
|
|
199
|
-
| Contract | Verification
|
|
200
|
-
| ------------------------- |
|
|
201
|
-
| FR1, FR2, AR1-AR4 | `ChatSendButton.test.tsx`, `ChatSendButton.a11y.chromium.spec.ts`, and `ChatComposer.test.tsx`
|
|
202
|
-
| FR3 | `ChatSendButton.test.tsx
|
|
203
|
-
| FR4 | `ChatSendButton.test.tsx`
|
|
204
|
-
| FR5, FR6 |
|
|
205
|
-
| FR7 | `themingTargets.test.ts
|
|
206
|
-
| RTL relation | RTL shared-fixture route plus refreshed verified-N/A source receipts for ChatSendButton and ChatComposer
|
|
207
|
-
| Browser matrix | `ChatSendButton.a11y.chromium.spec.ts`
|
|
208
|
-
| Documentation and surface | Consumer docs, export checks, Storybook, and `check:knowledge`
|
|
208
|
+
| Contract | Verification | Representative states | Mutation or failure expectation | Audit section |
|
|
209
|
+
| ------------------------- | -------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------ |
|
|
210
|
+
| FR1, FR2, AR1-AR4 | `ChatSendButton.test.tsx`, `ChatSendButton.a11y.chromium.spec.ts`, and `ChatComposer.test.tsx` | Enabled/disabled send, stop with and without handler, context stop, keyboard/pointer, light/dark interaction states | Label, disabled, native activation, state routing, or interaction paint drift fails focused or exact-head browser evidence. | `audit:ChatSendButton/accessibility` |
|
|
211
|
+
| FR3 | `ChatSendButton.test.tsx` | Explicit and shared-fallback send icon | Losing explicit-first precedence or the `arrowUp` fallback fails focused tests; the `spec:AST-032` slot stage is not tested here. | `audit:ChatSendButton/theming` |
|
|
212
|
+
| FR4 | `ChatSendButton.test.tsx` | Explicit and fallback stop icon | Losing explicit precedence or registry resolution fails focused assertions. | `audit:ChatSendButton/behavior` |
|
|
213
|
+
| FR5, FR6 | `ChatSendButton.test.tsx` callback composition, ordering, size, root passthrough, disabled-click, and keyboard tests | Send, stop, `sm`/`md`, ref/class/data/ARIA, Enter/Space | Consumer events replacing state actions, cancellation reordering, lost root inputs, or modality drift fails focused tests. | `audit:ChatSendButton/api` |
|
|
214
|
+
| FR7 | `themingTargets.test.ts` and `ChatSendButton.a11y.chromium.spec.ts` | Send and stop themes | Target removal, movement off paint, or undocumented target drift fails tests or browser evidence. | `audit:ChatSendButton/theming` |
|
|
215
|
+
| RTL relation | RTL shared-fixture route plus refreshed verified-N/A source receipts for ChatSendButton and ChatComposer | Send and stop | Directional artwork, physical positioning, or transform invalidates the checked-in receipts. | `audit:ChatSendButton/i18n-rtl` |
|
|
216
|
+
| Browser matrix | `ChatSendButton.a11y.chromium.spec.ts` browser states | Light/dark send and stop rest/hover/focus/press, disabled rest/hover, `sm`/`md`, 320px coarse pointer, D7 contrast pairs | A stale build, decoy selector, missing state, changed disabled paint, absent interaction pixels, failed contrast, or geometry miss fails closed. | `audit:ChatSendButton/visual` |
|
|
217
|
+
| Documentation and surface | Consumer docs, export checks, Storybook, and `check:knowledge` | Props, public subpath, states, contract | Missing or stale docs, exports, relationships, or required structure fails validation. | `audit:ChatSendButton/docs` |
|
|
218
|
+
|
|
219
|
+
Read from source, with no focused test yet:
|
|
220
|
+
|
|
221
|
+
- FR5: explicit props winning over ChatComposer context.
|
|
222
|
+
- FR6: `style` and `xstyle` reaching the root.
|
|
209
223
|
|
|
210
224
|
## Decision log
|
|
211
225
|
|
|
212
|
-
|
|
213
|
-
and one current AST-032 requirement whose implementation remains pending with its
|
|
214
|
-
owner. It introduces no component-local public API, default, compatibility,
|
|
215
|
-
ownership, or subjective visual decision.
|
|
226
|
+
No component-local decision is recorded.
|
|
216
227
|
|
|
217
228
|
## Open questions
|
|
218
229
|
|
|
219
230
|
- **Cross-reference: stop without handler.** `component:ChatComposer/OQ4` owns
|
|
220
231
|
the unresolved policy for a visible stop action without an explicit or context
|
|
221
|
-
`onStop`. This
|
|
222
|
-
|
|
232
|
+
`onStop`. This record covers today's enabled no-op branch without
|
|
233
|
+
duplicating that question.
|
|
223
234
|
|
|
224
235
|
## Content boundary
|
|
225
236
|
|