{ "$schema": "https://www.digitaltableteur.com/schemas/contract-spec/1.0/contract.schema.json", "specVersion": "1.0", "name": "StatusDot", "status": "stable", "description": "Tiny semantic status indicator: colored dot with visible or sr-only label.", "package": { "name": "@digitaltableteur/react", "import": "import { StatusDot } from \"@digitaltableteur/react\";" }, "props": { "tone": { "type": "union", "values": [ "info", "success", "warning", "error", "neutral" ], "optional": true, "description": "Semantic tone of the status." }, "size": { "type": "union", "values": [ "sm", "md", "lg" ], "optional": true, "description": "Size token." }, "pulse": { "type": "boolean", "optional": true, "description": "Animates a soft pulse for live/ongoing states (respects reduced motion)." }, "label": { "type": "string", "optional": true, "description": "Accessible label when no visible children are given (e.g. \"Online\").\nWithout children or label the dot carries state by colour alone, so a\ndevelopment warning is logged unless the dot is marked aria-hidden." }, "children": { "type": "React.ReactNode", "optional": true, "description": "Visible label text rendered next to the dot." } }, "accessibility": { "criteria": [ { "id": "axe-no-violations", "statement": "Required stories produce no axe violations at the configured severity.", "verification": "automated", "wcag": [ "2.5.8" ], "check": "npm run test:stories:matrix:ci", "evidence": [ { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-default.dark.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:38:53.861Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-default.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:17:55.777Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-default.light.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:29:31.143Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-example.dark.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:38:54.539Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-example.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:17:56.298Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-example.light.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:29:31.749Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-playground.dark.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:38:54.186Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-playground.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:17:56.051Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-playground.light.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:29:31.419Z", "passed": true, "runner": "local-recapture" } ] }, { "id": "accessibility-tree", "statement": "The accessibility tree (role, name, state) matches the committed snapshot for every required story.", "verification": "automated", "wcag": [ "1.3.1", "4.1.2" ], "check": "npm run test:stories:matrix:ci", "evidence": [ { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-default.dark.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:38:53.861Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-default.forced-colors.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:46:51.546Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-default.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:17:55.777Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-default.light.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:29:31.143Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-example.dark.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:38:54.539Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-example.forced-colors.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:46:52.143Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-example.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:17:56.298Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-example.light.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:29:31.749Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-forced-colors.dark.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:38:54.567Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-forced-colors.forced-colors.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:46:52.171Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-forced-colors.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:17:56.335Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-forced-colors.light.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:29:31.784Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-playground.dark.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:38:54.186Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-playground.forced-colors.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:46:51.835Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-playground.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:17:56.051Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-playground.light.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:29:31.419Z", "passed": true, "runner": "local-recapture" } ] }, { "id": "forced-colors-real-browser", "statement": "The component remains legible and operable under a real browser forced-colors: active pass.", "verification": "automated", "check": "npm run test:stories:hc", "evidence": [ { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-default.forced-colors.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:46:51.546Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-example.forced-colors.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:46:52.143Z", "passed": true, "runner": "local-recapture" }, { "artifact": "../../../nextjs-app/shared/components/StatusDot/__a11y-evidence__/feedback-statusdot-playground.forced-colors.json", "sourceCommit": "930c562b591b6d9967e1e8c214899052624d9a2f", "capturedAt": "2026-11-03T22:46:51.835Z", "passed": true, "runner": "local-recapture" } ] }, { "id": "aria-requirements", "statement": "Documented ARIA roles, states, and properties are present on the rendered output.", "verification": "unverified", "wcag": [ "4.1.2" ], "note": "No exportable evidence record for this check; re-run the check to capture one." }, { "id": "human-a11y-review", "statement": "A human completed an end-to-end accessibility review of this component.", "verification": "manual", "note": "2026-07-06 — alpha→beta: created the Figma component (tone×size variant set, dot fill bound to DT/Color tone tokens) at node 1004-1677, the only remaining beta blocker. Pulse animation disabled under prefers-reduced-motion (CSS guard verified); axe asserted in unit test; forced-colors + light/dark re-verified. 2026-07-08 — beta→stable: 4-mode AT (base/light/dark/forced-colors) verified on a non-6010 Storybook; accessibility tree and real-browser forced-colors confirmed; each tone's dot background-color verified distinct via computed style (color axis).", "reviewedAt": "2026-11-04" } ] }, "governance": { "owner": "design-system", "lastReviewed": "2026-11-04", "note": "Reviewed by Petri Lahdelma; prepared by Claude from a code review on 2026-11-03" }, "source": [ "../../../nextjs-app/shared/components/StatusDot/StatusDot.module.css", "../../../nextjs-app/shared/components/StatusDot/StatusDot.tsx" ] }