caplink-saas-ui-shared-component-library 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +55 -0
- package/package.json +44 -0
package/README.md
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
# caplink-saas-ui-shared-component-library
|
|
2
|
+
|
|
3
|
+
This project is a shared component library for the Caplink SaaS UI. It is built using React and Storybook.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
1. Clone the repository
|
|
8
|
+
2. Run `npm install` to install the dependencies
|
|
9
|
+
3. Run `npm run storybook` to start the Storybook server
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
To use the components in your project, you can install the package from npm:
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
npm install @caplink/saas-ui-shared-component-library
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
Then import the components you need:
|
|
20
|
+
|
|
21
|
+
```javascript
|
|
22
|
+
import { Button } from '@caplink/saas-ui-shared-component-library';
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## Development
|
|
26
|
+
|
|
27
|
+
To develop the components, you can run the Storybook server:
|
|
28
|
+
|
|
29
|
+
```bash
|
|
30
|
+
npm run storybook
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
This will start the Storybook server and open a browser window with the Storybook UI. You can use this to develop and test the components.
|
|
34
|
+
|
|
35
|
+
### Folder structure
|
|
36
|
+
|
|
37
|
+
All the components are located in the 'component-library' folder.
|
|
38
|
+
|
|
39
|
+
## Testing
|
|
40
|
+
|
|
41
|
+
We use multiple testing libraries to test our components. We use Jest for unit tests and Cypress for more complex integration tests that require a browser.
|
|
42
|
+
|
|
43
|
+
- All unit tests are located in the same folder as the component they are testing. The file name should be the same as the component file name, but with a '.spec.xxx' suffix.
|
|
44
|
+
- All Cypress tests are located in the 'cypress' folder.
|
|
45
|
+
|
|
46
|
+
## Contributing
|
|
47
|
+
|
|
48
|
+
This is a project for the Caplink SaaS UI team. If you are a member of the team, you can contribute to this project by following the standard Git workflow:
|
|
49
|
+
|
|
50
|
+
1. Create a new branch for your feature or bug fix
|
|
51
|
+
2. Make your changes
|
|
52
|
+
3. Push your branch to the remote repository
|
|
53
|
+
4. Create a pull request
|
|
54
|
+
|
|
55
|
+
Developing components with tests is a requirement for contributing to this project.
|
package/package.json
ADDED
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "caplink-saas-ui-shared-component-library",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"description": "A shared UI component library for React projects from Caplink",
|
|
5
|
+
"main": "index.js",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"test": "echo \"Error: no test specified\" && exit 1",
|
|
8
|
+
"storybook": "storybook dev -p 6006",
|
|
9
|
+
"build-storybook": "storybook build"
|
|
10
|
+
},
|
|
11
|
+
"files": [
|
|
12
|
+
"dist"
|
|
13
|
+
],
|
|
14
|
+
"keywords": [],
|
|
15
|
+
"author": "",
|
|
16
|
+
"license": "ISC",
|
|
17
|
+
"devDependencies": {
|
|
18
|
+
"@babel/core": "^7.24.0",
|
|
19
|
+
"@babel/preset-env": "^7.24.0",
|
|
20
|
+
"@babel/preset-react": "^7.23.3",
|
|
21
|
+
"@babel/preset-typescript": "^7.23.3",
|
|
22
|
+
"@chromatic-com/storybook": "^1.2.22",
|
|
23
|
+
"@storybook/addon-essentials": "^8.0.0",
|
|
24
|
+
"@storybook/addon-interactions": "^8.0.0",
|
|
25
|
+
"@storybook/addon-links": "^8.0.0",
|
|
26
|
+
"@storybook/addon-onboarding": "^8.0.0",
|
|
27
|
+
"@storybook/addon-styling-webpack": "^1.0.0",
|
|
28
|
+
"@storybook/blocks": "^8.0.0",
|
|
29
|
+
"@storybook/nextjs": "^8.0.0",
|
|
30
|
+
"@storybook/react": "^8.0.0",
|
|
31
|
+
"@storybook/test": "^8.0.0",
|
|
32
|
+
"@testing-library/react": "^14.2.1",
|
|
33
|
+
"@types/jest": "^29.5.12",
|
|
34
|
+
"autoprefixer": "^10.4.18",
|
|
35
|
+
"babel-jest": "^29.7.0",
|
|
36
|
+
"cypress": "^13.7.0",
|
|
37
|
+
"identity-obj-proxy": "^3.0.0",
|
|
38
|
+
"jest": "^29.7.0",
|
|
39
|
+
"jest-environment-jsdom": "^29.7.0",
|
|
40
|
+
"postcss": "^8.4.36",
|
|
41
|
+
"storybook": "^8.0.0",
|
|
42
|
+
"tailwindcss": "^3.4.1"
|
|
43
|
+
}
|
|
44
|
+
}
|