@adia-ai/web-components 0.4.5 → 0.4.7

package/index.d.ts

@@ -0,0 +1,315 @@
+/**
+ * `@adia-ai/web-components` — public TypeScript declarations.
+ *
+ * Re-exports the core types + augments `HTMLElementTagNameMap` so
+ * `document.querySelector('slider-ui')` returns `UISlider` (typed),
+ * not `Element`.
+ *
+ * @see ./USAGE.md
+ */
+
+// ── Core utilities ──────────────────────────────────────────────────
+export * from './core/index.js';
+
+// ── Form-bearing primitives (typed) ─────────────────────────────────
+export type {
+  UIInput,
+  UIInputType,
+  InputChangeEvent,
+  InputInputEvent,
+  InputChangeEventDetail,
+} from './components/input/input.js';
+
+export type {
+  UISelect,
+  SelectOption,
+  SelectChangeEvent,
+  SelectActionEvent,
+  SelectChangeEventDetail,
+  SelectActionEventDetail,
+} from './components/select/select.js';
+
+export type {
+  UISlider,
+  SliderChangeEvent,
+  SliderInputEvent,
+  SliderChangeEventDetail,
+} from './components/slider/slider.js';
+
+export type {
+  UIRange,
+  RangeChangeEvent,
+  RangeInputEvent,
+  RangeChangeEventDetail,
+} from './components/range/range.js';
+
+export type {
+  UITextarea,
+  TextareaChangeEvent,
+  TextareaInputEvent,
+  TextareaChangeEventDetail,
+} from './components/textarea/textarea.js';
+
+export type {
+  UISwitch,
+  SwitchChangeEvent,
+  SwitchChangeEventDetail,
+} from './components/switch/switch.js';
+
+export type {
+  UICheck,
+  CheckChangeEvent,
+  CheckChangeEventDetail,
+} from './components/check/check.js';
+
+export type {
+  UIRadio,
+  RadioChangeEvent,
+  RadioChangeEventDetail,
+} from './components/radio/radio.js';
+
+export type {
+  UISegmented,
+  SegmentedChangeEvent,
+  SegmentedChangeEventDetail,
+} from './components/segmented/segmented.js';
+
+export type {
+  UISearch,
+  SearchInputEvent,
+  SearchEvent,
+  SearchInputEventDetail,
+  SearchEventDetail,
+} from './components/search/search.js';
+
+export type {
+  UIOtpInput,
+  OtpInputEvent,
+  OtpInputEventDetail,
+} from './components/otp-input/otp-input.js';
+
+export type {
+  UIOptionCard,
+  OptionCardChangeEvent,
+  OptionCardChangeEventDetail,
+} from './components/option-card/option-card.js';
+
+export type {
+  UIColorPicker,
+  ColorFormat,
+  ColorPickerChangeEvent,
+  ColorPickerInputEvent,
+  ColorPickerFormatChangeEvent,
+  ColorPickerChangeEventDetail,
+  ColorPickerFormatChangeEventDetail,
+} from './components/color-picker/color-picker.js';
+
+export type {
+  UIRating,
+  RatingChangeEvent,
+  RatingChangeEventDetail,
+} from './components/rating/rating.js';
+
+export type {
+  UICode,
+  CodeChangeEvent,
+  CodeInputEvent,
+  CodeChangeEventDetail,
+} from './components/code/code.js';
+
+export type {
+  UICalendarPicker,
+  CalendarPickerChangeEvent,
+  CalendarPickerChangeEventDetail,
+} from './components/calendar-picker/calendar-picker.js';
+
+export type {
+  UIUpload,
+  UploadChangeEvent,
+  UploadChangeEventDetail,
+} from './components/upload/upload.js';
+
+// ── Non-form primitives (typed; §74 v0.4.7) ─────────────────────────
+// Property types are codegen'd from each component's `.a2ui.json`
+// sidecar by `scripts/build/dts-codegen.mjs`. Event types stay on the
+// 17 form-bearing primitives (above) where they carry semantic payload.
+export type { UIAccordion } from './components/accordion/accordion.js';
+export type { UIActionList } from './components/action-list/action-list.js';
+export type { UIAgentArtifact } from './components/agent-artifact/agent-artifact.js';
+export type { UIAgentFeedbackBar } from './components/agent-feedback-bar/agent-feedback-bar.js';
+export type { UIAgentQuestions } from './components/agent-questions/agent-questions.js';
+export type { UIAgentReasoning } from './components/agent-reasoning/agent-reasoning.js';
+export type { UIAgentSuggestions } from './components/agent-suggestions/agent-suggestions.js';
+export type { UIAgentTrace } from './components/agent-trace/agent-trace.js';
+export type { UIAlert } from './components/alert/alert.js';
+export type { UIAvatar } from './components/avatar/avatar.js';
+export type { UIBadge } from './components/badge/badge.js';
+export type { UIBlock } from './components/block/block.js';
+export type { UIBreadcrumb } from './components/breadcrumb/breadcrumb.js';
+export type { UIButton } from './components/button/button.js';
+export type { UICanvas } from './components/canvas/canvas.js';
+export type { UICard } from './components/card/card.js';
+export type { UIChart } from './components/chart/chart.js';
+export type { UIChartLegend } from './components/chart-legend/chart-legend.js';
+export type { UIChatThread } from './components/chat-thread/chat-thread.js';
+export type { UIColumn } from './components/col/col.js';
+export type { UICommand } from './components/command/command.js';
+export type { UIDemoToggle } from './components/demo-toggle/demo-toggle.js';
+export type { UIDescriptionList } from './components/description-list/description-list.js';
+export type { UIDivider } from './components/divider/divider.js';
+export type { UIDrawer } from './components/drawer/drawer.js';
+export type { UIEmbed } from './components/embed/embed.js';
+export type { UIEmptyState } from './components/empty-state/empty-state.js';
+export type { UIFeed } from './components/feed/feed.js';
+export type { UIField } from './components/field/field.js';
+export type { UIFields } from './components/fields/fields.js';
+export type { UIGrid } from './components/grid/grid.js';
+export type { UIHeatmap } from './components/heatmap/heatmap.js';
+export type { UIIcon } from './components/icon/icon.js';
+export type { UIImage } from './components/image/image.js';
+export type { UIInspector } from './components/inspector/inspector.js';
+export type { UIKbd } from './components/kbd/kbd.js';
+export type { UILink } from './components/link/link.js';
+export type { UIList } from './components/list/list.js';
+export type { UIMenu } from './components/menu/menu.js';
+export type { UIModal } from './components/modal/modal.js';
+export type { UINav } from './components/nav/nav.js';
+export type { UINavGroup } from './components/nav-group/nav-group.js';
+export type { UINavItem } from './components/nav-item/nav-item.js';
+export type { UINoodles } from './components/noodles/noodles.js';
+export type { UIPage } from './components/page/page.js';
+export type { UIPagination } from './components/pagination/pagination.js';
+export type { UIPane } from './components/pane/pane.js';
+export type { UIPipelineStatus } from './components/pipeline-status/pipeline-status.js';
+export type { UIPopover } from './components/popover/popover.js';
+export type { UIProgress } from './components/progress/progress.js';
+export type { UIProgressRow } from './components/progress-row/progress-row.js';
+export type { UIRichtext } from './components/richtext/richtext.js';
+export type { UIRow } from './components/row/row.js';
+export type { UISegment } from './components/segment/segment.js';
+export type { UISkeleton } from './components/skeleton/skeleton.js';
+export type { UIStack } from './components/stack/stack.js';
+export type { UIStepProgress } from './components/step-progress/step-progress.js';
+export type { UIStepper } from './components/stepper/stepper.js';
+export type { UIStream } from './components/stream/stream.js';
+export type { UISwatch } from './components/swatch/swatch.js';
+export type { UISwiper } from './components/swiper/swiper.js';
+export type { UITable } from './components/table/table.js';
+export type { UITableToolbar } from './components/table-toolbar/table-toolbar.js';
+export type { UITabs } from './components/tabs/tabs.js';
+export type { UITag } from './components/tag/tag.js';
+export type { UIText } from './components/text/text.js';
+export type { UITimeline } from './components/timeline/timeline.js';
+export type { UIToast } from './components/toast/toast.js';
+export type { UIToggleGroup } from './components/toggle-group/toggle-group.js';
+export type { UIToggleScheme } from './components/toggle-scheme/toggle-scheme.js';
+export type { UIToolbar } from './components/toolbar/toolbar.js';
+export type { UITooltip } from './components/tooltip/tooltip.js';
+export type { UITree } from './components/tree/tree.js';
+
+// ── Global HTMLElementTagNameMap augmentation ───────────────────────
+//
+// Tells TypeScript that `document.querySelector('slider-ui')` returns
+// `UISlider`, that `createElement('input-ui')` returns `UIInput`,
+// `document.querySelector('button-ui')` returns `UIButton`, etc.
+//
+// Post-§74 (v0.4.7): all 90 primitives that ship a JS class are
+// covered. The 5 CSS-only "elements" (`header`, `footer`, `section`,
+// etc. — styled by parent slot rules) don't have a class so they
+// don't appear in this map.
+declare global {
+  interface HTMLElementTagNameMap {
+    // Form-bearing (17, hand-authored with rich event types)
+    'input-ui':           import('./components/input/input.js').UIInput;
+    'select-ui':          import('./components/select/select.js').UISelect;
+    'slider-ui':          import('./components/slider/slider.js').UISlider;
+    'range-ui':           import('./components/range/range.js').UIRange;
+    'textarea-ui':        import('./components/textarea/textarea.js').UITextarea;
+    'switch-ui':          import('./components/switch/switch.js').UISwitch;
+    'check-ui':           import('./components/check/check.js').UICheck;
+    'radio-ui':           import('./components/radio/radio.js').UIRadio;
+    'segmented-ui':       import('./components/segmented/segmented.js').UISegmented;
+    'search-ui':          import('./components/search/search.js').UISearch;
+    'otp-input-ui':       import('./components/otp-input/otp-input.js').UIOtpInput;
+    'option-card-ui':     import('./components/option-card/option-card.js').UIOptionCard;
+    'color-picker-ui':    import('./components/color-picker/color-picker.js').UIColorPicker;
+    'rating-ui':          import('./components/rating/rating.js').UIRating;
+    'code-ui':            import('./components/code/code.js').UICode;
+    'calendar-picker-ui': import('./components/calendar-picker/calendar-picker.js').UICalendarPicker;
+    'upload-ui':          import('./components/upload/upload.js').UIUpload;
+    // Non-form (73, codegen'd by scripts/build/dts-codegen.mjs)
+    'accordion-ui':       import('./components/accordion/accordion.js').UIAccordion;
+    'action-list-ui':     import('./components/action-list/action-list.js').UIActionList;
+    'agent-artifact-ui':  import('./components/agent-artifact/agent-artifact.js').UIAgentArtifact;
+    'agent-feedback-bar-ui': import('./components/agent-feedback-bar/agent-feedback-bar.js').UIAgentFeedbackBar;
+    'agent-questions-ui': import('./components/agent-questions/agent-questions.js').UIAgentQuestions;
+    'agent-reasoning-ui': import('./components/agent-reasoning/agent-reasoning.js').UIAgentReasoning;
+    'agent-suggestions-ui': import('./components/agent-suggestions/agent-suggestions.js').UIAgentSuggestions;
+    'agent-trace-ui':     import('./components/agent-trace/agent-trace.js').UIAgentTrace;
+    'alert-ui':           import('./components/alert/alert.js').UIAlert;
+    'avatar-ui':          import('./components/avatar/avatar.js').UIAvatar;
+    'badge-ui':           import('./components/badge/badge.js').UIBadge;
+    'block-ui':           import('./components/block/block.js').UIBlock;
+    'breadcrumb-ui':      import('./components/breadcrumb/breadcrumb.js').UIBreadcrumb;
+    'button-ui':          import('./components/button/button.js').UIButton;
+    'canvas-ui':          import('./components/canvas/canvas.js').UICanvas;
+    'card-ui':            import('./components/card/card.js').UICard;
+    'chart-ui':           import('./components/chart/chart.js').UIChart;
+    'chart-legend-ui':    import('./components/chart-legend/chart-legend.js').UIChartLegend;
+    'chat-thread-ui':     import('./components/chat-thread/chat-thread.js').UIChatThread;
+    'col-ui':             import('./components/col/col.js').UIColumn;
+    'command-ui':         import('./components/command/command.js').UICommand;
+    'demo-toggle-ui':     import('./components/demo-toggle/demo-toggle.js').UIDemoToggle;
+    'description-list-ui': import('./components/description-list/description-list.js').UIDescriptionList;
+    'divider-ui':         import('./components/divider/divider.js').UIDivider;
+    'drawer-ui':          import('./components/drawer/drawer.js').UIDrawer;
+    'embed-ui':           import('./components/embed/embed.js').UIEmbed;
+    'empty-state-ui':     import('./components/empty-state/empty-state.js').UIEmptyState;
+    'feed-ui':            import('./components/feed/feed.js').UIFeed;
+    'field-ui':           import('./components/field/field.js').UIField;
+    'fields-ui':          import('./components/fields/fields.js').UIFields;
+    'grid-ui':            import('./components/grid/grid.js').UIGrid;
+    'heatmap-ui':         import('./components/heatmap/heatmap.js').UIHeatmap;
+    'icon-ui':            import('./components/icon/icon.js').UIIcon;
+    'image-ui':           import('./components/image/image.js').UIImage;
+    'inspector-ui':       import('./components/inspector/inspector.js').UIInspector;
+    'kbd-ui':             import('./components/kbd/kbd.js').UIKbd;
+    'link-ui':            import('./components/link/link.js').UILink;
+    'list-ui':            import('./components/list/list.js').UIList;
+    'menu-ui':            import('./components/menu/menu.js').UIMenu;
+    'modal-ui':           import('./components/modal/modal.js').UIModal;
+    'nav-ui':             import('./components/nav/nav.js').UINav;
+    'nav-group-ui':       import('./components/nav-group/nav-group.js').UINavGroup;
+    'nav-item-ui':        import('./components/nav-item/nav-item.js').UINavItem;
+    'noodles-ui':         import('./components/noodles/noodles.js').UINoodles;
+    'page-ui':            import('./components/page/page.js').UIPage;
+    'pagination-ui':      import('./components/pagination/pagination.js').UIPagination;
+    'pane-ui':            import('./components/pane/pane.js').UIPane;
+    'pipeline-status-ui': import('./components/pipeline-status/pipeline-status.js').UIPipelineStatus;
+    'popover-ui':         import('./components/popover/popover.js').UIPopover;
+    'progress-ui':        import('./components/progress/progress.js').UIProgress;
+    'progress-row-ui':    import('./components/progress-row/progress-row.js').UIProgressRow;
+    'richtext-ui':        import('./components/richtext/richtext.js').UIRichtext;
+    'row-ui':             import('./components/row/row.js').UIRow;
+    'segment-ui':         import('./components/segment/segment.js').UISegment;
+    'skeleton-ui':        import('./components/skeleton/skeleton.js').UISkeleton;
+    'stack-ui':           import('./components/stack/stack.js').UIStack;
+    'step-progress-ui':   import('./components/step-progress/step-progress.js').UIStepProgress;
+    'stepper-ui':         import('./components/stepper/stepper.js').UIStepper;
+    'stream-ui':          import('./components/stream/stream.js').UIStream;
+    'swatch-ui':          import('./components/swatch/swatch.js').UISwatch;
+    'swiper-ui':          import('./components/swiper/swiper.js').UISwiper;
+    'table-ui':           import('./components/table/table.js').UITable;
+    'table-toolbar-ui':   import('./components/table-toolbar/table-toolbar.js').UITableToolbar;
+    'tabs-ui':            import('./components/tabs/tabs.js').UITabs;
+    'tag-ui':             import('./components/tag/tag.js').UITag;
+    'text-ui':            import('./components/text/text.js').UIText;
+    'timeline-ui':        import('./components/timeline/timeline.js').UITimeline;
+    'toast-ui':           import('./components/toast/toast.js').UIToast;
+    'toggle-group-ui':    import('./components/toggle-group/toggle-group.js').UIToggleGroup;
+    'toggle-scheme-ui':   import('./components/toggle-scheme/toggle-scheme.js').UIToggleScheme;
+    'toolbar-ui':         import('./components/toolbar/toolbar.js').UIToolbar;
+    'tooltip-ui':         import('./components/tooltip/tooltip.js').UITooltip;
+    'tree-ui':            import('./components/tree/tree.js').UITree;
+  }
+}

