@avento-space/ts-ui 1.2.4 → 1.2.5

package/README.md

@@ -1,180 +1,180 @@
-# Avento TS UI
-
-**Web Components UI library — framework-agnostic, signal-driven, tree-shakeable.**
-
-Build reactive UIs with native web components. Works with any framework (React, Vue, Angular, or vanilla JS) or no framework at all.
-
----
-
-## Features
-
-- **50+ production-ready components** — buttons, modals, tables, forms, overlays, and more
-- **Shadow DOM** — encapsulated styles, no leaks
-- **Signal-based reactivity** — fine-grained updates without virtual DOM
-- **Tree-shakeable** — import only what you use
-- **Framework-agnostic** — use directly as HTML tags or via React wrappers
-- **Accessible** — WAI-ARIA patterns, keyboard navigation, focus management
-- **Icon system** — 3000+ SVG icons built in
-- **Zero dependencies** — only TypeScript
-
----
-
-## Quick Start
-
-### Install
-
-```bash
-npm install @avento-space/ts-ui
-```
-
-### Usage (vanilla JS / any framework)
-
-```typescript
-import { defineComponents } from '@avento-space/ts-ui';
-
-// Register all components (prefix: u-)
-defineComponents();
-
-// Components are now available as HTML tags
-```
-
-```html
-<u-button variant="primary">Click me</u-button>
-<u-modal title="Hello" open>
-  <p>Modal content</p>
-</u-modal>
-```
-
-### Usage with React
-
-```tsx
-import { defineComponents } from '@avento-space/ts-ui';
-import { Button, Modal } from '@avento-space/ts-ui/react';
-
-defineComponents();
-
-function App() {
-  return (
-    <Button variant="primary" onClick={() => alert('Hi!')}>
-      Click me
-    </Button>
-  );
-}
-```
-
----
-
-## Components
-
-| Component | Tag | Description |
-|-----------|-----|-------------|
-| Accordion | `<u-accordion>` | Collapsible sections |
-| Badge | `<u-badge>` | Status indicators, labels |
-| Box | `<u-box>` | Semantic layout wrapper |
-| Breadcrumb | `<u-breadcrumb>` | Navigation trail |
-| Button | `<u-button>` | Primary, secondary, ghost, danger, link |
-| Calendar | `<u-calendar>` | Date picker |
-| Card | `<u-card>` | Content container with header/footer |
-| Checkbox | `<u-checkbox>` | Toggle option |
-| Collection | `<u-collection>` | Managed item selection |
-| Combobox | `<u-combobox>` | Autocomplete input |
-| CommandPalette | `<u-command-palette>` | ⌘K command menu |
-| Container | `<u-container>` | Max-width layout wrapper |
-| ContextMenu | `<u-context-menu>` | Right-click menu |
-| DataTable | `<u-data-table>` | Sortable, filterable table |
-| DialogRoot | `<u-dialog-root>` | Dialog base behavior |
-| DismissableLayer | `<u-dismissable-layer>` | Click-outside handler |
-| Drawer | `<u-drawer>` | Slide-in panel |
-| Dropdown | `<u-dropdown>` | Menu button |
-| Field | `<u-field>` | Label + input wrapper |
-| FocusManager | `<u-focus-manager>` | Keyboard focus orchestration |
-| FocusScope | `<u-focus-scope>` | Isolated focus zone |
-| FocusTrap | `<u-focus-trap>` | Tab cycle trapping |
-| Form | `<u-form>` | Form validation wrapper |
-| Grid | `<u-grid>` | CSS Grid layout |
-| Hoverable | `<u-hoverable>` | Hover state behavior |
-| Input | `<u-input>` | Text input |
-| KeyboardNavigation | `<u-keyboard-navigation>` | Arrow key navigation |
-| Label | `<u-label>` | Form label |
-| Link | `<u-link>` | Styled anchor |
-| List | `<u-list>` | Keyed list renderer |
-| LiveRegion | `<u-live-region>` | Screen reader announcements |
-| Modal | `<u-modal>` | Dialog overlay |
-| Overlay | `<u-overlay>` | Backdrop layer |
-| Popover | `<u-popover>` | Hover/focus tooltip-like |
-| Popper | `<u-popper>` | Positioning utility |
-| Portal | `<u-portal>` | Teleport to another node |
-| Presence | `<u-presence>` | Mount/unmount animation |
-| Pressable | `<u-pressable>` | Press interaction behavior |
-| RadioGroup | `<u-radio-group>` | Radio button group |
-| RouterView | `<u-router-view>` | Router outlet |
-| Select | `<u-select>` | Native select replacement |
-| Slot | `<u-slot>` | Named slot content |
-| Sortable | `<u-sortable>` | Drag-to-reorder list |
-| Spacer | `<u-spacer>` | Flex spacing utility |
-| Stack / HStack | `<u-stack>` / `<u-hstack>` | Flexbox layouts |
-| Switch | `<u-switch>` | Toggle control |
-| Table | `<u-table>` | Data table |
-| Tabs | `<u-tabs>` | Tabbed interface |
-| Text | `<u-text>` | Typography with size/weight/color |
-| Textarea | `<u-textarea>` | Multi-line input |
-| Toast | `<u-toast>` | Notification popup |
-| TooltipRoot | `<u-tooltip-root>` | Hover tooltip |
-| Transition | `<u-transition>` | CSS transition behavior |
-| Tree | `<u-tree>` | Hierarchical list |
-| VisuallyHidden | `<u-visually-hidden>` | Screen reader-only content |
-| Icon | `<u-icon>` | 3000+ SVG icons |
-
----
-
-## Styling
-
-Components use **Shadow DOM**, so global CSS (Tailwind, modules, etc.) cannot style internal elements. Use **CSS custom properties** for design tokens and **`::part()` selectors** for targeting specific internal elements.
-
-> 📖 **Full documentation:** [`docs/theming.md`](./docs/theming.md) — includes the complete token table, stacking/z-index guide, React patterns, migration notes, and the optional [Tailwind plugin](docs/theming.md#7-optional-tailwind-plugin) for autocomplete-friendly `--u-*` utilities.
-
-```css
-/* Token override — affects all components */
-:root { --u-color-primary: #7c3aed; }
-
-/* Part selector — styles the internal <button> */
-u-button::part(button) { font-weight: 700; text-transform: uppercase; }
-```
-
----
-
-## React Wrappers
-
-```tsx
-import { Button, Modal, Tabs, Text, Badge, Card } from '@avento-space/ts-ui/react';
-```
-
-Each web component has a React wrapper that forwards props and refs.
-
----
-
-## Icons
-
-```html
-<u-icon name="heart"></u-icon>
-<u-icon name="settings" size="32" stroke-width="1.5"></u-icon>
-```
-
-3000+ icons available. See the icon registry for all names.
-
----
-
-## Scripts
-
-| Command | Description |
-|---------|-------------|
-| `npm run build` | Build with tsup (ESM + .d.ts) |
-| `npm test` | Run vitest |
-| `npm run typecheck` | TypeScript check |
-| `npm run lint` | ESLint |
-
----
-
-## License
-
-MIT
+# Avento TS UI
+
+**Web Components UI library — framework-agnostic, signal-driven, tree-shakeable.**
+
+Build reactive UIs with native web components. Works with any framework (React, Vue, Angular, or vanilla JS) or no framework at all.
+
+---
+
+## Features
+
+- **50+ production-ready components** — buttons, modals, tables, forms, overlays, and more
+- **Shadow DOM** — encapsulated styles, no leaks
+- **Signal-based reactivity** — fine-grained updates without virtual DOM
+- **Tree-shakeable** — import only what you use
+- **Framework-agnostic** — use directly as HTML tags or via React wrappers
+- **Accessible** — WAI-ARIA patterns, keyboard navigation, focus management
+- **Icon system** — 3000+ SVG icons built in
+- **Zero dependencies** — only TypeScript
+
+---
+
+## Quick Start
+
+### Install
+
+```bash
+npm install @avento-space/ts-ui
+```
+
+### Usage (vanilla JS / any framework)
+
+```typescript
+import { defineComponents } from '@avento-space/ts-ui';
+
+// Register all components (prefix: u-)
+defineComponents();
+
+// Components are now available as HTML tags
+```
+
+```html
+<u-button variant="primary">Click me</u-button>
+<u-modal title="Hello" open>
+  <p>Modal content</p>
+</u-modal>
+```
+
+### Usage with React
+
+```tsx
+import { defineComponents } from '@avento-space/ts-ui';
+import { Button, Modal } from '@avento-space/ts-ui/react';
+
+defineComponents();
+
+function App() {
+  return (
+    <Button variant="primary" onClick={() => alert('Hi!')}>
+      Click me
+    </Button>
+  );
+}
+```
+
+---
+
+## Components
+
+| Component | Tag | Description |
+|-----------|-----|-------------|
+| Accordion | `<u-accordion>` | Collapsible sections |
+| Badge | `<u-badge>` | Status indicators, labels |
+| Box | `<u-box>` | Semantic layout wrapper |
+| Breadcrumb | `<u-breadcrumb>` | Navigation trail |
+| Button | `<u-button>` | Primary, secondary, ghost, danger, link |
+| Calendar | `<u-calendar>` | Date picker |
+| Card | `<u-card>` | Content container with header/footer |
+| Checkbox | `<u-checkbox>` | Toggle option |
+| Collection | `<u-collection>` | Managed item selection |
+| Combobox | `<u-combobox>` | Autocomplete input |
+| CommandPalette | `<u-command-palette>` | ⌘K command menu |
+| Container | `<u-container>` | Max-width layout wrapper |
+| ContextMenu | `<u-context-menu>` | Right-click menu |
+| DataTable | `<u-data-table>` | Sortable, filterable table |
+| DialogRoot | `<u-dialog-root>` | Dialog base behavior |
+| DismissableLayer | `<u-dismissable-layer>` | Click-outside handler |
+| Drawer | `<u-drawer>` | Slide-in panel |
+| Dropdown | `<u-dropdown>` | Menu button |
+| Field | `<u-field>` | Label + input wrapper |
+| FocusManager | `<u-focus-manager>` | Keyboard focus orchestration |
+| FocusScope | `<u-focus-scope>` | Isolated focus zone |
+| FocusTrap | `<u-focus-trap>` | Tab cycle trapping |
+| Form | `<u-form>` | Form validation wrapper |
+| Grid | `<u-grid>` | CSS Grid layout |
+| Hoverable | `<u-hoverable>` | Hover state behavior |
+| Input | `<u-input>` | Text input |
+| KeyboardNavigation | `<u-keyboard-navigation>` | Arrow key navigation |
+| Label | `<u-label>` | Form label |
+| Link | `<u-link>` | Styled anchor |
+| List | `<u-list>` | Keyed list renderer |
+| LiveRegion | `<u-live-region>` | Screen reader announcements |
+| Modal | `<u-modal>` | Dialog overlay |
+| Overlay | `<u-overlay>` | Backdrop layer |
+| Popover | `<u-popover>` | Hover/focus tooltip-like |
+| Popper | `<u-popper>` | Positioning utility |
+| Portal | `<u-portal>` | Teleport to another node |
+| Presence | `<u-presence>` | Mount/unmount animation |
+| Pressable | `<u-pressable>` | Press interaction behavior |
+| RadioGroup | `<u-radio-group>` | Radio button group |
+| RouterView | `<u-router-view>` | Router outlet |
+| Select | `<u-select>` | Native select replacement |
+| Slot | `<u-slot>` | Named slot content |
+| Sortable | `<u-sortable>` | Drag-to-reorder list |
+| Spacer | `<u-spacer>` | Flex spacing utility |
+| Stack / HStack | `<u-stack>` / `<u-hstack>` | Flexbox layouts |
+| Switch | `<u-switch>` | Toggle control |
+| Table | `<u-table>` | Data table |
+| Tabs | `<u-tabs>` | Tabbed interface |
+| Text | `<u-text>` | Typography with size/weight/color |
+| Textarea | `<u-textarea>` | Multi-line input |
+| Toast | `<u-toast>` | Notification popup |
+| TooltipRoot | `<u-tooltip-root>` | Hover tooltip |
+| Transition | `<u-transition>` | CSS transition behavior |
+| Tree | `<u-tree>` | Hierarchical list |
+| VisuallyHidden | `<u-visually-hidden>` | Screen reader-only content |
+| Icon | `<u-icon>` | 3000+ SVG icons |
+
+---
+
+## Styling
+
+Components use **Shadow DOM**, so global CSS (Tailwind, modules, etc.) cannot style internal elements. Use **CSS custom properties** for design tokens and **`::part()` selectors** for targeting specific internal elements.
+
+> 📖 **Full documentation:** [`docs/theming.md`](./docs/theming.md) — includes the complete token table, stacking/z-index guide, React patterns, migration notes, and the optional [Tailwind plugin](docs/theming.md#7-optional-tailwind-plugin) for autocomplete-friendly `--u-*` utilities.
+
+```css
+/* Token override — affects all components */
+:root { --u-color-primary: #7c3aed; }
+
+/* Part selector — styles the internal <button> */
+u-button::part(button) { font-weight: 700; text-transform: uppercase; }
+```
+
+---
+
+## React Wrappers
+
+```tsx
+import { Button, Modal, Tabs, Text, Badge, Card } from '@avento-space/ts-ui/react';
+```
+
+Each web component has a React wrapper that forwards props and refs.
+
+---
+
+## Icons
+
+```html
+<u-icon name="heart"></u-icon>
+<u-icon name="settings" size="32" stroke-width="1.5"></u-icon>
+```
+
+3000+ icons available. See the icon registry for all names.
+
+---
+
+## Scripts
+
+| Command | Description |
+|---------|-------------|
+| `npm run build` | Build with tsup (ESM + .d.ts) |
+| `npm test` | Run vitest |
+| `npm run typecheck` | TypeScript check |
+| `npm run lint` | ESLint |
+
+---
+
+## License
+
+MIT

package/dist/{chunk-2JEFDU25.js → chunk-47AXL5HN.js}

@@ -1,4 +1,4 @@
-import { UElement, buttonStyles, inputStyles, boxStyles, listStyles, textStyles, stackStyles, gridStyles, overlayStyles, fieldStyles, checkboxStyles, selectStyles, linkStyles, containerStyles, dialogStyles, tooltipStyles, textareaStyles, radioStyles, switchStyles, labelStyles, treeStyles, tableStyles, breadcrumbStyles, tabsStyles, visuallyHiddenStyles, presenceStyles, animateKeyframes, modalStyles, drawerStyles, popoverStyles, dropdownStyles, accordionStyles, comboboxStyles, calendarStyles, dataTableStyles, commandPaletteStyles, toastStyles, contextMenuStyles, sortableStyles, formStyles, badgeStyles, cardStyles } from './chunk-AOFVLHAJ.js';
+import { UElement, buttonStyles, inputStyles, boxStyles, listStyles, textStyles, stackStyles, gridStyles, overlayStyles, fieldStyles, checkboxStyles, selectStyles, linkStyles, containerStyles, dialogStyles, tooltipStyles, textareaStyles, radioStyles, switchStyles, labelStyles, treeStyles, tableStyles, breadcrumbStyles, tabsStyles, visuallyHiddenStyles, presenceStyles, animateKeyframes, modalStyles, drawerStyles, popoverStyles, dropdownStyles, accordionStyles, comboboxStyles, calendarStyles, dataTableStyles, commandPaletteStyles, toastStyles, contextMenuStyles, sortableStyles, formStyles, badgeStyles, cardStyles } from './chunk-6Y6GA2QS.js';
 import { signal, effect } from './chunk-Q5RCPPCF.js';
 
 // src/components/button.wc.ts
@@ -6205,5 +6205,5 @@ var UCard = class extends UElement {
 };
 
 export { UAccordion, UAccordionItem, UAnimate, UBadge, UBox, UBreadcrumb, UButton, UCalendar, UCard, UCheckbox, UCollection, UCombobox, UCommandPalette, UContainer, UContextMenu, UDataTable, UDialogRoot, UDismissableLayer, UDrawer, UDropdown, UField, UFocusManager, UFocusScope, UFocusTrap, UForm, UGrid, UHStack, UHoverable, UInput, UKeyboardNavigation, ULabel, ULink, UList, ULiveRegion, UModal, UOverlay, UPopover, UPopper, UPortal, UPresence, UPressable, URadio, URadioGroup, URouterView, USelect, USlot, USortable, USpacer, UStack, USwitch, UTable, UTabs, UText, UTextarea, UToast, UTooltipRoot, UTransition, UTree, UVirtualList, UVisuallyHidden, createControlledInput, setPortalRoot };
-//# sourceMappingURL=chunk-2JEFDU25.js.map
-//# sourceMappingURL=chunk-2JEFDU25.js.map
+//# sourceMappingURL=chunk-47AXL5HN.js.map
+//# sourceMappingURL=chunk-47AXL5HN.js.map