groundfloor-react-ui 0.1.20

package/README.md

@@ -0,0 +1,87 @@
+# GroundFloor React UI
+
+This repository stores the component library for GroundFloor Components.
+
+---
+## Code Format
+
+- 4 spaces per tab.
+- JS/TS formatting. Use default formatter by VSCode. press Ctrl+K, Ctrl+F to format higlighted code.
+- It is recommended to use a syntax highlighter for styled-components. [Link here](https://marketplace.visualstudio.com/items?itemName=styled-components.vscode-styled-components)
+
+### Component Development Lifecycle
+
+- For each component development, create a separate git branch and pull request.
+- In `src/library/components` directory, create a folder with the respective component name, e.g 'Typography'
+- Create an index.js file inside for exporting components. Follow the example in `src/Typography` or 'Button'
+- Create separate JS files for each variant of the component and export in index.js.
+- Default theme object can be found in `src/library/constants/defaultThemeColor.js`. Add it to component's defaultProps. You can use `withTheme` HoC or `useTheme` hook whichever is suitable to get user-defined theme colors.
+- Static color information is provided in `src/library/constants/colors.js`.
+- In `stories/Components` directory, create a `{your-component}.stories.jsx` file and update the story. Follow the example given in `Typography.stories.jsx`, for details check the tutorial link provided.
+- Ensure that the title is `Components/{your-component}` so that is falls under the 'Components' category.
+
+### Adding Icons
+- Paste SVG file in `src/library/assets/icons`
+- Import in `src/library/components/Icon/Icon.js`
+- Map the icon to an icon name. Name should be in kebab-case format
+
+### Git contribution
+- Create a branch with the following convention: `{name}-{taskname}-{date}`. 
+- When the branch is ready for merging, create a Pull Request with the destination branch `master`.
+- Fill the details in the template given. Do add reviewers to the Pull Request.
+*Pushing directly to master branch is not recommended.*
+
+---
+
+### Deploying to NPM
+
+Follow the semantic versioning convention. Given a version number MAJOR.MINOR.PATCH, increment the:
+
+1. MAJOR version when you make incompatible API changes,
+2. MINOR version when you add functionality in a backwards compatible manner, and
+3. PATCH version when you make backwards compatible bug fixes.
+
+In `library/package.json`, update the version number. Then run `npm run npm-deploy` in project root directory. 
+**Remember to definitely commit/push to git after publishing a new version.**
+
+---
+
+## Tutorials / guides
+
+- [styled-components tutorial](https://styled-components.com/docs/basics)
+- [Storybook tutorial](https://storybook.js.org/docs/react/get-started/introduction)
+
+---
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `npm run storybook`
+Opens the Storybook app in development mode.
+Open [http://localhost:6006](http://localhost:6006) to view it in your browser.
+
+### `npm run compile`
+Cleans the 'dist' directory and builds the component library.
+
+### `npm run npm-deploy`
+Publishes the component library to NPM.
+
+### `npm start`
+Test your app in a default React environment.
+Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
+
+### `npm test`
+Launches the test runner in the interactive watch mode.
+
+### `npm run clean`
+Deletes the 'dist' folder.
+
+### `npm build-storybook`
+Bundles the Storybook app.
+
+### `npm run build`
+This is useless. No need to use. ever.
+
+### `npm run eject`
+**Note: Do not run this command. Once you `eject`, you can't go back!**

package/package.json

@@ -0,0 +1,84 @@
+{
+  "name": "groundfloor-react-ui",
+  "version": "0.1.20",
+  "main": "./src/index.js",
+  "private": false,
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "dependencies": {
+    "@mdx-js/react": "^2.3.0",
+    "chart.js": "^4.2.1",
+    "dayjs": "^1.11.6",
+    "react": "^18.2.0",
+    "react-chartjs-2": "^5.2.0",
+    "react-data-table-component": "^7.5.3",
+    "react-datepicker": "^4.8.0",
+    "react-dom": "^18.2.0",
+    "react-modal": "^3.15.1",
+    "react-phone-input-2": "^2.15.1",
+    "react-popper": "^2.3.0",
+    "react-popper-tooltip": "^4.4.2",
+    "react-router": "^6.4.2",
+    "react-router-dom": "^6.4.2",
+    "react-scripts": "^5.0.1",
+    "react-select": "^5.4.0",
+    "react-signature-pad-wrapper": "3.2.3",
+    "react-svg": "^15.1.10",
+    "sass": "^1.55.0",
+    "styled-components": "^5.3.6",
+    "use-resize-observer": "^9.1.0",
+    "webpack": "^5.74.0"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject",
+    "storybook": "start-storybook -p 6006 -s public",
+    "build-storybook": "build-storybook -s public",
+    "clean": "rimraf dist",
+    "chromatic": "npx chromatic --project-token=7fa642391e6f"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ],
+    "overrides": [
+      {
+        "files": [
+          "**/*.stories.*"
+        ],
+        "rules": {
+          "import/no-anonymous-default-export": "off"
+        }
+      }
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@storybook/addon-actions": "^6.5.12",
+    "@storybook/addon-essentials": "^6.5.12",
+    "@storybook/addon-links": "^6.5.12",
+    "@storybook/builder-webpack5": "^6.5.12",
+    "@storybook/manager-webpack5": "^6.5.12",
+    "@storybook/node-logger": "^6.5.12",
+    "@storybook/preset-create-react-app": "^4.1.2",
+    "@storybook/react": "^6.5.12",
+    "chromatic": "^6.17.0",
+    "ncp": "^2.0.0"
+  }
+}