@alkimi.org/ui-kit 0.1.6 → 0.1.7

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.
@@ -192,6 +192,124 @@ function App() {
192
192
  }
193
193
  ```
194
194
 
195
+ ## Adding More Components
196
+
197
+ To add more shadcn/ui components to this library:
198
+
199
+ 1. Use the shadcn CLI to add components:
200
+
201
+ ```bash
202
+ npx shadcn-ui@latest add [component-name]
203
+ ```
204
+
205
+ 2. Export the new component in [src/index.ts](src/index.ts):
206
+
207
+ ```tsx
208
+ export { ComponentName } from "./components/component-name"
209
+ ```
210
+
211
+ 3. Rebuild the library:
212
+ ```bash
213
+ npm run build
214
+ ```
215
+
216
+ ## Development
217
+
218
+ ### Running the Demo
219
+
220
+ To see the components in action, run the demo application:
221
+
222
+ ```bash
223
+ cd demo
224
+ npm install
225
+ npm run dev
226
+ ```
227
+
228
+ Then open [http://localhost:5173](http://localhost:5173) in your browser.
229
+
230
+ The demo showcases all available components with interactive examples, including:
231
+
232
+ - All button variants and sizes
233
+ - Card layouts and compositions
234
+ - Dark mode toggle
235
+ - Interactive component states
236
+
237
+ ### Build
238
+
239
+ Build the library for production:
240
+
241
+ ```bash
242
+ npm run build
243
+ ```
244
+
245
+ ### Watch Mode
246
+
247
+ Build the library in watch mode during development:
248
+
249
+ ```bash
250
+ npm run dev
251
+ ```
252
+
253
+ ### Type Check
254
+
255
+ Run TypeScript type checking:
256
+
257
+ ```bash
258
+ npm run type-check
259
+ ```
260
+
261
+ ### Storybook
262
+
263
+ View and develop components in isolation using Storybook:
264
+
265
+ ```bash
266
+ npm run storybook
267
+ ```
268
+
269
+ This will start Storybook on [http://localhost:6006](http://localhost:6006).
270
+
271
+ #### Building Storybook for Deployment
272
+
273
+ To build a static version of Storybook for deployment:
274
+
275
+ ```bash
276
+ npm run build-storybook
277
+ ```
278
+
279
+ This will generate a static site in the `storybook-static` directory that you can deploy to any static hosting service.
280
+
281
+ #### Deploying to Vercel
282
+
283
+ **Option 1: Using Vercel Dashboard (No Terminal Required)**
284
+
285
+ 1. Build Storybook locally: `npm run build-storybook`
286
+ 2. Go to [vercel.com](https://vercel.com) and log in
287
+ 3. Click "Add New..." → "Project"
288
+ 4. If this is your first time:
289
+ - Import your repository from GitHub/GitLab/Bitbucket
290
+ - In the project settings, configure:
291
+ - **Build Command**: `npm run build-storybook`
292
+ - **Output Directory**: `storybook-static`
293
+ - **Install Command**: `npm install`
294
+ 5. Click "Deploy"
295
+
296
+ Vercel will automatically deploy your Storybook and provide you with a URL. Every time you push to your main branch, Vercel will rebuild and redeploy automatically.
297
+
298
+ **Option 2: Using Vercel CLI**
299
+
300
+ 1. Build Storybook: `npm run build-storybook`
301
+ 2. Install Vercel CLI (if not already installed): `npm i -g vercel`
302
+ 3. Deploy: `vercel storybook-static`
303
+
304
+ ## Publishing to npm
305
+
306
+ 1. Update the version number in [package.json](package.json) (e.g., from `0.1.3` to `0.1.4`)
307
+ 2. Build the library: `npm run build`
308
+ 3. Login to npm (if not already logged in): `npm login`
309
+ 4. Publish: `npm publish`
310
+
311
+ **Note:** Make sure to bump the version in [package.json](package.json) before publishing any changes to avoid conflicts with existing versions on npm.
312
+
195
313
  ## License
196
314
 
197
315
  MIT
package/README.md CHANGED
@@ -192,124 +192,6 @@ function App() {
192
192
  }
193
193
  ```
194
194
 
