Definition of Done #

Related: Definition of Ready.

A component is considered Done in the aFP Design System when it fulfills the following technical, quality, and documentation criteria.

Purpose #

The Definition of Done (DoD) ensures every deliverable meets the same high standard of quality and consistency.
It defines what “finished” truly means across all contributors and packages.

Done Checklist #

[ ] npm run test (or test:ui) is green locally and in CI.
[ ] No console warnings in docs preview (npm run dev).
[ ] CEM regenerated (npx cem analyze) — new/changed members, events, slots and parts are visible in the docs API table.
[ ] @category JSDoc tag set so the component appears in the correct sidebar group.
[ ] Docs examples render correctly in Eleventy and are linked in the sidebar.
[ ] Component overview SVG exists in docs/assets/img/components/ (new components only).
[ ] Cross-browser sanity check done for supported targets.
[ ] Reviewer approved; feedback applied.
[ ] Jira ticket moved to Done with a brief note and links to docs.

Implementation #

Code is complete, committed, and pushed to the correct workspace.
Component follows established naming conventions (afp-*).
Code passes all formatting checks: npm run format:check
Follows token-based design (spacing, color, typography).
Color usage goes through --app-* appearance variables, not raw --afp-color-* palette tokens.
Shadow DOM used by default; light DOM only where external CSS styling is explicitly required.
Bootstrap Icons and Floating UI are used only via shared utilities.
JSDoc comments for Custom Elements Manifest are present (@summary, @category, @since, slots, parts, events).

Testing & Quality Assurance #

Local build and preview run without warnings or errors: npm run build
Component tested in Eleventy docs environment.
Accessibility verified (keyboard, screen reader, color contrast).
Behavior validated in supported browsers.
Peer review or pair testing conducted.

Documentation #

Each component or feature has an up-to-date <component>.md.
Usage examples added to the Eleventy documentation.
Props, attributes, and slots are documented in JSDoc for CEM output.
Change noted in changelog or release notes (if applicable).
Screenshots or code samples provided for review context.

Review & Sign-Off #

Code reviewed and approved by at least one maintainer.
CI pipeline (lint, format, build) passes successfully.
Reviewer confirms adherence to DoR and coding standards.
Feedback addressed before merge.

Post-Merge #

Component visible in preview/staging environment.
Documentation deployed successfully.
No regressions detected after integration.
Work item marked as Done in tracking system.