@orion-ds/react 1.2.7 → 2.0.1

package/AI_QUICKREF.md

@@ -11,7 +11,8 @@ import '@orion-ds/react/styles.css';
 
 import { ThemeProvider } from '@orion-ds/react';
 
-<ThemeProvider>
+// New flat props API (preferred)
+<ThemeProvider defaultBrand="orion" defaultTheme="light">
   <App />
 </ThemeProvider>
 ```
@@ -31,6 +32,10 @@ Avatar, Table, List, Chip, Pagination, Stepper
 ## Sections (Landing Pages)
 Hero, Features, CTA, Footer, Pricing, Testimonials, Stats, FAQ, Carousel, Team, Contact, Newsletter, LogoCloud, Blog, Gallery, Timeline, Comparison, Banner, SocialProof, AppDownload
 
+## Templates (Full Pages)
+**Marketing:** LandingPageTemplate, PricingPageTemplate, AboutPageTemplate, ContactPageTemplate
+**App:** DashboardTemplate, SettingsTemplate, ProfilePageTemplate, KanbanPageTemplate, LoginTemplate
+
 ## Icon Usage
 ```tsx
 import { Search } from 'lucide-react';
@@ -61,4 +66,11 @@ const { theme, brand, setTheme, setBrand } = useThemeContext();
 - ALWAYS import styles.css (or both CSS files separately)
 - ALWAYS add `aria-label` to iconOnly buttons
 
-## Full docs: AI_COMPONENTS.md
+## Deprecated Props (v2.0)
+| Old | New | Component |
+|-----|-----|-----------|
+| `headline` | `title` | Hero, CTA |
+| `subtitle` | `description` | DetailPanel |
+| `options` | flat props | ThemeProvider |
+
+## Full docs: AI_GUIDE.md, AI_COMPONENTS.md

package/README.md

@@ -1,8 +1,8 @@
-# @orion/react
+# @orion-ds/react
 
-> **Orion Design System** - React Component Library
+> **Orion Design System** - AI-First React Component Library
 