195
- ## Adding More Components
196
-
197
- To add more shadcn/ui components to this library:
198
-
199
- 1. Use the shadcn CLI to add components:
200
-
201
- ```bash
202
- npx shadcn-ui@latest add [component-name]
203
- ```
204
-
205
- 2. Export the new component in [src/index.ts](src/index.ts):
206
-
207
- ```tsx
208
- export { ComponentName } from "./components/component-name"
209
- ```
210
-
211
- 3. Rebuild the library:
212
- ```bash
213
- npm run build
214
- ```
215
-
216
- ## Development
217
-
218
- ### Running the Demo
219
-
220
- To see the components in action, run the demo application:
221
-
222
- ```bash
223
- cd demo
224
- npm install
225
- npm run dev
226
- ```
227
-
228
- Then open [http://localhost:5173](http://localhost:5173) in your browser.
229
-
230
- The demo showcases all available components with interactive examples, including:
231
-
232
- - All button variants and sizes
233
- - Card layouts and compositions
234
- - Dark mode toggle
235
- - Interactive component states
236
-
237
- ### Build
238
-
239
- Build the library for production:
240
-
241
- ```bash
242
- npm run build
243
- ```
244
-
245
- ### Watch Mode
246
-
247
- Build the library in watch mode during development:
248
-
249
- ```bash
250
- npm run dev
251
- ```
252
-
253
- ### Type Check
254
-
255
- Run TypeScript type checking:
256
-
257
- ```bash
258
- npm run type-check
259
- ```
260
-
261
- ### Storybook
262
-
263
- View and develop components in isolation using Storybook:
264
-
265
- ```bash
266
- npm run storybook
267
- ```
268
-
269
- This will start Storybook on [http://localhost:6006](http://localhost:6006).
270
-
271
- #### Building Storybook for Deployment
272
-
273
- To build a static version of Storybook for deployment:
274
-
275
- ```bash
276
- npm run build-storybook
277
- ```
278
-
279
- This will generate a static site in the `storybook-static` directory that you can deploy to any static hosting service.
280
-
281
- #### Deploying to Vercel
282
-
283
- **Option 1: Using Vercel Dashboard (No Terminal Required)**
284
-
285
- 1. Build Storybook locally: `npm run build-storybook`
286
- 2. Go to [vercel.com](https://vercel.com) and log in
287
- 3. Click "Add New..." → "Project"
288
- 4. If this is your first time:
289
- - Import your repository from GitHub/GitLab/Bitbucket
290
- - In the project settings, configure:
291
- - **Build Command**: `npm run build-storybook`
292
- - **Output Directory**: `storybook-static`
293
- - **Install Command**: `npm install`
294
- 5. Click "Deploy"
295
-
296
- Vercel will automatically deploy your Storybook and provide you with a URL. Every time you push to your main branch, Vercel will rebuild and redeploy automatically.
297
-
298
- **Option 2: Using Vercel CLI**
299
-
300
- 1. Build Storybook: `npm run build-storybook`
301
- 2. Install Vercel CLI (if not already installed): `npm i -g vercel`
302
- 3. Deploy: `vercel storybook-static`
303
-
304
- ## Publishing to npm
305
-
306
- 1. Update the version number in [package.json](package.json) (e.g., from `0.1.3` to `0.1.4`)
307
- 2. Build the library: `npm run build`
308
- 3. Login to npm (if not already logged in): `npm login`
309
- 4. Publish: `npm publish`
310
-
311
- **Note:** Make sure to bump the version in [package.json](package.json) before publishing any changes to avoid conflicts with existing versions on npm.
312
-
313
195
  ## License
314
196
 
315
197
  MIT
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alkimi.org/ui-kit",
3
- "version": "0.1.6",
3
+ "version": "0.1.7",
4
4
  "description": "A React component library built with shadcn/ui and Tailwind CSS",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",
@@ -17,12 +17,13 @@
17
17
  "dist"
18
18
  ],
19
19
  "scripts": {
20
- "build": "tsup && cp dist/index.css dist/styles.css && cp dist/index.css.map dist/styles.css.map && cp README.npm.md dist/README.md",
20
+ "build": "tsup && cp dist/index.css dist/styles.css && cp dist/index.css.map dist/styles.css.map",
21
21
  "dev": "tsup --watch",
22
22
  "type-check": "tsc --noEmit",
23
23
  "storybook": "storybook dev -p 6006",
24
24
  "build-storybook": "storybook build",
25
- "prepublishOnly": "npm run build"
25
+ "prepublishOnly": "npm run build && mv README.md README.github.md && cp README.npm.md README.md",
26
+ "postpublish": "mv README.github.md README.md"
26
27
  },
27
28
  "keywords": [
28
29
  "react",