@reticlehq/browser 3.3.0 → 3.4.0

package/dist/actions/actions-dom.d.ts

@@ -1,3 +1,4 @@
+import type { ActionTarget } from '../dom/realm.js';
 interface ClickGeometry {
     occluded: boolean;
     occludedBy: string | null;
@@ -5,7 +6,7 @@ interface ClickGeometry {
 }
 export declare const NO_GEOMETRY: ClickGeometry;
 export declare function mouseEventFor(el: Element, type: string, init?: MouseEventInit): MouseEvent;
-export declare function fireClickSequence(el: HTMLElement, hold?: {
+export declare function fireClickSequence(el: ActionTarget, hold?: {
     ms: number;
     sleep: (ms: number) => Promise<void>;
     now: () => number;
@@ -13,11 +14,11 @@ export declare function fireClickSequence(el: HTMLElement, hold?: {
     prevented: boolean;
     heldMs: number;
 }>;
-export declare function clickGeometry(el: HTMLElement): ClickGeometry;
+export declare function clickGeometry(el: ActionTarget): ClickGeometry;
 export declare function firePointer(el: Element, type: string, relatedTarget?: EventTarget | null): void;
 export declare function firePointerNonBubbling(el: Element, type: string, relatedTarget?: EventTarget | null): void;
-export declare function dragElement(source: HTMLElement, target: HTMLElement | null, data: unknown): Promise<boolean>;
-export declare function fireTapSequence(el: HTMLElement, hold: {
+export declare function dragElement(source: ActionTarget, target: ActionTarget | null, data: unknown): Promise<boolean>;
+export declare function fireTapSequence(el: ActionTarget, hold: {
     ms: number;
     sleep: (ms: number) => Promise<void>;
     now: () => number;

package/dist/actions/actions-press.d.ts

@@ -1,3 +1,4 @@
+import { type ActionTarget } from '../dom/realm.js';
 export declare function pressKey(args: Record<string, unknown>): string;
 export declare function pressModifiers(args: Record<string, unknown>): {
     metaKey: boolean;
@@ -9,6 +10,5 @@ export declare function pressCode(args: Record<string, unknown>, key: string): s
 export declare function focusedOrDocument(): HTMLElement;
 export declare function isReflessDocumentPress(ref: string, action: string, args: Record<string, unknown>): boolean;
 export declare function pressKeys(args: Record<string, unknown>): string[];
-export declare function holdKey(el: HTMLElement, key: string, code: string, mods: Record<string, boolean>, ms: number): Promise<void>;
-export declare function pressCombo(el: HTMLElement, keys: readonly string[], mods: Record<string, boolean>, holdMs: number): Promise<boolean>;
-export declare const ZOOM_NEEDS_REAL_BROWSER_MSG: string;
+export declare function holdKey(el: ActionTarget, key: string, code: string, mods: Record<string, boolean>, ms: number): Promise<void>;
+export declare function pressCombo(el: ActionTarget, keys: readonly string[], mods: Record<string, boolean>, holdMs: number): Promise<boolean>;

package/dist/actions/actions-press.js

@@ -118,6 +118,3 @@ export async function pressCombo(el, keys, mods, holdMs) {
     }
     return prevented;
 }
-export const ZOOM_NEEDS_REAL_BROWSER_MSG = 'cannot zoom from inside the page — CSS zoom changes how it LOOKS without changing the layout ' +
-    'viewport, visualViewport or media queries, so a layout that breaks at 200% would be reported as ' +
-    'checked and passing. Drive a real browser (reticle drive <url>, or reticle_lease) and zoom there.';

package/dist/actions/actions.js

@@ -5,9 +5,10 @@ import { dangerousActionContext, requiresDangerousConfirmation, submitControlFor
 import { assertEditable, assertNotRichText, setNativeValue } from './value-input.js';
 import { getAccessibleName, getRole, isVisible, getStates } from '../dom/a11y.js';
 import { elementHasHoverHandlers, identifyComponent } from '../registry/stores/adapters.js';
-import { isForm, isHtmlElement, isInput, isSelect, isTextArea } from '../dom/realm.js';
+import { isActionTarget, isForm, isInput, isSelect, isTextArea, } from '../dom/realm.js';
 import { nativeSetTimeout, settle } from '../timers/native/native-timers.js';
 import { AppearedText } from './appeared-text.js';
+import { alreadyAtCheckedState, assertAriaToggleLanded, isAriaToggle } from './check-state.js';
 import { focusedOrDocument, isReflessDocumentPress, pressCode, pressKey, pressModifiers, pressKeys, holdKey, pressCombo, } from './actions-press.js';
 function asString(value, fallback = '') {
     return 'string' === typeof value ? value : fallback;
@@ -16,8 +17,8 @@ function requireElement(ref) {
     const el = refs.resolve(ref);
     if (null === el)
         throw new Error(`ref '${echoRef(ref)}' no longer resolves to an element`);
-    if (!isHtmlElement(el))
-        throw new Error(`ref '${echoRef(ref)}' is not an HTMLElement`);
+    if (!isActionTarget(el))
+        throw new Error(`ref '${echoRef(ref)}' is not an HTML or SVG element`);
     return el;
 }
 function anchorOf(el) {
@@ -76,11 +77,6 @@ const CLICK_LIKE = new Set([
     ActionType.CHECK,
     ActionType.UNCHECK,
 ]);
-function alreadyAtCheckedState(el, action) {
-    if (action !== ActionType.CHECK && action !== ActionType.UNCHECK)
-        return false;
-    return isInput(el) && el.checked === (action === ActionType.CHECK);
-}
 function dragTargetRef(args) {
     const named = asString(args['toRef']);
     return '' !== named ? named : asString(args['target']);
@@ -116,7 +112,7 @@ function assertActionAllowed(el, action, args) {
     const sourceDangerous = requiresDangerousConfirmation(dangerousActionContext(el), getRole(el)) ||
         (submitter !== null &&
             requiresDangerousConfirmation(dangerousActionContext(submitter), getRole(submitter)));
-    const targetDangerous = isHtmlElement(dragTarget) &&
+    const targetDangerous = isActionTarget(dragTarget) &&
         requiresDangerousConfirmation(dangerousActionContext(dragTarget), getRole(dragTarget));
     if (canTrigger &&
         (sourceDangerous || targetDangerous) &&
@@ -244,11 +240,16 @@ async function dispatchOther(el, action, args) {
             throw new Error(`cannot select on a <${el.tagName.toLowerCase()}>`);
         case ActionType.CHECK:
         case ActionType.UNCHECK: {
-            if (!isInput(el))
+            const aria = isAriaToggle(el);
+            if (!isInput(el) && !aria) {
                 throw new Error(`cannot (un)check a <${el.tagName.toLowerCase()}>`);
+            }
             if (!enabledOf(el)) {
                 throw new Error(`cannot ${action} a disabled control — a real user could not, so neither will Reticle`);
             }
+            if (!isInput(el)) {
+                return alreadyAtCheckedState(el, action) ? false : (await fireClickSequence(el)).prevented;
+            }
             if ('radio' === el.type && action === ActionType.UNCHECK) {
                 throw new Error('cannot uncheck a radio button — a real user could not; select another radio in the group');
             }
@@ -324,7 +325,7 @@ async function dispatchOther(el, action, args) {
             if ('' === toRef)
                 return await dragElement(el, null, args['data']);
             const resolved = refs.resolve(toRef);
-            if (!isHtmlElement(resolved)) {
+            if (!isActionTarget(resolved)) {
                 throw new Error(`drag target '${echoRef(toRef)}' did not resolve to an element — pass a ref from ` +
                     'reticle_snapshot or reticle_query as args.toRef (alias: args.target)');
             }
@@ -380,6 +381,7 @@ export async function executeAction(ref, action, args = {}) {
         settleReason = outcome.settled ? null : SettleReason.TIMEOUT;
         obs.disconnect();
     }
+    assertAriaToggleLanded(el, action, alreadyAtValue);
     const valueAfter = valueOf(el);
     const nextFocus = activeRef(el);
     const effect = {

package/dist/actions/check-state.d.ts

@@ -0,0 +1,5 @@
+import { type ActionTarget } from '../dom/realm.js';
+export declare const isAriaToggle: (el: Element) => boolean;
+export declare const ariaChecked: (el: Element) => boolean;
+export declare function assertAriaToggleLanded(el: Element, action: string, skipped: boolean): void;
+export declare function alreadyAtCheckedState(el: ActionTarget, action: string): boolean;

package/dist/actions/check-state.js

@@ -0,0 +1,24 @@
+import { ActionType } from '@reticlehq/core';
+import { isInput } from '../dom/realm.js';
+const ARIA_TOGGLE_ROLES = new Set(['checkbox', 'switch']);
+const ARIA_CHECKED = 'aria-checked';
+export const isAriaToggle = (el) => !isInput(el) && ARIA_TOGGLE_ROLES.has(el.getAttribute('role') ?? '');
+export const ariaChecked = (el) => 'true' === el.getAttribute(ARIA_CHECKED);
+export function assertAriaToggleLanded(el, action, skipped) {
+    if (skipped || !isAriaToggle(el))
+        return;
+    if (action !== ActionType.CHECK && action !== ActionType.UNCHECK)
+        return;
+    const wanted = action === ActionType.CHECK;
+    if (ariaChecked(el) === wanted)
+        return;
+    throw new Error(`${action} clicked the ${el.getAttribute('role') ?? ''} but ${ARIA_CHECKED} is still "${String(!wanted)}" — the app did not toggle it`);
+}
+export function alreadyAtCheckedState(el, action) {
+    if (action !== ActionType.CHECK && action !== ActionType.UNCHECK)
+        return false;
+    const wanted = action === ActionType.CHECK;
+    if (isInput(el))
+        return el.checked === wanted;
+    return isAriaToggle(el) && ariaChecked(el) === wanted;
+}

package/dist/actions/danger-context.d.ts

@@ -1,3 +1,4 @@
-export declare function dangerousActionContext(el: HTMLElement): string;
-export declare function submitControlFor(el: HTMLElement): HTMLElement | null;
+import { type ActionTarget } from '../dom/realm.js';
+export declare function dangerousActionContext(el: ActionTarget): string;
+export declare function submitControlFor(el: ActionTarget): HTMLElement | null;
 export declare function requiresDangerousConfirmation(text: string, role?: string): boolean;

package/dist/actions/danger-context.js

@@ -1,5 +1,6 @@
 import { isDangerousActionText } from '@reticlehq/core';
 import { getAccessibleName } from '../dom/a11y.js';
+import { isHtmlElement } from '../dom/realm.js';
 const LABEL_VALUED_INPUT_TYPES = new Set([
     'submit',
     'button',
@@ -7,7 +8,7 @@ const LABEL_VALUED_INPUT_TYPES = new Set([
     'image',
 ]);
 function holdsUserText(el) {
-    if (el.isContentEditable)
+    if (isHtmlElement(el) && el.isContentEditable)
         return true;
     if (el instanceof HTMLTextAreaElement)
         return true;

package/dist/actions/value-input.d.ts

@@ -1,3 +1,4 @@
+import { type ActionTarget } from '../dom/realm.js';
 export declare function setNativeValue(el: HTMLInputElement | HTMLTextAreaElement, value: string): boolean;
-export declare function assertNotRichText(el: HTMLElement, action: string): void;
+export declare function assertNotRichText(el: ActionTarget, action: string): void;
 export declare function assertEditable(el: HTMLInputElement | HTMLTextAreaElement, action: string): void;

package/dist/actions/value-input.js

@@ -1,5 +1,5 @@
 import { captureValueSetter } from '../patching/capture-method.js';
-import { valuePrototypeOf } from '../dom/realm.js';
+import { isHtmlElement, valuePrototypeOf } from '../dom/realm.js';
 export function setNativeValue(el, value) {
     const proto = valuePrototypeOf(el);
     const setter = proto === undefined ? undefined : captureValueSetter(proto);
@@ -15,7 +15,7 @@ export function setNativeValue(el, value) {
 }
 function isRichText(el) {
     const flag = el.getAttribute('contenteditable');
-    if (el.isContentEditable || (null !== flag && 'false' !== flag))
+    if ((isHtmlElement(el) && el.isContentEditable) || (null !== flag && 'false' !== flag))
         return true;
     if ('textbox' === el.getAttribute('role'))
         return true;

package/dist/dom/a11y.js

@@ -1,9 +1,12 @@
 import { ElementState, REDACTED_VALUE } from '@reticlehq/core';
-import { isButton, isHtmlElement, isImage, isInput, isSelect, isTextArea } from './realm.js';
+import { isButton, isHtmlElement, isImage, isInput, isMeter, isOutput, isProgress, isSelect, isTextArea, } from './realm.js';
 import { refs } from './addressing/refs.js';
 import { inspectChart } from './chart.js';
 import { isSensitiveKey } from '../security/serialization.js';
 import { formatSource, sourceFromDom } from './addressing/source.js';
+const HTML_DETAILS_TAG = 'details';
+const HTML_DETAILS_OPEN_ATTRIBUTE = 'open';
+const HTML_DIRECT_SUMMARY_SELECTOR = ':scope > summary';
 const NAME_FROM_CONTENT = new Set([
     'button',
     'link',
@@ -190,7 +193,14 @@ export function getAccessibleName(el) {
         if (alt !== null)
             return alt.trim();
     }
-    if (isInput(el) || isTextArea(el) || isSelect(el)) {
+    const isLabelable = isInput(el) ||
+        isTextArea(el) ||
+        isSelect(el) ||
+        isButton(el) ||
+        isMeter(el) ||
+        isOutput(el) ||
+        isProgress(el);
+    if (isLabelable) {
         const labels = el.labels;
         if (labels !== null && labels.length > 0) {
             const text = [...labels]
@@ -200,6 +210,16 @@ export function getAccessibleName(el) {
             if (text.length > 0)
                 return text;
         }
+    }
+    if ('fieldset' === el.tagName.toLowerCase()) {
+        const legend = [...el.children].find((child) => 'legend' === child.tagName.toLowerCase());
+        if (legend !== undefined) {
+            const text = collapse(textWithoutHidden(legend));
+            if (text.length > 0)
+                return text;
+        }
+    }
+    if (isInput(el) || isTextArea(el) || isSelect(el)) {
         if (isInput(el)) {
             const type = el.type.toLowerCase();
             if ('submit' === type || 'button' === type || 'reset' === type) {
@@ -241,6 +261,8 @@ export function getStates(el, visible = isVisible(el)) {
         states.push(ElementState.CHECKED);
     if (true === ariaBool(el, 'aria-expanded'))
         states.push(ElementState.EXPANDED);
+    if (true === ariaBool(el, 'aria-pressed'))
+        states.push(ElementState.PRESSED);
     if (el.ownerDocument.activeElement === el)
         states.push(ElementState.FOCUSED);
     return states;
@@ -270,11 +292,23 @@ export function getValue(el) {
     const valueNow = el.getAttribute('aria-valuenow');
     return valueNow ?? undefined;
 }
+function hiddenInsideClosedDetails(el) {
+    const parent = el.parentElement;
+    if (null === parent)
+        return false;
+    const details = parent.closest(HTML_DETAILS_TAG);
+    if (null === details || details.hasAttribute(HTML_DETAILS_OPEN_ATTRIBUTE))
+        return false;
+    const summary = details.querySelector(HTML_DIRECT_SUMMARY_SELECTOR);
+    return null === summary || !summary.contains(el);
+}
 function selfHidden(el) {
     if ('true' === el.getAttribute('aria-hidden'))
         return true;
     if (isHtmlElement(el) && el.hidden)
         return true;
+    if (hiddenInsideClosedDetails(el))
+        return true;
     const view = el.ownerDocument.defaultView;
     if (view !== null) {
         const style = view.getComputedStyle(el);
@@ -288,6 +322,12 @@ function selfHidden(el) {
     }
     return false;
 }
+function parentAcrossShadowBoundary(el) {
+    if (null !== el.parentElement)
+        return el.parentElement;
+    const host = el.getRootNode().host;
+    return host ?? null;
+}
 export function isInViewport(el, memo) {
     if (!isVisible(el, memo))
         return false;
@@ -305,7 +345,7 @@ export function isVisible(el, memo) {
     const cached = memo?.get(el);
     if (cached !== undefined)
         return cached;
-    const parent = el.parentElement;
+    const parent = parentAcrossShadowBoundary(el);
     const result = !selfHidden(el) && (null === parent || isVisible(parent, memo));
     if (memo !== undefined)
         memo.set(el, result);

package/dist/dom/realm.d.ts

@@ -1,10 +1,16 @@
 export declare const isElement: (n: unknown) => n is Element;
 export declare const isImage: (n: unknown) => n is HTMLImageElement;
 export declare const isHtmlElement: (n: unknown) => n is HTMLElement;
+export declare const isSvgElement: (n: unknown) => n is SVGElement;
+export type ActionTarget = HTMLElement | SVGElement;
+export declare const isActionTarget: (n: unknown) => n is ActionTarget;
 export declare const isInput: (n: unknown) => n is HTMLInputElement;
 export declare const isTextArea: (n: unknown) => n is HTMLTextAreaElement;
 export declare const isSelect: (n: unknown) => n is HTMLSelectElement;
 export declare const isButton: (n: unknown) => n is HTMLButtonElement;
+export declare const isMeter: (n: unknown) => n is HTMLMeterElement;
+export declare const isOutput: (n: unknown) => n is HTMLOutputElement;
+export declare const isProgress: (n: unknown) => n is HTMLProgressElement;
 export declare const isForm: (n: unknown) => n is HTMLFormElement;
 export declare const isFrame: (n: unknown) => n is HTMLIFrameElement;
 export declare function valuePrototypeOf(el: Element): object | undefined;

package/dist/dom/realm.js

@@ -14,10 +14,15 @@ function isIn(node, name, ambient) {
 export const isElement = (n) => isIn(n, 'Element', 'undefined' === typeof Element ? undefined : Element);
 export const isImage = (n) => isIn(n, 'HTMLImageElement', 'undefined' === typeof HTMLImageElement ? undefined : HTMLImageElement);
 export const isHtmlElement = (n) => isIn(n, 'HTMLElement', 'undefined' === typeof HTMLElement ? undefined : HTMLElement);
+export const isSvgElement = (n) => isIn(n, 'SVGElement', 'undefined' === typeof SVGElement ? undefined : SVGElement);
+export const isActionTarget = (n) => isHtmlElement(n) || isSvgElement(n);
 export const isInput = (n) => isIn(n, 'HTMLInputElement', 'undefined' === typeof HTMLInputElement ? undefined : HTMLInputElement);
 export const isTextArea = (n) => isIn(n, 'HTMLTextAreaElement', 'undefined' === typeof HTMLTextAreaElement ? undefined : HTMLTextAreaElement);
 export const isSelect = (n) => isIn(n, 'HTMLSelectElement', 'undefined' === typeof HTMLSelectElement ? undefined : HTMLSelectElement);
 export const isButton = (n) => isIn(n, 'HTMLButtonElement', 'undefined' === typeof HTMLButtonElement ? undefined : HTMLButtonElement);
+export const isMeter = (n) => isIn(n, 'HTMLMeterElement', 'undefined' === typeof HTMLMeterElement ? undefined : HTMLMeterElement);
+export const isOutput = (n) => isIn(n, 'HTMLOutputElement', 'undefined' === typeof HTMLOutputElement ? undefined : HTMLOutputElement);
+export const isProgress = (n) => isIn(n, 'HTMLProgressElement', 'undefined' === typeof HTMLProgressElement ? undefined : HTMLProgressElement);
 export const isForm = (n) => isIn(n, 'HTMLFormElement', 'undefined' === typeof HTMLFormElement ? undefined : HTMLFormElement);
 export const isFrame = (n) => isIn(n, 'HTMLIFrameElement', 'undefined' === typeof HTMLIFrameElement ? undefined : HTMLIFrameElement);
 export function valuePrototypeOf(el) {

package/dist/dom/snapshot.js

@@ -54,6 +54,7 @@ function stateSuffix(el) {
     const states = getStates(el).filter((s) => s === ElementState.DISABLED ||
         s === ElementState.CHECKED ||
         s === ElementState.EXPANDED ||
+        s === ElementState.PRESSED ||
         s === ElementState.FOCUSED);
     return states.length > 0 ? ` [${states.join(',')}]` : '';
 }
@@ -142,9 +143,14 @@ function visit(child, depth, ctx, inLive) {
     }
 }
 function walk(parent, depth, ctx, inLive = false) {
-    if (depth > ctx.maxDepth)
-        return;
     const children = pierceChildren(parent);
+    if (depth > ctx.maxDepth) {
+        if (children.length > 0) {
+            ctx.truncated = true;
+            recordUnread([parent], ctx);
+        }
+        return;
+    }
     for (let index = 0; index < children.length; index += 1) {
         if (ctx.nodes >= ctx.maxNodes) {
             ctx.truncated = true;

package/dist/observers/network.js

@@ -1,4 +1,4 @@
-import { BlindSpotKind, EventType, REQUEST_SHAPE_FIELD, REQUEST_SHAPE_NONE, RETICLE_WS_PATH, StreamTransport, StreamDirection, fnv1a, } from '@reticlehq/core';
+import { BlindSpotKind, EventType, NEXT_ACTION_FIELD, NEXT_ACTION_HEADER, REQUEST_SHAPE_FIELD, REQUEST_SHAPE_NONE, RETICLE_WS_PATH, StreamTransport, StreamDirection, fnv1a, } from '@reticlehq/core';
 import { captureMethod } from '../patching/capture-method.js';
 import { observeSafely, observeValue } from './types.js';
 import { isCapturableType, projectBody, projectErrorBody, shouldCaptureErrorBody, withBodyDeadline, } from './net-detail/network-body.js';
@@ -120,6 +120,15 @@ function methodOf(input, init) {
         return input.method.toUpperCase();
     return 'GET';
 }
+function nextActionOf(input, init) {
+    if (init !== undefined && init.headers !== undefined) {
+        return observeValue(() => new Headers(init.headers).get(NEXT_ACTION_HEADER)) ?? undefined;
+    }
+    if (input instanceof Request) {
+        return observeValue(() => input.headers.get(NEXT_ACTION_HEADER)) ?? undefined;
+    }
+    return undefined;
+}
 const NON_APP_FRAME = /@reticlehq|reticle\.ts|network\.ts|transport\.ts|<anonymous>|new Promise|node:internal/i;
 const DEPENDENCY_FRAME = /node_modules|\/\.vite\/deps\//i;
 export function firstAppFrame(stack) {
@@ -191,6 +200,8 @@ export function installNetwork(emit, opts = {}) {
         const id = nextId();
         const start = performance.now();
         const method = methodOf(input, init);
+        const nextAction = nextActionOf(input, init);
+        const nextActionFields = nextAction === undefined ? {} : { [NEXT_ACTION_FIELD]: nextAction };
         const urlFields = netUrlFields(rawUrl);
         const url = urlFields.url;
         const initiatorStack = observeValue(() => initiatorFrame());
@@ -226,6 +237,7 @@ export function installNetwork(emit, opts = {}) {
                         ...resourceTiming(rawUrl),
                         ...netResponseMeta(res.statusText, contentType, res.headers.get('content-length')),
                         ...projectRequestBody(init?.body, captureBodies),
+                        ...nextActionFields,
                         ...responseBodyFields,
                         ...(reinterpret?.(url, (name) => res.headers.get(name)) ?? {}),
                     });
@@ -282,6 +294,7 @@ export function installNetwork(emit, opts = {}) {
                     durationMs: Math.round(performance.now() - start),
                     initiator: 'fetch',
                     ...initiatorFields,
+                    ...nextActionFields,
                 });
             });
             throw error;

package/dist/observers/state.js

@@ -54,7 +54,10 @@ export function installStoreState(emit) {
                 for (const change of changes) {
                     const value = project(change.path, change.new);
                     const old = project(change.path, change.old);
-                    if (!isSensitiveKey(change.path) && samePresentedValue(old, value))
+                    const same = isSensitiveKey(change.path)
+                        ? samePresentedValue(sanitizeForTransport(change.old), sanitizeForTransport(change.new))
+                        : samePresentedValue(old, value);
+                    if (same)
                         continue;
                     observeSafely(() => emit(EventType.STATE_CHANGE, { name, path: change.path, value, old }));
                 }

package/dist/registry/store-adapters.js

@@ -1,5 +1,35 @@
 import { nativeWarn } from '../timers/console/native-console.js';
 import { markAdapterSource } from './stores.js';
+function snapshotLive(value) {
+    try {
+        return copyPlain(value, new WeakMap());
+    }
+    catch {
+        return value;
+    }
+}
+function copyPlain(value, seen) {
+    if ('object' !== typeof value || null === value)
+        return value;
+    const done = seen.get(value);
+    if (done !== undefined)
+        return done;
+    if (Array.isArray(value)) {
+        const out = [];
+        seen.set(value, out);
+        for (const item of value)
+            out.push(copyPlain(item, seen));
+        return out;
+    }
+    const proto = Object.getPrototypeOf(value);
+    if (proto !== Object.prototype && proto !== null)
+        return value;
+    const out = {};
+    seen.set(value, out);
+    for (const [key, item] of Object.entries(value))
+        out[key] = copyPlain(item, seen);
+    return out;
+}
 export function tanstackQueryStore(client) {
     const store = {
         getState: () => {
@@ -106,7 +136,7 @@ export function svelteStore(readable, warn = nativeWarn) {
             let value;
             let called = false;
             stopSubscription(readable.subscribe((next) => {
-                value = next;
+                value = snapshotLive(next);
                 called = true;
             }));
             if (!called && !warnedAboutLazyStore) {
@@ -132,7 +162,7 @@ export function svelteStore(readable, warn = nativeWarn) {
 const PINIA_SUBSCRIBE_OPTIONS = { detached: true, flush: 'sync' };
 export function piniaStore(store) {
     return {
-        getState: () => store.$state,
+        getState: () => snapshotLive(store.$state),
         subscribe: (listener) => store.$subscribe(() => listener(), { ...PINIA_SUBSCRIBE_OPTIONS }),
     };
 }

package/dist/registry/stores/adapters.js

@@ -6,8 +6,14 @@ export function registerAdapter(adapter) {
 }
 export function identifyComponent(el) {
     for (const adapter of adapters) {
-        const info = adapter.identify(el);
-        if (info !== null)
+        let info;
+        try {
+            info = adapter.identify(el);
+        }
+        catch {
+            continue;
+        }
+        if (info !== null && info !== undefined)
             return info;
     }
     return null;