package/package.json

@@ -1,15 +1,32 @@
 {
   "name": "@adia-ai/web-components",
-  "version": "0.4.5",
+  "version": "0.4.7",
   "description": "AdiaUI web components — vanilla custom elements. A2UI runtime (renderer, registry, streams, wiring) lives in @adia-ai/a2ui-runtime.",
   "type": "module",
+  "types": "./index.d.ts",
   "exports": {
-    ".": "./index.js",
+    ".": {
+      "types": "./index.d.ts",
+      "default": "./index.js"
+    },
     "./css": "./index.css",
-    "./core": "./core/index.js",
-    "./core/*": "./core/*.js",
+    "./core": {
+      "types": "./core/index.d.ts",
+      "default": "./core/index.js"
+    },
+    "./core/*": {
+      "types": "./core/*.d.ts",
+      "default": "./core/*.js"
+    },
     "./components": "./components/index.js",
-    "./components/*": "./components/*/*.js",
+    "./components/*": {
+      "types": "./components/*/*.d.ts",
+      "default": "./components/*/*.js"
+    },
+    "./components/*/class": {
+      "types": "./components/*/*.d.ts",
+      "default": "./components/*/class.js"
+    },
     "./components/*.css": "./components/*/*.css",
     "./styles/*": "./styles/*",
     "./traits": "./traits/index.js",
@@ -29,7 +46,9 @@
     "!traits/**/*.examples.js",
     "!traits/_api-table.js",
     "index.js",
-    "index.css"
+    "index.css",
+    "index.d.ts",
+    "USAGE.md"
   ],
   "sideEffects": [
     "*.css",

package/traits/CATEGORIES.md

@@ -4,7 +4,7 @@
 
 **56 traits across 9 categories.**
 
-Traits are cross-cutting capabilities — orthogonal to the 93 primitives. Any primitive can opt into any trait by adding `data-*` attributes; traits hydrate via `defineTrait()` calls in the trait's `<name>.js`.
+Traits are cross-cutting capabilities — orthogonal to the 95 primitives. Any primitive can opt into any trait by adding `data-*` attributes; traits hydrate via `defineTrait()` calls in the trait's `<name>.js`.
 
 ## At a glance