@dxos/react-ui-attention 0.9.0 → 0.9.1-staging.ee54ba693a

package/dist/lib/browser/{chunk-I4VO2RQM.mjs → chunk-I4FDY4AZ.mjs}

@@ -1,9 +1,12 @@
 import {
   AttentionManager,
-  SelectionManager,
-  defaultSelection,
-  getAttendables
-} from "./chunk-D2BLVJ6Z.mjs";
+  ViewStateManager,
+  createDefaultBackends,
+  getAttendables,
+  resolveSelection,
+  selectionAspect,
+  toggleSelection
+} from "./chunk-4HYAJ4IO.mjs";
 
 // src/components/AttentionProvider/AttentionProvider.tsx
 import { RegistryContext } from "@effect-atom/atom-react";
@@ -117,127 +120,102 @@ var AttendableContainer = /* @__PURE__ */ forwardRef(({ id, classNames, children
   }, children);
 });
 
-// src/components/SelectionProvider/SelectionProvider.tsx
+// src/components/ViewStateProvider/ViewStateProvider.tsx
 import { RegistryContext as RegistryContext2 } from "@effect-atom/atom-react";
 import { createContext as createContext2 } from "@radix-ui/react-context";
-import * as Match from "effect/Match";
-import React2, { useCallback as useCallback2, useContext as useContext2, useEffect as useEffect2, useMemo as useMemo2, useState as useState2 } from "react";
+import React2, { useContext as useContext2, useEffect as useEffect2, useMemo as useMemo2, useState as useState2 } from "react";
+import { invariant } from "@dxos/invariant";
 import { useDefaultValue as useDefaultValue2 } from "@dxos/react-hooks";
