@vritti/quantum-ui 0.1.6 → 0.1.8

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 +150 -0
  2. package/package.json +29 -8
package/README.md ADDED
@@ -0,0 +1,150 @@
1
+ # @vritti/quantum-ui
2
+
3
+ A modern, TypeScript-first React component library built on Radix UI primitives and styled with Tailwind CSS v4. Fully typed, accessible, and tree-shakeable.
4
+
5
+ [![npm version](https://img.shields.io/npm/v/@vritti/quantum-ui.svg)](https://www.npmjs.com/package/@vritti/quantum-ui)
6
+ [![License](https://img.shields.io/npm/l/@vritti/quantum-ui.svg)](https://github.com/vritti-hub/quantum-ui/blob/main/LICENSE)
7
+
8
+ ## Features
9
+
10
+ - 🎨 **Tailwind CSS v4** - Modern utility-first styling
11
+ - ♿ **Accessible** - Built on Radix UI primitives
12
+ - 📦 **Tree-shakeable** - Import only what you need
13
+ - 🔷 **TypeScript** - Fully typed with excellent IntelliSense support
14
+ - 🎭 **Themeable** - Dark mode support with ThemeToggle component
15
+ - 📚 **Documented** - Comprehensive Storybook documentation
16
+
17
+ ## Documentation
18
+
19
+ 📖 [View full documentation and interactive examples on Storybook](https://vritti-hub.github.io/quantum-ui)
20
+
21
+ ## Installation
22
+
23
+ ```bash
24
+ npm install @vritti/quantum-ui
25
+ ```
26
+
27
+ ```bash
28
+ yarn add @vritti/quantum-ui
29
+ ```
30
+
31
+ ```bash
32
+ pnpm add @vritti/quantum-ui
33
+ ```
34
+
35
+ ### Peer Dependencies
36
+
37
+ Make sure you have the following peer dependencies installed:
38
+
39
+ ```bash
40
+ npm install react react-dom
41
+ ```
42
+
43
+ This library supports React 18.x and 19.x.
44
+
45
+ ## Usage
46
+
47
+ Import components individually for optimal tree-shaking:
48
+
49
+ ```tsx
50
+ import { Button } from '@vritti/quantum-ui/Button';
51
+ import { Card } from '@vritti/quantum-ui/Card';
52
+ import { TextField } from '@vritti/quantum-ui/TextField';
53
+
54
+ function App() {
55
+ return (
56
+ <Card>
57
+ <TextField label="Email" placeholder="Enter your email" />
58
+ <Button variant="primary">Submit</Button>
59
+ </Card>
60
+ );
61
+ }
62
+ ```
63
+
64
+ Or import from the main entry point:
65
+
66
+ ```tsx
67
+ import { Button, Card, TextField } from '@vritti/quantum-ui';
68
+ ```
69
+
70
+ ## Available Components
71
+
72
+ - **Button** - Versatile button component with multiple variants
73
+ - **Card** - Container component for grouping content
74
+ - **TextField** - Text input with label and validation support
75
+ - **PasswordField** - Secure password input with show/hide toggle
76
+ - **Checkbox** - Accessible checkbox component
77
+ - **Typography** - Text styling component
78
+ - **ThemeToggle** - Dark/light mode toggle
79
+
80
+ ## Development
81
+
82
+ ### Prerequisites
83
+
84
+ - Node.js 18+ or 20+
85
+ - npm, yarn, or pnpm
86
+
87
+ ### Setup
88
+
89
+ 1. Clone the repository:
90
+ ```bash
91
+ git clone https://github.com/vritti-hub/quantum-ui.git
92
+ cd quantum-ui
93
+ ```
94
+
95
+ 2. Install dependencies:
96
+ ```bash
97
+ npm install
98
+ ```
99
+
100
+ 3. Start Storybook for development:
101
+ ```bash
102
+ npm run storybook
103
+ ```
104
+
105
+ 4. Build the library:
106
+ ```bash
107
+ npm run build
108
+ ```
109
+
110
+ ### Scripts
111
+
112
+ - `npm run dev` - Start Vite dev server
113
+ - `npm run build` - Build the library for production
114
+ - `npm run storybook` - Start Storybook development server
115
+ - `npm run build-storybook` - Build Storybook for production
116
+ - `npm run lint` - Lint the codebase
117
+
118
+ ## Contributing
119
+
120
+ We welcome contributions! Please follow these steps:
121
+
122
+ 1. Fork the repository
123
+ 2. Create a new branch (`git checkout -b feature/amazing-feature`)
124
+ 3. Make your changes
125
+ 4. Commit your changes (`git commit -m 'Add some amazing feature'`)
126
+ 5. Push to the branch (`git push origin feature/amazing-feature`)
127
+ 6. Open a Pull Request
128
+
129
+ ### Contribution Guidelines
130
+
131
+ - Follow the existing code style
132
+ - Write meaningful commit messages
133
+ - Add tests for new features
134
+ - Update documentation as needed
135
+ - Ensure all tests pass before submitting PR
136
+
137
+ ## Issues and Support
138
+
139
+ Found a bug or have a feature request? Please [open an issue](https://github.com/vritti-hub/quantum-ui/issues).
140
+
141
+ ## License
142
+
143
+ This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
144
+
145
+ ## Links
146
+
147
+ - [Documentation (Storybook)](https://vritti-hub.github.io/quantum-ui)
148
+ - [GitHub Repository](https://github.com/vritti-hub/quantum-ui)
149
+ - [npm Package](https://www.npmjs.com/package/@vritti/quantum-ui)
150
+ - [Report Issues](https://github.com/vritti-hub/quantum-ui/issues)
package/package.json CHANGED
@@ -1,12 +1,33 @@
1
1
  {
2
2
  "name": "@vritti/quantum-ui",
3
+ "description": "A modern, TypeScript-first React component library built on Radix UI primitives and styled with Tailwind CSS v4. Fully typed, accessible, and tree-shakeable components including Button, Card, TextField, Typography, ThemeToggle, Checkbox, and PasswordField.",
3
4
  "private": false,
4
5
  "publishConfig": {
5
6
  "access": "public"
6
7
  },
7
- "version": "0.1.6",
8
+ "version": "0.1.8",
8
9
  "type": "module",
9
10
  "sideEffects": false,
11
+ "repository": {
12
+ "type": "git",
13
+ "url": "git+https://github.com/vritti-hub/quantum-ui.git"
14
+ },
15
+ "homepage": "https://vritti-hub.github.io/quantum-ui",
16
+ "bugs": {
17
+ "url": "https://github.com/vritti-hub/quantum-ui/issues"
18
+ },
19
+ "keywords": [
20
+ "react",
21
+ "components",
22
+ "ui",
23
+ "tailwind",
24
+ "tailwindcss",
25
+ "radix-ui",
26
+ "typescript",
27
+ "accessible",
28
+ "tree-shakeable",
29
+ "component-library"
30
+ ],
10
31
  "main": "./dist/index.js",
11
32
  "module": "./dist/index.js",
12
33
  "types": "./dist/index.d.ts",
@@ -16,31 +37,31 @@
16
37
  "import": "./dist/index.js"
17
38
  },
18
39
  "./Button": {
19
- "types": "./dist/components/Button.d.ts",
40
+ "types": "./dist/Button.d.ts",
20
41
  "import": "./dist/components/Button.js"
21
42
  },
22
43
  "./Card": {
23
- "types": "./dist/components/Card.d.ts",
44
+ "types": "./dist/Card.d.ts",
24
45
  "import": "./dist/components/Card.js"
25
46
  },
26
47
  "./TextField": {
27
- "types": "./dist/components/TextField.d.ts",
48
+ "types": "./dist/TextField.d.ts",
28
49
  "import": "./dist/components/TextField.js"
29
50
  },
30
51
  "./Typography": {
31
- "types": "./dist/components/Typography.d.ts",
52
+ "types": "./dist/Typography.d.ts",
32
53
  "import": "./dist/components/Typography.js"
33
54
  },
34
55
  "./ThemeToggle": {
35
- "types": "./dist/components/ThemeToggle.d.ts",
56
+ "types": "./dist/ThemeToggle.d.ts",
36
57
  "import": "./dist/components/ThemeToggle.js"
37
58
  },
38
59
  "./Checkbox": {
39
- "types": "./dist/components/Checkbox.d.ts",
60
+ "types": "./dist/Checkbox.d.ts",
40
61
  "import": "./dist/components/Checkbox.js"
41
62
  },
42
63
  "./PasswordField": {
43
- "types": "./dist/components/PasswordField.d.ts",
64
+ "types": "./dist/PasswordField.d.ts",
44
65
  "import": "./dist/components/PasswordField.js"
45
66
  }
46
67
  },