@adia-ai/web-modules 0.8.19 → 0.8.21

package/shell/admin-command/admin-command.test.js

@@ -1,115 +0,0 @@
-import { describe, it, expect, beforeEach, vi } from 'vitest';
-import '../../../web-components/core/element.js';
-import './admin-command.js';
-
-const tick = () => new Promise((r) => queueMicrotask(r));
-
-function mount(html) {
-  const wrap = document.createElement('div');
-  wrap.innerHTML = html;
-  document.body.appendChild(wrap);
-  return wrap.firstElementChild;
-}
-
-// happy-dom's <dialog> support is partial — showModal/close need to be
-// patched into noops that toggle the .open getter via a flag. The real
-// browser does this natively.
-function patchDialogPolyfill(dialog) {
-  let isOpen = false;
-  Object.defineProperty(dialog, 'open', {
-    get: () => isOpen,
-    set: (v) => { isOpen = !!v; },
-    configurable: true,
-  });
-  dialog.showModal = function () {
-    isOpen = true;
-    this.dispatchEvent(new Event('toggle'));
-  };
-  dialog.close = function () {
-    isOpen = false;
-    this.dispatchEvent(new Event('close'));
-  };
-}
-
-beforeEach(() => {
-  document.body.innerHTML = '';
-});
-
-describe('admin-command', () => {
-  it('registers admin-command as a custom element', () => {
-    expect(customElements.get('admin-command')).toBeDefined();
-  });
-
-  it('defaults to open=false, shortcut="both"', () => {
-    const cmd = mount('<admin-command></admin-command>');
-    expect(cmd.open).toBe(false);
-    expect(cmd.shortcut).toBe('both');
-  });
-
-  it('exposes .show() / .hide() / .toggle() public methods', () => {
-    const cmd = mount('<admin-command></admin-command>');
-    expect(typeof cmd.show).toBe('function');
-    expect(typeof cmd.hide).toBe('function');
-    expect(typeof cmd.toggle).toBe('function');
-  });
-
-  it('reflects [open] when .show() is called', async () => {
-    const cmd = mount('<admin-command></admin-command>');
-    const dialog = cmd.shadowRoot?.querySelector('dialog') ?? cmd.querySelector('dialog');
-    if (dialog) patchDialogPolyfill(dialog);
-    cmd.show();
-    await tick();
-    expect(cmd.open).toBe(true);
-    expect(cmd.hasAttribute('open')).toBe(true);
-  });
-
-  it('clears [open] when .hide() is called', async () => {
-    const cmd = mount('<admin-command></admin-command>');
-    const dialog = cmd.shadowRoot?.querySelector('dialog') ?? cmd.querySelector('dialog');
-    if (dialog) patchDialogPolyfill(dialog);
-    cmd.show();
-    await tick();
-    cmd.hide();
-    await tick();
-    expect(cmd.open).toBe(false);
-    expect(cmd.hasAttribute('open')).toBe(false);
-  });
-
-  it('toggle() flips open state and returns the new value', async () => {
-    const cmd = mount('<admin-command></admin-command>');
-    const dialog = cmd.shadowRoot?.querySelector('dialog') ?? cmd.querySelector('dialog');
-    if (dialog) patchDialogPolyfill(dialog);
-    const after1 = cmd.toggle();
-    await tick();
-    expect(after1).toBe(true);
-    const after2 = cmd.toggle();
-    await tick();
-    expect(after2).toBe(false);
-  });
-
-  it('removes Cmd+K listener on disconnect', () => {
-    const cmd = mount('<admin-command></admin-command>');
-    const removeSpy = vi.spyOn(document, 'removeEventListener');
-    cmd.remove();
-    const removedTypes = removeSpy.mock.calls.map((args) => args[0]);
-    expect(removedTypes).toContain('keydown');
-  });
-
-  it('honors [no-shortcut] — does not toggle on Cmd+K', async () => {
-    // Verify behavior, not listener registration (happy-dom timing makes
-    // spy-based tests unreliable for synchronous custom-element lifecycle).
-    const cmd = mount('<admin-command no-shortcut></admin-command>');
-    const dialog = cmd.querySelector(':scope > dialog');
-    if (dialog) patchDialogPolyfill(dialog);
-    const event = new KeyboardEvent('keydown', { key: 'k', metaKey: true });
-    document.dispatchEvent(event);
-    await tick();
-    expect(cmd.open).toBe(false);
-    cmd.remove();
-  });
-
-  it('accepts shortcut="cmd+k"', () => {
-    const cmd = mount('<admin-command shortcut="cmd+k"></admin-command>');
-    expect(cmd.shortcut).toBe('cmd+k');
-  });
-});

