name | route | menu |
---|---|---|
General Guidelines |
/contribute/guidelines |
Contribute |
In the first place, thank you for your interest in contributing! 🙏
To build the project:
- Install local npm packages:
npm install
- Run the build:
npm run build
To run the dev server:
- Install local npm packages:
npm install
- Run the dev server (usually on
http://localhost:3000
):npm start
In order for the automation to work in the best possible way (we use GitHub Actions), please follow these guidelines:
-
One pull request per subject. Don't combine unrelated changes in a single PR unless they are really subtle details such as fix of a typo.
-
Only PRs into
master
branch are listed in changelog. PRs into other branches are not picked up by release automation. -
Name your branches according to nature of change. Choose one of:
bc/*
for breaking changesfeature/*
for featuresbugfix/*
for bugfixesrefactoring/*
for refactoring of the librarydocs/*
ordocumentation/*
for changes in docsmaintenance/*
for maintenance (builds, dependencies, automation, etc.)release/*
for releases (administrators only)
-
Write clear, helpful and descriptive commit messages.
- Use imperative and write in English, e.g. Update dependencies or Claim support for controlled components only.
- If an issue exists for your changes, append the issue number in parentheses to the end of the commit message, e.g. Update dependencies (#261).
- Optionally use Markdown code blocks to emphasize, e.g.
Create
ScrollView
component (#53).
-
Write clear, helpful and descriptive PR names.
- All rules for commit messages apply also for PR names.
- Always check that PR name meets the requirements above because PR names are used in changelog. GitHub automatically truncates long PR names and picks up branch name for multi-commit PRs, so it's necessary to make sure the PR name is what we want to have in the changelog.
- If an issue exists for your changes, append this text to PR
description (the topmost comment in the PR) in order for the issue to be
closed automatically once the PR is merged:
Closes #<ISSUE NUMBER>
. You will know the issue is linked correctly when it appears in the Linked issues section of the PR. (Having the issue mentioned in commit message and/or PR name does not have this effect.) - If there is no issue for your changes, please add your PR to
The Board
GitHub project in the Projects section of the PR. The correct board column will be selected automatically. This helps us keep track of what is in development.
Pull requests are labelled automatically. You can add more labels to better
qualify the nature of the change — in such case, it will be included in all
corresponding changelog groups. Or use the skip changelog
label to exclude a
pull request from the changelog.
The best way for development of React UI is to link react-ui
into your
application with npm link
so you can see it in action.
- In React UI repository, run
npm link
- In your application, run
npm link @react-ui-org/react-ui
To prevent Invalid Hook Call Warning when React UI is linked, add the following code to your app's Webpack config:
const path = require('path');
module.exports = {
resolve: {
alias: {
react: path.resolve('./node_modules/react'),
'react-dom': path.resolve('./node_modules/react-dom'),
},
},
};
To keep React UI consistent and predictable the following guidelines should be observed:
- If component accepts the
children
prop it should be either required or the element should returnnull
when no children are provided.
We use Docz (powered by Gatsby) as the documentation platform. The documentation itself is written in MDX format — a human-readable blend of the popular Markdown and JSX syntax.
Run npm start
to run the docs in development mode, and open
http://localhost:3000
in your browser to see the docs in live-reload mode.
A few things to note:
-
In order to get component props parsed and rendered by Docz, it's crucial to import the component into an MDX file right from its source file — parsing a re-exported component (typically via
index.js
) isn't currently supported. -
If you don't want Gatsby to collect anonymous statistics, you may want to disable Gatsby telemetry by running
npx gatsby telemetry --disable
. -
If you see the Not found page after having changed the configuration of Docz or Gatsby in the live-reload mode, you may either restart the Docz development server (
ctrl + c
andnpm start
), or try to edit an MDX file which makes the Docz rebuild, too. -
To make your authoring experience better, we recommend to make sure your IDE understands the MDX syntax and is able to help you wrap lines in MD and MDX files automatically (Jetbrains IDE's and VSCode support both features out-of-the-box or through a plugin).