-var SELECTION_NAME = "Selection";
-var [SelectionContextProvider, useSelectionContext] = createContext2(SELECTION_NAME, {
-  selection: void 0
+var __dxlog_file2 = "/__w/dxos/dxos/packages/ui/react-ui-attention/src/components/ViewStateProvider/ViewStateProvider.tsx";
+var VIEW_STATE_NAME = "ViewState";
+var [ViewStateContextProvider, useViewStateContext] = createContext2(VIEW_STATE_NAME, {
+  manager: void 0
 });
-var SelectionProvider = ({ children, selection: selectionProp }) => {
+var ViewStateProvider = ({ children, manager: managerProp }) => {
   const registry = useContext2(RegistryContext2);
-  const selection = useDefaultValue2(selectionProp, () => new SelectionManager(registry));
-  return /* @__PURE__ */ React2.createElement(SelectionContextProvider, {
-    selection
+  const manager = useDefaultValue2(managerProp, () => new ViewStateManager({
+    registry,
+    backends: createDefaultBackends(registry)
+  }));
+  return /* @__PURE__ */ React2.createElement(ViewStateContextProvider, {
+    manager
   }, children);
 };
-var useSelectionManager = () => {
-  const { selection } = useSelectionContext(SELECTION_NAME);
-  return selection;
+var useViewStateManager = () => {
+  const { manager } = useViewStateContext(VIEW_STATE_NAME);
+  invariant(manager, "useViewStateManager() requires a ViewStateProvider ancestor.", { "~LogMeta": "~LogMeta", F: __dxlog_file2, L: 29, S: void 0, A: ["manager", "'useViewStateManager() requires a ViewStateProvider ancestor.'"] });
+  return manager;
 };
-var getDefaultResult = (mode) => {
-  return Match.type().pipe(Match.when({
-    mode: "single"
-  }, (selection) => selection.id), Match.when({
-    mode: "multi"
-  }, (selection) => selection.ids), Match.when({
-    mode: "range"
-  }, (selection) => selection.from && selection.to ? {
-    from: selection.from,
-    to: selection.to
-  } : void 0), Match.when({
-    mode: "multi-range"
-  }, (selection) => selection.ranges), Match.exhaustive)(defaultSelection(mode));
+var useViewStateManagerOptional = () => {
+  const { manager } = useViewStateContext(VIEW_STATE_NAME);
+  return manager;
 };
-var useSelected = (contextId, mode = "multi") => {
-  const { selection } = useSelectionContext(SELECTION_NAME);
-  const [state, setState] = useState2(() => contextId && selection ? selection.getSelected(contextId, mode) : getDefaultResult(mode));
+var useViewState = (aspect, contextId) => {
+  const { manager } = useViewStateContext(VIEW_STATE_NAME);
+  const [value, setValue] = useState2(() => contextId && manager ? manager.get(aspect, contextId) : aspect.defaultValue());
   useEffect2(() => {
-    if (!contextId || !selection) {
-      setState(getDefaultResult(mode));
+    if (!contextId || !manager) {
+      setValue(aspect.defaultValue());
       return;
     }
-    setState(selection.getSelected(contextId, mode));
-    return selection.subscribe(() => {
-      setState(selection.getSelected(contextId, mode));
-    });
+    setValue(manager.get(aspect, contextId));
+    return manager.subscribe(aspect, contextId, setValue);
   }, [
-    selection,
-    contextId,
-    mode
+    manager,
+    aspect,
+    contextId
   ]);
-  return state;
+  return value;
 };
-var useSelectionActions = (contextIds) => {
-  const stableContextIds = useMemo2(() => contextIds, [
-    JSON.stringify(contextIds)
-  ]);
-  const { selection } = useSelectionContext(SELECTION_NAME);
-  const singleSelect = useCallback2((id) => {
-    if (!selection) {
-      return;
+var useViewStateActions = (aspect, contextId) => {
+  const { manager } = useViewStateContext(VIEW_STATE_NAME);
+  return useMemo2(() => ({
+    set: (value) => {
+      if (contextId) {
+        manager?.set(aspect, contextId, value);
+      }
+    },
+    update: (fn) => {
+      if (contextId) {
+        manager?.update(aspect, contextId, fn);
+      }
+    },
+    clear: () => {
+      if (contextId) {
+        manager?.set(aspect, contextId, aspect.defaultValue());
+      }
     }
-    for (const contextId of stableContextIds) {
-      selection.updateSingle(contextId, id);
-    }
-  }, [
-    selection,
-    stableContextIds
+  }), [
+    manager,
+    aspect,
+    contextId
   ]);
-  const multiSelect = useCallback2((ids) => {
-    if (!selection) {
-      return;
-    }
-    for (const contextId of stableContextIds) {
-      selection.updateMulti(contextId, ids);
-    }
-  }, [
-    selection,
-    stableContextIds
-  ]);
-  const rangeSelect = useCallback2((from, to) => {
-    if (!selection) {
-      return;
-    }
-    for (const contextId of stableContextIds) {
-      selection.updateRange(contextId, from, to);
-    }
-  }, [
-    selection,
-    stableContextIds
-  ]);
-  const toggle = useCallback2((id) => {
-    if (!selection) {
-      return;
-    }
-    for (const contextId of stableContextIds) {
-      selection.toggleSelection(contextId, id);
-    }
-  }, [
-    selection,
-    stableContextIds
-  ]);
-  const clear = useCallback2(() => {
-    if (!selection) {
-      return;
-    }
-    for (const contextId of stableContextIds) {
-      selection.clearSelection(contextId);
-    }
-  }, [
-    selection,
-    stableContextIds
-  ]);
-  return {
-    singleSelect,
-    multiSelect,
-    rangeSelect,
-    toggle,
+};
+var useSelection = (contextId, mode = "multi") => resolveSelection(useViewState(selectionAspect, contextId), mode);
+var useSelectionActions = (contextId) => {
+  const { update, clear } = useViewStateActions(selectionAspect, contextId);
+  return useMemo2(() => ({
+    single: (id) => update(() => ({
+      mode: "single",
+      id
+    })),
+    multi: (ids) => update(() => ({
+      mode: "multi",
+      ids: [
+        ...ids
+      ]
+    })),
+    range: (from, to) => update(() => ({
+      mode: "range",
+      from,
+      to
+    })),
+    toggle: (id) => update((prev) => toggleSelection(prev, id)),
+    clear
+  }), [
+    update,
     clear
-  };
+  ]);
 };
 
 export {
@@ -247,9 +225,12 @@ export {
   useAttentionAttributes,
   RootAttentionProvider,
   AttendableContainer,
-  SelectionProvider,
-  useSelectionManager,
-  useSelected,
+  ViewStateProvider,
+  useViewStateManager,
+  useViewStateManagerOptional,
+  useViewState,
+  useViewStateActions,
+  useSelection,
   useSelectionActions
 };
-//# sourceMappingURL=chunk-I4VO2RQM.mjs.map
+//# sourceMappingURL=chunk-I4FDY4AZ.mjs.map

package/dist/lib/browser/chunk-I4FDY4AZ.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/AttentionProvider/AttentionProvider.tsx", "../../../src/components/ViewStateProvider/ViewStateProvider.tsx"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { RegistryContext } from '@effect-atom/atom-react';\nimport { createContext } from '@radix-ui/react-context';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, {\n  type ComponentPropsWithRef,\n  type FocusEvent,\n  type PropsWithChildren,\n  forwardRef,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { log } from '@dxos/log';\nimport { useDefaultValue } from '@dxos/react-hooks';\nimport { type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nimport { type Attention, AttentionManager, getAttendables } from '../../attention';\n\nconst ATTENTION_NAME = 'Attention';\nconst ATTENDABLE_ATTRIBUTE = 'data-attendable-id';\nconst ATTENTION_SOURCE_ATTRIBUTE = 'data-w-attention-source';\n\ntype AttentionContextValue = {\n  attention: AttentionManager;\n};\n\nconst [AttentionContextProvider, useAttentionContext] = createContext<AttentionContextValue>(ATTENTION_NAME, {\n  attention: undefined as unknown as AttentionManager,\n});\n\nconst UNKNOWN_ATTENDABLE = { hasAttention: false, isAncestor: false, isRelated: false } as Attention;\n\n/**\n * Subscribe to the attention state for a qualified graph ID.\n */\n// TODO(burdon): Unify with seleciton and change to contextId?\nconst useAttention = (attendableId?: string): Attention => {\n  const { attention } = useAttentionContext(ATTENTION_NAME);\n  const [state, setState] = useState<Attention>(UNKNOWN_ATTENDABLE);\n  useEffect(() => {\n    if (!attendableId || !attention) {\n      setState(UNKNOWN_ATTENDABLE);\n      return;\n    }\n\n    const currentState = attention.get(attendableId);\n    setState(currentState);\n\n    return attention.subscribe(attendableId, (newState) => {\n      setState(newState);\n    });\n  }, [attention, attendableId]);\n\n  return state;\n};\n\nconst useAttended = () => {\n  const { attention } = useAttentionContext(ATTENTION_NAME);\n  const [current, setCurrent] = useState<readonly string[]>([]);\n  useEffect(() => {\n    if (!attention) {\n      return;\n    }\n\n    setCurrent(attention.getCurrent());\n\n    return attention.subscribeCurrent((newCurrent) => {\n      setCurrent(newCurrent);\n    });\n  }, [attention]);\n\n  return current;\n};\n\n/**\n * Computes HTML element attributes to apply so the attention system can detect changes.\n */\nconst useAttentionAttributes = (attendableId?: string) => {\n  const { hasAttention } = useAttention(attendableId);\n  return useMemo(() => {\n    const attributes: Record<string, string | undefined> = { [ATTENDABLE_ATTRIBUTE]: attendableId };\n    if (hasAttention) {\n      attributes[ATTENTION_SOURCE_ATTRIBUTE] = 'true';\n    }\n\n    return attributes;\n  }, [attendableId, hasAttention]);\n};\n\ntype RootAttentionProviderProps = PropsWithChildren<{\n  attention?: AttentionManager;\n  onChange?: (nextAttended: string[]) => void;\n}>;\n\nconst RootAttentionProvider = ({ children, attention: propsAttention, onChange }: RootAttentionProviderProps) => {\n  const registry = useContext(RegistryContext);\n  const attention = useDefaultValue(propsAttention, () => new AttentionManager(registry));\n\n  const handleFocus = useCallback(\n    (event: FocusEvent) => {\n      // NOTE(thure): Use the following to debug focus movement across the app:\n      log('focus', { related: event.relatedTarget, target: event.target });\n\n      const selector = [\n        '[data-attendable-id]',\n        ...Array.from(document.querySelectorAll('[aria-controls]')).map(\n          (el) => `[id=\"${el.getAttribute('aria-controls')}\"]`,\n        ),\n      ].join(',');\n      const prev = attention.getCurrent();\n      const next = getAttendables(selector, event.target);\n      // TODO(wittjosiah): Not allowing empty state means that the attended item is not strictly guaranteed to be in the DOM.\n      //   Currently this depends on the deck in order to ensure that when the attended item is removed something else is attended.\n      // Only update state if the result is different and not empty.\n      if (next.length > 0 && (prev.length !== next.length || !!prev.find((id, index) => next[index] !== id))) {\n        attention.update(next);\n        onChange?.(next);\n      }\n    },\n    [attention, onChange],\n  );\n\n  return (\n    <AttentionContextProvider attention={attention}>\n      <div className='contents' onFocusCapture={handleFocus}>\n        {children}\n      </div>\n    </AttentionContextProvider>\n  );\n};\n\nexport type AttendableContainerProps = ThemedClassName<\n  ComponentPropsWithRef<'div'> & { id: string; asChild?: boolean }\n>;\n\n/**\n * Note that DeckPlugin and StackPlugin both handle attention on their own,\n * and when rendering content in those cases it is not necessary to also render an `AttendableContainer`.\n * This component is primarily for Storybook stories and other testing scenarios,\n * or the rare cases where an attendable entity is rendered outside of either of those plugins.\n */\nconst AttendableContainer = forwardRef<HTMLDivElement, AttendableContainerProps>(\n  ({ id, classNames, children, asChild, ...props }, forwardedRef) => {\n    const attentionAttrs = useAttentionAttributes(id);\n    const Comp = asChild ? Slot : Primitive.div;\n    return (\n      <Comp\n        role='none'\n        {...props}\n        {...attentionAttrs}\n        className={mx('dx-attention-surface', props.tabIndex === 0 && 'dx-focus-ring-inset-over-all', classNames)}\n        ref={forwardedRef}\n      >\n        {children}\n      </Comp>\n    );\n  },\n);\n\nexport {\n  AttendableContainer,\n  RootAttentionProvider,\n  useAttended,\n  useAttention,\n  useAttentionAttributes,\n  useAttentionContext,\n};\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport { RegistryContext } from '@effect-atom/atom-react';\nimport { createContext } from '@radix-ui/react-context';\nimport React, { type PropsWithChildren, useContext, useEffect, useMemo, useState } from 'react';\n\nimport { invariant } from '@dxos/invariant';\nimport { useDefaultValue } from '@dxos/react-hooks';\n\nimport {\n  type SelectionMode,\n  type SelectionResult,\n  resolveSelection,\n  selectionAspect,\n  toggleSelection,\n} from '../../selection';\nimport { type AspectDef, ViewStateManager, createDefaultBackends } from '../../view-state';\n\nconst VIEW_STATE_NAME = 'ViewState';\n\ntype ViewStateContextValue = { manager?: ViewStateManager };\n\n// Default value lets consumers render outside a provider (isolated stories/tests) without throwing;\n// `manager` reads as `undefined` and hooks fall back to aspect defaults / no-op actions.\nconst [ViewStateContextProvider, useViewStateContext] = createContext<ViewStateContextValue>(VIEW_STATE_NAME, {\n  manager: undefined,\n});\n\n/** Provides the per-context UI state manager. Replaces the former `SelectionProvider`. */\nexport const ViewStateProvider = ({\n  children,\n  manager: managerProp,\n}: PropsWithChildren<{ manager?: ViewStateManager }>) => {\n  const registry = useContext(RegistryContext);\n  const manager = useDefaultValue(\n    managerProp,\n    () => new ViewStateManager({ registry, backends: createDefaultBackends(registry) }),\n  );\n  return <ViewStateContextProvider manager={manager}>{children}</ViewStateContextProvider>;\n};\n\n/** Access the underlying ViewStateManager from context. Throws when used outside a `ViewStateProvider`. */\nexport const useViewStateManager = (): ViewStateManager => {\n  const { manager } = useViewStateContext(VIEW_STATE_NAME);\n  invariant(manager, 'useViewStateManager() requires a ViewStateProvider ancestor.');\n  return manager;\n};\n\n/** Access the ViewStateManager if a provider is present; `undefined` otherwise (e.g. isolated stories/tests). */\nexport const useViewStateManagerOptional = (): ViewStateManager | undefined => {\n  const { manager } = useViewStateContext(VIEW_STATE_NAME);\n  return manager;\n};\n\n/** Reactive read of an aspect value for a context; yields the aspect default when unset or unprovided. */\nexport const useViewState = <T,>(aspect: AspectDef<T>, contextId?: string): T => {\n  const { manager } = useViewStateContext(VIEW_STATE_NAME);\n  const [value, setValue] = useState<T>(() =>\n    contextId && manager ? manager.get(aspect, contextId) : aspect.defaultValue(),\n  );\n  useEffect(() => {\n    if (!contextId || !manager) {\n      setValue(aspect.defaultValue());\n      return;\n    }\n    setValue(manager.get(aspect, contextId));\n    return manager.subscribe(aspect, contextId, setValue);\n  }, [manager, aspect, contextId]);\n  return value;\n};\n\nexport type UseViewStateActions<T> = {\n  set: (value: T) => void;\n  update: (fn: (prev: T) => T) => void;\n  clear: () => void;\n};\n\nexport const useViewStateActions = <T,>(aspect: AspectDef<T>, contextId?: string): UseViewStateActions<T> => {\n  const { manager } = useViewStateContext(VIEW_STATE_NAME);\n  return useMemo<UseViewStateActions<T>>(\n    () => ({\n      set: (value) => {\n        if (contextId) {\n          manager?.set(aspect, contextId, value);\n        }\n      },\n      update: (fn) => {\n        if (contextId) {\n          manager?.update(aspect, contextId, fn);\n        }\n      },\n      clear: () => {\n        if (contextId) {\n          manager?.set(aspect, contextId, aspect.defaultValue());\n        }\n      },\n    }),\n    [manager, aspect, contextId],\n  );\n};\n\n/** Resolved selection value for `contextId` in the requested `mode` (default `multi`). */\nexport const useSelection = <T extends SelectionMode>(contextId?: string, mode: T = 'multi' as T): SelectionResult<T> =>\n  resolveSelection(useViewState(selectionAspect, contextId), mode);\n\nexport type UseSelectionActions = {\n  single: (id: string) => void;\n  multi: (ids: string[]) => void;\n  range: (from: string, to: string) => void;\n  toggle: (id: string) => void;\n  clear: () => void;\n};\n\n/** Selection mutators for a single context, built on the generic ViewState actions. */\nexport const useSelectionActions = (contextId?: string): UseSelectionActions => {\n  const { update, clear } = useViewStateActions(selectionAspect, contextId);\n  return useMemo<UseSelectionActions>(\n    () => ({\n      single: (id) => update(() => ({ mode: 'single', id })),\n      multi: (ids) => update(() => ({ mode: 'multi', ids: [...ids] })),\n      range: (from, to) => update(() => ({ mode: 'range', from, to })),\n      toggle: (id) => update((prev) => toggleSelection(prev, id)),\n      clear,\n    }),\n    [update, clear],\n  );\n};\n"],
+  "mappings": "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",
+  "names": ["RegistryContext", "createContext", "Primitive", "Slot", "React", "forwardRef", "useCallback", "useContext", "useEffect", "useMemo", "useState", "log", "useDefaultValue", "mx", "ATTENTION_NAME", "ATTENTION_SOURCE_ATTRIBUTE", "AttentionContextProvider", "attention", "undefined", "UNKNOWN_ATTENDABLE", "isAncestor", "isRelated", "setState", "useState", "useEffect", "attendableId", "subscribe", "newState", "useAttended", "setCurrent", "newCurrent", "attributes", "ATTENDABLE_ATTRIBUTE", "hasAttention", "useDefaultValue", "propsAttention", "AttentionManager", "registry", "handleFocus", "useCallback", "event", "log", "target", "selector", "join", "prev", "getCurrent", "next", "onChange", "div", "className", "onFocusCapture", "children", "Comp", "role", "attentionAttrs", "ref", "AttendableContainer", "RegistryContext", "createContext", "React", "useContext", "useEffect", "useMemo", "useState", "invariant", "useDefaultValue", "__dxlog_file", "VIEW_STATE_NAME", "createContext", "registry", "backends", "createDefaultBackends", "ViewStateContextProvider", "manager", "children", "defaultValue", "useEffect", "contextId", "setValue", "useMemo", "set", "value", "update", "clear", "aspect", "single", "mode", "id", "ids", "from", "to"]
+}

package/dist/lib/browser/index.mjs

@@ -1,20 +1,27 @@
 import {
   AttendableContainer,
   RootAttentionProvider,
-  SelectionProvider,
+  ViewStateProvider,
   useAttended,
   useAttention,
   useAttentionAttributes,
   useAttentionContext,
-  useSelected,
+  useSelection,
   useSelectionActions,
-  useSelectionManager
-} from "./chunk-I4VO2RQM.mjs";
+  useViewState,
+  useViewStateActions,
+  useViewStateManager,
+  useViewStateManagerOptional
+} from "./chunk-I4FDY4AZ.mjs";
 import {
   AttentionManager,
-  SelectionManager,
+  LocalBackend,
+  MemoryBackend,
   SelectionSchema,
+  ViewStateManager,
+  createDefaultBackends,
   defaultSelection,
+  defineViewState,
   expandAttendableId,
   getAttendables,
   getLinkedVariant,
@@ -22,8 +29,11 @@ import {
   getSegmentId,
   getSelectionSet,
   isLinkedSegment,
-  linkedSegment
-} from "./chunk-D2BLVJ6Z.mjs";
+  linkedSegment,
+  resolveSelection,
+  selectionAspect,
+  toggleSelection
+} from "./chunk-4HYAJ4IO.mjs";
 
 // src/components/AttentionGlyph/AttentionGlyph.tsx
 import React, { forwardRef, useMemo } from "react";
@@ -94,7 +104,7 @@ var AttentionGlyph = /* @__PURE__ */ forwardRef(({ presence, attended, syncing,
 
 // src/useArticleKeyboardNavigation.ts
 import { useEffect, useMemo as useMemo2 } from "react";
-import { Keyboard } from "@dxos/keyboard";
+import { Keyboard, nestKeyboardContext } from "@dxos/keyboard";
 var advance = ({ ids, currentId, delta }) => {
   if (ids.length === 0) {
     return void 0;
@@ -116,9 +126,10 @@ var useArticleKeyboardNavigation = ({ articleId, items, currentId, getId, onSele
     if (!hasAttention) {
       return;
     }
-    const context = Keyboard.singleton.getContext(articleId);
+    const contextPath = nestKeyboardContext(articleId);
+    const context = Keyboard.singleton.getContext(contextPath);
     const prevContext = Keyboard.singleton.getCurrentContext();
-    Keyboard.singleton.setCurrentContext(articleId);
+    Keyboard.singleton.setCurrentContext(contextPath);
     const nextBinding = {
       shortcut: "j",
       handler: () => {
@@ -154,7 +165,7 @@ var useArticleKeyboardNavigation = ({ articleId, items, currentId, getId, onSele
     return () => {
       context.unbind("j");
       context.unbind("k");
-      if (Keyboard.singleton.getCurrentContext() === articleId) {
+      if (Keyboard.singleton.getCurrentContext() === contextPath) {
         Keyboard.singleton.setCurrentContext(prevContext);
       }
     };
@@ -170,13 +181,17 @@ export {
   AttendableContainer,
   AttentionGlyph,
   AttentionManager,
+  LocalBackend,
+  MemoryBackend,
   RootAttentionProvider,
-  SelectionManager,
-  SelectionProvider,
   SelectionSchema,
   Syncing,
+  ViewStateManager,
+  ViewStateProvider,
   advance,
+  createDefaultBackends,
   defaultSelection,
+  defineViewState,
   expandAttendableId,
   getAttendables,
   getLinkedVariant,
@@ -185,13 +200,19 @@ export {
   getSelectionSet,
   isLinkedSegment,
   linkedSegment,
+  resolveSelection,
+  selectionAspect,
+  toggleSelection,
   useArticleKeyboardNavigation,
   useAttended,
   useAttention,
   useAttentionAttributes,
   useAttentionContext,
-  useSelected,
+  useSelection,
   useSelectionActions,
-  useSelectionManager
+  useViewState,
+  useViewStateActions,
+  useViewStateManager,
+  useViewStateManagerOptional
 };
 //# sourceMappingURL=index.mjs.map

package/dist/lib/browser/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/AttentionGlyph/AttentionGlyph.tsx", "../../../src/useArticleKeyboardNavigation.ts"],
-  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Primitive } from '@radix-ui/react-primitive';\nimport React, { type CSSProperties, type ComponentPropsWithRef, forwardRef, useMemo } from 'react';\n\nimport { Icon, type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nconst attentionGlyphStyles = mx(\n  'inline-block rounded-xs w-3 h-3 bg-transparent text-accent-text transition-colors',\n  '[[data-contains-attended=true]_&]:bg-attention-contains',\n  '[[data-attention=true]_&]:bg-accent-bg',\n  '[[data-attention=true]_&]:text-accent-fg',\n  '[[aria-current][data-attention=true]_&]:bg-accent-bg',\n  '[[aria-current][data-attention=true]_&]:text-accent-fg',\n  '[[aria-selected=\"true\"][data-attention=true]_&]:bg-accent-bg',\n  '[[aria-selected=\"true\"][data-attention=true]_&]:text-accent-fg',\n);\n\nconst presenceIconStyles = mx('w-3 h-3');\n\nconst PresenceOne = () => {\n  return (\n    <svg\n      width='12'\n      height='12'\n      viewBox='0 0 12 12'\n      className={presenceIconStyles}\n      fill='none'\n      xmlns='http://www.w3.org/2000/svg'\n    >\n      <circle cx='6' cy='6' r='2.5' fill='currentColor' />\n    </svg>\n  );\n};\n\nconst PresenceMany = () => {\n  return (\n    <svg\n      width='12'\n      height='12'\n      viewBox='0 0 12 12'\n      className={presenceIconStyles}\n      fill='none'\n      xmlns='http://www.w3.org/2000/svg'\n    >\n      <path\n        d='M6.75 8.27311C7.38815 7.72296 7.79212 6.90866 7.79212 6C7.79212 5.09134 7.38815 4.27704 6.75 3.72689C7.06722 3.58122 7.42019 3.5 7.79212 3.5C9.17283 3.5 10.2921 4.61929 10.2921 6C10.2921 7.38071 9.17283 8.5 7.79212 8.5C7.42019 8.5 7.06723 8.41878 6.75 8.27311Z'\n        fill='currentColor'\n      />\n      <circle cx='4.25' cy='6' r='2.5' fill='currentColor' />\n    </svg>\n  );\n};\n\nexport const Syncing = () => {\n  const animationProps = useMemo<CSSProperties>(\n    () => ({\n      // Synchronize animations.\n      animationDelay: `-${Date.now() % 2_000}ms`,\n    }),\n    [],\n  );\n\n  return (\n    <div role='status' className='flex items-center'>\n      <Icon\n        icon='ph--circle-notch--bold'\n        size={3}\n        style={animationProps}\n        classNames='text-subdued animate-[spin_2s_linear_infinite]'\n      />\n    </div>\n  );\n};\n\nexport type AttentionGlyphProps = {\n  attended?: boolean;\n  containsAttended?: boolean;\n  syncing?: boolean;\n  presence?: 'none' | 'one' | 'many';\n} & ThemedClassName<Omit<ComponentPropsWithRef<typeof Primitive.span>, 'children'>>;\n\nexport const AttentionGlyph = forwardRef<HTMLSpanElement, AttentionGlyphProps>(\n  ({ presence, attended, syncing, containsAttended, classNames, ...props }, forwardedRef) => {\n    const icon = syncing ? (\n      <Syncing />\n    ) : presence === 'many' ? (\n      <PresenceMany />\n    ) : presence === 'one' ? (\n      <PresenceOne />\n    ) : null;\n\n    return (\n      <div className='flex group' data-attention={attended} data-contains-attended={containsAttended}>\n        <span {...props} className={mx(attentionGlyphStyles, classNames)} ref={forwardedRef}>\n          {icon}\n        </span>\n      </div>\n    );\n  },\n);\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport { useEffect, useMemo } from 'react';\n\nimport { Keyboard } from '@dxos/keyboard';\n\nimport { useAttention } from './components';\n\n/**\n * Compute the id to select after pressing 'j' (delta = 1) or 'k' (delta = -1).\n * Clamps at the list ends — pressing 'j' on the last item keeps the last item\n * selected (vim-style), and 'k' on the first item keeps the first.\n *\n * When no current selection exists, returns the first id (for delta = 1) or the\n * last id (for delta = -1) so the user can enter the list with either key.\n */\nexport const advance = ({\n  ids,\n  currentId,\n  delta,\n}: {\n  ids: readonly string[];\n  currentId: string | undefined;\n  delta: 1 | -1;\n}): string | undefined => {\n  if (ids.length === 0) {\n    return undefined;\n  }\n\n  const idx = currentId ? ids.indexOf(currentId) : -1;\n  if (idx === -1) {\n    return delta === 1 ? ids[0] : ids[ids.length - 1];\n  }\n\n  const next = Math.max(0, Math.min(ids.length - 1, idx + delta));\n  return ids[next];\n};\n\nexport type UseArticleKeyboardNavigationOptions<T> = {\n  /** Stable id for the article (used as the keyboard context path). */\n  articleId: string;\n  /** Ordered list of selectable items as they appear in the article. */\n  items: readonly T[];\n  /** Currently-selected id, if any. */\n  currentId: string | undefined;\n  /** Extracts the id from an item. Defaults to `item.id`. */\n  getId?: (item: T) => string;\n  /** Called with the id to select when the user presses 'j' or 'k'. */\n  onSelect: (id: string) => void;\n};\n\n/**\n * Wire 'j' (next) and 'k' (previous) keyboard shortcuts for an article that\n * navigates a list of items (e.g., messages, events). Bindings are scoped to\n * the article's keyboard context so they only fire while the article has attention.\n *\n * Pass the items directly; ids are derived via `getId` (defaults to `item.id`).\n * Clamps at list boundaries. Active only when the article is attended.\n */\nexport const useArticleKeyboardNavigation: {\n  <T extends { id: string }>(options: UseArticleKeyboardNavigationOptions<T>): void;\n  <T>(options: UseArticleKeyboardNavigationOptions<T> & { getId: (item: T) => string }): void;\n} = <T>({ articleId, items, currentId, getId, onSelect }: UseArticleKeyboardNavigationOptions<T>): void => {\n  const { hasAttention } = useAttention(articleId);\n\n  // `getId` is optional only when `T extends { id: string }` (enforced by the overloads above),\n  // so the fallback is sound; the cast bridges the generic erased by the implementation signature.\n  const ids = useMemo(() => items.map((item) => (getId ? getId(item) : (item as { id: string }).id)), [items, getId]);\n\n  useEffect(() => {\n    if (!hasAttention) {\n      return;\n    }\n\n    const context = Keyboard.singleton.getContext(articleId);\n    const prevContext = Keyboard.singleton.getCurrentContext();\n    Keyboard.singleton.setCurrentContext(articleId);\n\n    const nextBinding = {\n      shortcut: 'j',\n      handler: () => {\n        const target = advance({ ids, currentId, delta: 1 });\n        if (target !== undefined) {\n          onSelect(target);\n        }\n      },\n      data: 'Next item',\n      disableInput: true,\n    };\n    const prevBinding = {\n      shortcut: 'k',\n      handler: () => {\n        const target = advance({ ids, currentId, delta: -1 });\n        if (target !== undefined) {\n          onSelect(target);\n        }\n      },\n      data: 'Previous item',\n      disableInput: true,\n    };\n\n    context.bind(nextBinding);\n    context.bind(prevBinding);\n\n    return () => {\n      context.unbind('j');\n      context.unbind('k');\n      // Restore the prior context if we were the ones who set it.\n      if (Keyboard.singleton.getCurrentContext() === articleId) {\n        Keyboard.singleton.setCurrentContext(prevContext);\n      }\n    };\n  }, [articleId, ids, currentId, onSelect, hasAttention]);\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,OAAOA,SAAyDC,YAAYC,eAAe;AAE3F,SAASC,YAAkC;AAC3C,SAASC,UAAU;AAEnB,IAAMC,uBAAuBD,GAC3B,qFACA,2DACA,0CACA,4CACA,wDACA,0DACA,gEACA,gEAAA;AAGF,IAAME,qBAAqBF,GAAG,SAAA;AAE9B,IAAMG,cAAc,MAAA;AAClB,SACE,sBAAA,cAACC,OAAAA;IACCC,OAAM;IACNC,QAAO;IACPC,SAAQ;IACRC,WAAWN;IACXO,MAAK;IACLC,OAAM;KAEN,sBAAA,cAACC,UAAAA;IAAOC,IAAG;IAAIC,IAAG;IAAIC,GAAE;IAAML,MAAK;;AAGzC;AAEA,IAAMM,eAAe,MAAA;AACnB,SACE,sBAAA,cAACX,OAAAA;IACCC,OAAM;IACNC,QAAO;IACPC,SAAQ;IACRC,WAAWN;IACXO,MAAK;IACLC,OAAM;KAEN,sBAAA,cAACM,QAAAA;IACCC,GAAE;IACFR,MAAK;MAEP,sBAAA,cAACE,UAAAA;IAAOC,IAAG;IAAOC,IAAG;IAAIC,GAAE;IAAML,MAAK;;AAG5C;AAEO,IAAMS,UAAU,MAAA;AACrB,QAAMC,iBAAiBrB,QACrB,OAAO;;IAELsB,gBAAgB,IAAIC,KAAKC,IAAG,IAAK,GAAA;EACnC,IACA,CAAA,CAAE;AAGJ,SACE,sBAAA,cAACC,OAAAA;IAAIC,MAAK;IAAShB,WAAU;KAC3B,sBAAA,cAACT,MAAAA;IACC0B,MAAK;IACLC,MAAM;IACNC,OAAOR;IACPS,YAAW;;AAInB;AASO,IAAMC,iBAAiBhC,2BAC5B,CAAC,EAAEiC,UAAUC,UAAUC,SAASC,kBAAkBL,YAAY,GAAGM,MAAAA,GAASC,iBAAAA;AACxE,QAAMV,OAAOO,UACX,sBAAA,cAACd,SAAAA,IAAAA,IACCY,aAAa,SACf,sBAAA,cAACf,cAAAA,IAAAA,IACCe,aAAa,QACf,sBAAA,cAAC3B,aAAAA,IAAAA,IACC;AAEJ,SACE,sBAAA,cAACoB,OAAAA;IAAIf,WAAU;IAAa4B,kBAAgBL;IAAUM,0BAAwBJ;KAC5E,sBAAA,cAACK,QAAAA;IAAM,GAAGJ;IAAO1B,WAAWR,GAAGC,sBAAsB2B,UAAAA;IAAaW,KAAKJ;KACpEV,IAAAA,CAAAA;AAIT,CAAA;;;AClGF,SAASe,WAAWC,WAAAA,gBAAe;AAEnC,SAASC,gBAAgB;AAYlB,IAAMC,UAAU,CAAC,EACtBC,KACAC,WACAC,MAAK,MAKN;AACC,MAAIF,IAAIG,WAAW,GAAG;AACpB,WAAOC;EACT;AAEA,QAAMC,MAAMJ,YAAYD,IAAIM,QAAQL,SAAAA,IAAa;AACjD,MAAII,QAAQ,IAAI;AACd,WAAOH,UAAU,IAAIF,IAAI,CAAA,IAAKA,IAAIA,IAAIG,SAAS,CAAA;EACjD;AAEA,QAAMI,OAAOC,KAAKC,IAAI,GAAGD,KAAKE,IAAIV,IAAIG,SAAS,GAAGE,MAAMH,KAAAA,CAAAA;AACxD,SAAOF,IAAIO,IAAAA;AACb;AAuBO,IAAMI,+BAGT,CAAI,EAAEC,WAAWC,OAAOZ,WAAWa,OAAOC,SAAQ,MAA0C;AAC9F,QAAM,EAAEC,aAAY,IAAKC,aAAaL,SAAAA;AAItC,QAAMZ,MAAMkB,SAAQ,MAAML,MAAMM,IAAI,CAACC,SAAUN,QAAQA,MAAMM,IAAAA,IAASA,KAAwBC,EAAE,GAAI;IAACR;IAAOC;GAAM;AAElHQ,YAAU,MAAA;AACR,QAAI,CAACN,cAAc;AACjB;IACF;AAEA,UAAMO,UAAUC,SAASC,UAAUC,WAAWd,SAAAA;AAC9C,UAAMe,cAAcH,SAASC,UAAUG,kBAAiB;AACxDJ,aAASC,UAAUI,kBAAkBjB,SAAAA;AAErC,UAAMkB,cAAc;MAClBC,UAAU;MACVC,SAAS,MAAA;AACP,cAAMC,SAASlC,QAAQ;UAAEC;UAAKC;UAAWC,OAAO;QAAE,CAAA;AAClD,YAAI+B,WAAW7B,QAAW;AACxBW,mBAASkB,MAAAA;QACX;MACF;MACAC,MAAM;MACNC,cAAc;IAChB;AACA,UAAMC,cAAc;MAClBL,UAAU;MACVC,SAAS,MAAA;AACP,cAAMC,SAASlC,QAAQ;UAAEC;UAAKC;UAAWC,OAAO;QAAG,CAAA;AACnD,YAAI+B,WAAW7B,QAAW;AACxBW,mBAASkB,MAAAA;QACX;MACF;MACAC,MAAM;MACNC,cAAc;IAChB;AAEAZ,YAAQc,KAAKP,WAAAA;AACbP,YAAQc,KAAKD,WAAAA;AAEb,WAAO,MAAA;AACLb,cAAQe,OAAO,GAAA;AACff,cAAQe,OAAO,GAAA;AAEf,UAAId,SAASC,UAAUG,kBAAiB,MAAOhB,WAAW;AACxDY,iBAASC,UAAUI,kBAAkBF,WAAAA;MACvC;IACF;EACF,GAAG;IAACf;IAAWZ;IAAKC;IAAWc;IAAUC;GAAa;AACxD;",
-  "names": ["React", "forwardRef", "useMemo", "Icon", "mx", "attentionGlyphStyles", "presenceIconStyles", "PresenceOne", "svg", "width", "height", "viewBox", "className", "fill", "xmlns", "circle", "cx", "cy", "r", "PresenceMany", "path", "d", "Syncing", "animationProps", "animationDelay", "Date", "now", "div", "role", "icon", "size", "style", "classNames", "AttentionGlyph", "presence", "attended", "syncing", "containsAttended", "props", "forwardedRef", "data-attention", "data-contains-attended", "span", "ref", "useEffect", "useMemo", "Keyboard", "advance", "ids", "currentId", "delta", "length", "undefined", "idx", "indexOf", "next", "Math", "max", "min", "useArticleKeyboardNavigation", "articleId", "items", "getId", "onSelect", "hasAttention", "useAttention", "useMemo", "map", "item", "id", "useEffect", "context", "Keyboard", "singleton", "getContext", "prevContext", "getCurrentContext", "setCurrentContext", "nextBinding", "shortcut", "handler", "target", "data", "disableInput", "prevBinding", "bind", "unbind"]
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Primitive } from '@radix-ui/react-primitive';\nimport React, { type ComponentPropsWithRef, type CSSProperties, forwardRef, useMemo } from 'react';\n\nimport { Icon, type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nconst attentionGlyphStyles = mx(\n  'inline-block rounded-xs w-3 h-3 bg-transparent text-accent-text transition-colors',\n  '[[data-contains-attended=true]_&]:bg-attention-contains',\n  '[[data-attention=true]_&]:bg-accent-bg',\n  '[[data-attention=true]_&]:text-accent-fg',\n  '[[aria-current][data-attention=true]_&]:bg-accent-bg',\n  '[[aria-current][data-attention=true]_&]:text-accent-fg',\n  '[[aria-selected=\"true\"][data-attention=true]_&]:bg-accent-bg',\n  '[[aria-selected=\"true\"][data-attention=true]_&]:text-accent-fg',\n);\n\nconst presenceIconStyles = mx('w-3 h-3');\n\nconst PresenceOne = () => {\n  return (\n    <svg\n      width='12'\n      height='12'\n      viewBox='0 0 12 12'\n      className={presenceIconStyles}\n      fill='none'\n      xmlns='http://www.w3.org/2000/svg'\n    >\n      <circle cx='6' cy='6' r='2.5' fill='currentColor' />\n    </svg>\n  );\n};\n\nconst PresenceMany = () => {\n  return (\n    <svg\n      width='12'\n      height='12'\n      viewBox='0 0 12 12'\n      className={presenceIconStyles}\n      fill='none'\n      xmlns='http://www.w3.org/2000/svg'\n    >\n      <path\n        d='M6.75 8.27311C7.38815 7.72296 7.79212 6.90866 7.79212 6C7.79212 5.09134 7.38815 4.27704 6.75 3.72689C7.06722 3.58122 7.42019 3.5 7.79212 3.5C9.17283 3.5 10.2921 4.61929 10.2921 6C10.2921 7.38071 9.17283 8.5 7.79212 8.5C7.42019 8.5 7.06723 8.41878 6.75 8.27311Z'\n        fill='currentColor'\n      />\n      <circle cx='4.25' cy='6' r='2.5' fill='currentColor' />\n    </svg>\n  );\n};\n\nexport const Syncing = () => {\n  const animationProps = useMemo<CSSProperties>(\n    () => ({\n      // Synchronize animations.\n      animationDelay: `-${Date.now() % 2_000}ms`,\n    }),\n    [],\n  );\n\n  return (\n    <div role='status' className='flex items-center'>\n      <Icon\n        icon='ph--circle-notch--bold'\n        size={3}\n        style={animationProps}\n        classNames='text-subdued animate-[spin_2s_linear_infinite]'\n      />\n    </div>\n  );\n};\n\nexport type AttentionGlyphProps = {\n  attended?: boolean;\n  containsAttended?: boolean;\n  syncing?: boolean;\n  presence?: 'none' | 'one' | 'many';\n} & ThemedClassName<Omit<ComponentPropsWithRef<typeof Primitive.span>, 'children'>>;\n\nexport const AttentionGlyph = forwardRef<HTMLSpanElement, AttentionGlyphProps>(\n  ({ presence, attended, syncing, containsAttended, classNames, ...props }, forwardedRef) => {\n    const icon = syncing ? (\n      <Syncing />\n    ) : presence === 'many' ? (\n      <PresenceMany />\n    ) : presence === 'one' ? (\n      <PresenceOne />\n    ) : null;\n\n    return (\n      <div className='flex group' data-attention={attended} data-contains-attended={containsAttended}>\n        <span {...props} className={mx(attentionGlyphStyles, classNames)} ref={forwardedRef}>\n          {icon}\n        </span>\n      </div>\n    );\n  },\n);\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport { useEffect, useMemo } from 'react';\n\nimport { Keyboard, nestKeyboardContext } from '@dxos/keyboard';\n\nimport { useAttention } from './components';\n\n/**\n * Compute the id to select after pressing 'j' (delta = 1) or 'k' (delta = -1).\n * Clamps at the list ends — pressing 'j' on the last item keeps the last item\n * selected (vim-style), and 'k' on the first item keeps the first.\n *\n * When no current selection exists, returns the first id (for delta = 1) or the\n * last id (for delta = -1) so the user can enter the list with either key.\n */\nexport const advance = ({\n  ids,\n  currentId,\n  delta,\n}: {\n  ids: readonly string[];\n  currentId: string | undefined;\n  delta: 1 | -1;\n}): string | undefined => {\n  if (ids.length === 0) {\n    return undefined;\n  }\n\n  const idx = currentId ? ids.indexOf(currentId) : -1;\n  if (idx === -1) {\n    return delta === 1 ? ids[0] : ids[ids.length - 1];\n  }\n\n  const next = Math.max(0, Math.min(ids.length - 1, idx + delta));\n  return ids[next];\n};\n\nexport type UseArticleKeyboardNavigationOptions<T> = {\n  /** Stable id for the article (used as the keyboard context path). */\n  articleId: string;\n  /** Ordered list of selectable items as they appear in the article. */\n  items: readonly T[];\n  /** Currently-selected id, if any. */\n  currentId: string | undefined;\n  /** Extracts the id from an item. Defaults to `item.id`. */\n  getId?: (item: T) => string;\n  /** Called with the id to select when the user presses 'j' or 'k'. */\n  onSelect: (id: string) => void;\n};\n\n/**\n * Wire 'j' (next) and 'k' (previous) keyboard shortcuts for an article that\n * navigates a list of items (e.g., messages, events). Bindings are scoped to\n * the article's keyboard context so they only fire while the article has attention.\n *\n * Pass the items directly; ids are derived via `getId` (defaults to `item.id`).\n * Clamps at list boundaries. Active only when the article is attended.\n */\nexport const useArticleKeyboardNavigation: {\n  <T extends { id: string }>(options: UseArticleKeyboardNavigationOptions<T>): void;\n  <T>(options: UseArticleKeyboardNavigationOptions<T> & { getId: (item: T) => string }): void;\n} = <T>({ articleId, items, currentId, getId, onSelect }: UseArticleKeyboardNavigationOptions<T>): void => {\n  const { hasAttention } = useAttention(articleId);\n\n  // `getId` is optional only when `T extends { id: string }` (enforced by the overloads above),\n  // so the fallback is sound; the cast bridges the generic erased by the implementation signature.\n  const ids = useMemo(() => items.map((item) => (getId ? getId(item) : (item as { id: string }).id)), [items, getId]);\n\n  useEffect(() => {\n    if (!hasAttention) {\n      return;\n    }\n\n    const contextPath = nestKeyboardContext(articleId);\n    const context = Keyboard.singleton.getContext(contextPath);\n    const prevContext = Keyboard.singleton.getCurrentContext();\n    Keyboard.singleton.setCurrentContext(contextPath);\n\n    const nextBinding = {\n      shortcut: 'j',\n      handler: () => {\n        const target = advance({ ids, currentId, delta: 1 });\n        if (target !== undefined) {\n          onSelect(target);\n        }\n      },\n      data: 'Next item',\n      disableInput: true,\n    };\n    const prevBinding = {\n      shortcut: 'k',\n      handler: () => {\n        const target = advance({ ids, currentId, delta: -1 });\n        if (target !== undefined) {\n          onSelect(target);\n        }\n      },\n      data: 'Previous item',\n      disableInput: true,\n    };\n\n    context.bind(nextBinding);\n    context.bind(prevBinding);\n\n    return () => {\n      context.unbind('j');\n      context.unbind('k');\n      // Restore the prior context if we were the ones who set it.\n      if (Keyboard.singleton.getCurrentContext() === contextPath) {\n        Keyboard.singleton.setCurrentContext(prevContext);\n      }\n    };\n  }, [articleId, ids, currentId, onSelect, hasAttention]);\n};\n"],
+  "mappings": "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",
+  "names": ["React", "forwardRef", "useMemo", "Icon", "mx", "attentionGlyphStyles", "presenceIconStyles", "PresenceOne", "svg", "width", "height", "viewBox", "className", "fill", "xmlns", "circle", "cx", "cy", "r", "PresenceMany", "path", "d", "Syncing", "animationProps", "animationDelay", "Date", "now", "div", "role", "icon", "size", "style", "classNames", "AttentionGlyph", "presence", "attended", "syncing", "containsAttended", "props", "forwardedRef", "data-attention", "data-contains-attended", "span", "ref", "useEffect", "useMemo", "Keyboard", "nestKeyboardContext", "advance", "ids", "currentId", "delta", "length", "undefined", "idx", "indexOf", "next", "Math", "max", "min", "useArticleKeyboardNavigation", "articleId", "items", "getId", "onSelect", "hasAttention", "useAttention", "useMemo", "map", "item", "id", "useEffect", "contextPath", "nestKeyboardContext", "context", "Keyboard", "singleton", "getContext", "prevContext", "getCurrentContext", "setCurrentContext", "nextBinding", "shortcut", "handler", "target", "data", "disableInput", "prevBinding", "bind", "unbind"]
 }

package/dist/lib/browser/meta.json

@@ -1 +1 @@
-{"inputs":{"src/attention.ts":{"bytes":25933,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true}],"format":"esm"},"src/components/AttentionGlyph/AttentionGlyph.tsx":{"bytes":9775,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true}],"format":"esm"},"src/components/AttentionGlyph/index.ts":{"bytes":394,"imports":[{"path":"src/components/AttentionGlyph/AttentionGlyph.tsx","kind":"import-statement","original":"./AttentionGlyph"}],"format":"esm"},"src/components/AttentionProvider/AttentionProvider.tsx":{"bytes":18161,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"@radix-ui/react-primitive","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"src/attention.ts","kind":"import-statement","original":"../../attention"}],"format":"esm"},"src/components/AttentionProvider/index.ts":{"bytes":401,"imports":[{"path":"src/components/AttentionProvider/AttentionProvider.tsx","kind":"import-statement","original":"./AttentionProvider"}],"format":"esm"},"src/selection.ts":{"bytes":27361,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"effect/Match","kind":"import-statement","external":true},{"path":"effect/Schema","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true}],"format":"esm"},"src/components/SelectionProvider/SelectionProvider.tsx":{"bytes":16598,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"effect/Match","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"src/selection.ts","kind":"import-statement","original":"../../selection"}],"format":"esm"},"src/components/SelectionProvider/index.ts":{"bytes":401,"imports":[{"path":"src/components/SelectionProvider/SelectionProvider.tsx","kind":"import-statement","original":"./SelectionProvider"}],"format":"esm"},"src/components/index.ts":{"bytes":616,"imports":[{"path":"src/components/AttentionGlyph/index.ts","kind":"import-statement","original":"./AttentionGlyph"},{"path":"src/components/AttentionProvider/index.ts","kind":"import-statement","original":"./AttentionProvider"},{"path":"src/components/SelectionProvider/index.ts","kind":"import-statement","original":"./SelectionProvider"}],"format":"esm"},"src/useArticleKeyboardNavigation.ts":{"bytes":11610,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/keyboard","kind":"import-statement","external":true},{"path":"src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"},"src/index.ts":{"bytes":700,"imports":[{"path":"src/attention.ts","kind":"import-statement","original":"./attention"},{"path":"src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"src/selection.ts","kind":"import-statement","original":"./selection"},{"path":"src/useArticleKeyboardNavigation.ts","kind":"import-statement","original":"./useArticleKeyboardNavigation"}],"format":"esm"},"src/testing/decorators/withAttention.ts":{"bytes":3505,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"src/attention.ts","kind":"import-statement","original":"../../attention"},{"path":"src/components/index.ts","kind":"import-statement","original":"../../components"}],"format":"esm"},"src/testing/decorators/index.ts":{"bytes":389,"imports":[{"path":"src/testing/decorators/withAttention.ts","kind":"import-statement","original":"./withAttention"}],"format":"esm"},"src/testing/index.ts":{"bytes":382,"imports":[{"path":"src/testing/decorators/index.ts","kind":"import-statement","original":"./decorators"}],"format":"esm"},"src/types/index.ts":{"bytes":1067,"imports":[{"path":"src/attention.ts","kind":"import-statement","original":"../attention"},{"path":"src/selection.ts","kind":"import-statement","original":"../selection"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":11016},"dist/lib/browser/index.mjs":{"imports":[{"path":"dist/lib/browser/chunk-I4VO2RQM.mjs","kind":"import-statement"},{"path":"dist/lib/browser/chunk-D2BLVJ6Z.mjs","kind":"import-statement"},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/keyboard","kind":"import-statement","external":true}],"exports":["AttendableContainer","AttentionGlyph","AttentionManager","RootAttentionProvider","SelectionManager","SelectionProvider","SelectionSchema","Syncing","advance","defaultSelection","expandAttendableId","getAttendables","getLinkedVariant","getParentId","getSegmentId","getSelectionSet","isLinkedSegment","linkedSegment","useArticleKeyboardNavigation","useAttended","useAttention","useAttentionAttributes","useAttentionContext","useSelected","useSelectionActions","useSelectionManager"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":0},"src/components/AttentionGlyph/AttentionGlyph.tsx":{"bytesInOutput":2911},"src/useArticleKeyboardNavigation.ts":{"bytesInOutput":1896}},"bytes":5966},"dist/lib/browser/testing/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":1875},"dist/lib/browser/testing/index.mjs":{"imports":[{"path":"dist/lib/browser/chunk-I4VO2RQM.mjs","kind":"import-statement"},{"path":"dist/lib/browser/chunk-D2BLVJ6Z.mjs","kind":"import-statement"},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["withAttention"],"entryPoint":"src/testing/index.ts","inputs":{"src/testing/decorators/withAttention.ts":{"bytesInOutput":610},"src/testing/index.ts":{"bytesInOutput":0}},"bytes":863},"dist/lib/browser/chunk-I4VO2RQM.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":17646},"dist/lib/browser/chunk-I4VO2RQM.mjs":{"imports":[{"path":"dist/lib/browser/chunk-D2BLVJ6Z.mjs","kind":"import-statement"},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"@radix-ui/react-primitive","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"effect/Match","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true}],"exports":["AttendableContainer","RootAttentionProvider","SelectionProvider","useAttended","useAttention","useAttentionAttributes","useAttentionContext","useSelected","useSelectionActions","useSelectionManager"],"inputs":{"src/components/AttentionProvider/AttentionProvider.tsx":{"bytesInOutput":3786},"src/components/SelectionProvider/SelectionProvider.tsx":{"bytesInOutput":3529}},"bytes":7816},"dist/lib/browser/types/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":93},"dist/lib/browser/types/index.mjs":{"imports":[{"path":"dist/lib/browser/chunk-D2BLVJ6Z.mjs","kind":"import-statement"}],"exports":["AttentionManager","SelectionManager","SelectionSchema","defaultSelection","expandAttendableId","getAttendables","getLinkedVariant","getParentId","getSegmentId","getSelectionSet","isLinkedSegment","linkedSegment"],"entryPoint":"src/types/index.ts","inputs":{"src/types/index.ts":{"bytesInOutput":0}},"bytes":536},"dist/lib/browser/chunk-D2BLVJ6Z.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":25344},"dist/lib/browser/chunk-D2BLVJ6Z.mjs":{"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"effect/Match","kind":"import-statement","external":true},{"path":"effect/Schema","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true}],"exports":["AttentionManager","SelectionManager","SelectionSchema","defaultSelection","expandAttendableId","getAttendables","getLinkedVariant","getParentId","getSegmentId","getSelectionSet","isLinkedSegment","linkedSegment"],"inputs":{"src/attention.ts":{"bytesInOutput":5433},"src/selection.ts":{"bytesInOutput":6966}},"bytes":12721}}}
+{"inputs":{"src/attention.ts":{"bytes":25933,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true}],"format":"esm"},"src/components/AttentionGlyph/AttentionGlyph.tsx":{"bytes":9775,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true}],"format":"esm"},"src/components/AttentionGlyph/index.ts":{"bytes":394,"imports":[{"path":"src/components/AttentionGlyph/AttentionGlyph.tsx","kind":"import-statement","original":"./AttentionGlyph"}],"format":"esm"},"src/components/AttentionProvider/AttentionProvider.tsx":{"bytes":18161,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"@radix-ui/react-primitive","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"src/attention.ts","kind":"import-statement","original":"../../attention"}],"format":"esm"},"src/components/AttentionProvider/index.ts":{"bytes":401,"imports":[{"path":"src/components/AttentionProvider/AttentionProvider.tsx","kind":"import-statement","original":"./AttentionProvider"}],"format":"esm"},"src/view-state/view-state.ts":{"bytes":8199,"imports":[],"format":"esm"},"src/view-state/backends.ts":{"bytes":19210,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"effect/Schema","kind":"import-statement","external":true}],"format":"esm"},"src/view-state/index.ts":{"bytes":470,"imports":[{"path":"src/view-state/view-state.ts","kind":"import-statement","original":"./view-state"},{"path":"src/view-state/backends.ts","kind":"import-statement","original":"./backends"}],"format":"esm"},"src/selection.ts":{"bytes":12380,"imports":[{"path":"effect/Match","kind":"import-statement","external":true},{"path":"effect/Schema","kind":"import-statement","external":true},{"path":"src/view-state/index.ts","kind":"import-statement","original":"./view-state"}],"format":"esm"},"src/components/ViewStateProvider/ViewStateProvider.tsx":{"bytes":15088,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"src/selection.ts","kind":"import-statement","original":"../../selection"},{"path":"src/view-state/index.ts","kind":"import-statement","original":"../../view-state"}],"format":"esm"},"src/components/ViewStateProvider/index.ts":{"bytes":401,"imports":[{"path":"src/components/ViewStateProvider/ViewStateProvider.tsx","kind":"import-statement","original":"./ViewStateProvider"}],"format":"esm"},"src/components/index.ts":{"bytes":616,"imports":[{"path":"src/components/AttentionGlyph/index.ts","kind":"import-statement","original":"./AttentionGlyph"},{"path":"src/components/AttentionProvider/index.ts","kind":"import-statement","original":"./AttentionProvider"},{"path":"src/components/ViewStateProvider/index.ts","kind":"import-statement","original":"./ViewStateProvider"}],"format":"esm"},"src/useArticleKeyboardNavigation.ts":{"bytes":11909,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/keyboard","kind":"import-statement","external":true},{"path":"src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"},"src/index.ts":{"bytes":790,"imports":[{"path":"src/attention.ts","kind":"import-statement","original":"./attention"},{"path":"src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"src/selection.ts","kind":"import-statement","original":"./selection"},{"path":"src/useArticleKeyboardNavigation.ts","kind":"import-statement","original":"./useArticleKeyboardNavigation"},{"path":"src/view-state/index.ts","kind":"import-statement","original":"./view-state"}],"format":"esm"},"src/testing/decorators/withAttention.ts":{"bytes":3505,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"src/attention.ts","kind":"import-statement","original":"../../attention"},{"path":"src/components/index.ts","kind":"import-statement","original":"../../components"}],"format":"esm"},"src/testing/decorators/index.ts":{"bytes":389,"imports":[{"path":"src/testing/decorators/withAttention.ts","kind":"import-statement","original":"./withAttention"}],"format":"esm"},"src/testing/index.ts":{"bytes":382,"imports":[{"path":"src/testing/decorators/index.ts","kind":"import-statement","original":"./decorators"}],"format":"esm"},"src/types/index.ts":{"bytes":1166,"imports":[{"path":"src/attention.ts","kind":"import-statement","original":"../attention"},{"path":"src/selection.ts","kind":"import-statement","original":"../selection"},{"path":"src/view-state/index.ts","kind":"import-statement","original":"../view-state"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":11207},"dist/lib/browser/index.mjs":{"imports":[{"path":"dist/lib/browser/chunk-I4FDY4AZ.mjs","kind":"import-statement"},{"path":"dist/lib/browser/chunk-4HYAJ4IO.mjs","kind":"import-statement"},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/keyboard","kind":"import-statement","external":true}],"exports":["AttendableContainer","AttentionGlyph","AttentionManager","LocalBackend","MemoryBackend","RootAttentionProvider","SelectionSchema","Syncing","ViewStateManager","ViewStateProvider","advance","createDefaultBackends","defaultSelection","defineViewState","expandAttendableId","getAttendables","getLinkedVariant","getParentId","getSegmentId","getSelectionSet","isLinkedSegment","linkedSegment","resolveSelection","selectionAspect","toggleSelection","useArticleKeyboardNavigation","useAttended","useAttention","useAttentionAttributes","useAttentionContext","useSelection","useSelectionActions","useViewState","useViewStateActions","useViewStateManager","useViewStateManagerOptional"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":0},"src/components/AttentionGlyph/AttentionGlyph.tsx":{"bytesInOutput":2911},"src/useArticleKeyboardNavigation.ts":{"bytesInOutput":1979}},"bytes":6461},"dist/lib/browser/testing/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":1875},"dist/lib/browser/testing/index.mjs":{"imports":[{"path":"dist/lib/browser/chunk-I4FDY4AZ.mjs","kind":"import-statement"},{"path":"dist/lib/browser/chunk-4HYAJ4IO.mjs","kind":"import-statement"},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["withAttention"],"entryPoint":"src/testing/index.ts","inputs":{"src/testing/decorators/withAttention.ts":{"bytesInOutput":610},"src/testing/index.ts":{"bytesInOutput":0}},"bytes":863},"dist/lib/browser/chunk-I4FDY4AZ.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":15951},"dist/lib/browser/chunk-I4FDY4AZ.mjs":{"imports":[{"path":"dist/lib/browser/chunk-4HYAJ4IO.mjs","kind":"import-statement"},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"@radix-ui/react-primitive","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true}],"exports":["AttendableContainer","RootAttentionProvider","ViewStateProvider","useAttended","useAttention","useAttentionAttributes","useAttentionContext","useSelection","useSelectionActions","useViewState","useViewStateActions","useViewStateManager","useViewStateManagerOptional"],"inputs":{"src/components/AttentionProvider/AttentionProvider.tsx":{"bytesInOutput":3786},"src/components/ViewStateProvider/ViewStateProvider.tsx":{"bytesInOutput":3199}},"bytes":7620},"dist/lib/browser/types/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":93},"dist/lib/browser/types/index.mjs":{"imports":[{"path":"dist/lib/browser/chunk-4HYAJ4IO.mjs","kind":"import-statement"}],"exports":["AttentionManager","LocalBackend","MemoryBackend","SelectionSchema","ViewStateManager","createDefaultBackends","defaultSelection","defineViewState","expandAttendableId","getAttendables","getLinkedVariant","getParentId","getSegmentId","getSelectionSet","isLinkedSegment","linkedSegment","resolveSelection","selectionAspect","toggleSelection"],"entryPoint":"src/types/index.ts","inputs":{"src/types/index.ts":{"bytesInOutput":0}},"bytes":806},"dist/lib/browser/chunk-4HYAJ4IO.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":33376},"dist/lib/browser/chunk-4HYAJ4IO.mjs":{"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"effect/Schema","kind":"import-statement","external":true},{"path":"effect/Match","kind":"import-statement","external":true},{"path":"effect/Schema","kind":"import-statement","external":true}],"exports":["AttentionManager","LocalBackend","MemoryBackend","SelectionSchema","ViewStateManager","createDefaultBackends","defaultSelection","defineViewState","expandAttendableId","getAttendables","getLinkedVariant","getParentId","getSegmentId","getSelectionSet","isLinkedSegment","linkedSegment","resolveSelection","selectionAspect","toggleSelection"],"inputs":{"src/attention.ts":{"bytesInOutput":5433},"src/view-state/view-state.ts":{"bytesInOutput":1053},"src/view-state/backends.ts":{"bytesInOutput":3752},"src/selection.ts":{"bytesInOutput":2312}},"bytes":13071}}}

package/dist/lib/browser/testing/index.mjs

@@ -1,10 +1,10 @@
 import {
   RootAttentionProvider,
-  SelectionProvider
-} from "../chunk-I4VO2RQM.mjs";
+  ViewStateProvider
+} from "../chunk-I4FDY4AZ.mjs";
 import {
   AttentionManager
-} from "../chunk-D2BLVJ6Z.mjs";
+} from "../chunk-4HYAJ4IO.mjs";
 
 // src/testing/decorators/withAttention.ts
 import { Registry, RegistryContext } from "@effect-atom/atom-react";
@@ -21,7 +21,7 @@ var withAttention = (initialAttendedId) => {
       value: registry
     }, createElement(RootAttentionProvider, {
       attention
-    }, createElement(SelectionProvider, {}, createElement(Story))));
+    }, createElement(ViewStateProvider, {}, createElement(Story))));
   };
 };
 export {

package/dist/lib/browser/testing/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/testing/decorators/withAttention.ts"],
-  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Registry, RegistryContext } from '@effect-atom/atom-react';\nimport { type Decorator } from '@storybook/react';\nimport { createElement, useMemo } from 'react';\n\nimport { AttentionManager } from '../../attention';\nimport { RootAttentionProvider, SelectionProvider } from '../../components';\n\n/**\n * Storybook decorator that provides attention context.\n * @param initialAttendedId Optional ID to set as initially attended.\n */\nexport const withAttention = (initialAttendedId?: string): Decorator => {\n  return (Story) => {\n    const registry = useMemo(() => Registry.make(), []);\n    const attention = useMemo(\n      () => (initialAttendedId ? new AttentionManager(registry, [initialAttendedId]) : undefined),\n      [registry],\n    );\n\n    return createElement(\n      RegistryContext.Provider,\n      { value: registry },\n      createElement(RootAttentionProvider, { attention }, createElement(SelectionProvider, {}, createElement(Story))),\n    );\n  };\n};\n"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Registry, RegistryContext } from '@effect-atom/atom-react';\nimport { type Decorator } from '@storybook/react';\nimport { createElement, useMemo } from 'react';\n\nimport { AttentionManager } from '../../attention';\nimport { RootAttentionProvider, ViewStateProvider } from '../../components';\n\n/**\n * Storybook decorator that provides attention context.\n * @param initialAttendedId Optional ID to set as initially attended.\n */\nexport const withAttention = (initialAttendedId?: string): Decorator => {\n  return (Story) => {\n    const registry = useMemo(() => Registry.make(), []);\n    const attention = useMemo(\n      () => (initialAttendedId ? new AttentionManager(registry, [initialAttendedId]) : undefined),\n      [registry],\n    );\n\n    return createElement(\n      RegistryContext.Provider,\n      { value: registry },\n      createElement(RootAttentionProvider, { attention }, createElement(ViewStateProvider, {}, createElement(Story))),\n    );\n  };\n};\n"],
   "mappings": ";;;;;;;;;AAIA,SAASA,UAAUC,uBAAuB;AAE1C,SAASC,eAAeC,eAAe;AAShC,IAAMC,gBAAgB,CAACC,sBAAAA;AAC5B,SAAO,CAACC,UAAAA;AACN,UAAMC,WAAWC,QAAQ,MAAMC,SAASC,KAAI,GAAI,CAAA,CAAE;AAClD,UAAMC,YAAYH,QAChB,MAAOH,oBAAoB,IAAIO,iBAAiBL,UAAU;MAACF;KAAkB,IAAIQ,QACjF;MAACN;KAAS;AAGZ,WAAOO,cACLC,gBAAgBC,UAChB;MAAEC,OAAOV;IAAS,GAClBO,cAAcI,uBAAuB;MAAEP;IAAU,GAAGG,cAAcK,mBAAmB,CAAC,GAAGL,cAAcR,KAAAA,CAAAA,CAAAA,CAAAA;EAE3G;AACF;",
-  "names": ["Registry", "RegistryContext", "createElement", "useMemo", "withAttention", "initialAttendedId", "Story", "registry", "useMemo", "Registry", "make", "attention", "AttentionManager", "undefined", "createElement", "RegistryContext", "Provider", "value", "RootAttentionProvider", "SelectionProvider"]
+  "names": ["Registry", "RegistryContext", "createElement", "useMemo", "withAttention", "initialAttendedId", "Story", "registry", "useMemo", "Registry", "make", "attention", "AttentionManager", "undefined", "createElement", "RegistryContext", "Provider", "value", "RootAttentionProvider", "ViewStateProvider"]
 }