chop-logic-components 1.0.3 → 1.0.4

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.
Files changed (2) hide show
  1. package/README.md +67 -25
  2. package/package.json +2 -3
package/README.md CHANGED
@@ -6,46 +6,88 @@ Welcome to **Chop Logic Components**, a comprehensive React components library p
6
6
 
7
7
  Chop Logic is designed to speed up development by providing reusable, accessible, and highly customizable components. Whether you're building complex forms, creating dynamic layouts, or managing component logic with hooks, Chop Logic has the tools to make it easier.
8
8
 
9
- ### Why Choose Chop Logic?
9
+ All components are well documented using Storybook. Visit the [DEMO page](https://savourygin.github.io/chop-logic-components) and try them out.
10
10
 
11
- Here's what makes Chop Logic an excellent addition to your React project:
11
+ ## Getting Started
12
12
 
13
- - **Styled Components:** All components are styled using a consistent, modern design language and can easily adapt to your project's look and feel. Each component offers a flexible API, making them simple to extend and customize.
13
+ To get started with Chop Logic, install it via npm or yarn:
14
14
 
15
- - **Custom Hooks:** Simplify your component logic by using the custom hooks provided. From managing form input to handling asynchronous data fetching, Chop Logic's hooks cover common scenarios that developers face daily.
15
+ ```bash
16
+ npm install chop-logic-components
17
+ # or
18
+ yarn add chop-logic-components
19
+ ```
16
20
 
17
- - **Built for Reusability:** Every component and hook is designed with reusability in mind, reducing repetitive code and enabling faster development cycles.
21
+ ## Scripts
18
22
 
19
- - **Ease of Use:** Chop Logic follows best practices in API design, ensuring that components and hooks are easy to learn and work seamlessly with each other.
23
+ ### `format`
20
24
 
21
- - **Storybook Integration:** This library includes comprehensive Storybook documentation for each component and hook, allowing you to explore usage examples, try props in real-time, and see how each feature behaves in isolation.
25
+ Runs [Prettier](https://prettier.io/) to automatically format TypeScript files (`.ts` and `.tsx`) in the project. This script will write changes directly to the files.
22
26
 
23
- ## Key Features
27
+ ```bash
28
+ npm run format
29
+ ```
24
30
 
25
- ### Components
31
+ ### `lint`
26
32
 
27
- Chop Logic includes a wide range of styled components that are ready to use in your projects:
33
+ Runs ESLint to analyze the TypeScript code for potential errors and enforce coding standards. It automatically fixes issues where possible and uses the .gitignore file to ignore certain paths.
28
34
 
29
- - **Inputs:** Beautifully styled input controllers with customization options.
30
- - **Containers:** Easily customizable container elements like text grids, forms, and tabs.
31
- - **Modals:** Flexible modal windows and accessible tooltips, perfect for enhancing user interactions.
32
- - **More Components Coming Soon!**
35
+ ```bash
36
+ npm run lint
37
+ ```
33
38
 
34
- ### Hooks
39
+ ### `check-types`
35
40
 
36
- In addition to UI components, Chop Logic offers a collection of custom hooks to help you manage complex logic:
41
+ Runs the TypeScript compiler (tsc) to perform type checking without generating output files. This script helps ensure that the code adheres to TypeScript's type safety.
37
42
 
38
- - **useModalFocusTrap:** A hook that traps focus within an open modal, ensuring accessibility compliance.
39
- - **useKeyPress:** Easily manage keyboard interactions and trigger actions based on keypress events.
40
- - **useContainerDimensions:** Get the dimensions of any HTML element to dynamically adjust your UI.
41
- - **More Hooks Coming Soon!**
43
+ ```bash
44
+ npm run check-types
45
+ ```
42
46
 
43
- ## Getting Started
47
+ ### `build`
44
48
 
45
- To get started with Chop Logic, install it via npm or yarn:
49
+ Compiles the TypeScript code into JavaScript using the TypeScript compiler (tsc) and then builds the project using Vite.
46
50
 
47
51
  ```bash
48
- npm install chop-logic-components
49
- # or
50
- yarn add chop-logic-components
52
+ npm run build
53
+ ```
54
+
55
+ ### `test`
56
+
57
+ Runs unit tests using Vitest, a fast testing framework designed for Vite projects.
58
+
59
+ ```bash
60
+ npm run test
61
+ ```
62
+
63
+ ### `test:ci`
64
+
65
+ Runs the tests in continuous integration (CI) mode with Vitest, providing a streamlined output suitable for automated environments.
66
+
67
+ ```bash
68
+ npm run test:ci
69
+ ```
70
+
71
+ ### `storybook`
72
+
73
+ Starts a local instance of Storybook for developing UI components. The Storybook interface will be available at http://localhost:6006.
74
+
75
+ ```bash
76
+ npm run storybook
77
+ ```
78
+
79
+ ### `build-storybook`
80
+
81
+ Builds the static version of the Storybook for deployment, outputting the files to the storybook-static directory. The --quiet flag suppresses the build logs.
82
+
83
+ ```bash
84
+ npm run build-storybook
85
+ ```
86
+
87
+ ### `prepare`
88
+
89
+ Runs the build script and then installs Husky hooks for managing Git hooks in the project.
90
+
91
+ ```bash
92
+ npm run prepare
51
93
  ```
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "type": "git",
5
5
  "url": "git+https://github.com/SavouryGin/chop-logic-components.git"
6
6
  },
7
- "version": "1.0.3",
7
+ "version": "1.0.4",
8
8
  "description": "React UI components library for Chop Logic project",
9
9
  "type": "module",
10
10
  "main": "dist/index.cjs.js",
@@ -20,7 +20,6 @@
20
20
  "build": "tsc && vite build",
21
21
  "test": "vitest",
22
22
  "test:ci": "vitest run",
23
- "coverage": "vitest run --coverage",
24
23
  "storybook": "storybook dev -p 6006",
25
24
  "build-storybook": "storybook build -- -o storybook-static --quiet",
26
25
  "prepare": "npm run build && husky install"
@@ -42,7 +41,7 @@
42
41
  "bugs": {
43
42
  "url": "https://github.com/SavouryGin/chop-logic-components/issues"
44
43
  },
45
- "homepage": "https://github.com/SavouryGin/chop-logic-components#readme",
44
+ "homepage": "https://savourygin.github.io/chop-logic-components",
46
45
  "devDependencies": {
47
46
  "@chromatic-com/storybook": "^2.0.2",
48
47
  "@commitlint/cli": "^19.3.0",