@adia-ai/web-modules 0.2.5 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -11,6 +11,38 @@ Built from `@adia-ai/web-components` primitives.
|
|
|
11
11
|
|
|
12
12
|
_No pending changes._
|
|
13
13
|
|
|
14
|
+
## [0.3.0] - 2026-05-05
|
|
15
|
+
|
|
16
|
+
**9-package lockstep cut + chat-shell now uses `@adia-ai/llm`.** All 9 published `@adia-ai/*` packages bump 0.2.5 → 0.3.0 per [`docs/specs/package-architecture.md` § 15](../../docs/specs/package-architecture.md#15-versioning-policy). Internal `@adia-ai/*` dep ranges bump `^0.2.0` → `^0.3.0`.
|
|
17
|
+
|
|
18
|
+
This is a **minor cut on top of v0.2.5 with one BREAKING install change**: `@adia-ai/web-modules` now declares `@adia-ai/llm` as a peer dependency. Consumers using `<chat-shell>` (or any LLM-capable composite from this package) must install `@adia-ai/llm` alongside this package.
|
|
19
|
+
|
|
20
|
+
### Changed
|
|
21
|
+
|
|
22
|
+
- **`<chat-shell>` chat-input now imports `streamChat` from `@adia-ai/llm`** instead of `@adia-ai/a2ui-compose/llm`. No behavior change at the chat-shell API surface (same `provider`/`model`/`messages` props, same chunk-stream events). Internal — but consumer-visible because `peerDependencies` changed.
|
|
23
|
+
- **Proxy mode now works correctly.** When `<chat-shell>` is configured with `proxy-url="/api/chat"` (or any proxy URL), the request body now includes `provider` so the proxy routes to the right upstream. Previously, OpenAI/Gemini requests through proxy mode silently routed to Anthropic and 404'd. The `Authorization: Bearer undefined` header that appeared in proxy-mode requests (when `apiKey` was absent) is also gone.
|
|
24
|
+
- `peerDependencies["@adia-ai/llm"]`: NEW, `^0.3.0`.
|
|
25
|
+
- `peerDependencies["@adia-ai/web-components"]`: `^0.2.0` → `^0.3.0`.
|
|
26
|
+
- `peerDependencies["@adia-ai/a2ui-utils"]` removed; replaced by `peerDependencies["@adia-ai/a2ui-runtime"]: ^0.3.0` (rename + bump).
|
|
27
|
+
- `version`: `0.2.5` → `0.3.0`.
|
|
28
|
+
|
|
29
|
+
### Migration
|
|
30
|
+
|
|
31
|
+
Update `package.json`:
|
|
32
|
+
|
|
33
|
+
```diff
|
|
34
|
+
{
|
|
35
|
+
"peerDependencies": {
|
|
36
|
+
"@adia-ai/web-components": "^0.3.0",
|
|
37
|
+
- "@adia-ai/a2ui-utils": "^0.2.0"
|
|
38
|
+
+ "@adia-ai/a2ui-runtime": "^0.3.0",
|
|
39
|
+
+ "@adia-ai/llm": "^0.3.0"
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
Then `npm install` (or pnpm). Imports of `<chat-shell>` itself don't change. Direct imports of `streamChat` from this package were never a public surface — they remain available indirectly via `@adia-ai/llm`.
|
|
45
|
+
|
|
14
46
|
## [0.2.5] - 2026-05-04
|
|
15
47
|
|
|
16
48
|
**8-package lockstep cut.** All 8 published `@adia-ai/*` packages bump 0.2.4 → 0.2.5 per [`docs/specs/package-architecture.md` § 15](../../docs/specs/package-architecture.md#15-versioning-policy). Internal `@adia-ai/*` dep ranges remain at `^0.2.0` (covers 0.2.5 under semver — patch-cut asymmetry).
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { UIElement } from '../../../web-components/core/element.js';
|
|
2
2
|
import { renderMarkdown } from '../../../web-components/core/markdown.js';
|
|
3
|
-
import { streamChat } from '../../../
|
|
3
|
+
import { streamChat } from '../../../llm/index.js';
|
|
4
4
|
|
|
5
5
|
function escapeHTML(s) {
|
|
6
6
|
return s.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@adia-ai/web-modules",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "AdiaUI composite custom elements \u2014 shell, chat, editor, runtime clusters built from @adia-ai/web-components primitives. Subpath exports per cluster.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"exports": {
|
|
@@ -33,8 +33,9 @@
|
|
|
33
33
|
"./runtime/**/*.js"
|
|
34
34
|
],
|
|
35
35
|
"peerDependencies": {
|
|
36
|
-
"@adia-ai/web-components": "^0.
|
|
37
|
-
"@adia-ai/a2ui-
|
|
36
|
+
"@adia-ai/web-components": "^0.3.0",
|
|
37
|
+
"@adia-ai/a2ui-runtime": "^0.3.0",
|
|
38
|
+
"@adia-ai/llm": "^0.3.0"
|
|
38
39
|
},
|
|
39
40
|
"publishConfig": {
|
|
40
41
|
"access": "public",
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
<header>
|
|
2
|
+
<div>
|
|
3
|
+
<h1>Admin Shell</h1>
|
|
4
|
+
<div data-actions>
|
|
5
|
+
<tag-ui size="sm">admin-shell</tag-ui>
|
|
6
|
+
</div>
|
|
7
|
+
</div>
|
|
8
|
+
<p>Behavior-only application shell. Wires sidebar toggles, resize handles, a Cmd+K command palette, and a ResizeObserver that drives responsive sidebar collapse. The shell binds interactions; the consumer supplies the DOM. The docs site you're reading runs inside one.</p>
|
|
9
|
+
</header>
|
|
10
|
+
|
|
11
|
+
<section data-section>
|
|
12
|
+
<h2 variant="section">Basic shape</h2>
|
|
13
|
+
<p data-note>Author supplies the DOM (sidebars + main column + optional command dialog); the shell binds the interactions.</p>
|
|
14
|
+
<code-ui language="html"><admin-shell mode="rounded">
|
|
15
|
+
<aside data-sidebar="leading">
|
|
16
|
+
<header>…</header>
|
|
17
|
+
<section>
|
|
18
|
+
<nav-ui>…</nav-ui>
|
|
19
|
+
</section>
|
|
20
|
+
<footer>…</footer>
|
|
21
|
+
<div data-resize></div>
|
|
22
|
+
</aside>
|
|
23
|
+
|
|
24
|
+
<main>
|
|
25
|
+
<header>
|
|
26
|
+
<button-ui data-sidebar-toggle="leading" icon="sidebar" variant="ghost" size="sm"></button-ui>
|
|
27
|
+
<breadcrumb-ui>…</breadcrumb-ui>
|
|
28
|
+
</header>
|
|
29
|
+
<section>
|
|
30
|
+
<router-ui></router-ui>
|
|
31
|
+
</section>
|
|
32
|
+
<footer>
|
|
33
|
+
<span>Footer</span>
|
|
34
|
+
</footer>
|
|
35
|
+
</main>
|
|
36
|
+
|
|
37
|
+
<dialog data-command>
|
|
38
|
+
<command-ui placeholder="Search..."></command-ui>
|
|
39
|
+
</dialog>
|
|
40
|
+
</admin-shell></code-ui>
|
|
41
|
+
</section>
|
|
42
|
+
|
|
43
|
+
<section data-section>
|
|
44
|
+
<h2 variant="section">Properties</h2>
|
|
45
|
+
<table>
|
|
46
|
+
<thead><tr><th>Prop</th><th>Type</th><th>Default</th><th>Description</th></tr></thead>
|
|
47
|
+
<tbody>
|
|
48
|
+
<tr><td><code>mode</code></td><td>string</td><td>—</td><td>Layout variant: <code>rounded</code> (softens edges), <code>borderless</code> (removes outer chrome). Empty is the default bordered surface. Multiple values allowed (e.g. <code>"rounded borderless"</code>).</td></tr>
|
|
49
|
+
</tbody>
|
|
50
|
+
</table>
|
|
51
|
+
</section>
|
|
52
|
+
|
|
53
|
+
<section data-section>
|
|
54
|
+
<h2 variant="section">Behavior wiring</h2>
|
|
55
|
+
<table>
|
|
56
|
+
<thead><tr><th>Affordance</th><th>Author markup</th><th>What the shell does</th></tr></thead>
|
|
57
|
+
<tbody>
|
|
58
|
+
<tr><td>Sidebar toggle</td><td><code>[data-sidebar-toggle="leading"]</code> / <code>[data-sidebar-toggle="trailing"]</code></td><td>Click flips <code>[data-collapsed]</code> on the corresponding aside. Persists in <code>localStorage</code>.</td></tr>
|
|
59
|
+
<tr><td>Sidebar resize</td><td><code><div data-resize></div></code> inside the sidebar</td><td>Pointer-drag resizes the aside; bounded by <code>leading-min/max-width</code> attrs. Snaps below threshold to collapsed.</td></tr>
|
|
60
|
+
<tr><td>Command palette</td><td><code><dialog data-command></code> + shell <code>[cmd-k]</code></td><td><code>Cmd+K</code> / <code>Ctrl+K</code> calls <code>showModal()</code>. Forwards <code>command-select</code> events from the inner <code><command-ui></code>.</td></tr>
|
|
61
|
+
<tr><td>Responsive collapse</td><td>(automatic)</td><td>ResizeObserver collapses sidebars when viewport drops below the breakpoint; restores on widen.</td></tr>
|
|
62
|
+
</tbody>
|
|
63
|
+
</table>
|
|
64
|
+
</section>
|
|
65
|
+
|
|
66
|
+
<section data-section>
|
|
67
|
+
<h2 variant="section">Events</h2>
|
|
68
|
+
<table>
|
|
69
|
+
<thead><tr><th>Event</th><th>Detail</th><th>Fires when</th></tr></thead>
|
|
70
|
+
<tbody>
|
|
71
|
+
<tr><td><code>sidebar-toggle</code></td><td><code>{ sidebar, expanded }</code></td><td>A sidebar is collapsed or expanded (toggle button, snap, or programmatic).</td></tr>
|
|
72
|
+
<tr><td><code>sidebar-resize</code></td><td><code>{ sidebar, width }</code></td><td>As a sidebar is dragged. Debounced on the trailing edge.</td></tr>
|
|
73
|
+
<tr><td><code>command-select</code></td><td><code>{ value }</code></td><td>Forwarded from the inner command palette when an option is chosen.</td></tr>
|
|
74
|
+
</tbody>
|
|
75
|
+
</table>
|
|
76
|
+
</section>
|
|
77
|
+
|
|
78
|
+
<section data-section>
|
|
79
|
+
<h2 variant="section">JS API</h2>
|
|
80
|
+
<code-ui language="js">const shell = document.querySelector('admin-shell');
|
|
81
|
+
|
|
82
|
+
shell.toggleLeading(); // collapse / expand the leading sidebar
|
|
83
|
+
shell.toggleTrailing(); // collapse / expand the trailing sidebar
|
|
84
|
+
shell.openCommand(); // open the Cmd+K dialog
|
|
85
|
+
shell.closeCommand(); // close it</code-ui>
|
|
86
|
+
</section>
|
|
87
|
+
|
|
88
|
+
<section data-section>
|
|
89
|
+
<h2 variant="section">Slot vocabulary inside the shell</h2>
|
|
90
|
+
<p>
|
|
91
|
+
Both authoring shapes are valid simultaneously. The legacy
|
|
92
|
+
raw-HTML form (<code>aside[data-sidebar]</code>,
|
|
93
|
+
<code>main > header</code>, etc.) keeps working unchanged;
|
|
94
|
+
consumers can also use the
|
|
95
|
+
<a href="/site/components/aside">aside-ui</a> /
|
|
96
|
+
<a href="/site/components/header">header-ui</a> /
|
|
97
|
+
<a href="/site/components/section">section-ui</a> /
|
|
98
|
+
<a href="/site/components/footer">footer-ui</a> slot vocabulary.
|
|
99
|
+
Both render identically — the shell's CSS lifts each structural
|
|
100
|
+
selector into <code>:is(legacy, slot-ui)</code> form, and the JS-
|
|
101
|
+
side wiring (<code>#sidebarName</code>) reads from either
|
|
102
|
+
<code>data-sidebar</code> or <code>slot</code>. See
|
|
103
|
+
<a href="/site/reference/decisions">ADR-0011</a> for the migration
|
|
104
|
+
rationale.
|
|
105
|
+
</p>
|
|
106
|
+
<code-ui language="html"><!-- Slot-vocabulary equivalent of the structure shown above -->
|
|
107
|
+
<admin-shell mode="rounded">
|
|
108
|
+
<aside-ui slot="leading">
|
|
109
|
+
<header-ui>…</header-ui>
|
|
110
|
+
<section-ui>
|
|
111
|
+
<nav-ui>…</nav-ui>
|
|
112
|
+
</section-ui>
|
|
113
|
+
<footer-ui>…</footer-ui>
|
|
114
|
+
<div data-resize></div>
|
|
115
|
+
</aside-ui>
|
|
116
|
+
|
|
117
|
+
<main>
|
|
118
|
+
<header-ui>…</header-ui>
|
|
119
|
+
<section-ui>
|
|
120
|
+
<router-ui></router-ui>
|
|
121
|
+
</section-ui>
|
|
122
|
+
<footer-ui>…</footer-ui>
|
|
123
|
+
</main>
|
|
124
|
+
</admin-shell></code-ui>
|
|
125
|
+
</section>
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en" data-theme="auto">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
+
<title>Admin Shell — AdiaUI</title>
|
|
7
|
+
|
|
8
|
+
<!-- Token base -->
|
|
9
|
+
<link rel="stylesheet" href="../../../web-components/styles/resets.css">
|
|
10
|
+
<link rel="stylesheet" href="../../../web-components/styles/tokens.css">
|
|
11
|
+
|
|
12
|
+
<!-- Component CSS -->
|
|
13
|
+
<link rel="stylesheet" href="./admin-shell.css">
|
|
14
|
+
<link rel="stylesheet" href="../../../web-components/components/code/code.css">
|
|
15
|
+
<link rel="stylesheet" href="../../../web-components/components/tag/tag.css">
|
|
16
|
+
|
|
17
|
+
<!-- Component JS -->
|
|
18
|
+
<script type="module" src="./admin-shell.js"></script>
|
|
19
|
+
<script type="module" src="../../../web-components/components/code/code.js"></script>
|
|
20
|
+
<script type="module" src="../../../web-components/components/tag/tag.js"></script>
|
|
21
|
+
|
|
22
|
+
<style>
|
|
23
|
+
:where(html, body) { margin: 0; min-height: 100vh; background: var(--a-bg); color: var(--a-fg); font-family: var(--a-font); }
|
|
24
|
+
main { max-width: 960px; margin-inline: auto; padding: var(--a-space-6) var(--a-space-5); }
|
|
25
|
+
</style>
|
|
26
|
+
</head>
|
|
27
|
+
<body>
|
|
28
|
+
|
|
29
|
+
<main id="demo-root">
|
|
30
|
+
<p>Loading examples…</p>
|
|
31
|
+
</main>
|
|
32
|
+
|
|
33
|
+
<script type="module">
|
|
34
|
+
const root = document.getElementById('demo-root');
|
|
35
|
+
try {
|
|
36
|
+
const res = await fetch('./admin-shell.examples.html');
|
|
37
|
+
if (!res.ok) throw new Error(`fetch failed (${res.status})`);
|
|
38
|
+
root.innerHTML = await res.text();
|
|
39
|
+
} catch (err) {
|
|
40
|
+
root.innerHTML = `<p style="color:var(--a-danger-strong);">Failed to load admin-shell.examples.html — ${err.message}</p>`;
|
|
41
|
+
console.error('[admin-shell.html]', err);
|
|
42
|
+
}
|
|
43
|
+
</script>
|
|
44
|
+
|
|
45
|
+
</body>
|
|
46
|
+
</html>
|