@web-fuse/wf-components 1.0.0 → 1.0.2

Sign up to get free protection for your applications and to get access to all the features.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@web-fuse/wf-components",
3
- "version": "1.0.0",
3
+ "version": "1.0.2",
4
4
  "description": "A library containing common form and display components",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs.js",
@@ -15,7 +15,8 @@
15
15
  "preview": "vite preview",
16
16
  "storybook": "storybook dev -p 6006",
17
17
  "build-storybook": "storybook build",
18
- "lint": "eslint ./src"
18
+ "lint": "eslint ./src",
19
+ "prepack": "npm run build"
19
20
  },
20
21
  "keywords": [],
21
22
  "author": "Luc Appelman",
package/readme.md ADDED
@@ -0,0 +1,22 @@
1
+ # Web-Fuse Components
2
+
3
+ A library containing common form and display components. The component requires that you use the React Framework and relies on styled-components and antd packages. If you want to use the CodeBlock you will also need to install *react-copy-to-clipboard* and *react-syntax-highlighter*.
4
+
5
+ ## Previewing components
6
+
7
+ You can preview and test the components by cloning the repository to your system and running storybook.
8
+
9
+ 1. Clone this repository to your system
10
+ 2. Open the directory in a terminal
11
+ 3. Install all dependencies by running `npm install` in the terminal
12
+ 4. To start storybook run `npm run storybook`
13
+
14
+ ## Local development
15
+
16
+ To make changes in the repository you should first run storybook as explained in [Previewing Components](#previewing-components). Open the component you want to edit in storybook and navigate to the corresponding file in the `src` directory. Each component will have its own file or files. Stories are located in the `src/stories` directory.
17
+
18
+ Each component must always be exported using `export default` and each component must always be assigned to a `const` variable before it is exported. If this is not done vite may have problems rebuilding the component and React will not know the name of the component.
19
+
20
+ ## Custom theme algorithm for antd
21
+
22
+ If you are using the `theme.darkAlgorithm` in your antd `ConfigProvider` you may notice that your primary color is not preserved. Therefor this package includes the `wfDarkAlgorithm` export. The only change, compared the the darkAlgorithm exported by antd, is that it takes retains your primary color.