Add icon-only row-action labeling rule and data formatting conventions
Row-action buttons in a data table are icon-only and need deterministic title/aria-label instead of repeated text. Also documents money and date-precision formatting (whole-unit money with non-breaking-space thousands grouping, ISO week numbers for day-level dates). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -14,6 +14,9 @@ Version: 1.3
|
||||
- Use a small stable button taxonomy: `primary`, `secondary`, `ghost`, `danger`, `disabled`.
|
||||
- Destructive actions (`archive`, `delete`, `remove`) must use danger styling and explicit labels.
|
||||
- Button text should describe the action outcome, not implementation detail.
|
||||
- Inside a data-table row action column, buttons are icon-only. Each one must have a
|
||||
deterministic `title` and `aria-label`; text labels belong in toolbars, forms and
|
||||
confirmation dialogs, not repeated in every row.
|
||||
- Buttons are text-first; icons are optional and must not replace labels on primary/danger actions.
|
||||
- Base examples must show both `disabled` and `loading` states.
|
||||
- Any control that triggers a network or database call must show a visible busy state for the whole
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
# Contract: Web Visual Baseline
|
||||
|
||||
Version: 1.0
|
||||
Version: 1.1
|
||||
|
||||
## Scope
|
||||
|
||||
@@ -60,6 +60,22 @@ Copy `assets/view.css` as the starting stylesheet and adapt tokens; do not rewri
|
||||
- Clear primary buttons for the main action on a screen.
|
||||
- Simple alert/error boxes with border + tinted background.
|
||||
|
||||
## Data Formatting
|
||||
|
||||
- Money: no minor units (no cents/kopecks) — round to whole currency units for
|
||||
display. Group thousands with a non-breaking space (` `), not a comma
|
||||
or dot — e.g. `$13 320`, not `$13,320.00`. The `ru-RU` locale's own
|
||||
`toLocaleString()` grouping character is already a non-breaking space, so
|
||||
`Math.round(value).toLocaleString('ru-RU')` satisfies this directly without
|
||||
hand-rolled grouping logic.
|
||||
- Dates that only need day-level (not time-of-day) precision — a delivery
|
||||
ETA, a planning/reorder date — are shown as an ISO week number: `W32`. When
|
||||
a table row aggregates several dates that disagree (e.g. several purchase
|
||||
lots under one order with different ETAs), show the week range instead:
|
||||
`W32-34`. Audit-trail timestamps (created/updated-at) are exempt — show
|
||||
those as ordinary dates, since collapsing them to a week would hide the
|
||||
information they exist to convey.
|
||||
|
||||
## Status Rules
|
||||
|
||||
- `OK`: green
|
||||
|
||||
Reference in New Issue
Block a user