@raxrai/stylelab-ui 0.1.0 → 0.1.1

package/README.md

@@ -1,30 +1,8 @@
 # StyleLab UI
 
-A themeable, accessible React UI library with **8 themes**: Minimal, Night, Glass, Neubrutal, Clay, Cyberpunk, Retro, and Motion. Built with Tailwind CSS v4, CVA, and Lucide icons. NPM-ready with CJS/ESM build and zero heavy dependencies (peer: React).
+A themeable, accessible React UI library with **8 themes**: Minimal, Night, Glass, Neubrutal, Clay, Cyberpunk, Retro, and Motion. Built with Tailwind CSS v4, CVA, and Lucide icons. Zero extra dependencies at install time — only **React** and **React DOM** as peers; everything else is bundled.
 
-## Run locally
-
-```bash
-npm install
-npm run dev
-```
-
-Open [http://localhost:3000/gallery](http://localhost:3000/gallery) to see all components and the sticky theme switcher.
-
-## Build library for distribution
-
-```bash
-npm run build:lib
-```
-
-Output: `dist/` (CJS, ESM, and `.d.ts`). The package is already configured for npm (`main`, `module`, `types`, `exports`, `files`). To publish, see **[docs/PUBLISHING-TO-NPM.md](docs/PUBLISHING-TO-NPM.md)** for detailed steps.
-
----
-
-## Documentation
-
-- **[docs/COMPONENTS.md](docs/COMPONENTS.md)** — Full component API: every prop, type, hook, and global (themes, `getThemeClass`, `cn`, etc.).
-- **[docs/PUBLISHING-TO-NPM.md](docs/PUBLISHING-TO-NPM.md)** — How to publish this package to npm (maintainers).
+**Live site (demo, gallery, docs):** [https://stylelab.rajarai.com](https://stylelab.rajarai.com)
 
 ---
 
@@ -34,18 +12,20 @@ Output: `dist/` (CJS, ESM, and `.d.ts`). The package is already configured for n
 npm install @raxrai/stylelab-ui react react-dom
 ```
 
-Peer dependencies: `react` and `react-dom` (>=18). Other runtime deps (e.g. `class-variance-authority`, `clsx`, `tailwind-merge`, `lucide-react`, `framer-motion`) are bundled, so no extra install is required.
+Peer dependencies: **react** and **react-dom** (>=18). Other runtime deps (e.g. class-variance-authority, clsx, tailwind-merge, lucide-react, framer-motion) are bundled, so no extra install is required.
 
-### Tailwind + styles
+### 1. Tailwind + styles
 
-Your app must use **Tailwind CSS v4**. Import StyleLab design tokens in your global CSS after Tailwind:
+Your app must use **Tailwind CSS v4**. Import StyleLab design tokens in your global CSS **after** Tailwind:
 
 ```css
 @import "tailwindcss";
 @import "@raxrai/stylelab-ui/styles";
 ```
 
-### ThemeProvider
+### 2. ThemeProvider
+
+Wrap your app so components receive the active theme:
 
 ```tsx
 import { ThemeProvider } from "@raxrai/stylelab-ui";
@@ -61,7 +41,7 @@ export default function RootLayout({ children }) {
 }
 ```
 
-### Use components
+### 3. Use components
 
 ```tsx
 import { Button, Card, useTheme } from "@raxrai/stylelab-ui";
@@ -79,17 +59,20 @@ export function MyPage() {
 
 **Themes:** `minimal` | `night` | `glass` | `neubrutal` | `clay` | `cyberpunk` | `retro` | `motion`
 
-### Exports
+---
+
+## What’s in the package
 
 **Components:** Accordion, Alert, Avatar, AvatarGroup, Badge, BentoGrid, Breadcrumbs, Button, Calendar, Card, CommandPalette, DashboardShell, DataTable, DocumentAccordion, Dropdown, Flashcard, GraphicCard, Input, Modal, Navbar, PricingCard, ProgressBar, SectionHeader, Sidebar, Skeleton, Slider, StatsCard, Tabs, Terminal, Timeline, Toast, Toggle, Tooltip.
 
 **Global:** ThemeProvider, useTheme, getThemeClass, THEMES, StyleLabTheme, cn, getNextListIndex, useFocusTrap, useClickOutside, useKeyboardNavigation.
 
-Full API (props, types, usage): see [docs/COMPONENTS.md](docs/COMPONENTS.md).
+- **See all components and try themes:** [stylelab.rajarai.com](https://stylelab.rajarai.com)
+- **Full API (props, types, hooks):** [docs/COMPONENTS.md](docs/COMPONENTS.md) in this repo.
 
 ---
 
-## Component Prop API (overview)
+## Component API (overview)
 
 ### Button
 
@@ -196,8 +179,8 @@ Implements focus trap and scroll lock when open.
 
 | Prop           | Type                    | Default | Description              |
 |----------------|-------------------------|---------|--------------------------|
-| `trigger`       | `ReactNode`             | —       | Button / element to open |
-| `items`        | `{ value, label, disabled? }[]` | — | Options               |
+| `trigger`     | `ReactNode`             | —       | Button / element to open |
+| `items`       | `{ value, label, disabled? }[]` | — | Options               |
 | `value` / `defaultValue` | `string`        | —       | Controlled / initial     |
 | `onValueChange`| `(value: string) => void` | —     | Selection callback       |
 
@@ -211,10 +194,15 @@ Keyboard: Enter/Space to open, Arrows to move, Enter to select, Escape to close.
 import { cn, useFocusTrap, useClickOutside, useKeyboardNavigation, getNextListIndex } from "@raxrai/stylelab-ui";
 ```
 
-- **cn(...)** – `clsx` + `tailwind-merge` for class names.
+- **cn(...)** – clsx + tailwind-merge for class names.
 - **useFocusTrap(active, options?)** – Traps focus in a container ref (e.g. Modal).
 - **useClickOutside(ref(s), handler, options?)** – Fires when click is outside ref(s).
 - **useKeyboardNavigation({ onEscape, onArrowLeft, onArrowRight, ... })** – Document-level key handlers.
 - **getNextListIndex(current, direction, length)** – Index for arrow-key list/tab navigation.
 
 ---
+
+## Links
+
+- **Live demo & docs:** [https://stylelab.rajarai.com](https://stylelab.rajarai.com)
+- **Full component API (this repo):** [docs/COMPONENTS.md](docs/COMPONENTS.md)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@raxrai/stylelab-ui",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Themeable UI library with 8 themes: Minimal, Night, Glass, Neubrutal, Clay, Cyberpunk, Retro, Motion",
   "sideEffects": false,
   "scripts": {