@adia-ai/web-components 0.0.2 → 0.0.3

package/components/skeleton/skeleton.js

@@ -11,7 +11,7 @@
  * Radius: none, sm (default), md, lg, full
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaSkeleton extends AdiaElement {
   static properties = {

package/components/slider/slider.js

@@ -6,7 +6,7 @@
  *   [====fill====●─────────────────track──────]
  */
 
-import { AdiaFormElement } from '@core/form.js';
+import { AdiaFormElement } from '../../core/form.js';
 
 class AdiaSlider extends AdiaFormElement {
   static properties = {

package/components/stack/stack.js

@@ -5,7 +5,7 @@
  * <stack-ui align="center">...</stack-ui>
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaStack extends AdiaElement {
   static properties = {

package/components/stat/stat.js

@@ -8,7 +8,7 @@
  * Trend: up, down, neutral (colors the change badge accordingly)
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaStat extends AdiaElement {
   static properties = {

package/components/stepper/stepper.js

@@ -20,7 +20,7 @@
  *   orientation — horizontal (default) | vertical
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaStepper extends AdiaElement {
   static properties = {

package/components/stream/stream.js

@@ -18,7 +18,7 @@
  *   stream-error  — stream error (detail: { error })
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaStream extends AdiaElement {
   static properties = {

package/components/swiper/swiper.js

@@ -20,7 +20,7 @@
  *   autoplay-resume
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaSwiper extends AdiaElement {
   static properties = {

package/components/switch/switch.js

@@ -3,8 +3,8 @@
  * Pure CSS track + thumb, no native <input>.
  */
 
-import { AdiaFormElement } from '@core/form.js';
-import { html } from '@core/element.js';
+import { AdiaFormElement } from '../../core/form.js';
+import { html } from '../../core/element.js';
 
 class AdiaSwitch extends AdiaFormElement {
   static properties = {

package/components/table/table.js

@@ -36,7 +36,7 @@
  *   cell-click — { detail: { key, row, value, dataIndex } }
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 import { cellTypes, sortFns } from './cell-types.js';
 
 // ── Helpers ──────────────────────────────────────────────────────────────────

package/components/tabs/tab.js

@@ -7,7 +7,7 @@
  * The tab button is rendered by the parent tabs-ui, not by tab-ui itself.
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaTab extends AdiaElement {
   static properties = {

package/components/tabs/tabs.js

@@ -14,7 +14,7 @@
  *   ArrowLeft / ArrowRight to navigate tabs
  */
 
-import { AdiaElement, html } from '@core/element.js';
+import { AdiaElement, html } from '../../core/element.js';
 import '@components/tabs/tab.js';
 
 class AdiaTabs extends AdiaElement {

package/components/tag/tag.js

@@ -11,7 +11,7 @@
  *   remove — { detail: { text, value } } fired when dismiss is clicked
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaTag extends AdiaElement {
   static properties = {

package/components/text/text.js

@@ -11,7 +11,7 @@
  *   lines    — multi-line clamp count (0 = no clamp)
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaText extends AdiaElement {
   static properties = {

package/components/textarea/textarea.js

@@ -4,7 +4,7 @@
  * No native <textarea> inside.
  */
 
-import { AdiaFormElement } from '@core/form.js';
+import { AdiaFormElement } from '../../core/form.js';
 
 class AdiaTextarea extends AdiaFormElement {
   static properties = {

package/components/timeline/timeline.js

@@ -40,7 +40,7 @@
  *   .outcomes = string[]    // renders an expandable sub-list under the row
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 // ── Container ──────────────────────────────────────────────────
 

package/components/toast/toast.js

@@ -14,7 +14,7 @@
  *   close — fired after the toast finishes its exit animation
  */
 
-import { AdiaElement, html } from '@core/element.js';
+import { AdiaElement, html } from '../../core/element.js';
 
 class AdiaToast extends AdiaElement {
   #timer = null;

package/components/toggle-group/toggle-group.js

@@ -12,7 +12,7 @@
  *   single — restrict to one active option at a time (default false: multi-select)
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 // ── Toggle Option ──
 //

package/components/toolbar/toolbar.js

@@ -20,8 +20,8 @@
  * Platform: Popover API (top-layer) + CSS Anchor Positioning via @core/anchor.js.
  */
 
-import { AdiaElement } from '@core/element.js';
-import { anchorPopover } from '@core/anchor.js';
+import { AdiaElement } from '../../core/element.js';
+import { anchorPopover } from '../../core/anchor.js';
 
 const SPILLOVER_ATTR = 'data-toolbar-spillover';
 const SPILLOVER_MENU_ATTR = 'data-toolbar-spillover-menu';

package/components/tooltip/tooltip.js

@@ -10,8 +10,8 @@
  * No click interaction — hover/focus only.
  */
 
-import { AdiaElement } from '@core/element.js';
-import { anchorPopover } from '@core/anchor.js';
+import { AdiaElement } from '../../core/element.js';
+import { anchorPopover } from '../../core/anchor.js';
 
 class AdiaTooltip extends AdiaElement {
   static properties = {

package/components/tree/tree.js

@@ -19,7 +19,7 @@
  *   tree-select — fired on tree-ui when an item is selected (detail: { item, text, value })
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaTree extends AdiaElement {
   static template = () => null;

package/components/upload/upload.js

@@ -4,7 +4,7 @@
  * Form-associated via AdiaFormElement + ElementInternals.
  */
 
-import { AdiaFormElement } from '@core/form.js';
+import { AdiaFormElement } from '../../core/form.js';
 
 class AdiaUpload extends AdiaFormElement {
   static properties = {

package/core/markdown.js

@@ -4,7 +4,7 @@
  * No dependencies. ~80 lines.
  *
  * Usage:
- *   import { renderMarkdown } from '@core/markdown.js';
+ *   import { renderMarkdown } from './markdown.js';
  *   element.innerHTML = renderMarkdown(text);
  */
 

package/core/provider.js

@@ -22,8 +22,8 @@
  *   ctrl.commands.navigate('/about');
  */
 
-import { AdiaElement } from '@core/element.js';
-import { BaseController } from '@core/controller.js';
+import { AdiaElement } from './element.js';
+import { BaseController } from './controller.js';
 
 // ═══════════════════════════════════════════════════════════════
 // NANO PROVIDER (inline — tiny base class)

package/package.json

@@ -1,13 +1,14 @@
 {
   "name": "@adia-ai/web-components",
-  "version": "0.0.2",
-  "description": "AdiaUI web components — vanilla custom elements + A2UI runtime. Training corpus lives in @adia-ai/gen-ui-training.",
+  "version": "0.0.3",
+  "description": "AdiaUI web components — vanilla custom elements. A2UI runtime (renderer, registry, streams, wiring) lives in @adia-ai/a2ui-utils.",
   "type": "module",
   "exports": {
     ".":         "./index.js",
     "./css":     "./index.css",
     "./a2ui":    "./a2ui/index.js",
-    "./core":    "./core/index.js"
+    "./core":    "./core/index.js",
+    "./patterns": "./patterns/index.js"
   },
   "files": [
     "core/",
@@ -26,6 +27,9 @@
     "./patterns/**/*.js",
     "./core/provider.js"
   ],
+  "dependencies": {
+    "@adia-ai/a2ui-utils": "^0.0.1"
+  },
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org"

package/patterns/a2ui-root/a2ui-root.a2ui.json

@@ -0,0 +1,118 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://adiaui.dev/a2ui/v0_9/components/A2UIRoot.json",
+  "title": "A2UIRoot",
+  "description": "A2UI protocol surface. Connects to a stream source (SSE, WebSocket, JSONL, MCP) and renders A2UI messages as AdiaUI components via the `@adia-ai/a2ui-utils` renderer.",
+  "type": "object",
+  "allOf": [
+    {
+      "$ref": "common_types.json#/$defs/ComponentCommon"
+    },
+    {
+      "$ref": "common_types.json#/$defs/CatalogComponentCommon"
+    }
+  ],
+  "properties": {
+    "active": {
+      "description": "True while the stream is connected and receiving messages.",
+      "type": "boolean",
+      "default": false
+    },
+    "batch": {
+      "description": "Batch renderer updates via requestAnimationFrame for large fan-in.",
+      "type": "boolean",
+      "default": false
+    },
+    "component": {
+      "const": "A2UIRoot"
+    },
+    "loading": {
+      "description": "True while the stream is connecting.",
+      "type": "boolean",
+      "default": false
+    },
+    "src": {
+      "description": "Stream source URL (endpoint for SSE/WebSocket, file path for JSONL, tool-call target for MCP).",
+      "type": "string",
+      "default": ""
+    },
+    "transport": {
+      "description": "Stream transport to use.",
+      "type": "string",
+      "enum": [
+        "sse",
+        "ws",
+        "websocket",
+        "jsonl",
+        "mcp"
+      ],
+      "default": "sse"
+    }
+  },
+  "required": [
+    "component"
+  ],
+  "unevaluatedProperties": false,
+  "x-adiaui": {
+    "anti_patterns": [],
+    "category": "container",
+    "events": {
+      "a2ui-action": {
+        "description": "Fired when a child element with [data-action] is clicked. detail: { name, sourceComponentId, context }"
+      },
+      "a2ui-closed": {
+        "description": "Fired when the stream ends."
+      },
+      "a2ui-connected": {
+        "description": "Fired when the stream is established."
+      },
+      "a2ui-error": {
+        "description": "Fired when the stream errors. detail: { error }"
+      },
+      "a2ui-message": {
+        "description": "Fired for each A2UI message received. detail: { message }"
+      }
+    },
+    "examples": [],
+    "keywords": [
+      "a2ui",
+      "protocol",
+      "renderer",
+      "stream",
+      "surface",
+      "sse",
+      "websocket",
+      "jsonl",
+      "mcp"
+    ],
+    "name": "AdiaA2UIRoot",
+    "related": [
+      "canvas",
+      "inspector"
+    ],
+    "slots": {
+      "default": {
+        "description": "The rendered surface. Children are stamped by the A2UI renderer."
+      }
+    },
+    "states": [
+      {
+        "description": "Default, ready to connect.",
+        "name": "idle"
+      },
+      {
+        "description": "Stream is connecting.",
+        "name": "loading"
+      },
+      {
+        "description": "Stream is connected and receiving messages.",
+        "name": "active"
+      }
+    ],
+    "synonyms": {},
+    "tag": "a2ui-root",
+    "tokens": {},
+    "traits": [],
+    "version": 1
+  }
+}

package/{a2ui/root.js → patterns/a2ui-root/a2ui-root.js}

@@ -13,10 +13,15 @@
  *   a2ui-action    — user interaction (detail: { name, sourceComponentId, context })
  */
 
-import { AdiaElement } from '@core/element.js';
-import { A2UIRenderer } from './renderer.js';
-import { registry } from './registry.js';
-import { sseStream, wsStream, jsonlStream, mcpStream } from './stream.js';
+import { AdiaElement } from '../../core/element.js';
+import {
+  A2UIRenderer,
+  registry,
+  sseStream,
+  wsStream,
+  jsonlStream,
+  mcpStream,
+} from '@adia-ai/a2ui-utils';
 
 class AdiaA2UIRoot extends AdiaElement {
   static properties = {

package/patterns/a2ui-root/a2ui-root.yaml

@@ -0,0 +1,76 @@
+# Edit this file; run `npm run build:components` to regenerate a2ui.json.
+$schema: ../../../../scripts/schemas/component.yaml.schema.json
+name: AdiaA2UIRoot
+tag: a2ui-root
+component: A2UIRoot
+category: container
+version: 1
+description: A2UI protocol surface. Connects to a stream source (SSE, WebSocket, JSONL, MCP) and renders A2UI messages as AdiaUI components via the `@adia-ai/a2ui-utils` renderer.
+props:
+  src:
+    description: Stream source URL (endpoint for SSE/WebSocket, file path for JSONL, tool-call target for MCP).
+    type: string
+    default: ""
+  transport:
+    description: Stream transport to use.
+    type: string
+    default: sse
+    enum:
+      - sse
+      - ws
+      - websocket
+      - jsonl
+      - mcp
+  loading:
+    description: True while the stream is connecting.
+    type: boolean
+    default: false
+    reflect: true
+  active:
+    description: True while the stream is connected and receiving messages.
+    type: boolean
+    default: false
+    reflect: true
+  batch:
+    description: Batch renderer updates via requestAnimationFrame for large fan-in.
+    type: boolean
+    default: false
+events:
+  a2ui-connected:
+    description: Fired when the stream is established.
+  a2ui-message:
+    description: "Fired for each A2UI message received. detail: { message }"
+  a2ui-action:
+    description: "Fired when a child element with [data-action] is clicked. detail: { name, sourceComponentId, context }"
+  a2ui-error:
+    description: "Fired when the stream errors. detail: { error }"
+  a2ui-closed:
+    description: Fired when the stream ends.
+slots:
+  default:
+    description: The rendered surface. Children are stamped by the A2UI renderer.
+states:
+  - name: idle
+    description: Default, ready to connect.
+  - name: loading
+    description: Stream is connecting.
+  - name: active
+    description: Stream is connected and receiving messages.
+traits: []
+tokens: {}
+a2ui:
+  rules: []
+anti_patterns: []
+keywords:
+  - a2ui
+  - protocol
+  - renderer
+  - stream
+  - surface
+  - sse
+  - websocket
+  - jsonl
+  - mcp
+related:
+  - canvas
+  - inspector

package/patterns/adia-chat/adia-chat.js

@@ -1,6 +1,6 @@
-import { AdiaElement } from '@core/element.js';
-import { renderMarkdown } from '@core/markdown.js';
-import { streamChat } from '@llm/index.js';
+import { AdiaElement } from '../../core/element.js';
+import { renderMarkdown } from '../../core/markdown.js';
+import { streamChat } from '../../../gen-ui/llm/adapters/index.js';
 
 function escapeHTML(s) {
   return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');

package/patterns/adia-editor/adia-editor.js

@@ -1,4 +1,4 @@
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 /**
  * <adia-editor-ui> — Editor layout pattern.

package/patterns/app-nav/app-nav.js

@@ -15,7 +15,7 @@
  * Event: nav-select (detail: { item, text, value })
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaAppNav extends AdiaElement {
   static properties = {

package/patterns/app-nav-group/app-nav-group.js

@@ -6,8 +6,8 @@
  * popover with its children instead of toggling inline expansion.
  */
 
-import { AdiaElement } from '@core/element.js';
-import { anchorPopover } from '@core/anchor.js';
+import { AdiaElement } from '../../core/element.js';
+import { anchorPopover } from '../../core/anchor.js';
 
 class AdiaAppNavGroup extends AdiaElement {
   static properties = {

package/patterns/app-nav-item/app-nav-item.js

@@ -6,7 +6,7 @@
  * a side-effect of calling nav.select(item) or user click.
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaAppNavItem extends AdiaElement {
   static properties = {

package/patterns/app-shell/app-shell.js

@@ -19,7 +19,7 @@
  * sticky headers, scroll containment, mode composition.
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 const SNAP_THRESHOLD = 96;
 const SNAP_MIN_USABLE = 160;

package/patterns/gen-ui/gen-ui.js

@@ -1,4 +1,4 @@
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 import '../../components/chat/chat.js';
 import '../../components/canvas/canvas.js';
 import '../../components/inspector/inspector.js';

package/patterns/index.js

@@ -8,3 +8,4 @@ export { AdiaSectionNavItem } from './section-nav-item/section-nav-item.js';
 export { AdiaGenUI }          from './gen-ui/gen-ui.js';
 export { AdiaChatElement }    from './adia-chat/adia-chat.js';
 export { AdiaEditorElement }  from './adia-editor/adia-editor.js';
+export { AdiaA2UIRoot }       from './a2ui-root/a2ui-root.js';

package/patterns/section-nav/section-nav.js

@@ -7,7 +7,7 @@
  * Event: nav-select (bubbles from items). detail: { item, text, value }
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaSectionNav extends AdiaElement {
   static properties = {

package/patterns/section-nav-group/section-nav-group.js

@@ -4,7 +4,7 @@
  * that emits `group-toggle` (detail: { text, open }).
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaSectionNavGroup extends AdiaElement {
   static properties = {

package/patterns/section-nav-item/section-nav-item.js

@@ -5,7 +5,7 @@
  * Event: nav-select. detail: { item, text, value }
  */
 
-import { AdiaElement } from '@core/element.js';
+import { AdiaElement } from '../../core/element.js';
 
 class AdiaSectionNavItem extends AdiaElement {
   static properties = {

package/traits/define.js

@@ -4,7 +4,7 @@
  * A trait is a reusable behavior package: event listeners, attribute management,
  * and cleanup — defined once, attached to any element.
  *
- *   import { defineTrait } from '@traits/define.js';
+ *   import { defineTrait } from './define.js';
  *
  *   export const pressable = defineTrait({
  *     name: 'pressable',