@adia-ai/web-modules 0.8.25 → 0.8.26

package/index.js

@@ -20,3 +20,4 @@ export * from './dashboard/index.js';
 export * from './feedback/index.js';
 export * from './billing/index.js';
 export * from './settings/index.js';
+export * from './agent-admin/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adia-ai/web-modules",
-  "version": "0.8.25",
+  "version": "0.8.26",
   "description": "AdiaUI composite custom elements — shell, chat, editor, runtime clusters built from @adia-ai/web-components primitives. Subpath exports per cluster.",
   "type": "module",
   "exports": {
@@ -217,6 +217,20 @@
       "types": "./css-module.d.ts",
       "default": "./form/*/*.css"
     },
+    "./agent-admin": {
+      "types": "./agent-admin/index.d.ts",
+      "import": "./agent-admin/index.js",
+      "default": "./agent-admin/index.js"
+    },
+    "./agent-admin/*": {
+      "types": "./agent-admin/*/*.d.ts",
+      "import": "./agent-admin/*/*.js",
+      "default": "./agent-admin/*/*.js"
+    },
+    "./agent-admin/*.css": {
+      "types": "./css-module.d.ts",
+      "default": "./agent-admin/*/*.css"
+    },
     "./package.json": "./package.json"
   },
   "files": [
@@ -253,6 +267,10 @@
     "!form/**/*.examples.html",
     "!form/**/*.examples.js",
     "!form/**/*.html",
+    "agent-admin/",
+    "!agent-admin/**/*.examples.html",
+    "!agent-admin/**/*.examples.js",
+    "!agent-admin/**/*.html",
     "!**/*.test.js",
     "index.js",
     "css-module.d.ts",
@@ -267,12 +285,15 @@
     "./chat/**/*.js",
     "./editor/**/*.js",
     "./runtime/**/*.js",
-    "./theme/**/*.js"
+    "./theme/**/*.js",
+    "./agent-admin/**/*.js"
   ],
   "peerDependencies": {
-    "@adia-ai/web-components": "0.8.25",
-    "@adia-ai/a2ui-runtime": "0.8.25",
-    "@adia-ai/llm": "0.8.25"
+    "@adia-ai/web-components": "0.8.26",
+    "@adia-ai/a2ui-runtime": "0.8.26",
+    "@adia-ai/llm": "0.8.26",
+    "@adia-ai/agent": "0.8.26",
+    "@adia-ai/persona": "0.8.26"
   },
   "publishConfig": {
     "access": "public",

package/theme/theme-panel/theme-panel.js

@@ -439,22 +439,19 @@ class ThemePanel extends UIElement {
     }
     // Apply the theme (which may write [theme] on target)
     this.#apply({ theme: slug }, 'theme');
-    // Then re-read computed values into sliders on next frame, so the
-    // theme's [theme] block has taken effect.
-    const sync = () => {
-      const cs = getComputedStyle(target);
-      const density = parseFloat(cs.getPropertyValue('--a-density')) || 1;
-      const radius = parseFloat(cs.getPropertyValue('--a-radius-k')) || 1;
-      if (this.#densityEl) this.#densityEl.value = density;
-      if (this.#radiusEl) this.#radiusEl.value = radius;
-      this.activeDensity = String(density);
-      this.activeRadius = String(radius);
-    };
-    if (typeof requestAnimationFrame === 'function') {
-      requestAnimationFrame(sync);
-    } else {
-      sync();
-    }
+    // The density/radius overrides were just cleared above, so the panel
+    // holds no override — same "no override" state reset() and the
+    // "default" preset represent by showing 1×/1×, regardless of what the
+    // theme's own [theme] block declares for --a-density/--a-radius-k.
+    // The sliders track the panel's OWN applied state (write-only target,
+    // read-only-from-state display), never a getComputedStyle round-trip
+    // off the target — that read was timing-sensitive (needed a
+    // requestAnimationFrame hedge) and could lag or misread scoped
+    // overrides (gh#578).
+    if (this.#densityEl) this.#densityEl.value = 1;
+    if (this.#radiusEl) this.#radiusEl.value = 1;
+    this.activeDensity = '';
+    this.activeRadius = '';
   }
 
   #onPresetClick(name) {
@@ -615,9 +612,7 @@ class ThemePanel extends UIElement {
       this.activeDensity = String(density);
       if (this.#densityEl) this.#densityEl.value = density;
     } else if (this.#densityEl) {
-      // Read computed from target
-      const cs = getComputedStyle(target);
-      const d = parseFloat(cs.getPropertyValue('--a-density')) || 1;
+      const d = this.#readInitialShape(target, '--a-density');
       this.#densityEl.value = d;
       this.activeDensity = String(d);
     }
@@ -627,8 +622,7 @@ class ThemePanel extends UIElement {
       this.activeRadius = String(radius);
       if (this.#radiusEl) this.#radiusEl.value = radius;
     } else if (this.#radiusEl) {
-      const cs = getComputedStyle(target);
-      const r = parseFloat(cs.getPropertyValue('--a-radius-k')) || 1;
+      const r = this.#readInitialShape(target, '--a-radius-k');
       this.#radiusEl.value = r;
       this.activeRadius = String(r);
     }
@@ -642,6 +636,22 @@ class ThemePanel extends UIElement {
     }
   }
 
+  // Initial-connect ONLY (#initState, no persisted value): the panel has no
+  // record of its own yet — [theme] may have been author-set directly in
+  // markup, outside any theme-panel write, so there's no this.activeDensity/
+  // activeRadius to fall back to. Reading the computed first-paint baseline
+  // here is the legitimate exception the framework's write-only-target /
+  // read-only-from-state rule allows (site/pages/patterns/appearance-
+  // settings.html): unlike #onThemeClick (gh#578), this call happens
+  // synchronously during connected(), after the theme attribute this same
+  // method just applied above — no requestAnimationFrame hedge needed, and
+  // the result becomes this.activeDensity/activeRadius, so every
+  // subsequent redraw stays read-only-from-state, never re-derived again.
+  #readInitialShape(target, prop) {
+    const cs = getComputedStyle(target);
+    return parseFloat(cs.getPropertyValue(prop)) || 1;
+  }
+
   // ── Internal — prefers-color-scheme ─────────────────────────────────
 
   #resolvePrefersScheme() {