Feature/hey UI 55 implement conventional commits (#14)

.eslintrc.js

@@ -173,7 +173,7 @@ module.exports = {
     'react/jsx-indent': ['error', 2],
     'react/jsx-indent-props': ['error', 2],
     'react/jsx-curly-spacing': ['error'],
-    'react/jsx-fragments': ['warn', 'element'],
+    'react/jsx-fragments': ['error', 'element'],
     'react/static-property-placement': ['error', 'static public field'],
     'react/state-in-constructor': ['error', 'never'],
     'react/prop-types': 'off',
@@ -188,6 +188,8 @@ module.exports = {
     'react/destructuring-assignment': ['error', 'always'],
     'react/jsx-filename-extension': [1, { extensions: ['.jsx', '.tsx'] }],
     'react/jsx-one-expression-per-line': 'off',
+    'react/no-array-index-key': ['error'],
+    'react/jsx-closing-bracket-location': 1,
 
     // A11Y
     'jsx-a11y/anchor-is-valid': ['warn', { aspects: ['invalidHref'] }],

.github/CONTRIBUTING.md

@@ -0,0 +1,73 @@
+# Contributing
+
+The following is a set of guidelines for contributing to Hey-UI. Please spend several minutes reading these guidelines before you create an issue or pull request.
+
+## Code of Conduct
+
+We have adopted a [Code of Conduct](https://github.com/hey-car/hey-ui/blob/main/CODE_OF_CONDUCT.md) that we expect project participants to follow.
+Also, please read our [Structure Convention](https://github.com/hey-car/hey-ui/blob/main/STRUCTURE_CONVENTION.md) and [Style Guide](https://github.com/hey-car/hey-ui/blob/main/STYLEGUIDE_CONVENTION.).
+Please read the full text so that you can understand what actions will and will not be tolerated.
+
+## Open Development
+
+All work on Hey-UI happens directly on [GitHub](https://github.com/hey-car/hey-ui). Both core team members and external contributors send pull requests which go through the same review process.
+
+## Branch Organization
+
+According to our [release schedule](changelog#Release-Schedule), we maintain two branches, `main` and `feature`. If you send a bugfix pull request, please do it against the `main` branch, if it's a feature pull request, please do it against the `feature` branch.
+
+`main` - Contains only tested code. Сode gets here from `release/*` and `hotfix/*` branches.
+
+`release/*` - Contains branches formed from the `develop` branch, for future release, e.g. `release/0.0.1`.
+
+`develop` - General branch for developing. Сode gets here from `feature/*` and `bugfix/*` branches.
+
+`feature/*` - Branches are created based on ticket name, e.g. `feature/HEYUI-999-status-button-component`. Every individual ticket must have its corresponding branch, even for small tasks.
+
+`hotfix/*` - These are branches that contains very urgent fixes for production, e.g. `hotfix/HEYUI-999-fix-button-attribute`.
+
+`bugfix/*` - These branches contain bug fixes and can be merged into `develop`, `release` or `feature` braches, e.g. `bugfix/HEYUI-999-fix-button-attribute`.
+
+## Bugs
+
+We are using [GitHub Issues](https://github.com/hey-car/hey-ui/issues) for bug tracking.
+
+Before you report a bug, please make sure you've searched existing issues, and read our [FAQ](/docs/react/faq).
+
+## Your First Pull Request
+
+Working on your first Pull Request? You can learn how from this free video series:
+
+[How to Contribute to an Open Source Project on GitHub](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github)
+
+If you decide to fix an issue, please be sure to check the comment thread in case somebody is already working on a fix. If nobody is working on it at the moment, please leave a comment stating that you intend to work on it so other people don't accidentally duplicate your effort.
+
+If somebody claims an issue but doesn't follow up for more than two weeks, it's fine to take over it but you should still leave a comment.
+
+## Sending a Pull Request
+
+The core team is monitoring for pull requests. We will review your pull request and either merge it, request changes to it, or close it with an explanation.
+
+**Before submitting a pull request**, please make sure the following is done:
+
+1. Fork the repository and create your branch from the [correct branch](#Branch-Organization).
+2. Run `npm install` in the repository root.
+   > For Windows 10 development environment, if you run into error `gyp err! find vs msvs_version not set from command line or npm config`, please install [the latest Python v3](https://www.python.org/downloads/) and **Desktop development with C++** through [Visual Studio Installer](https://docs.microsoft.com/en-us/visualstudio/install/install-visual-studio?view=vs-2019#step-3---install-the-visual-studio-installer) before running `npm install`
+3. If you've fixed a bug or added code that should be tested, add tests!
+4. Ensure the test suite passes (npm run test). Tip: `npm test -- --watch TestName` is helpful in development.
+5. Run `npm test -- -u` to update the [jest snapshots](http://facebook.github.io/jest/docs/en/snapshot-testing.html#snapshot-testing-with-jest) and commit these changes as well (if there are any updates).
+6. Ensure the UI change passes `npm run test:screenshots`，Run `npm run test:screenshots -- -u` to update UI snapshots and commit these changes as well (if there are any updates).
+7. Make sure your code lints (npm run lint). Tip: Lint runs automatically when you `git commit` (Use [Git Hooks](https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks)).
+
+Sending a Pull Request to [react-component](https://github.com/react-component/):
+
+Since Hey-UI's components are based on react-component, sometimes you may need to send pull request to the corresponding react-component repository. If it's a bugfix pull request, after it's merged, the core team will release a patch release for that component as soon as possible, then you only need to reinstall Hey-ui in your project to get the latest patch release. If it's a feature pull request, after it's merged, the core team will release a minor release, then you need raise another pull request to [Hey-UI](https://github.com/hey-car/hey-ui/) to update dependencies, document and TypeScript interfaces (if needed).
+
+## Development Workflow
+
+After cloning Hey-UI, run `npm install` to fetch its dependencies. Then, you can run several commands:
+
+1. `npm start` runs Storybook Hey-UI website locally.
+2. `npm run lint` checks the code style.
+3. `npm test` runs the complete test suite. (Make sure the `NODE_ENV` environment variable is unset, or it may causing some problems.)
+4. `npm run build` build packages to the `dist` directory.

.github/workflows/main.yml

@@ -1,6 +1,6 @@
 name: Demo build
 
-on: [push]
+on: [push, pull_request]
 
 jobs:
   build:
@@ -27,7 +27,7 @@ jobs:
 
       # Looking for open PR
       - name: Find open PR
-        uses: jwalton/gh-find-current-pr@v1
+        uses: jwalton/gh-find-current-pr@v1.2.1
         id: find_pr
         with:
           github-token: ${{ secrets.GITHUB_TOKEN }}

.storybook/preview.js

@@ -41,8 +41,8 @@ addParameters({
       method: 'alphabetical',
       order: [
         'Introduction',
-        'Get started',
-        ['Installation', 'Contributing'],
+        'Guidelines',
+        ['Installation', 'Contributing', 'Package structure convention', 'Code style guide convention'],
         'Components',
       ],
     },

CODE_OF_CONDUCT.md

@@ -0,0 +1,78 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to make participation in our project and our
+community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, sex characteristics, gender identity and
+expression, level of experience, education, socio-economic status, nationality,
+personal appearance, race, religion, or sexual identity and orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+- The use of sexualized language or imagery and unwelcome sexual attention or
+  advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or reject
+comments, commits, code, wiki edits, issues, and other contributions that are
+not aligned to this Code of Conduct, or to ban temporarily or permanently any
+contributor for other behaviors that they deem inappropriate, threatening,
+offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community. Examples of
+representing a project or community include using an official project e-mail
+address, posting via an official social media account, or acting as an appointed
+representative at an online or offline event. Representation of a project may be
+further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting the project team at **[email protected]**. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an
+incident. Further details of specific enforcement policies may be posted
+separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage],
+version 1.4, available at
+https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
+
+[homepage]: https://www.contributor-covenant.org
+
+For answers to common questions about this code of conduct, see
+https://www.contributor-covenant.org/faq

STRUCTURE_CONVENTION.md

@@ -0,0 +1,114 @@
+# Package structure convention
+
+## Filename & Folders
+
+Name files with `camelCase` or `pascalCase`. E.g. `Accordion.tsx`, `MyControl.tsx`, `utils.ts`, `map.ts` etc.
+
+## Package folder structure
+
+```
++-- exampleComponent
+    +-- CHANGELOG.md
+    +-- package.json
+    +-- tsconfig.json
+    +-- src
+        +-- components
+            +-- InternalExampleComponent
+                +-- InternalExampleComponent.tsx
+                ...
+                +-- index.ts
+        +-- utils
+            +-- getSomething.ts
+        +-- hooks
+            +-- useExampleComponent.ts
+            +-- useExampleComponent.types.ts
+            +-- useExampleComponent.constants.ts
+            ...
+            +-- index.ts
+        +-- docs
+            +-- ExampleComponent.stories.ts
+            +-- Description.mdx
+            +-- AnyDoc.mdx
+        +-- styles
+            +-- default.module.css
+            +-- size.module.css
+            +-- any.module.css
+        +-- __image_snapshots__
+            +-- test-snapshot.png
+            +-- any-snapshot.png
+        +-- __snapshots__
+            +-- ExampleComponent.test.tsx.snap
+        +-- __tests__
+            +-- ExampleComponent.test.tsx
+            +-- exampleComponent.screenshots.test.tsx
+            +-- ExampleComponent.mock.ts
+        +-- ExampleComponent.tsx
+        +-- ExampleComponent.types.ts
+        +-- ExampleComponent.constants.ts
+        ...
+        +-- index.ts
+```
+
+## Package or module exporting
+
+Each package or module should export the default entity according to a particular package or module.
+Other elements such as types, utils, or any helpers of the package or module should be exported as a named export.
+
+`ExampleComponent.tsx`
+
+```JSX
+function ExampleComponent() {
+    return ...
+}
+
+export default ExampleComponent;
+```
+
+`ExampleComponent.types.ts`
+
+```JSX
+
+export interface ExampleComponentProps {
+ ...
+}
+
+export interface ExampleComponentInterface {
+ ...
+}
+
+```
+
+`ExampleComponent/index.ts`
+
+```typescript
+export { default } from './ExampleComponent';
+
+export * from './ExampleComponent.types.ts';
+```
+
+## Import package
+
+```JSX
+import ExampleComponent, {
+  ExampleComponentProps,
+  AnyThing,
+} from '@hey-ui/ExampleComponent';
+```
+
+## Component Naming
+
+Use the filename as the component name.
+For example, `ExampleComponent.tsx` should have a reference name of `ExampleComponent`.
+However, for root components of a directory, use `index.ts` as the filename and use the directory
+name as the component name:
+
+```typescript
+// bad
+import ExampleComponent from './ExampleComponent/ExampleComponent';
+
+// bad
+import ExampleComponent from './ExampleComponent/index';
+
+// good
+import ExampleComponent from './ExampleComponent';
+```