package/shell/admin-shell/admin-shell.test.js

@@ -1,185 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import { readFileSync } from 'node:fs';
-import { fileURLToPath } from 'node:url';
-import { dirname, resolve } from 'node:path';
-
-const __dirname = dirname(fileURLToPath(import.meta.url));
-const bespokeCSS = readFileSync(resolve(__dirname, 'css/admin-shell.bespoke.css'), 'utf8');
-const collapsedCSS = readFileSync(resolve(__dirname, 'css/admin-shell.collapsed.css'), 'utf8');
-
-// ── Helpers ────────────────────────────────────────────────────────
-function mount(html) {
-  document.body.innerHTML = html;
-  return document.body.firstElementChild;
-}
-
-beforeEach(() => {
-  document.body.innerHTML = '';
-});
-
-// ── Regression guards ─────────────────────────────────────────────
-//
-// These tests document substrate selector decisions that have been
-// regressed and re-fixed at least once each. They run against the raw
-// CSS file content + DOM `element.matches()` rather than computed style,
-// because happy-dom doesn't fully resolve external stylesheet cascade.
-// The trade-off: we don't assert that the rule WAS applied, but we DO
-// assert that the rule's selector REACHES the element it's meant to
-// style — which is the part that broke in v0.6.16.
-
-describe('admin-shell.bespoke.css — selector reachability', () => {
-  it('v0.6.16 fix: admin-page rule uses descendant combinator (not >)', () => {
-    // The previous selector `admin-scroll > admin-page` broke when a
-    // router (e.g. <router-ui>) sat between <admin-scroll> and
-    // <admin-page>. The fix uses :is() + descendant combinator so any
-    // depth of intermediate wrapping still matches.
-    expect(bespokeCSS).toMatch(/:is\(admin-scroll,\s*admin-content\)\s+admin-page\s*\{/);
-    // Negative assertion: the broken direct-child form should not be
-    // present any more (catches accidental reverts).
-    expect(bespokeCSS).not.toMatch(/^admin-scroll\s*>\s*admin-page\s*,/m);
-    expect(bespokeCSS).not.toMatch(/^admin-content\s*>\s*admin-page\s*\{/m);
-  });
-
-  it('admin-page rule reaches admin-page inside <router-ui>', () => {
-    // Synthesize the docs-site DOM shape that hit the v0.6.16 bug.
-    // The selector under test must match <admin-page> via descendant
-    // combinator even when <router-ui> sits between.
-    mount(`
-      <admin-shell>
-        <admin-content>
-          <admin-scroll>
-            <router-ui id="router">
-              <admin-page id="page"></admin-page>
-            </router-ui>
-          </admin-scroll>
-        </admin-content>
-      </admin-shell>
-    `);
-    const page = document.getElementById('page');
-    expect(page).toBeTruthy();
-    // Direct-child match should fail (router-ui sits between)
-    expect(page.matches('admin-scroll > admin-page')).toBe(false);
-    expect(page.matches('admin-content > admin-page')).toBe(false);
-    // Descendant match must succeed (this is what v0.6.17 introduced)
-    expect(page.matches(':is(admin-scroll, admin-content) admin-page')).toBe(true);
-  });
-
-  it('admin-page rule still reaches admin-page as direct child', () => {
-    // Canonical playground/example layout — no router wrapper.
-    // The descendant combinator must still match this case.
-    mount(`
-      <admin-shell>
-        <admin-content>
-          <admin-scroll>
-            <admin-page id="page"></admin-page>
-          </admin-scroll>
-        </admin-content>
-      </admin-shell>
-    `);
-    const page = document.getElementById('page');
-    expect(page.matches(':is(admin-scroll, admin-content) admin-page')).toBe(true);
-  });
-});
-
-describe('admin-shell.collapsed.css — vanilla HTML fallback (v0.6.17)', () => {
-  it('contains the vanilla-HTML fallback block', () => {
-    // v0.6.17 added rules covering <button class="nav-item"> etc. so
-    // text labels don't overflow the 48px rail when the consumer doesn't
-    // use AdiaUI <nav-item-ui> primitives.
-    expect(collapsedCSS).toMatch(/Vanilla-HTML fallback/);
-    // v0.6.20 (FEEDBACK-38 addendum): the heading-hide rule narrowed from a
-    // blanket `[slot="heading"]` to plain-text headings + headings without
-    // slotted children, so composed wrappers (<admin-entity-item slot="heading">)
-    // survive collapse. The rule still resolves to `display: none`.
-    expect(collapsedCSS).toMatch(/\[slot="heading"\][^{]*\{\s*display:\s*none/);
-    expect(collapsedCSS).toMatch(/\[slot="heading"\]:not\(:has\(>\s*\[slot\]\)\)/);
-    expect(collapsedCSS).toMatch(/button\.nav-item/);
-    expect(collapsedCSS).toMatch(/text-indent:\s*-9999px/);
-  });
-
-  it('preserves icon visibility inside vanilla nav buttons', () => {
-    // text-indent:-9999px on the parent must be undone on the icon
-    // child, otherwise the icon disappears with the text. Both rules
-    // must be present in the file.
-    expect(collapsedCSS).toMatch(/button\.nav-item\s*>\s*icon-ui[\s\S]*?text-indent:\s*0/);
-  });
-
-  it('fallback rules sit inside the @container sidebar query', () => {
-    // The vanilla-HTML fallback must be scoped to the collapsed state
-    // (max-width: 96px container query). Outside that scope, the
-    // text-indent: -9999px clip would also break the expanded state.
-    const containerMatch = collapsedCSS.match(/@container\s+sidebar\s*\(max-width:\s*96px\)\s*\{([\s\S]+)\}/);
-    expect(containerMatch).toBeTruthy();
-    const inside = containerMatch[1];
-    expect(inside).toMatch(/Vanilla-HTML fallback/);
-    expect(inside).toMatch(/text-indent:\s*-9999px/);
-  });
-});
-
-// ── FB-55 — runtime warn when AdminSidebar / AdminCommand unregistered ──
-//
-// Per-component import path (`@adia-ai/web-modules/shell/admin-shell`)
-// registers ONLY AdminShell. <admin-sidebar> renders (CSS targets by
-// tag) but is an unupgraded HTMLElement with no .toggle(). The
-// optional chain `sidebar?.toggle?.()` previously swallowed the no-op
-// silently — zero diagnostic. v0.6.35 adds a one-shot console.warn at
-// toggle-time when the sidebar is found but not upgraded.
-//
-// These tests import ONLY AdminShell (not AdminSidebar), simulate the
-// per-component-path failure mode, and assert the warn fires + dedups
-// per element.
-
-describe('admin-shell — FB-55 unregistered-element warn', () => {
-  it('logs warn when [data-sidebar-toggle] clicked and admin-sidebar not registered', async () => {
-    // AdminShell only — AdminSidebar deliberately NOT imported.
-    await import('./admin-shell.js');
-    const warns = [];
-    const origWarn = console.warn;
-    console.warn = (...args) => warns.push(args.join(' '));
-    try {
-      const shell = mount(
-        '<admin-shell>' +
-          '<admin-sidebar slot="leading"></admin-sidebar>' +
-          '<button data-sidebar-toggle="leading">☰</button>' +
-        '</admin-shell>'
-      );
-      // Allow the connect-time wiring to settle.
-      await new Promise((r) => queueMicrotask(r));
-      const btn = shell.querySelector('[data-sidebar-toggle]');
-      btn.click();
-      expect(warns.length).toBe(1);
-      expect(warns[0]).toMatch(/admin-sidebar.*slot="leading".*not registered/i);
-      expect(warns[0]).toMatch(/Sidebar toggle will not work/);
-      expect(warns[0]).toMatch(/cluster barrel/);
-      // Second click — dedup, no additional warn for the same offender.
-      btn.click();
-      expect(warns.length).toBe(1);
-    } finally {
-      console.warn = origWarn;
-    }
-  });
-
-  it('does NOT log when admin-sidebar IS registered (upgraded element)', async () => {
-    // Import the sidebar class — element is now upgraded with .toggle().
-    await import('../admin-sidebar/admin-sidebar.js');
-    await import('./admin-shell.js');
-    const warns = [];
-    const origWarn = console.warn;
-    console.warn = (...args) => warns.push(args.join(' '));
-    try {
-      const shell = mount(
-        '<admin-shell>' +
-          '<admin-sidebar slot="leading"></admin-sidebar>' +
-          '<button data-sidebar-toggle="leading">☰</button>' +
-        '</admin-shell>'
-      );
-      await new Promise((r) => queueMicrotask(r));
-      shell.querySelector('[data-sidebar-toggle]').click();
-      // No warn — sidebar.toggle() exists and runs cleanly.
-      const fb55Warns = warns.filter((w) => /FB-55|not registered/.test(w));
-      expect(fb55Warns.length).toBe(0);
-    } finally {
-      console.warn = origWarn;
-    }
-  });
-});

package/shell/admin-sidebar/admin-sidebar.test.js

@@ -1,173 +0,0 @@
-import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
-import '../../../web-components/core/element.js';
-import './admin-sidebar.js';
-
-const tick = () => new Promise((r) => queueMicrotask(r));
-
-function mount(html) {
-  const wrap = document.createElement('div');
-  wrap.innerHTML = html;
-  document.body.appendChild(wrap);
-  return wrap.firstElementChild;
-}
-
-// happy-dom doesn't ship a working ResizeObserver out-of-the-box, and
-// returns zero from getBoundingClientRect (no layout engine). Patch both
-// in beforeEach so connected() doesn't immediately mark every sidebar as
-// collapsed (width <= 96).
-let originalRect;
-beforeEach(() => {
-  document.body.innerHTML = '';
-  try { localStorage.clear(); } catch {}
-  globalThis.ResizeObserver = class {
-    observe() {}
-    unobserve() {}
-    disconnect() {}
-  };
-  // Mock getBoundingClientRect to derive width from inline style (or 240 default)
-  originalRect = HTMLElement.prototype.getBoundingClientRect;
-  HTMLElement.prototype.getBoundingClientRect = function () {
-    const inline = this.style?.width || '';
-    const w = parseFloat(inline) || 240;
-    return { width: w, height: 600, top: 0, left: 0, right: w, bottom: 600, x: 0, y: 0 };
-  };
-});
-
-afterEach(() => {
-  if (originalRect) HTMLElement.prototype.getBoundingClientRect = originalRect;
-});
-
-describe('admin-sidebar', () => {
-  it('registers admin-sidebar as a custom element', () => {
-    expect(customElements.get('admin-sidebar')).toBeDefined();
-  });
-
-  it('defaults to collapsed=false on connect', () => {
-    const sb = mount('<admin-sidebar slot="leading"></admin-sidebar>');
-    expect(sb.collapsed).toBe(false);
-  });
-
-  it('reflects [collapsed] via property assignment', async () => {
-    const sb = mount('<admin-sidebar slot="leading"></admin-sidebar>');
-    sb.collapsed = true;
-    await tick();
-    expect(sb.hasAttribute('collapsed')).toBe(true);
-  });
-
-  it('reflects [resizing] via property assignment', async () => {
-    const sb = mount('<admin-sidebar slot="leading"></admin-sidebar>');
-    sb.resizing = true;
-    await tick();
-    expect(sb.hasAttribute('resizing')).toBe(true);
-  });
-
-  it('exposes .toggle() / .collapse() / .expand() public methods', () => {
-    const sb = mount('<admin-sidebar slot="leading" collapsible></admin-sidebar>');
-    expect(typeof sb.toggle).toBe('function');
-    expect(typeof sb.collapse).toBe('function');
-    expect(typeof sb.expand).toBe('function');
-  });
-
-  it('persists width to localStorage on collapse, restores on connect', async () => {
-    // First mount: set a width, collapse, persisted to localStorage
-    const sb1 = mount('<admin-sidebar slot="leading" collapsible></admin-sidebar>');
-    sb1.style.width = '240px';
-    // happy-dom doesn't compute layout; mock getBoundingClientRect to return our set width
-    sb1.getBoundingClientRect = () => ({ width: 240 });
-    sb1.collapse();
-    expect(sb1.collapsed).toBe(true);
-    // localStorage should hold either the floor or the previous width
-    const stored = localStorage.getItem('adia-sidebar-leading');
-    expect(stored).not.toBeNull();
-  });
-
-  it('uses [name] override for the localStorage key', () => {
-    const sb = mount('<admin-sidebar slot="leading" name="custom-id" collapsible></admin-sidebar>');
-    sb.getBoundingClientRect = () => ({ width: 200 });
-    sb.style.width = '200px';
-    sb.collapse();
-    expect(localStorage.getItem('adia-sidebar-custom-id')).not.toBeNull();
-    expect(localStorage.getItem('adia-sidebar-leading')).toBeNull();
-  });
-
-  it('toggle() returns the new collapsed value', () => {
-    const sb = mount('<admin-sidebar slot="leading" collapsible></admin-sidebar>');
-    sb.getBoundingClientRect = () => ({ width: 200 });
-    sb.style.width = '200px';
-    const result = sb.toggle();
-    expect(result).toBe(sb.collapsed);
-  });
-
-  it('dispatches sidebar-toggle event on toggle()', () => {
-    const sb = mount('<admin-sidebar slot="leading" collapsible></admin-sidebar>');
-    sb.getBoundingClientRect = () => ({ width: 200 });
-    sb.style.width = '200px';
-    const onToggle = vi.fn();
-    sb.addEventListener('sidebar-toggle', onToggle);
-    sb.toggle();
-    expect(onToggle).toHaveBeenCalledTimes(1);
-    expect(onToggle.mock.calls[0][0].detail).toEqual(
-      expect.objectContaining({ name: expect.any(String), expanded: expect.any(Boolean) })
-    );
-  });
-
-  it('cleans up resize handlers on disconnect (no zombie listeners)', () => {
-    const sb = mount('<admin-sidebar slot="leading" resizable><div data-resize></div></admin-sidebar>');
-    const handle = sb.querySelector('[data-resize]');
-    const removeSpy = vi.spyOn(handle, 'removeEventListener');
-    sb.remove();
-    // disconnected() runs cleanup; pointerdown listener should have been removed
-    const removedTypes = removeSpy.mock.calls.map((args) => args[0]);
-    expect(removedTypes).toContain('pointerdown');
-  });
-
-  // gh#286 — a zero rect (linkedom/SSR shims have no layout engine; a
-  // browser can also connect an element before its first layout, e.g.
-  // inside a display:none ancestor) must NOT snap the sidebar collapsed.
-  describe('gh#286 — zero-rect connect does not force collapse', () => {
-    it('stays at the connect() default (expanded) when the rect is 0×0', () => {
-      HTMLElement.prototype.getBoundingClientRect = () => ({ width: 0, height: 0, top: 0, left: 0, right: 0, bottom: 0, x: 0, y: 0 });
-      const sb = mount('<admin-sidebar slot="leading"></admin-sidebar>');
-      expect(sb.collapsed).toBe(false);
-    });
-
-    it('keeps a persisted expanded width instead of overriding it with a bogus collapse', () => {
-      // First mount at a real expanded width — persists 240px.
-      const sb1 = mount('<admin-sidebar slot="leading" collapsible></admin-sidebar>');
-      sb1.getBoundingClientRect = () => ({ width: 240 });
-      sb1.style.width = '240px';
-      sb1.collapse();
-      sb1.expand();
-      sb1.remove();
-
-      // Re-mount under a zero-rect environment (the SSR case) — the
-      // restored width from storage should survive; connected() must not
-      // overwrite it back to collapsed just because the rect read 0.
-      HTMLElement.prototype.getBoundingClientRect = () => ({ width: 0, height: 0, top: 0, left: 0, right: 0, bottom: 0, x: 0, y: 0 });
-      const sb2 = mount('<admin-sidebar slot="leading" collapsible></admin-sidebar>');
-      expect(sb2.collapsed).toBe(false);
-    });
-
-    it('the ResizeObserver first tick self-corrects once real layout exists', () => {
-      let observedCallback;
-      globalThis.ResizeObserver = class {
-        constructor(cb) { observedCallback = cb; }
-        observe() {}
-        unobserve() {}
-        disconnect() {}
-      };
-      HTMLElement.prototype.getBoundingClientRect = () => ({ width: 0, height: 0, top: 0, left: 0, right: 0, bottom: 0, x: 0, y: 0 });
-      const sb = mount('<admin-sidebar slot="leading"></admin-sidebar>');
-      expect(sb.collapsed).toBe(false); // still unresolved right after connect
-
-      // Simulate the observer's first real tick (e.g. SSR hydration's
-      // first client paint) reporting an actually-narrow layout.
-      observedCallback([{ contentBoxSize: [{ inlineSize: 60 }] }]);
-      expect(sb.collapsed).toBe(true);
-
-      // And the inverse — a real wide layout expands it.
-      observedCallback([{ contentBoxSize: [{ inlineSize: 240 }] }]);
-      expect(sb.collapsed).toBe(false);
-    });
-  });
-});

package/shell/embed-shell/embed-shell.test.js

@@ -1,127 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import './embed-shell.js'; // registers <embed-shell>
-
-// A minimal consumer shape: one [app] surface with two [opens] triggers, plus
-// two named [panel] surfaces (one carrying a [close] trigger). The shell owns
-// layout, not content — divs stand in for the real consumer surfaces.
-function mount() {
-  document.body.innerHTML = `
-    <embed-shell>
-      <div app>
-        <button id="open-chat" opens="chat">chat</button>
-        <button id="open-settings" opens="settings">settings</button>
-      </div>
-      <div panel="chat"><button id="close" close>x</button></div>
-      <div panel="settings"></div>
-    </embed-shell>`;
-  return document.body.querySelector('embed-shell');
-}
-
-beforeEach(() => {
-  document.body.innerHTML = '';
-});
-
-// ── open / close / toggle ─────────────────────────────────────────
-describe('embed-shell — open / close / toggle API', () => {
-  it('open(name) reflects [panel] on the shell + sets [active] on the matching surface', () => {
-    const shell = mount();
-    shell.open('chat');
-    expect(shell.getAttribute('panel')).toBe('chat');
-    expect(shell.querySelector('[panel="chat"]').hasAttribute('active')).toBe(true);
-    expect(shell.panel).toBe('chat');
-  });
-
-  it('open(name) switches the active panel — only one [active] at a time', () => {
-    const shell = mount();
-    shell.open('chat');
-    shell.open('settings');
-    expect(shell.getAttribute('panel')).toBe('settings');
-    expect(shell.querySelector('[panel="chat"]').hasAttribute('active')).toBe(false);
-    expect(shell.querySelector('[panel="settings"]').hasAttribute('active')).toBe(true);
-  });
-
-  it('open() with no matching [panel] is a no-op (consumer must provide the surface)', () => {
-    const shell = mount();
-    shell.open('nope');
-    expect(shell.hasAttribute('panel')).toBe(false);
-  });
-
-  it('open() ignores an empty name', () => {
-    const shell = mount();
-    shell.open('');
-    expect(shell.hasAttribute('panel')).toBe(false);
-  });
-
-  it('close() clears [panel] + [active]; .panel reads ""', () => {
-    const shell = mount();
-    shell.open('chat');
-    shell.close();
-    expect(shell.hasAttribute('panel')).toBe(false);
-    expect(shell.querySelector('[panel="chat"]').hasAttribute('active')).toBe(false);
-    expect(shell.panel).toBe('');
-  });
-
-  it('toggle() opens when closed, closes when the same panel is already open', () => {
-    const shell = mount();
-    shell.toggle('chat');
-    expect(shell.panel).toBe('chat');
-    shell.toggle('chat');
-    expect(shell.panel).toBe('');
-  });
-
-  it('emits embed:change with the new panel name on open, "" on close', () => {
-    const shell = mount();
-    const seen = [];
-    shell.addEventListener('embed:change', (e) => seen.push(e.detail.panel));
-    shell.open('chat');
-    shell.close();
-    expect(seen).toEqual(['chat', '']);
-  });
-});
-
-// ── delegated triggers + inbound events ───────────────────────────
-describe('embed-shell — delegated triggers + events', () => {
-  it('[opens] click toggles the named panel', () => {
-    const shell = mount();
-    shell.querySelector('#open-chat').click();
-    expect(shell.panel).toBe('chat');
-    shell.querySelector('#open-chat').click(); // same trigger toggles it back off
-    expect(shell.panel).toBe('');
-  });
-
-  it('[opens] switches directly between panels', () => {
-    const shell = mount();
-    shell.querySelector('#open-chat').click();
-    shell.querySelector('#open-settings').click();
-    expect(shell.panel).toBe('settings');
-  });
-
-  it('[close] click dismisses the open panel', () => {
-    const shell = mount();
-    shell.open('chat');
-    shell.querySelector('#close').click();
-    expect(shell.panel).toBe('');
-  });
-
-  it('embed:open event opens/toggles a panel', () => {
-    const shell = mount();
-    shell.querySelector('[app]').dispatchEvent(
-      new CustomEvent('embed:open', { detail: { panel: 'settings' }, bubbles: true }),
-    );
-    expect(shell.panel).toBe('settings');
-  });
-
-  it('Escape closes the open panel', () => {
-    const shell = mount();
-    shell.open('chat');
-    shell.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape', bubbles: true }));
-    expect(shell.panel).toBe('');
-  });
-
-  it('Escape is a no-op when no panel is open', () => {
-    const shell = mount();
-    // Should not throw; panel stays closed.
-    shell.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape', bubbles: true }));
-    expect(shell.panel).toBe('');
-  });
-});

package/simple/simple-shell/simple-shell.test.js

@@ -1,83 +0,0 @@
-import { describe, it, expect, beforeEach } from 'vitest';
-import '../../../web-components/core/element.js';
-import './simple-shell.js';
-
-const tick = () => new Promise((r) => queueMicrotask(r));
-
-function mount(html) {
-  const wrap = document.createElement('div');
-  wrap.innerHTML = html;
-  document.body.appendChild(wrap);
-  return wrap.firstElementChild;
-}
-
-beforeEach(() => {
-  document.body.innerHTML = '';
-});
-
-describe('simple-shell', () => {
-  it('registers simple-shell as a custom element', () => {
-    expect(customElements.get('simple-shell')).toBeDefined();
-  });
-
-  it('defaults to centered=false and full-bleed=false', () => {
-    const el = mount('<simple-shell></simple-shell>');
-    expect(el.hasAttribute('centered')).toBe(false);
-    expect(el.hasAttribute('full-bleed')).toBe(false);
-  });
-
-  it('honors initial [centered] attribute on connect', () => {
-    const el = mount('<simple-shell centered></simple-shell>');
-    expect(el.centered).toBe(true);
-  });
-
-  it('honors initial [full-bleed] attribute on connect', () => {
-    const el = mount('<simple-shell full-bleed></simple-shell>');
-    expect(el['full-bleed']).toBe(true);
-  });
-
-  it('reflects [centered] via property assignment', async () => {
-    const el = mount('<simple-shell></simple-shell>');
-    el.centered = true;
-    await tick();
-    expect(el.hasAttribute('centered')).toBe(true);
-  });
-
-  it('reflects [full-bleed] via property assignment', async () => {
-    const el = mount('<simple-shell></simple-shell>');
-    el['full-bleed'] = true;
-    await tick();
-    expect(el.hasAttribute('full-bleed')).toBe(true);
-  });
-
-  it('removes [centered] when set to false', async () => {
-    const el = mount('<simple-shell centered></simple-shell>');
-    el.centered = false;
-    await tick();
-    expect(el.hasAttribute('centered')).toBe(false);
-  });
-
-  it('stamps no HTML (behavior-only orchestrator)', () => {
-    const el = mount('<simple-shell></simple-shell>');
-    // Empty content + nothing stamped by the host
-    expect(el.children.length).toBe(0);
-  });
-
-  it('preserves authored slotted children', () => {
-    const el = mount(`
-      <simple-shell>
-        <simple-hero><h1 slot="heading">Hello</h1></simple-hero>
-        <simple-content><p>Body</p></simple-content>
-      </simple-shell>
-    `);
-    expect(el.querySelector('simple-hero')).toBeTruthy();
-    expect(el.querySelector('simple-content')).toBeTruthy();
-    expect(el.querySelector('[slot="heading"]')).toBeTruthy();
-  });
-
-  it('supports both [centered] and [full-bleed] simultaneously', () => {
-    const el = mount('<simple-shell centered full-bleed></simple-shell>');
-    expect(el.centered).toBe(true);
-    expect(el['full-bleed']).toBe(true);
-  });
-});