-TypeScript-first React component library built on the Orion Design System tokens. Features 22 production-ready components with full type safety, theme switching, and multi-brand support.
+TypeScript-first React component library built on the Orion Design System. Features 40+ components, 30+ sections, and 9 page templates with full type safety, theme switching, and multi-brand support.
 
 [![TypeScript](https://img.shields.io/badge/TypeScript-100%25-blue)](https://www.typescriptlang.org/)
 [![Tests](https://img.shields.io/badge/tests-passing-brightgreen)](#)
@@ -10,15 +10,15 @@ TypeScript-first React component library built on the Orion Design System tokens
 
 ## Features
 
-- ✅ **22 TypeScript Components** - Fully typed with IntelliSense support
+- 🤖 **AI-First Design** - Optimized for AI/LLM code generation (see AI_GUIDE.md)
+- ✅ **40+ Components** - Fully typed with IntelliSense support
+- 📐 **30+ Sections** - Pre-built page sections (Hero, Features, Pricing, etc.)
+- 📄 **9 Templates** - Complete page templates (Landing, Dashboard, Profile, etc.)
 - 🎨 **Theme Switching** - Light/Dark modes with CSS variables
-- 🏢 **Multi-Brand** - Orion, UVM, Unitec, Laureate brands
-- 🎯 **Lucide Icons** - 5000+ icons built-in (icon support in Button, Field, Alert, etc.)
-- ♿ **Accessible** - WCAG AA compliant, keyboard navigation
-- 📦 **Tree-Shakeable** - Import only what you need (ESM + CJS)
-- 🎭 **CSS Modules** - Scoped styling, no conflicts
-- 🧪 **Tested** - 19+ unit tests with Vitest
-- 📚 **Documented** - 50+ Storybook stories
+- 🏢 **Multi-Brand** - orion, red, deepblue, orange, lemon brands
+- 🎯 **Lucide Icons** - 5000+ icons built-in
+- ♿ **Accessible** - WCAG AA compliant
+- 📦 **Tree-Shakeable** - ESM + CJS
 
 ## Installation
 
@@ -88,6 +88,18 @@ function MyApp() {
 }
 \`\`\`
 
+## AI / LLM Integration
+
+This library is optimized for AI code generation. When using with Claude, Cursor, Copilot, or other AI tools:
+
+| Document | Purpose |
+|----------|---------|
+| `AI_GUIDE.md` | Complete integration guide, decision trees, anti-patterns |
+| `AI_QUICKREF.md` | Quick reference for common patterns |
+| `AI_COMPONENTS.md` | All components with examples |
+
+These files are included in the npm package.
+
 ## Google Fonts (Automatic)
 
 **Fonts are loaded automatically by `ThemeProvider`** (since v1.1.4). No manual setup required!
@@ -180,12 +192,58 @@ if (missing.length > 0) {
 - **ThemeController** - Theme & brand selector
 - **useTheme** - Theme management hook
 
+## Sections
+
+Pre-built page sections for rapid development:
+
+| Category | Sections |
+|----------|----------|
+| **Marketing** | Hero, Features, Pricing, CTA, Testimonials, FAQ, Footer |
+| **App** | Sidebar, Header, DetailPanel, StatCards |
+| **Content** | ArticleContent, MediaGallery, Timeline |
+
+\`\`\`tsx
+import { Hero, Features, Pricing } from '@orion-ds/react';
+
+<Hero title="Welcome" description="Build faster" />
+<Features items={[...]} columns={3} />
+<Pricing plans={[...]} />
+\`\`\`
+
+[View all 30+ sections in AI_COMPONENTS.md](./AI_COMPONENTS.md)
+
+## Templates
+
+Complete page templates ready to use:
+
+| Template | Use Case |
+|----------|----------|
+| `LandingPageTemplate` | Marketing landing pages |
+| `DashboardTemplate` | Admin dashboards |
+| `ProfilePageTemplate` | User profile pages |
+| `SettingsTemplate` | Settings pages |
+| `LoginTemplate` | Authentication pages |
+| `OnboardingTemplate` | User onboarding flows |
+| `NotFoundTemplate` | 404 error pages |
+| `MaintenanceTemplate` | Maintenance pages |
+| `ComingSoonTemplate` | Pre-launch pages |
+
+\`\`\`tsx
+import { LandingPageTemplate } from '@orion-ds/react';
+
+<LandingPageTemplate
+  hero={{ title: 'Welcome', description: '...' }}
+  features={{ items: [...] }}
+  pricing={{ plans: [...] }}
+/>
+\`\`\`
+
 ## Lucide Icons
 
 All components support **Lucide icons** - 5000+ beautiful, consistent icons.
 
 \`\`\`tsx
-import { Button, Field, Alert } from '@orion/react';
+import { Button, Field, Alert } from '@orion-ds/react';
 import { Search, Download, AlertCircle } from 'lucide-react';
 
 // Icon in button (left side)
@@ -217,7 +275,7 @@ See [LUCIDE_ICONS.md](./LUCIDE_ICONS.md) for complete icon documentation.
 ### Using the Hook
 
 \`\`\`tsx
-import { useTheme } from '@orion/react';
+import { useTheme } from '@orion-ds/react';
 
 function ThemeSwitcher() {
   const { theme, brand, setTheme, setBrand, toggleTheme } = useTheme();
@@ -227,14 +285,38 @@ function ThemeSwitcher() {
       <button onClick={toggleTheme}>
         Current: {theme}
       </button>
-      <button onClick={() => setBrand('uvm')}>
-        Switch to UVM Brand
+      <button onClick={() => setBrand('deepblue')}>
+        Switch to Deepblue Brand
       </button>
     </>
   );
 }
 \`\`\`
 
+## v2.0.0 Migration Guide
+
+### Breaking Changes
+
+#### Hero & CTA: `headline` → `title`
+\`\`\`diff
+- <Hero headline="Welcome" description="..." />
++ <Hero title="Welcome" description="..." />
+\`\`\`
+
+#### DetailPanel: `subtitle` → `description`
+\`\`\`diff
+- <DetailPanel title="Edit" subtitle="User profile" />
++ <DetailPanel title="Edit" description="User profile" />
+\`\`\`
+
+#### ThemeProvider: Flat Props (Optional)
+\`\`\`diff
+- <ThemeProvider options={{ defaultBrand: 'red' }}>
++ <ThemeProvider defaultBrand="red">
+\`\`\`
+
+> **Backward Compatibility**: The old props still work but show deprecation warnings in development.
+
 ## License
 
 MIT © Orion Team

package/dist/components/Accordion/index.d.ts

@@ -1,5 +1,20 @@
 /**
- * Accordion Component Export
+ * Accordion Component - Collapsible content sections.
+ *
+ * @example
+ * ```tsx
+ * import { Accordion } from '@orion-ds/react';
+ *
+ * <Accordion
+ *   items={[
+ *     { id: '1', title: 'Section 1', content: <p>Content for section 1</p> },
+ *     { id: '2', title: 'Section 2', content: <p>Content for section 2</p> },
+ *     { id: '3', title: 'Section 3', content: <p>Content for section 3</p> },
+ *   ]}
+ *   variant="bordered"
+ *   allowMultiple
+ * />
+ * ```
  */
 export { Accordion } from './Accordion';
 export type { AccordionProps, AccordionItem, AccordionVariant, AccordionItemProps, } from './Accordion.types';

package/dist/components/Accordion/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EACV,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,kBAAkB,GACnB,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EACV,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,kBAAkB,GACnB,MAAM,mBAAmB,CAAC"}

package/dist/components/Alert/index.d.ts

@@ -1,5 +1,15 @@
 /**
- * Alert Component Exports
+ * Alert Component - System messages and notifications.
+ *
+ * @example
+ * ```tsx
+ * import { Alert } from '@orion-ds/react';
+ *
+ * <Alert variant="info" title="Info">This is an informational alert.</Alert>
+ * <Alert variant="success" title="Success">Operation completed.</Alert>
+ * <Alert variant="warning" title="Warning">Please review.</Alert>
+ * <Alert variant="error" title="Error" onClose={() => {}}>Something went wrong.</Alert>
+ * ```
  */
 export { Alert } from './Alert';
 export type { AlertProps, AlertVariant } from './Alert.types';

package/dist/components/Alert/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/Avatar/index.d.ts

@@ -1,5 +1,14 @@
 /**
- * Avatar Component Exports
+ * Avatar Component - User/entity profile images.
+ *
+ * @example
+ * ```tsx
+ * import { Avatar } from '@orion-ds/react';
+ *
+ * <Avatar src="/user.jpg" name="John Doe" />
+ * <Avatar name="Jane Smith" /> // Shows initials "JS"
+ * <Avatar src="/profile.jpg" size="lg" />
+ * ```
  */
 export { Avatar } from './Avatar';
 export type { AvatarProps, AvatarSize } from './Avatar.types';

package/dist/components/Avatar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/Badge/index.d.ts

@@ -1,5 +1,15 @@
 /**
- * Badge Component Exports
+ * Badge Component - Status indicators and counts.
+ *
+ * @example
+ * ```tsx
+ * import { Badge } from '@orion-ds/react';
+ *
+ * <Badge>Default</Badge>
+ * <Badge variant="success">Active</Badge>
+ * <Badge variant="error">Failed</Badge>
+ * <Badge variant="brand" size="sm">New</Badge>
+ * ```
  */
 export { Badge } from './Badge';
 export type { BadgeProps, BadgeVariant, BadgeSize } from './Badge.types';

package/dist/components/Badge/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/Breadcrumb/index.d.ts

@@ -1,5 +1,19 @@
 /**
- * Breadcrumb Component Exports
+ * Breadcrumb Component - Navigation hierarchy display.
+ *
+ * @example
+ * ```tsx
+ * import { Breadcrumb } from '@orion-ds/react';
+ *
+ * <Breadcrumb
+ *   items={[
+ *     { label: 'Home', href: '/' },
+ *     { label: 'Products', href: '/products' },
+ *     { label: 'Category', href: '/products/category' },
+ *     { label: 'Item' }, // Current page (no href)
+ *   ]}
+ * />
+ * ```
  */
 export { Breadcrumb } from './Breadcrumb';
 export type { BreadcrumbProps, BreadcrumbItem, BreadcrumbSize, BreadcrumbSeparator, } from './Breadcrumb.types';

package/dist/components/Breadcrumb/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumb/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EACV,eAAe,EACf,cAAc,EACd,cAAc,EACd,mBAAmB,GACpB,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumb/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EACV,eAAe,EACf,cAAc,EACd,cAAc,EACd,mBAAmB,GACpB,MAAM,oBAAoB,CAAC"}

package/dist/components/Button/index.d.ts

@@ -1,5 +1,15 @@
 /**
- * Button Component Exports
+ * Button Component - Primary action element for triggering events.
+ *
+ * @example
+ * ```tsx
+ * import { Button } from '@orion-ds/react';
+ *
+ * <Button variant="primary">Click me</Button>
+ * <Button variant="secondary" icon={<Plus size={20} />}>Add Item</Button>
+ * <Button iconOnly icon={<Settings size={20} />} aria-label="Settings" />
+ * <Button variant="danger" size="sm">Delete</Button>
+ * ```
  */
 export { Button } from './Button';
 export type { ButtonProps, ButtonVariant, ButtonSize } from './Button.types';

package/dist/components/Button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/Card/index.d.ts

@@ -1,5 +1,18 @@
 /**
- * Card Component Exports
+ * Card Component - Container for grouping related content.
+ *
+ * @example
+ * ```tsx
+ * import { Card, Button } from '@orion-ds/react';
+ *
+ * <Card variant="elevated">
+ *   <Card.Header>Card Title</Card.Header>
+ *   <Card.Body>Card content goes here.</Card.Body>
+ *   <Card.Footer>
+ *     <Button>Action</Button>
+ *   </Card.Footer>
+ * </Card>
+ * ```
  */
 export { Card } from './Card';
 export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, CardVariant } from './Card.types';

package/dist/components/Card/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,eAAe,EAAE,aAAa,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,eAAe,EAAE,aAAa,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC"}

package/dist/components/Carousel/index.d.ts

@@ -1,8 +1,23 @@
 /**
- * Carousel Component Exports
+ * Carousel Component - Image/content slider.
  *
  * Atomic carousel component for use within cards, modals, or custom layouts.
  * For full-page carousel sections, use CarouselSection from sections.
+ *
+ * @example
+ * ```tsx
+ * import { Carousel } from '@orion-ds/react';
+ *
+ * <Carousel
+ *   items={[
+ *     { id: '1', image: '/slide1.jpg', title: 'Slide 1' },
+ *     { id: '2', image: '/slide2.jpg', title: 'Slide 2' },
+ *     { id: '3', image: '/slide3.jpg', title: 'Slide 3' },
+ *   ]}
+ *   autoPlay
+ *   showNavigation
+ * />
+ * ```
  */
 export { Carousel } from './Carousel';
 export { CarouselCard } from './CarouselCard';

package/dist/components/Carousel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Carousel/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EACV,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,WAAW,EACX,eAAe,EACf,aAAa,EACb,uBAAuB,GACxB,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Carousel/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EACV,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,WAAW,EACX,eAAe,EACf,aAAa,EACb,uBAAuB,GACxB,MAAM,kBAAkB,CAAC"}

package/dist/components/Checkbox/index.d.ts

@@ -1,5 +1,14 @@
 /**
- * Checkbox Component Exports
+ * Checkbox Component - Boolean selection with label.
+ *
+ * @example
+ * ```tsx
+ * import { Checkbox } from '@orion-ds/react';
+ *
+ * <Checkbox label="I agree to the terms" />
+ * <Checkbox label="Select all" checked={selectAll} indeterminate={someSelected} />
+ * <Checkbox label="Remember me" checked={remember} onChange={setRemember} />
+ * ```
  */
 export { Checkbox } from './Checkbox';
 export type { CheckboxProps, CheckboxSize } from './Checkbox.types';

package/dist/components/Checkbox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/components/Chip/index.d.ts

@@ -1,5 +1,15 @@
 /**
- * Chip Component Export
+ * Chip Component - Tags and filter labels.
+ *
+ * @example
+ * ```tsx
+ * import { Chip } from '@orion-ds/react';
+ *
+ * <Chip>Default</Chip>
+ * <Chip variant="brand">Featured</Chip>
+ * <Chip onRemove={() => handleRemove()}>Removable</Chip>
+ * <Chip selected onClick={() => toggle()}>Selectable</Chip>
+ * ```
  */
 export { Chip } from './Chip';
 export type { ChipProps, ChipVariant, ChipSize } from './Chip.types';

package/dist/components/Chip/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC"}

package/dist/components/Combobox/index.d.ts

@@ -1,5 +1,21 @@
 /**
- * Combobox Component Export
+ * Combobox Component - Autocomplete/typeahead input.
+ *
+ * @example
+ * ```tsx
+ * import { Combobox } from '@orion-ds/react';
+ *
+ * <Combobox
+ *   label="Select a country"
+ *   placeholder="Search countries..."
+ *   options={[
+ *     { value: 'us', label: 'United States' },
+ *     { value: 'uk', label: 'United Kingdom' },
+ *     { value: 'ca', label: 'Canada' },
+ *   ]}
+ *   onSelect={(option) => setCountry(option.value)}
+ * />
+ * ```
  */
 export { Combobox } from './Combobox';
 export type { ComboboxProps, ComboboxOption, ComboboxGroup, ComboboxSize } from './Combobox.types';

package/dist/components/Combobox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Combobox/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Combobox/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/components/Divider/index.d.ts

@@ -1,5 +1,15 @@
 /**
- * Divider Component Export
+ * Divider Component - Visual content separator.
+ *
+ * @example
+ * ```tsx
+ * import { Divider } from '@orion-ds/react';
+ *
+ * <Divider />
+ * <Divider variant="dashed" />
+ * <Divider orientation="vertical" />
+ * <Divider>OR</Divider>
+ * ```
  */
 export { Divider } from './Divider';
 export type { DividerProps, DividerOrientation, DividerVariant } from './Divider.types';

package/dist/components/Divider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Divider/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Divider/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/components/Drawer/index.d.ts

@@ -1,5 +1,20 @@
 /**
- * Drawer Component Export
+ * Drawer Component - Side panel overlay.
+ *
+ * @example
+ * ```tsx
+ * import { Drawer, Button } from '@orion-ds/react';
+ *
+ * <Drawer isOpen={isOpen} onClose={() => setIsOpen(false)} placement="right" size="md">
+ *   <Drawer.Header>Settings</Drawer.Header>
+ *   <Drawer.Body>
+ *     <p>Drawer content here</p>
+ *   </Drawer.Body>
+ *   <Drawer.Footer>
+ *     <Button onClick={() => setIsOpen(false)}>Close</Button>
+ *   </Drawer.Footer>
+ * </Drawer>
+ * ```
  */
 export { Drawer } from './Drawer';
 export type { DrawerProps, DrawerPlacement, DrawerSize, DrawerHeaderProps, DrawerBodyProps, DrawerFooterProps, } from './Drawer.types';

package/dist/components/Drawer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EACV,WAAW,EACX,eAAe,EACf,UAAU,EACV,iBAAiB,EACjB,eAAe,EACf,iBAAiB,GAClB,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EACV,WAAW,EACX,eAAe,EACf,UAAU,EACV,iBAAiB,EACjB,eAAe,EACf,iBAAiB,GAClB,MAAM,gBAAgB,CAAC"}

package/dist/components/Dropdown/index.d.ts

@@ -1,5 +1,21 @@
 /**
- * Dropdown Component Export
+ * Dropdown Component - Action menu with items.
+ *
+ * @example
+ * ```tsx
+ * import { Dropdown, Button } from '@orion-ds/react';
+ * import { Edit, Trash, Copy } from 'lucide-react';
+ *
+ * <Dropdown
+ *   trigger={<Button>Actions</Button>}
+ *   items={[
+ *     { label: 'Edit', icon: <Edit size={16} />, onClick: handleEdit },
+ *     { label: 'Duplicate', icon: <Copy size={16} />, onClick: handleCopy },
+ *     { type: 'divider' },
+ *     { label: 'Delete', icon: <Trash size={16} />, onClick: handleDelete, danger: true },
+ *   ]}
+ * />
+ * ```
  */
 export { Dropdown } from './Dropdown';
 export type { DropdownProps, DropdownItem, DropdownGroup, DropdownPlacement, } from './Dropdown.types';

package/dist/components/Dropdown/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EACV,aAAa,EACb,YAAY,EACZ,aAAa,EACb,iBAAiB,GAClB,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EACV,aAAa,EACb,YAAY,EACZ,aAAa,EACb,iBAAiB,GAClB,MAAM,kBAAkB,CAAC"}

package/dist/components/EmptyState/index.d.ts

@@ -1,5 +1,18 @@
 /**
- * EmptyState Component Export
+ * EmptyState Component - Placeholder for empty data views.
+ *
+ * @example
+ * ```tsx
+ * import { EmptyState, Button } from '@orion-ds/react';
+ * import { Inbox } from 'lucide-react';
+ *
+ * <EmptyState
+ *   icon={<Inbox size={48} />}
+ *   title="No messages"
+ *   description="You don't have any messages yet."
+ *   action={<Button>Compose</Button>}
+ * />
+ * ```
  */
 export { EmptyState } from './EmptyState';
 export type { EmptyStateProps, EmptyStateSize } from './EmptyState.types';

package/dist/components/EmptyState/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/Field/index.d.ts

@@ -1,5 +1,15 @@
 /**
- * Field Component Exports
+ * Field Component - Text input with label, validation, and icons.
+ *
+ * @example
+ * ```tsx
+ * import { Field } from '@orion-ds/react';
+ * import { Mail, Eye } from 'lucide-react';
+ *
+ * <Field label="Email" type="email" placeholder="you@example.com" />
+ * <Field label="Password" type="password" error="Required" />
+ * <Field label="Search" icon={<Search size={18} />} />
+ * ```
  */
 export { Field } from './Field';
 export type { FieldProps } from './Field.types';

package/dist/components/Field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Field/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Field/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/FontLoader/index.d.ts

@@ -1,7 +1,20 @@
 /**
- * FontLoader Component
+ * FontLoader Component - Loads brand fonts from Google Fonts.
  *
- * Automatically loads Google Fonts required by Orion Design System brands.
+ * Note: ThemeProvider automatically includes FontLoader by default.
+ * Only use directly if disabling auto-loading.
+ *
+ * @example
+ * ```tsx
+ * import { FontLoader } from '@orion-ds/react';
+ *
+ * // Usually not needed - ThemeProvider handles this automatically
+ * // Only use if you disabled auto-loading:
+ * <ThemeProvider disableAutoFontLoading>
+ *   <FontLoader />
+ *   <App />
+ * </ThemeProvider>
+ * ```
  */
 export { FontLoader } from './FontLoader';
 export type { FontLoaderProps } from './FontLoader';

package/dist/components/FontLoader/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FontLoader/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FontLoader/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC"}