Skip to content

Contributing to the Design System

Prerequisite: Before contributing, you should complete the Design System Training Path.
This ensures you have the necessary skills in Git, GitHub Actions, JavaScript/TypeScript, Node.js, Storybook, Web Components (Lit), Playwright, and GitHub Copilot.

Why Contribute?

Our design system is a shared asset that ensures consistency, quality, and scalability across all products. Contributing is not just about writing code—it’s about strengthening our collective design language, improving developer efficiency, and helping everyone deliver better user experiences.

Contributions can include:
- Code: new components, enhancements, bug fixes.
- Documentation: usage guidelines, examples, tutorials.
- Design: Figma assets, accessibility improvements, tokens.
- Testing: adding or improving unit, integration, or E2E tests.
- Tooling: scripts, CI/CD improvements, repo maintenance.

Getting Access

To contribute, you’ll need access to specific organizations and repositories.

Organizations & Repos:
- Progress-I360 – the Progress GitHub Organization for shared services and components. - Progress-I360/design-system – the documentation
- Progress-I360/progress-web-components – Storybook instance for component previews.

After you have been provided access reach out to the Infra 360 team to be added to the proper team to ensure you have the proper Github rights to contribute.

Work with your manager or raise a support ticket to ensure you have the right permissions.

Contribution Workflow

We follow a clear and lightweight workflow to encourage contributions while maintaining quality.

1. Identify the Need

  • File an issue (In Jira) describing the bug, enhancement, or new component.
  • Link to supporting examples, Figma designs, or product requirements.
  • Use labels (e.g., bug, enhancement, docs, a11y).

2. Discuss & Align

  • Every new component or significant change requires discussion in the issue.
  • Architects, designers, and engineers will review for fit, accessibility, and scalability.
  • For new components, start with a proposal template (placeholder link).

3. Design & Develop

  • Build components using Lit and Web Components standards.
  • Document them in Storybook with multiple stories (states, interactions, edge cases).
  • Write tests:
  • Unit tests (Node.js test runner).
  • Component interaction tests (Storybook).
  • E2E tests (Playwright).

4. Submit a Pull Request

  • Pull Request checklist:
  • [ ] Stories written in Storybook.
  • [ ] Tests added or updated.
  • [ ] CI pipeline passing.
  • [ ] Docs updated if needed.
  • Request review from at least one maintainer and one designer.

5. Review & Merge

  • Maintainers will review for consistency, accessibility, and quality.
  • Address comments promptly.
  • Once approved, PRs are merged via squash commits for a clean history.

Contribution Types

Not every contribution is code! You can:
- Add a new component → Must follow design tokens and accessibility guidelines.
- Fix a bug → Provide test coverage that reproduces and validates the fix.
- Improve docs → Clarify usage, add code examples, or fix typos.
- Enhance tooling → Update CI/CD workflows, linting, or testing configs.
- Propose a pattern → Document reusable UI/UX approaches for future adoption.

Contribution Principles

We align on principles inspired by industry best practices:
1. Consistency first – Components must follow established design tokens, spacing, and accessibility standards.
2. Documentation is non-optional – Every change must be accompanied by docs or Storybook updates.
3. Test what you build – No code without test coverage.
4. Small, iterative contributions – Avoid “big bang” PRs. Incremental change = faster review.
5. Accessibility is core – Contribute with WCAG compliance in mind.
6. Design + Dev partnership – Major changes require both design and dev sign-off.

Getting Started Checklist

Before you start contributing, make sure you can:
- Clone and branch from the repo.
- Run the build and Storybook locally.
- Write a Lit component with properties and events.
- Add a Storybook story for the component.
- Run Playwright and Node.js tests successfully.
- Submit a PR with passing GitHub Actions checks.

Recognition & Growth

Contributors will be:
- Recognized in release notes.
- Invited to participate in roadmap discussions.
- Eligible to become maintainers after demonstrating consistent, high-quality contributions.

Resources

✦ Your contributions shape the system.
Every issue filed, PR submitted, or doc updated makes the design system stronger for the entire organization.