@hexdspace/react 0.1.36 → 0.1.39

package/dist/index.js

@@ -353,8 +353,8 @@ var NotificationHost = ({
     return isDark() ? "dark" : "light";
   }, [isDark]);
   const transition = useMemo2(() => {
-    const config = resolvedTheme.transition;
-    return config ? cssTransition(config) : Slide;
+    const config2 = resolvedTheme.transition;
+    return config2 ? cssTransition(config2) : Slide;
   }, [resolvedTheme.transition]);
   const style = useMemo2(
     () => ({
@@ -490,17 +490,17 @@ var AutoRefreshDecorator = class _AutoRefreshDecorator {
     this.refresh = refresh2;
   }
   static inFlightRefresh = null;
-  async get(url, config) {
-    return this.tryRequest(() => this.httpClient.get(url, config));
+  async get(url, config2) {
+    return this.tryRequest(() => this.httpClient.get(url, config2));
   }
-  async post(url, data, config) {
-    return this.tryRequest(() => this.httpClient.post(url, data, config));
+  async post(url, data, config2) {
+    return this.tryRequest(() => this.httpClient.post(url, data, config2));
   }
-  async put(url, data, config) {
-    return this.tryRequest(() => this.httpClient.put(url, data, config));
+  async put(url, data, config2) {
+    return this.tryRequest(() => this.httpClient.put(url, data, config2));
   }
-  async delete(url, config) {
-    return this.tryRequest(() => this.httpClient.delete(url, config));
+  async delete(url, config2) {
+    return this.tryRequest(() => this.httpClient.delete(url, config2));
   }
   async tryRequest(fn) {
     try {
@@ -538,21 +538,21 @@ var FetchHttpClient = class {
   constructor(baseURL = "/api") {
     this.baseURL = baseURL;
   }
-  async get(url, config) {
-    return this.doRequest("GET", url, void 0, config);
+  async get(url, config2) {
+    return this.doRequest("GET", url, void 0, config2);
   }
-  async post(url, data, config) {
-    return this.doRequest("POST", url, data, config);
+  async post(url, data, config2) {
+    return this.doRequest("POST", url, data, config2);
   }
-  async put(url, data, config) {
-    return this.doRequest("PUT", url, data, config);
+  async put(url, data, config2) {
+    return this.doRequest("PUT", url, data, config2);
   }
-  async delete(url, config) {
-    return this.doRequest("DELETE", url, void 0, config);
+  async delete(url, config2) {
+    return this.doRequest("DELETE", url, void 0, config2);
   }
-  async doRequest(method, url, body, config) {
+  async doRequest(method, url, body, config2) {
     const isFormData = body instanceof FormData;
-    const headers = { ...config?.headers };
+    const headers = { ...config2?.headers };
     let parsedBody;
     if (body !== void 0) {
       parsedBody = isFormData ? body : JSON.stringify(body);
@@ -564,9 +564,9 @@ var FetchHttpClient = class {
       const res = await fetch(this.resolve(url), {
         method,
         body: parsedBody,
-        headers: { ...headers, ...config?.headers },
+        headers: { ...headers, ...config2?.headers },
         credentials: "include",
-        signal: config?.signal
+        signal: config2?.signal
       });
       const data = await (res.headers.get("content-type")?.includes("application/json") ? res.json() : res.text());
       if (!res.ok) {
@@ -630,24 +630,24 @@ var MockHttpClient = class {
   reset() {
     this.handlers.clear();
   }
-  get(url, config) {
-    return this.invoke("GET", url, void 0, config);
+  get(url, config2) {
+    return this.invoke("GET", url, void 0, config2);
   }
-  post(url, data, config) {
-    return this.invoke("POST", url, data, config);
+  post(url, data, config2) {
+    return this.invoke("POST", url, data, config2);
   }
-  put(url, data, config) {
-    return this.invoke("PUT", url, data, config);
+  put(url, data, config2) {
+    return this.invoke("PUT", url, data, config2);
   }
-  delete(url, config) {
-    return this.invoke("DELETE", url, void 0, config);
+  delete(url, config2) {
+    return this.invoke("DELETE", url, void 0, config2);
   }
-  invoke(method, url, data, config) {
+  invoke(method, url, data, config2) {
     const handler = this.handlers.get(getKey(method, url));
     if (!handler) {
       return Promise.reject(new Error(`No mock handler registered for ${method} ${url}`));
     }
-    const result = handler({ url, data, config });
+    const result = handler({ url, data, config: config2 });
     return Promise.resolve(result);
   }
 };
@@ -903,7 +903,7 @@ function useAuthActions() {
   const logout = useCallback2(() => {
     authController2.logout().then(() => dispatch({ type: "LOGOUT" }));
   }, [dispatch, authController2]);
-  const register = useCallback2(
+  const register2 = useCallback2(
     async (email, password, attributes) => {
       dispatch({ type: "REQUEST" });
       const res = await authController2.register(email, password, attributes);
@@ -912,7 +912,7 @@ function useAuthActions() {
     },
     [dispatch, authController2]
   );
-  return { login, logout, register };
+  return { login, logout, register: register2 };
 }
 function dispatchLoginResult(res, dispatch) {
   if (res.ok) {
@@ -2032,8 +2032,8 @@ var InMemoryDialogRegistry = class {
 
 // src/feature/dialog/infra/controller/dialog-controller.ts
 var DialogController = class {
-  constructor(registry2, open2, resolve2, dismiss2, closeTop2) {
-    this.registry = registry2;
+  constructor(registry3, open2, resolve2, dismiss2, closeTop2) {
+    this.registry = registry3;
     this.open = open2;
     this.resolve = resolve2;
     this.dismiss = dismiss2;
@@ -2154,14 +2154,1661 @@ function useDialog() {
   );
 }
 
+// src/util/math-util.ts
+function clamp(n, min, max) {
+  return Math.max(min, Math.min(max, n));
+}
+
+// src/feature/selection/application/use-case/handle-selection-use-case.ts
+var DEFAULT_CLEAR_ARGS = {
+  clearToggles: true,
+  exitSelectMode: true,
+  clearAnchor: true
+};
+var HandleSelectionUseCase = class {
+  constructor(store) {
+    this.store = store;
+  }
+  pushScope(scopeId) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    ensureScope(next, scopeId);
+    removeFromStack(next.scopeStack, scopeId);
+    next.scopeStack.push(scopeId);
+    this.store.set(next);
+  }
+  popScope() {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const popped = next.scopeStack.pop() ?? null;
+    this.store.set(next);
+    return popped;
+  }
+  setActiveScope(scopeId) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    ensureScope(next, scopeId);
+    removeFromStack(next.scopeStack, scopeId);
+    next.scopeStack.push(scopeId);
+    this.store.set(next);
+  }
+  ensureScope(scopeId) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    ensureScope(next, scopeId);
+    this.store.set(next);
+  }
+  registerRegion(args) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const scope = ensureScope(next, args.key.scopeId);
+    const region = ensureRegion(scope, args.key.regionId);
+    const hasInitialCursor = args.initialCursor !== void 0;
+    if (hasInitialCursor) {
+      region.cursor = args.initialCursor ?? null;
+    }
+    const items = args.getRegionItems();
+    const previousItems = prev.items[toItemsKey(args.key)];
+    const fallback = args.initialCursor ? items.includes(args.initialCursor) ? { kind: "id", id: args.initialCursor } : { kind: "first" } : void 0;
+    reconcileRegionState(region, items, fallback, previousItems);
+    if (args.makeActive) {
+      scope.activeRegion = args.key.regionId;
+    }
+    next.items[toItemsKey(args.key)] = items;
+    this.store.set(next);
+    return (fallback2) => {
+      this.refreshRegion(args.key, args.getRegionItems, fallback2);
+    };
+  }
+  unregisterRegion(key) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const scope = next.scopes[key.scopeId];
+    if (!scope) {
+      return;
+    }
+    const wasActive = scope.activeRegion === key.regionId;
+    delete scope.regions[key.regionId];
+    delete next.items[toItemsKey(key)];
+    if (wasActive) {
+      scope.activeRegion = null;
+      if (scope.mode === "select") {
+        scope.mode = "move";
+      }
+    }
+    this.store.set(next);
+  }
+  setActiveRegion(key) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const scope = ensureScope(next, key.scopeId);
+    ensureRegion(scope, key.regionId);
+    if (scope.activeRegion && scope.activeRegion !== key.regionId) {
+      const prevRegion = scope.regions[scope.activeRegion];
+      if (prevRegion) {
+        prevRegion.cursor = null;
+      }
+      if (scope.mode === "select") {
+        scope.mode = "move";
+        for (const region of Object.values(scope.regions)) {
+          region.selectAnchor = null;
+        }
+      }
+    }
+    scope.activeRegion = key.regionId;
+    this.store.set(next);
+  }
+  setCursor(key, itemId) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const scope = ensureScope(next, key.scopeId);
+    const region = ensureRegion(scope, key.regionId);
+    region.cursor = itemId;
+    this.store.set(next);
+  }
+  moveCursor(key, delta) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const scope = ensureScope(next, key.scopeId);
+    const region = ensureRegion(scope, key.regionId);
+    const items = getStoredItems(prev, key);
+    if (items.length === 0) {
+      region.cursor = null;
+      this.store.set(next);
+      return;
+    }
+    const index = region.cursor ? getIndex(items, region.cursor) : null;
+    if (index === null) {
+      if (delta === 0) {
+        this.store.set(next);
+        return;
+      }
+      region.cursor = delta > 0 ? items[0] : items[items.length - 1];
+      this.store.set(next);
+      return;
+    }
+    const nextIndex = clamp(index + delta, 0, items.length - 1);
+    region.cursor = items[nextIndex];
+    this.store.set(next);
+  }
+  enterSelectMode(key) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const scope = ensureScope(next, key.scopeId);
+    const region = ensureRegion(scope, key.regionId);
+    if (!region.cursor) {
+      const items = getStoredItems(prev, key);
+      region.cursor = getFallbackCursor(items, { kind: "first" });
+    }
+    removeFromStack(next.scopeStack, key.scopeId);
+    next.scopeStack.push(key.scopeId);
+    scope.mode = "select";
+    scope.activeRegion = key.regionId;
+    region.selectAnchor = region.cursor;
+    this.store.set(next);
+  }
+  exitSelectMode(scopeId) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const scope = ensureScope(next, scopeId);
+    scope.mode = "move";
+    for (const region of Object.values(scope.regions)) {
+      region.selectAnchor = null;
+    }
+    this.store.set(next);
+  }
+  toggleItem(key, itemId) {
+    const prev = this.store.get();
+    const targetId = itemId ?? prev.scopes[key.scopeId]?.regions[key.regionId]?.cursor ?? null;
+    if (!targetId) {
+      return;
+    }
+    const next = cloneState(prev);
+    const scope = ensureScope(next, key.scopeId);
+    const region = ensureRegion(scope, key.regionId);
+    if (region.toggled.has(targetId)) {
+      region.toggled.delete(targetId);
+    } else {
+      region.toggled.add(targetId);
+    }
+    this.store.set(next);
+  }
+  clearSelection(target, args) {
+    const prev = this.store.get();
+    const next = cloneState(prev);
+    const opts = { ...DEFAULT_CLEAR_ARGS, ...args };
+    if (target.kind === "activeScope") {
+      const scopeId = getActiveScopeId(next);
+      if (!scopeId) {
+        return;
+      }
+      const scope = next.scopes[scopeId];
+      if (!scope) {
+        return;
+      }
+      clearScope(scope, opts);
+      this.store.set(next);
+      return;
+    }
+    if (target.kind === "scope") {
+      const scope = next.scopes[target.scopeId];
+      if (!scope) {
+        return;
+      }
+      clearScope(scope, opts);
+      this.store.set(next);
+      return;
+    }
+    if (target.kind === "activeRegion") {
+      const scopeId = getActiveScopeId(next);
+      if (!scopeId) {
+        return;
+      }
+      const scope = next.scopes[scopeId];
+      const regionId = scope?.activeRegion;
+      if (!scope || !regionId) {
+        return;
+      }
+      clearRegion(scope, regionId, opts);
+      this.store.set(next);
+      return;
+    }
+    if (target.kind === "region") {
+      const scope = next.scopes[target.key.scopeId];
+      if (!scope) {
+        return;
+      }
+      clearRegion(scope, target.key.regionId, opts);
+      this.store.set(next);
+    }
+  }
+  refreshRegion(key, getRegionItems, fallbackOverride) {
+    const prev = this.store.get();
+    const prevScope = prev.scopes[key.scopeId];
+    if (!prevScope || !prevScope.regions[key.regionId]) {
+      return;
+    }
+    const next = cloneState(prev);
+    const scope = ensureScope(next, key.scopeId);
+    const region = ensureRegion(scope, key.regionId);
+    const items = getRegionItems();
+    const previousItems = prev.items[toItemsKey(key)];
+    const fallback = fallbackOverride ?? (region.cursor ? { kind: "nearestTo", id: region.cursor } : void 0);
+    reconcileRegionState(region, items, fallback, previousItems);
+    next.items[toItemsKey(key)] = items;
+    this.store.set(next);
+  }
+};
+function cloneState(prev) {
+  const scopes2 = {};
+  for (const [scopeId, scope] of Object.entries(prev.scopes)) {
+    const regions = {};
+    for (const [regionId, region] of Object.entries(scope.regions)) {
+      regions[regionId] = {
+        cursor: region.cursor,
+        toggled: new Set(region.toggled),
+        selectAnchor: region.selectAnchor
+      };
+    }
+    scopes2[scopeId] = {
+      activeRegion: scope.activeRegion,
+      mode: scope.mode,
+      regions
+    };
+  }
+  return {
+    scopeStack: [...prev.scopeStack],
+    scopes: scopes2,
+    items: { ...prev.items }
+  };
+}
+function ensureScope(state, scopeId) {
+  if (!state.scopes[scopeId]) {
+    state.scopes[scopeId] = {
+      activeRegion: null,
+      mode: "move",
+      regions: {}
+    };
+  }
+  return state.scopes[scopeId];
+}
+function ensureRegion(scope, regionId) {
+  if (!scope.regions[regionId]) {
+    scope.regions[regionId] = {
+      cursor: null,
+      toggled: /* @__PURE__ */ new Set(),
+      selectAnchor: null
+    };
+  }
+  return scope.regions[regionId];
+}
+function removeFromStack(stack, scopeId) {
+  const index = stack.indexOf(scopeId);
+  if (index >= 0) {
+    stack.splice(index, 1);
+  }
+}
+function getActiveScopeId(state) {
+  return state.scopeStack.length > 0 ? state.scopeStack[state.scopeStack.length - 1] : null;
+}
+function clearScope(scope, args) {
+  if (args.exitSelectMode) {
+    scope.mode = "move";
+  }
+  for (const region of Object.values(scope.regions)) {
+    if (args.clearToggles) {
+      region.toggled = /* @__PURE__ */ new Set();
+    }
+    if (args.clearAnchor) {
+      region.selectAnchor = null;
+    }
+  }
+}
+function clearRegion(scope, regionId, args) {
+  if (args.exitSelectMode) {
+    scope.mode = "move";
+  }
+  const region = scope.regions[regionId];
+  if (!region) {
+    return;
+  }
+  if (args.clearToggles) {
+    region.toggled = /* @__PURE__ */ new Set();
+  }
+  if (args.clearAnchor) {
+    region.selectAnchor = null;
+  }
+}
+function reconcileRegionState(region, items, fallback, previousItems) {
+  if (items.length === 0) {
+    region.cursor = null;
+    region.selectAnchor = null;
+    region.toggled = /* @__PURE__ */ new Set();
+    return;
+  }
+  const itemSet = new Set(items);
+  if (!region.cursor) {
+    region.cursor = getFallbackCursor(items, fallback, previousItems);
+  } else if (!itemSet.has(region.cursor)) {
+    region.cursor = getFallbackCursor(items, fallback, previousItems);
+  }
+  if (region.selectAnchor && !itemSet.has(region.selectAnchor)) {
+    region.selectAnchor = null;
+  }
+  if (region.toggled.size > 0) {
+    for (const id of region.toggled) {
+      if (!itemSet.has(id)) {
+        region.toggled.delete(id);
+      }
+    }
+  }
+}
+function getFallbackCursor(items, fallback, previousItems) {
+  if (!fallback || fallback.kind === "none") {
+    return null;
+  }
+  if (fallback.kind === "first") {
+    return items[0] ?? null;
+  }
+  if (fallback.kind === "last") {
+    return items[items.length - 1] ?? null;
+  }
+  if (fallback.kind === "id") {
+    return items.includes(fallback.id) ? fallback.id : null;
+  }
+  if (fallback.kind === "nth") {
+    const idx = clamp(fallback.idx, 0, items.length - 1);
+    return items[idx] ?? null;
+  }
+  if (fallback.kind === "nearestTo") {
+    return getNearestCursor(items, fallback.id, previousItems);
+  }
+  if (fallback.kind === "sameIndex") {
+    return null;
+  }
+  throw new Error(`Invalid cursor fallback type of: ${JSON.stringify(fallback)} did not match any handler.`);
+}
+function getNearestCursor(items, id, previousItems) {
+  if (items.includes(id)) {
+    return id;
+  }
+  const prevList = previousItems ?? [];
+  const prevIndex = prevList.indexOf(id);
+  if (prevIndex < 0) {
+    return null;
+  }
+  const itemSet = new Set(items);
+  for (let offset = 1; offset < prevList.length; offset += 1) {
+    const forwardIndex = prevIndex + offset;
+    if (forwardIndex < prevList.length) {
+      const forwardId = prevList[forwardIndex];
+      if (forwardId && itemSet.has(forwardId)) {
+        return forwardId;
+      }
+    }
+    const backwardIndex = prevIndex - offset;
+    if (backwardIndex >= 0) {
+      const backwardId = prevList[backwardIndex];
+      if (backwardId && itemSet.has(backwardId)) {
+        return backwardId;
+      }
+    }
+  }
+  return null;
+}
+function getIndex(items, itemId) {
+  const index = items.indexOf(itemId);
+  return index >= 0 ? index : null;
+}
+function toItemsKey(key) {
+  return `${key.scopeId}:${key.regionId}`;
+}
+function getStoredItems(state, key) {
+  return state.items[toItemsKey(key)] ?? [];
+}
+
+// src/feature/selection/application/use-case/query-selection-use-case.ts
+var QuerySelectionUseCase = class {
+  constructor(store, combineMode = "xor") {
+    this.store = store;
+    this.combineMode = combineMode;
+  }
+  getActiveScope() {
+    return getActiveScopeId2(this.store.get());
+  }
+  getActiveRegion(scopeId) {
+    const scope = this.store.get().scopes[scopeId];
+    if (!scope || !scope.activeRegion) {
+      return null;
+    }
+    return { scopeId, regionId: scope.activeRegion };
+  }
+  getMode(scopeId) {
+    return this.store.get().scopes[scopeId]?.mode ?? "move";
+  }
+  getCursor(key) {
+    return this.store.get().scopes[key.scopeId]?.regions[key.regionId]?.cursor ?? null;
+  }
+  isSelected(key, itemId) {
+    const state = this.store.get();
+    const selection = getRegionSelection(state, key);
+    if (!selection) {
+      return false;
+    }
+    const scopeMode = state.scopes[key.scopeId]?.mode ?? "move";
+    const items = getStoredItems2(state, key);
+    return isSelectedItem(items, selection, itemId, scopeMode, this.combineMode);
+  }
+  getSelectedIds(key) {
+    const state = this.store.get();
+    const selection = getRegionSelection(state, key);
+    if (!selection) {
+      return [];
+    }
+    const scopeMode = state.scopes[key.scopeId]?.mode ?? "move";
+    const items = getStoredItems2(state, key);
+    return getSelectedIds(items, selection, scopeMode, this.combineMode);
+  }
+  getToggledIds(key) {
+    const selection = getRegionSelection(this.store.get(), key);
+    if (!selection) {
+      return [];
+    }
+    const items = getStoredItems2(this.store.get(), key);
+    return items.filter((id) => selection.toggled.has(id));
+  }
+  getRangeIds(key) {
+    const state = this.store.get();
+    const selection = getRegionSelection(state, key);
+    if (!selection) {
+      return [];
+    }
+    const scopeMode = state.scopes[key.scopeId]?.mode ?? "move";
+    if (scopeMode !== "select") {
+      return [];
+    }
+    const items = getStoredItems2(state, key);
+    return getRangeIds(items, selection.selectAnchor, selection.cursor);
+  }
+};
+function getRegionSelection(state, key) {
+  return state.scopes[key.scopeId]?.regions[key.regionId] ?? null;
+}
+function getActiveScopeId2(state) {
+  return state.scopeStack.length > 0 ? state.scopeStack[state.scopeStack.length - 1] : null;
+}
+function getStoredItems2(state, key) {
+  return state.items[`${key.scopeId}:${key.regionId}`] ?? [];
+}
+function getRangeIds(items, anchor, cursor) {
+  if (!anchor || !cursor) {
+    return [];
+  }
+  const anchorIndex = items.indexOf(anchor);
+  const cursorIndex = items.indexOf(cursor);
+  if (anchorIndex < 0 || cursorIndex < 0) {
+    return [];
+  }
+  const start = Math.min(anchorIndex, cursorIndex);
+  const end = Math.max(anchorIndex, cursorIndex);
+  return items.slice(start, end + 1);
+}
+function getSelectedIds(items, selection, mode, combineMode) {
+  if (mode === "move") {
+    if (selection.toggled.size === 0) {
+      return [];
+    }
+    return items.filter((id) => selection.toggled.has(id));
+  }
+  const rangeIds = new Set(getRangeIds(items, selection.selectAnchor, selection.cursor));
+  if (selection.toggled.size === 0 && rangeIds.size === 0) {
+    return [];
+  }
+  return items.filter(
+    (id) => combineMode === "union" ? rangeIds.has(id) || selection.toggled.has(id) : rangeIds.has(id) !== selection.toggled.has(id)
+  );
+}
+function isSelectedItem(items, selection, itemId, mode, combineMode) {
+  if (mode === "move") {
+    return selection.toggled.has(itemId);
+  }
+  const rangeIds = new Set(getRangeIds(items, selection.selectAnchor, selection.cursor));
+  return combineMode === "union" ? rangeIds.has(itemId) || selection.toggled.has(itemId) : rangeIds.has(itemId) !== selection.toggled.has(itemId);
+}
+
+// src/feature/selection/infra/in-memory-selection-store.ts
+var InMemorySelectionStore = class {
+  constructor(state = { scopeStack: [], scopes: {}, items: {} }) {
+    this.state = state;
+  }
+  get() {
+    return this.state;
+  }
+  set(next) {
+    this.state = next;
+  }
+};
+
+// src/feature/selection/infra/controller/selection-controller.ts
+var SelectionController = class {
+  handleSelection;
+  querySelection;
+  selectionStore;
+  subscribeFn;
+  version = 0;
+  constructor(deps) {
+    this.handleSelection = deps.handleSelection;
+    this.querySelection = deps.querySelection;
+    this.selectionStore = deps.selectionStore;
+    this.subscribeFn = createSubscriptionAdapter(this.selectionStore, () => {
+      this.version += 1;
+    });
+  }
+  registerRegion(args) {
+    return this.handleSelection.registerRegion(args);
+  }
+  pushScope(scopeId) {
+    this.handleSelection.pushScope(scopeId);
+  }
+  popScope() {
+    return this.handleSelection.popScope();
+  }
+  setActiveScope(scopeId) {
+    this.handleSelection.setActiveScope(scopeId);
+  }
+  ensureScope(scopeId) {
+    this.handleSelection.ensureScope(scopeId);
+  }
+  unregisterRegion(key) {
+    this.handleSelection.unregisterRegion(key);
+  }
+  setActiveRegion(key) {
+    this.handleSelection.setActiveRegion(key);
+  }
+  setCursor(key, itemId) {
+    this.handleSelection.setCursor(key, itemId);
+  }
+  moveCursor(key, delta) {
+    this.handleSelection.moveCursor(key, delta);
+  }
+  enterSelectMode(key) {
+    this.handleSelection.enterSelectMode(key);
+  }
+  exitSelectMode(scopeId) {
+    this.handleSelection.exitSelectMode(scopeId);
+  }
+  toggleItem(key, itemId) {
+    this.handleSelection.toggleItem(key, itemId);
+  }
+  clearSelection(target, args) {
+    this.handleSelection.clearSelection(target, args);
+  }
+  getActiveScope() {
+    return this.querySelection.getActiveScope();
+  }
+  getActiveRegion(scopeId) {
+    return this.querySelection.getActiveRegion(scopeId);
+  }
+  getActiveItem(key) {
+    const resolved = this.resolveKey(key);
+    if (!resolved) {
+      return null;
+    }
+    return this.querySelection.getCursor(resolved);
+  }
+  getItems(key) {
+    const resolved = this.resolveKey(key);
+    if (!resolved) {
+      return [];
+    }
+    return this.selectionStore.get().items[toItemsKey2(resolved)] ?? [];
+  }
+  getSelectedIds(key) {
+    const resolved = this.resolveKey(key);
+    if (!resolved) {
+      return [];
+    }
+    return this.querySelection.getSelectedIds(resolved);
+  }
+  getToggledIds(key) {
+    const resolved = this.resolveKey(key);
+    if (!resolved) {
+      return [];
+    }
+    return this.querySelection.getToggledIds(resolved);
+  }
+  getRangeIds(key) {
+    const resolved = this.resolveKey(key);
+    if (!resolved) {
+      return [];
+    }
+    return this.querySelection.getRangeIds(resolved);
+  }
+  isSelected(key, itemId) {
+    return this.querySelection.isSelected(key, itemId);
+  }
+  getMode(scopeId) {
+    return this.querySelection.getMode(scopeId);
+  }
+  getQuery() {
+    return this.querySelection;
+  }
+  getStore() {
+    return this.selectionStore;
+  }
+  getHandle() {
+    return this.handleSelection;
+  }
+  subscribe(listener) {
+    return this.subscribeFn(listener);
+  }
+  getVersion() {
+    return this.version;
+  }
+  resolveKey(key) {
+    if (key) {
+      return key;
+    }
+    const scopeId = this.querySelection.getActiveScope();
+    if (!scopeId) {
+      return null;
+    }
+    return this.querySelection.getActiveRegion(scopeId);
+  }
+};
+function toItemsKey2(key) {
+  return `${key.scopeId}:${key.regionId}`;
+}
+var createSelectionController = controllerFactory(
+  (deps) => new SelectionController(deps),
+  (overrides) => {
+    const hasCustomUseCases = !!overrides.handleSelection || !!overrides.querySelection;
+    if (hasCustomUseCases && !overrides.selectionStore) {
+      throw new Error("createSelectionController requires selectionStore when overriding use cases");
+    }
+    const selectionStore = overrides.selectionStore ?? new InMemorySelectionStore();
+    const handleSelection = overrides.handleSelection ?? new HandleSelectionUseCase(selectionStore);
+    const querySelection = overrides.querySelection ?? new QuerySelectionUseCase(selectionStore);
+    return {
+      handleSelection,
+      querySelection,
+      selectionStore
+    };
+  }
+);
+function createSubscriptionAdapter(store, onChange) {
+  const maybeStore = store;
+  if (typeof maybeStore.subscribe === "function") {
+    return (listener) => maybeStore.subscribe?.(() => {
+      onChange();
+      listener();
+    }) ?? (() => {
+    });
+  }
+  const listeners = /* @__PURE__ */ new Set();
+  const originalSet = store.set.bind(store);
+  store.set = (next) => {
+    originalSet(next);
+    onChange();
+    for (const listener of listeners) {
+      listener();
+    }
+  };
+  return (listener) => {
+    listeners.add(listener);
+    return () => {
+      listeners.delete(listener);
+    };
+  };
+}
+
+// src/feature/selection/infra/web/react/SelectionControllerProvider.tsx
+import { createContext as createContext3, useContext as useContext4 } from "react";
+import { jsx as jsx12 } from "react/jsx-runtime";
+var SelectionControllerCtx = createContext3(null);
+function SelectionControllerProvider({ children, controller }) {
+  return /* @__PURE__ */ jsx12(SelectionControllerCtx.Provider, { value: controller, children });
+}
+function useSelectionController() {
+  const controller = useContext4(SelectionControllerCtx);
+  if (!controller) throw new Error("useSelectionController must be used within <SelectionControllerProvider>");
+  return controller;
+}
+
+// src/feature/keyboard/entity/scope-manager.ts
+var ScopeManager = class {
+  scopes = /* @__PURE__ */ new Map();
+  define(id, priority, exclusive = false) {
+    if (!this.scopes.has(id)) {
+      this.scopes.set(id, { id, enabled: false, refCount: 0, priority, exclusive });
+    }
+  }
+  enable(id) {
+    const s = this.scopes.get(id);
+    if (!s) return;
+    const nextRefCount = (s.refCount ?? 0) + 1;
+    s.refCount = nextRefCount;
+    s.enabled = nextRefCount > 0;
+    this.scopes.set(id, s);
+  }
+  disable(id) {
+    const s = this.scopes.get(id);
+    if (!s) return;
+    const nextRefCount = Math.max(0, (s.refCount ?? 0) - 1);
+    s.refCount = nextRefCount;
+    s.enabled = nextRefCount > 0;
+    this.scopes.set(id, s);
+  }
+  isAnyExclusiveActiveAbove(priority) {
+    for (const s of this.scopes.values()) {
+      if (s.enabled && s.exclusive && s.priority > priority) return true;
+    }
+    return false;
+  }
+  isScopeActive(id) {
+    const s = this.scopes.get(id);
+    if (!s || !s.enabled) return false;
+    return !this.isAnyExclusiveActiveAbove(s.priority);
+  }
+  getState(id) {
+    return this.scopes.get(id) ?? null;
+  }
+};
+
+// src/feature/keyboard/application/use-case/enable-scope-use-case.ts
+var EnableScopeUseCase = class {
+  constructor(scopes2) {
+    this.scopes = scopes2;
+  }
+  enableScope(id) {
+    this.scopes.enable(id);
+  }
+};
+
+// src/feature/keyboard/application/use-case/disable-scope-use-case.ts
+var DisableScopeUseCase = class {
+  constructor(scopes2) {
+    this.scopes = scopes2;
+  }
+  disableScope(id) {
+    this.scopes.disable(id);
+  }
+};
+
+// src/feature/keyboard/application/use-case/list-shortcuts-use-case.ts
+var ListShortcutsUseCase = class {
+  constructor(registry3) {
+    this.registry = registry3;
+  }
+  listShortcutsByScope() {
+    return this.registry.snapshotGroupedByScope();
+  }
+};
+
+// src/feature/keyboard/application/use-case/register-shortcut-use-case.ts
+import { v4 as uuid2 } from "uuid";
+var RegisterShortcutUseCase = class {
+  constructor(engine2, scopes2, registry3) {
+    this.engine = engine2;
+    this.scopes = scopes2;
+    this.registry = registry3;
+  }
+  store = /* @__PURE__ */ new Map();
+  registerShortcut(regInput) {
+    const id = uuid2();
+    const reg = { preventDefault: true, ignoreTyping: true, ...regInput, id };
+    const guard = (e) => {
+      if (reg.ignoreTyping && isTyping(e)) return false;
+      return this.scopes.isScopeActive(reg.scopeId);
+    };
+    const handle = this.engine.register(reg.bindings, { guard, preventDefault: reg.preventDefault });
+    this.registry.addMany(
+      reg.bindings.map((b) => ({
+        registrationId: id,
+        scopeId: reg.scopeId,
+        combos: b.combos,
+        description: b.description,
+        group: b.group
+      }))
+    );
+    this.store.set(id, { handle, reg });
+    return id;
+  }
+  unregister(id) {
+    const item = this.store.get(id);
+    if (!item) return;
+    item.handle.dispose();
+    this.store.delete(id);
+    this.registry.removeByRegistration(id);
+  }
+};
+function isTyping(e) {
+  const el = e.target;
+  if (!el) return false;
+  const inText = el.tagName === "INPUT" || el.tagName === "TEXTAREA" || el.isContentEditable;
+  if (!inText) return false;
+  const k = e.key;
+  const allow = k === "Escape" || k === "Tab" || k.startsWith("Arrow") || k === "PageUp" || k === "PageDown" || k === "Home" || k === "End" || e.ctrlKey || e.metaKey || e.altKey;
+  return !allow;
+}
+
+// src/feature/keyboard/application/use-case/unregister-shortcut-use-case.ts
+var UnregisterShortcutUseCase = class {
+  constructor(registry3) {
+    this.registry = registry3;
+  }
+  unregisterShortcut(id) {
+    this.registry.unregister(id);
+  }
+};
+
+// src/feature/keyboard/infra/web/react/KeyboardProvider.tsx
+import { createContext as createContext4, useContext as useContext5, useMemo as useMemo4 } from "react";
+
+// src/feature/keyboard/infra/providers/in-memory-shortcuts-registry.ts
+function compareStringArrays(a, b) {
+  const len = Math.min(a.length, b.length);
+  for (let i = 0; i < len; i++) {
+    const c = a[i].localeCompare(b[i]);
+    if (c !== 0) return c;
+  }
+  return a.length - b.length;
+}
+var InMemoryShortcutRegistry = class {
+  byReg = /* @__PURE__ */ new Map();
+  addMany(items) {
+    for (const it of items) {
+      const arr = this.byReg.get(it.registrationId) ?? [];
+      arr.push(it);
+      this.byReg.set(it.registrationId, arr);
+    }
+  }
+  removeByRegistration(registrationId) {
+    this.byReg.delete(registrationId);
+  }
+  snapshotGroupedByScope() {
+    const grouped = {};
+    for (const items of this.byReg.values()) {
+      for (const it of items) {
+        const existing = grouped[it.scopeId];
+        if (existing) {
+          existing.push({ ...it });
+          continue;
+        }
+        grouped[it.scopeId] = [{ ...it }];
+      }
+    }
+    for (const scopeId of Object.keys(grouped)) {
+      grouped[scopeId].sort(
+        (a, b) => (a.group ?? "").localeCompare(b.group ?? "") || a.description.localeCompare(b.description) || compareStringArrays(a.combos, b.combos)
+      );
+    }
+    return grouped;
+  }
+};
+
+// src/feature/keyboard/infra/providers/tinykeys-hotkey-engine.ts
+import { tinykeys } from "tinykeys";
+var TinykeysHotkeyEngine = class {
+  register(bindings, opts = {}) {
+    const target = opts.target ?? window;
+    const codeMap = {};
+    const charMap = [];
+    const wrap = (fn) => (e) => {
+      if (opts.guard && !opts.guard(e)) return;
+      if (opts.preventDefault) e.preventDefault();
+      fn(e);
+    };
+    for (const b of bindings) {
+      for (const combo of b.combos) {
+        const m = combo.match(/^char:(.+)$/i);
+        if (m) {
+          charMap.push({ char: m[1], handler: b.handler });
+        } else {
+          codeMap[combo] = wrap(b.handler);
+        }
+      }
+    }
+    const disposers = [];
+    if (Object.keys(codeMap).length) {
+      const tk = tinykeys;
+      const unbind = tk(target, codeMap);
+      disposers.push(unbind);
+    }
+    if (charMap.length) {
+      const onKeyDown = (e) => {
+        for (const { char, handler } of charMap) {
+          if (e.key === char) {
+            if (opts.guard && !opts.guard(e)) return;
+            if (opts.preventDefault) e.preventDefault();
+            handler(e);
+            return;
+          }
+        }
+      };
+      const et = target;
+      et.addEventListener("keydown", onKeyDown);
+      disposers.push(() => et.removeEventListener("keydown", onKeyDown));
+    }
+    return {
+      dispose: () => {
+        for (const dispose of disposers) {
+          dispose();
+        }
+      }
+    };
+  }
+};
+
+// src/feature/keyboard/infra/controllers/keyboard-controller.ts
+var KeyboardController = class {
+  constructor(scopes2, register2, unregister2, enableScope2, disableScope2, listShortcuts2, config2) {
+    this.scopes = scopes2;
+    this.register = register2;
+    this.unregister = unregister2;
+    this.enableScope = enableScope2;
+    this.disableScope = disableScope2;
+    this.listShortcuts = listShortcuts2;
+    for (const s of config2?.predefinedScopes ?? []) {
+      this.scopes.define(s.id, s.priority, !!s.exclusive);
+      if (s.enabled) this.scopes.enable(s.id);
+    }
+  }
+  handleDefineScope(id, priority, exclusive = false) {
+    this.scopes.define(id, priority, exclusive);
+  }
+  handleEnableScope(id) {
+    this.enableScope.enableScope(id);
+  }
+  handleDisableScope(id) {
+    this.disableScope.disableScope(id);
+  }
+  handleRegisterShortcut(params) {
+    return this.register.registerShortcut(params);
+  }
+  handleUnregisterShortcut(id) {
+    this.unregister.unregisterShortcut(id);
+  }
+  handleListShortcutsByScope() {
+    return this.listShortcuts.listShortcutsByScope();
+  }
+};
+var scopes = new ScopeManager();
+var engine = new TinykeysHotkeyEngine();
+var registry2 = new InMemoryShortcutRegistry();
+var register = new RegisterShortcutUseCase(engine, scopes, registry2);
+var unregister = new UnregisterShortcutUseCase(register);
+var enableScope = new EnableScopeUseCase(scopes);
+var disableScope = new DisableScopeUseCase(scopes);
+var listShortcuts = new ListShortcutsUseCase(registry2);
+var config = {
+  predefinedScopes: [
+    { id: "global", priority: 10, exclusive: false, enabled: true },
+    { id: "page", priority: 50, exclusive: false, enabled: false },
+    { id: "dialog", priority: 100, exclusive: true, enabled: false }
+  ]
+};
+var keyboardController = new KeyboardController(
+  scopes,
+  register,
+  unregister,
+  enableScope,
+  disableScope,
+  listShortcuts,
+  config
+);
+
+// src/feature/keyboard/infra/web/react/KeyboardProvider.tsx
+import { jsx as jsx13 } from "react/jsx-runtime";
+var KeyboardCtx = createContext4(null);
+var KeyboardProvider = ({ children }) => {
+  const controller = useMemo4(() => keyboardController, []);
+  return /* @__PURE__ */ jsx13(KeyboardCtx.Provider, { value: { controller }, children });
+};
+function useKeyboardController() {
+  const ctx = useContext5(KeyboardCtx);
+  if (!ctx) throw new Error("useKeyboardController must be used within <KeyboardProvider>");
+  return ctx.controller;
+}
+
+// src/feature/keyboard/infra/web/react/useShortcut.tsx
+import { useEffect as useEffect5, useMemo as useMemo5 } from "react";
+function useShortcut(scopeId, bindings, opts) {
+  const controller = useKeyboardController();
+  const stableBindings = useMemo5(() => bindings, [bindings]);
+  useEffect5(() => {
+    const id = controller.handleRegisterShortcut({
+      scopeId,
+      bindings: stableBindings,
+      ignoreTyping: opts?.ignoreTyping ?? true,
+      preventDefault: opts?.preventDefault ?? true
+    });
+    return () => controller.handleUnregisterShortcut(id);
+  }, [controller, stableBindings, opts?.ignoreTyping, opts?.preventDefault, scopeId]);
+}
+
+// src/feature/keyboard/infra/web/react/useShortcutScope.tsx
+import { useEffect as useEffect6 } from "react";
+function useShortcutScope(scopeId, enabled = true) {
+  const controller = useKeyboardController();
+  useEffect6(() => {
+    if (!enabled) return void 0;
+    controller.handleEnableScope(scopeId);
+    return () => controller.handleDisableScope(scopeId);
+  }, [controller, scopeId, enabled]);
+}
+
+// src/feature/vim-navigation/entity/vim-region-registry.ts
+var VimRegionRegistry = class {
+  byScope = /* @__PURE__ */ new Map();
+  register(meta) {
+    const scopeMap = this.byScope.get(meta.key.scopeId) ?? /* @__PURE__ */ new Map();
+    scopeMap.set(meta.key.regionId, meta);
+    this.byScope.set(meta.key.scopeId, scopeMap);
+  }
+  unregister(key) {
+    const scopeMap = this.byScope.get(key.scopeId);
+    if (!scopeMap) return;
+    scopeMap.delete(key.regionId);
+    if (scopeMap.size === 0) {
+      this.byScope.delete(key.scopeId);
+    }
+  }
+  get(key) {
+    return this.byScope.get(key.scopeId)?.get(key.regionId) ?? null;
+  }
+  list(scopeId) {
+    const scopeMap = this.byScope.get(scopeId);
+    if (!scopeMap) return [];
+    return Array.from(scopeMap.values()).sort((a, b) => a.orderIndex - b.orderIndex);
+  }
+  neighbor(scopeId, current, dir, count) {
+    const regs = this.list(scopeId);
+    if (regs.length === 0) return null;
+    const currentIndex = regs.findIndex((r) => r.key.regionId === current.regionId);
+    const start = currentIndex >= 0 ? currentIndex : 0;
+    const step = dir === "right" ? 1 : -1;
+    const moveBy = Math.max(1, count);
+    const raw = start + step * moveBy;
+    const nextIndex = clamp2(raw, 0, regs.length - 1);
+    return regs[nextIndex]?.key ?? null;
+  }
+};
+function clamp2(n, min, max) {
+  return Math.max(min, Math.min(max, n));
+}
+
+// src/feature/vim-navigation/application/use-case/vim-handle-key-use-case.ts
+var VimHandleKeyUseCase = class {
+  constructor(selection, query, getItems, regions) {
+    this.selection = selection;
+    this.query = query;
+    this.getItems = getItems;
+    this.regions = regions;
+  }
+  stateByScope = /* @__PURE__ */ new Map();
+  reset(scopeId) {
+    if (!scopeId) {
+      this.stateByScope.clear();
+      return;
+    }
+    this.stateByScope.delete(scopeId);
+  }
+  handleChar(char, e) {
+    if (e.ctrlKey || e.metaKey || e.altKey) return;
+    const scopeId = this.query.getActiveScope();
+    if (!scopeId) return;
+    const activeKey = this.query.getActiveRegion(scopeId);
+    if (!activeKey) return;
+    const st = this.stateByScope.get(scopeId) ?? { count: "", pending: null };
+    this.stateByScope.set(scopeId, st);
+    if (isDigit(char)) {
+      if (char === "0" && st.count.length === 0) return;
+      st.count += char;
+      return;
+    }
+    if (st.pending === "g") {
+      st.pending = null;
+      if (char === "g") {
+        const count = consumeCount(st, 1);
+        this.goToIndex(activeKey, count);
+        this.afterCursorChange(activeKey);
+        return;
+      }
+    }
+    if (char === "g") {
+      st.pending = "g";
+      return;
+    }
+    if (char === "v") {
+      const mode = this.query.getMode(scopeId);
+      if (mode === "move") {
+        this.selection.enterSelectMode(activeKey);
+        this.afterRegionChange(activeKey);
+      } else {
+        this.selection.exitSelectMode(scopeId);
+        this.afterRegionChange(activeKey);
+      }
+      st.count = "";
+      st.pending = null;
+      return;
+    }
+    if (char === " ") {
+      this.selection.toggleItem(activeKey);
+      st.count = "";
+      st.pending = null;
+      return;
+    }
+    if (char === "h" || char === "j" || char === "k" || char === "l") {
+      const dir = mapHjkl(char);
+      const count = consumeCount(st, 1);
+      this.applyDirectional(scopeId, activeKey, dir, count);
+      st.pending = null;
+      return;
+    }
+    if (char === "G") {
+      const count = consumeCount(st, 0);
+      if (count > 0) {
+        this.goToIndex(activeKey, count);
+      } else {
+        this.goToLast(activeKey);
+      }
+      this.afterCursorChange(activeKey);
+      st.pending = null;
+      return;
+    }
+    st.count = "";
+    st.pending = null;
+  }
+  handleEscape(e) {
+    if (e.ctrlKey || e.metaKey || e.altKey) return;
+    const scopeId = this.query.getActiveScope();
+    if (!scopeId) return;
+    this.selection.exitSelectMode(scopeId);
+    const activeKey = this.query.getActiveRegion(scopeId);
+    if (activeKey) {
+      this.afterRegionChange(activeKey);
+    }
+    const st = this.stateByScope.get(scopeId);
+    if (st) {
+      st.count = "";
+      st.pending = null;
+    }
+  }
+  applyDirectional(scopeId, activeKey, dir, count) {
+    const meta = this.regions.get(activeKey);
+    if (meta?.intra.has(dir)) {
+      const delta = directionToDelta(dir, count);
+      this.selection.moveCursor(activeKey, delta);
+      this.afterCursorChange(activeKey);
+      return;
+    }
+    if (dir === "left" || dir === "right") {
+      const interDir = dir;
+      if (meta && !meta.inter.has(interDir)) return;
+      const nextKey = this.regions.neighbor(scopeId, activeKey, interDir, count);
+      if (!nextKey) return;
+      const prevIndex = this.getCursorIndex(activeKey);
+      this.selection.setActiveRegion(nextKey);
+      const enteredMeta = this.regions.get(nextKey);
+      const fallback = enteredMeta?.enterCursorFallback;
+      const nextCursor = this.query.getCursor(nextKey);
+      if (!nextCursor && fallback) {
+        const resolved = this.resolveInterRegionFallback(fallback, prevIndex);
+        if (resolved) {
+          this.applyFallbackCursor(nextKey, resolved);
+        }
+      }
+      this.afterRegionChange(nextKey);
+    }
+  }
+  goToLast(key) {
+    const items = this.getItems(key);
+    if (items.length === 0) {
+      this.selection.setCursor(key, null);
+      return;
+    }
+    const last = items[items.length - 1] ?? null;
+    this.selection.setCursor(key, last);
+  }
+  goToIndex(key, index1) {
+    const items = this.getItems(key);
+    if (items.length === 0) {
+      this.selection.setCursor(key, null);
+      return;
+    }
+    const idx0 = clamp3(index1 - 1, 0, items.length - 1);
+    this.selection.setCursor(key, items[idx0] ?? null);
+  }
+  afterRegionChange(key) {
+    const meta = this.regions.get(key);
+    meta?.focusContainer?.();
+    meta?.scrollToCursor?.();
+  }
+  afterCursorChange(key) {
+    const meta = this.regions.get(key);
+    meta?.scrollToCursor?.();
+    if (meta?.focusOnCursorChange !== false) {
+      meta?.focusContainer?.();
+    }
+  }
+  applyFallbackCursor(key, fallback) {
+    const items = this.getItems(key);
+    const nextCursor = getFallbackCursor2(items, fallback);
+    if (nextCursor === null) {
+      return;
+    }
+    this.selection.setCursor(key, nextCursor);
+  }
+  getCursorIndex(key) {
+    const cursor = this.query.getCursor(key);
+    if (!cursor) {
+      return null;
+    }
+    const items = this.getItems(key);
+    const index = items.indexOf(cursor);
+    return index >= 0 ? index : null;
+  }
+  resolveInterRegionFallback(fallback, prevIndex) {
+    if (fallback.kind === "sameIndex") {
+      if (prevIndex === null) {
+        return null;
+      }
+      return { kind: "nth", idx: prevIndex };
+    }
+    if (fallback.kind !== "nth") {
+      return fallback;
+    }
+    if (fallback.idx >= 0) {
+      return fallback;
+    }
+    if (prevIndex === null) {
+      return null;
+    }
+    return { kind: "nth", idx: prevIndex };
+  }
+};
+function isDigit(ch) {
+  return ch.length === 1 && ch >= "0" && ch <= "9";
+}
+function consumeCount(st, def) {
+  if (!st.count) return def;
+  const n = Number(st.count);
+  st.count = "";
+  if (!Number.isFinite(n) || n < 0) return def;
+  return Math.floor(n);
+}
+function mapHjkl(ch) {
+  switch (ch) {
+    case "h":
+      return "left";
+    case "j":
+      return "down";
+    case "k":
+      return "up";
+    case "l":
+      return "right";
+  }
+}
+function getFallbackCursor2(items, fallback) {
+  if (fallback.kind === "none") {
+    return null;
+  }
+  if (fallback.kind === "first") {
+    return items[0] ?? null;
+  }
+  if (fallback.kind === "last") {
+    return items[items.length - 1] ?? null;
+  }
+  if (fallback.kind === "id") {
+    return items.includes(fallback.id) ? fallback.id : null;
+  }
+  if (fallback.kind === "nth") {
+    const idx = clamp3(fallback.idx, 0, items.length - 1);
+    return items[idx] ?? null;
+  }
+  if (fallback.kind === "nearestTo") {
+    return getNearestCursor2(items, fallback.id);
+  }
+  throw new Error(`Invalid cursor fallback type of: ${JSON.stringify(fallback)} did not match any handler.`);
+}
+function getNearestCursor2(items, id) {
+  if (items.includes(id)) {
+    return id;
+  }
+  return null;
+}
+function directionToDelta(dir, count) {
+  const n = Math.max(1, count);
+  switch (dir) {
+    case "down":
+      return n;
+    case "up":
+      return -n;
+    case "right":
+      return n;
+    case "left":
+      return -n;
+  }
+}
+function clamp3(n, min, max) {
+  return Math.max(min, Math.min(max, n));
+}
+
+// src/feature/vim-navigation/infra/controller/vim-controller.ts
+var VimController = class {
+  regions;
+  handleKey;
+  selection;
+  constructor(selection, regions = new VimRegionRegistry(), handleKey = new VimHandleKeyUseCase(
+    selection.getHandle(),
+    selection.getQuery(),
+    (key) => selection.getItems(key),
+    regions
+  )) {
+    this.regions = regions;
+    this.handleKey = handleKey;
+    this.selection = selection;
+  }
+  handleRegisterRegionMeta(meta) {
+    this.regions.register(meta);
+  }
+  handleUnregisterRegionMeta(key) {
+    this.regions.unregister(key);
+  }
+  handleCharKey(char, e) {
+    this.handleKey.handleChar(char, e);
+  }
+  handleEscape(e) {
+    this.handleKey.handleEscape(e);
+  }
+  resetActiveScope() {
+    const scopeId = this.selection.getActiveScope();
+    if (!scopeId) return;
+    this.handleKey.reset(scopeId);
+  }
+  getSelection() {
+    return this.selection;
+  }
+};
+var createVimController = controllerFactory(
+  (deps) => new VimController(deps.selection, deps.regions, deps.handleKey),
+  (overrides) => {
+    const selection = overrides.selection;
+    if (!selection) {
+      throw new Error("createVimController requires selection");
+    }
+    const regions = overrides.regions ?? new VimRegionRegistry();
+    const handleKey = overrides.handleKey ?? new VimHandleKeyUseCase(
+      selection.getHandle(),
+      selection.getQuery(),
+      (key) => selection.getItems(key),
+      regions
+    );
+    return {
+      selection,
+      regions,
+      handleKey
+    };
+  }
+);
+
+// src/feature/vim-navigation/infra/web/react/VimControllerProvider.tsx
+import { createContext as createContext5, useContext as useContext6 } from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
+var VimControllerCtx = createContext5(null);
+function VimControllerProvider({ children, controller }) {
+  return /* @__PURE__ */ jsx14(VimControllerCtx.Provider, { value: controller, children });
+}
+function useVimController() {
+  const controller = useContext6(VimControllerCtx);
+  if (!controller) throw new Error("useVimController must be used within <VimControllerProvider>");
+  return controller;
+}
+
+// src/feature/vim-navigation/infra/web/react/hook/use-vim-bindings.tsx
+import { useCallback as useCallback5, useEffect as useEffect7, useMemo as useMemo6, useRef as useRef3, useState as useState5 } from "react";
+var scopeBindings = /* @__PURE__ */ new Map();
+function notify(entry) {
+  for (const notifySub of entry.subscribers.values()) {
+    notifySub(entry.ownerId);
+  }
+}
+function useVimBindings(keyboardScopeId, options = {}) {
+  const vim = useVimController();
+  const enabled = options.enabled ?? true;
+  const ownerIdRef = useRef3(Symbol("vim-binding-owner"));
+  const [isOwner, setIsOwner] = useState5(false);
+  const handleOwnerChange = useCallback5((ownerId) => {
+    setIsOwner(ownerId === ownerIdRef.current);
+  }, []);
+  useEffect7(() => {
+    if (!enabled) {
+      setIsOwner(false);
+      return;
+    }
+    const entry = scopeBindings.get(keyboardScopeId) ?? {
+      ownerId: null,
+      subscribers: /* @__PURE__ */ new Map()
+    };
+    scopeBindings.set(keyboardScopeId, entry);
+    entry.subscribers.set(ownerIdRef.current, handleOwnerChange);
+    if (!entry.ownerId) {
+      entry.ownerId = ownerIdRef.current;
+    }
+    notify(entry);
+    return () => {
+      entry.subscribers.delete(ownerIdRef.current);
+      if (entry.ownerId === ownerIdRef.current) {
+        const nextOwner = entry.subscribers.keys().next().value ?? null;
+        entry.ownerId = nextOwner;
+        if (!nextOwner && entry.subscribers.size === 0) {
+          scopeBindings.delete(keyboardScopeId);
+          return;
+        }
+        notify(entry);
+        return;
+      }
+      if (entry.subscribers.size === 0) {
+        scopeBindings.delete(keyboardScopeId);
+      }
+    };
+  }, [enabled, handleOwnerChange, keyboardScopeId]);
+  const bindings = useMemo6(() => {
+    if (!enabled || !isOwner) {
+      return [];
+    }
+    const charCombo = (c) => `char:${c}`;
+    const onChar = (c) => (e) => vim.handleCharKey(c, e);
+    const digitBindings = [];
+    for (let i = 0; i <= 9; i += 1) {
+      const d = String(i);
+      digitBindings.push({
+        combos: [charCombo(d)],
+        handler: onChar(d),
+        description: `vim: count ${d}`,
+        group: "vim"
+      });
+    }
+    return [
+      ...digitBindings,
+      { combos: [charCombo("h")], handler: onChar("h"), description: "vim: left", group: "vim" },
+      { combos: [charCombo("j")], handler: onChar("j"), description: "vim: down", group: "vim" },
+      { combos: [charCombo("k")], handler: onChar("k"), description: "vim: up", group: "vim" },
+      { combos: [charCombo("l")], handler: onChar("l"), description: "vim: right", group: "vim" },
+      { combos: [charCombo("g")], handler: onChar("g"), description: "vim: g prefix", group: "vim" },
+      { combos: [charCombo("G")], handler: onChar("G"), description: "vim: G", group: "vim" },
+      {
+        combos: [charCombo("v"), charCombo("V")],
+        handler: onChar("v"),
+        description: "vim: toggle select",
+        group: "vim"
+      },
+      { combos: [charCombo(" ")], handler: onChar(" "), description: "vim: toggle item", group: "vim" },
+      { combos: ["Escape"], handler: (e) => vim.handleEscape(e), description: "vim: escape", group: "vim" }
+    ];
+  }, [enabled, isOwner, vim]);
+  useShortcut(keyboardScopeId, bindings, { ignoreTyping: true, preventDefault: true });
+}
+
+// src/feature/vim-navigation/infra/web/react/hook/use-vim-region.tsx
+import { useEffect as useEffect9, useMemo as useMemo8, useRef as useRef4, useSyncExternalStore } from "react";
+
+// src/feature/vim-navigation/infra/web/react/hook/use-vim-region-meta.tsx
+import { useEffect as useEffect8, useMemo as useMemo7 } from "react";
+function useVimRegionMeta(containerRef, args) {
+  const vim = useVimController();
+  const selection = vim.getSelection();
+  const intraSet = useMemo7(() => new Set(args.intra ?? ["up", "down"]), [args.intra]);
+  const interSet = useMemo7(() => new Set(args.inter ?? ["left", "right"]), [args.inter]);
+  const itemAttr = args.itemDataAttr ?? "data-vim-item-id";
+  const focusContainer = useMemo7(() => {
+    return () => {
+      const el = containerRef.current;
+      if (!el) return;
+      const activeId = selection.getActiveItem(args.key);
+      const selector = activeId ? `[${itemAttr}="${cssEscape(activeId)}"]` : `[${itemAttr}]`;
+      const itemEl = el.querySelector(selector);
+      itemEl?.focus();
+    };
+  }, [args.key, containerRef, itemAttr, selection]);
+  const scrollToCursor = useMemo7(() => {
+    return () => {
+      const el = containerRef.current;
+      if (!el) return;
+      const cursor = selection.getActiveItem(args.key);
+      if (!cursor) return;
+      const selector = `[${itemAttr}="${cssEscape(cursor)}"]`;
+      const itemEl = el.querySelector(selector);
+      if (!itemEl) return;
+      itemEl.scrollIntoView({ block: "nearest" });
+    };
+  }, [args.key, containerRef, selection, itemAttr]);
+  useEffect8(() => {
+    const meta = {
+      key: args.key,
+      orderIndex: args.orderIndex,
+      intra: intraSet,
+      inter: interSet,
+      focusContainer,
+      scrollToCursor,
+      enterCursorFallback: args.enterCursorFallback,
+      focusOnCursorChange: args.focusOnCursorChange ?? true
+    };
+    vim.handleRegisterRegionMeta(meta);
+    return () => {
+      vim.handleUnregisterRegionMeta(args.key);
+    };
+  }, []);
+  function getItemProps(itemId) {
+    return { [itemAttr]: itemId };
+  }
+  return { getItemProps };
+}
+function cssEscape(value) {
+  const cssObj = typeof CSS === "undefined" ? void 0 : CSS;
+  if (cssObj && typeof cssObj.escape === "function") {
+    return cssObj.escape(value);
+  }
+  return value.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
+}
+
+// src/feature/vim-navigation/infra/web/react/hook/use-vim-region.tsx
+function useVimRegion(containerRef, args) {
+  const vim = useVimController();
+  const selection = vim.getSelection();
+  const keyboard = useKeyboardController();
+  const refreshRef = useRef4(null);
+  const getRegionItemsRef = useRef4(args.getRegionItems);
+  const bindKeys = args.bindKeys ?? true;
+  const keyboardScopeId = args.keyboardScopeId ?? args.key.scopeId;
+  useEffect9(() => {
+    keyboard.handleDefineScope(keyboardScopeId, 50, false);
+    if (!bindKeys) {
+      return;
+    }
+    keyboard.handleEnableScope(keyboardScopeId);
+    return () => keyboard.handleDisableScope(keyboardScopeId);
+  }, [bindKeys, keyboard, keyboardScopeId]);
+  useVimBindings(keyboardScopeId, { enabled: bindKeys });
+  useSyncExternalStore(
+    (listener) => selection.subscribe(listener),
+    () => selection.getVersion(),
+    () => selection.getVersion()
+  );
+  const metaArgs = useMemo8(
+    () => ({
+      key: args.key,
+      orderIndex: args.orderIndex,
+      intra: args.intra,
+      inter: args.inter,
+      enterCursorFallback: args.enterCursorFallback,
+      itemDataAttr: args.itemDataAttr,
+      focusOnCursorChange: args.focusOnCursorChange
+    }),
+    [
+      args.enterCursorFallback,
+      args.focusOnCursorChange,
+      args.inter,
+      args.intra,
+      args.itemDataAttr,
+      args.key,
+      args.orderIndex
+    ]
+  );
+  const { getItemProps } = useVimRegionMeta(containerRef, metaArgs);
+  useEffect9(() => {
+    getRegionItemsRef.current = args.getRegionItems;
+  }, [args.getRegionItems]);
+  useEffect9(() => {
+    const refresh2 = selection.registerRegion({
+      key: args.key,
+      getRegionItems: () => getRegionItemsRef.current(),
+      makeActive: args.makeActive,
+      initialCursor: args.initialCursor
+    });
+    refreshRef.current = refresh2;
+    if (!selection.getActiveScope()) {
+      selection.setActiveScope(args.key.scopeId);
+    }
+    refresh2();
+    return () => {
+      selection.unregisterRegion(args.key);
+      refreshRef.current = null;
+    };
+  }, [args.initialCursor, args.key, args.makeActive, selection]);
+  useEffect9(() => {
+    if (!args.refreshDeps) {
+      return;
+    }
+    refreshRef.current?.();
+  }, args.refreshDeps ?? []);
+  const activeId = selection.getActiveItem(args.key);
+  const selectedIds = selection.getSelectedIds(args.key);
+  const rangeIds = selection.getRangeIds(args.key);
+  const toggledIds = selection.getToggledIds(args.key);
+  const mode = selection.getMode(args.key.scopeId);
+  const isSelected = (itemId) => selection.isSelected(args.key, itemId);
+  return {
+    getItemProps,
+    refresh: (fallback) => refreshRef.current?.(fallback),
+    activeId,
+    selectedIds,
+    rangeIds,
+    toggledIds,
+    mode,
+    isSelected
+  };
+}
+
 // src/ui/components/Field.tsx
 import * as React6 from "react";
 
 // src/ui/components/Label.tsx
 import * as React5 from "react";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 var Label = React5.forwardRef(
-  ({ className, htmlFor, children, ...props }, ref) => /* @__PURE__ */ jsx12(
+  ({ className, htmlFor, children, ...props }, ref) => /* @__PURE__ */ jsx15(
     "label",
     {
       ref,
@@ -2175,7 +3822,7 @@ var Label = React5.forwardRef(
 Label.displayName = "Label";
 
 // src/ui/components/Field.tsx
-import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs7 } from "react/jsx-runtime";
 function Field({ label, hint, error, required, disabled, id, children, className, ...props }) {
   const reactId = React6.useId();
   const controlId = id ?? `field-${reactId}`;
@@ -2195,7 +3842,7 @@ function Field({ label, hint, error, required, disabled, id, children, className
     "aria-describedby": ariaDescribedBy
   });
   return /* @__PURE__ */ jsxs7("div", { className: cn("grid gap-1.5", className), ...props, children: [
-    label ? /* @__PURE__ */ jsx13("div", { className: "flex items-center justify-between gap-3", children: /* @__PURE__ */ jsxs7(Label, { htmlFor: controlId, children: [
+    label ? /* @__PURE__ */ jsx16("div", { className: "flex items-center justify-between gap-3", children: /* @__PURE__ */ jsxs7(Label, { htmlFor: controlId, children: [
       label,
       resolvedRequired ? /* @__PURE__ */ jsxs7("span", { "aria-hidden": "true", className: "text-(--muted)", children: [
         " ",
@@ -2203,15 +3850,15 @@ function Field({ label, hint, error, required, disabled, id, children, className
       ] }) : null
     ] }) }) : null,
     control,
-    error ? /* @__PURE__ */ jsx13("p", { id: errorId, className: "text-xs leading-5 text-(--danger-contrast)", role: "alert", children: error }) : null,
-    hint ? /* @__PURE__ */ jsx13("p", { id: hintId, className: "text-xs leading-5 text-(--muted)", children: hint }) : null
+    error ? /* @__PURE__ */ jsx16("p", { id: errorId, className: "text-xs leading-5 text-(--danger-contrast)", role: "alert", children: error }) : null,
+    hint ? /* @__PURE__ */ jsx16("p", { id: hintId, className: "text-xs leading-5 text-(--muted)", children: hint }) : null
   ] });
 }
 
 // src/ui/components/Input.tsx
 import { cva as cva3 } from "class-variance-authority";
 import * as React7 from "react";
-import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs8 } from "react/jsx-runtime";
 var controlShellBase = cn(
   "relative inline-flex items-center gap-2",
   "rounded-[var(--radius-input)]",
@@ -2291,7 +3938,7 @@ var Input = React7.forwardRef(
         "data-invalid": invalid ? "" : void 0,
         "data-disabled": isDisabled ? "" : void 0,
         children: [
-          showLeftSlot ? /* @__PURE__ */ jsx14(
+          showLeftSlot ? /* @__PURE__ */ jsx17(
             "span",
             {
               className: cn(slotBase, reserveLeftSlot && slotReserve),
@@ -2299,7 +3946,7 @@ var Input = React7.forwardRef(
               children: leftSlot
             }
           ) : null,
-          /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx17(
             "input",
             {
               ref,
@@ -2309,7 +3956,7 @@ var Input = React7.forwardRef(
               ...props
             }
           ),
-          showRightSlot ? /* @__PURE__ */ jsx14(
+          showRightSlot ? /* @__PURE__ */ jsx17(
             "span",
             {
               className: cn(slotBase, reserveRightSlot && slotReserve),
@@ -2328,7 +3975,7 @@ Input.displayName = "Input";
 import { cva as cva4 } from "class-variance-authority";
 import { Slot as Slot2 } from "radix-ui";
 import * as React8 from "react";
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 var skeletonBase = cn(
   "relative isolate inline-flex overflow-hidden",
   "bg-[color:color-mix(in_oklab,var(--surface-2),var(--border)_25%)]",
@@ -2386,7 +4033,7 @@ var Skeleton = React8.forwardRef(
   ({ variant, size, radius, fullWidth, animation, preset, animate, asChild, className, children, ...props }, ref) => {
     const resolvedAnimation = animation ?? (animate === false ? "none" : animate ? "pulse" : void 0);
     const Component = asChild ? Slot2.Root : "div";
-    return /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsx18(
       Component,
       {
         ref,
@@ -2403,7 +4050,7 @@ var Skeleton = React8.forwardRef(
         ),
         "aria-hidden": props["aria-hidden"] ?? true,
         ...props,
-        children: asChild ? /* @__PURE__ */ jsx15(Slot2.Slottable, { children }) : children
+        children: asChild ? /* @__PURE__ */ jsx18(Slot2.Slottable, { children }) : children
       }
     );
   }
@@ -2413,7 +4060,7 @@ Skeleton.displayName = "Skeleton";
 // src/ui/components/Textarea.tsx
 import { cva as cva5 } from "class-variance-authority";
 import * as React9 from "react";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 var controlShellBase2 = cn(
   "relative inline-flex w-full",
   "rounded-[var(--radius-input)]",
@@ -2508,13 +4155,13 @@ var Textarea = React9.forwardRef(
     React9.useLayoutEffect(() => {
       resize();
     }, [resize, value]);
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx19(
       "div",
       {
         className: cn(textareaShellVariants({ variant, size, fullWidth }), className),
         "data-invalid": invalid ? "" : void 0,
         "data-disabled": isDisabled ? "" : void 0,
-        children: /* @__PURE__ */ jsx16(
+        children: /* @__PURE__ */ jsx19(
           "textarea",
           {
             ref: mergeRefs(innerRef, ref),
@@ -2541,7 +4188,7 @@ Textarea.displayName = "Textarea";
 import { AnimatePresence as AnimatePresence2, motion as motion2 } from "motion/react";
 import { Tooltip as TooltipPrimitive } from "radix-ui";
 import * as React10 from "react";
-import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs9 } from "react/jsx-runtime";
 var tooltipContentBase = cn(
   "panel shadow-none px-4 py-2.5 text-xs z-5000 select-none",
   "origin-center",
@@ -2561,9 +4208,9 @@ function Tooltip({
 }) {
   const [open2, setOpen] = React10.useState(false);
   const motionDuration = useMotionDuration("--motion-fast", 0.14);
-  return /* @__PURE__ */ jsx17(TooltipPrimitive.Provider, { delayDuration: delayMs, children: /* @__PURE__ */ jsxs9(TooltipPrimitive.Root, { onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx17(TooltipPrimitive.Trigger, { asChild: true, children }),
-    /* @__PURE__ */ jsx17(TooltipPrimitive.Portal, { forceMount: true, children: /* @__PURE__ */ jsx17(AnimatePresence2, { children: open2 ? /* @__PURE__ */ jsx17(TooltipPrimitive.Content, { asChild: true, forceMount: true, side, sideOffset, children: /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsx20(TooltipPrimitive.Provider, { delayDuration: delayMs, children: /* @__PURE__ */ jsxs9(TooltipPrimitive.Root, { onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx20(TooltipPrimitive.Trigger, { asChild: true, children }),
+    /* @__PURE__ */ jsx20(TooltipPrimitive.Portal, { forceMount: true, children: /* @__PURE__ */ jsx20(AnimatePresence2, { children: open2 ? /* @__PURE__ */ jsx20(TooltipPrimitive.Content, { asChild: true, forceMount: true, side, sideOffset, children: /* @__PURE__ */ jsxs9(
       motion2.div,
       {
         className: tooltipContentBase,
@@ -2591,7 +4238,7 @@ function Tooltip({
         },
         children: [
           content,
-          /* @__PURE__ */ jsx17(TooltipPrimitive.Arrow, { style: { fill: "var(--surface-2)" } })
+          /* @__PURE__ */ jsx20(TooltipPrimitive.Arrow, { style: { fill: "var(--surface-2)" } })
         ]
       }
     ) }) : null }) })
@@ -2603,7 +4250,7 @@ import { cva as cva6 } from "class-variance-authority";
 import { AnimatePresence as AnimatePresence3, motion as motion3 } from "motion/react";
 import { Popover as PopoverPrimitive } from "radix-ui";
 import * as React11 from "react";
-import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs10 } from "react/jsx-runtime";
 var popoverContentVariants = cva6(
   cn(
     "p-3 text-sm z-5000",
@@ -2675,7 +4322,7 @@ function Popover({
     onOpenChange?.(nextOpen);
   };
   return /* @__PURE__ */ jsxs10(PopoverPrimitive.Root, { open: resolvedOpen, onOpenChange: handleOpenChange, modal, children: [
-    /* @__PURE__ */ jsx18(
+    /* @__PURE__ */ jsx21(
       PopoverPrimitive.Trigger,
       {
         asChild: true,
@@ -2684,7 +4331,7 @@ function Popover({
         children: trigger
       }
     ),
-    /* @__PURE__ */ jsx18(PopoverPrimitive.Portal, { forceMount: true, container: portalContainer, children: /* @__PURE__ */ jsx18(AnimatePresence3, { children: resolvedOpen ? /* @__PURE__ */ jsx18(
+    /* @__PURE__ */ jsx21(PopoverPrimitive.Portal, { forceMount: true, container: portalContainer, children: /* @__PURE__ */ jsx21(AnimatePresence3, { children: resolvedOpen ? /* @__PURE__ */ jsx21(
       PopoverPrimitive.Content,
       {
         asChild: true,
@@ -2719,7 +4366,7 @@ function Popover({
             style,
             children: [
               children,
-              withArrow ? /* @__PURE__ */ jsx18(
+              withArrow ? /* @__PURE__ */ jsx21(
                 PopoverPrimitive.Arrow,
                 {
                   className: arrowClassName,
@@ -2761,7 +4408,7 @@ function useComposedRefs(...refs) {
 }
 
 // src/ui/components/DropdownMenu.tsx
-import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs11 } from "react/jsx-runtime";
 var dropdownMenuContentVariants = cva7(
   cn(
     "min-w-[14rem] p-2 text-sm z-5000",
@@ -2884,6 +4531,7 @@ function DropdownMenu({
   children,
   open: open2,
   defaultOpen,
+  keepMounted = false,
   onOpenChange,
   hoverOpen = false,
   hoverCloseDelayMs = 50,
@@ -2989,9 +4637,43 @@ function DropdownMenu({
   );
   const onPointerDownOutside = (event) => {
     restContentProps.onPointerDownOutside?.(event);
+    if (keepMounted) {
+      const target = event.target;
+      const isTriggerEvent = target instanceof Node && triggerRef.current?.contains(target);
+      if (!resolvedOpen || isTriggerEvent) {
+        event.preventDefault();
+      }
+    }
+  };
+  const keepMountedClassName = keepMounted && !resolvedOpen ? "pointer-events-none" : void 0;
+  const initialMotionState = {
+    opacity: 0,
+    scale: 0.98,
+    x: "var(--menu-x)",
+    y: "var(--menu-y)"
+  };
+  const openMotionState = {
+    opacity: 1,
+    scale: 1,
+    x: 0,
+    y: 0
+  };
+  const closedMotionState = {
+    opacity: 0,
+    scale: 0.98,
+    x: "var(--menu-x)",
+    y: "var(--menu-y)"
   };
+  const motionEase = keepMounted ? resolvedOpen ? "easeOut" : "easeIn" : "easeOut";
   const onInteractOutside = (event) => {
     restContentProps.onInteractOutside?.(event);
+    if (keepMounted) {
+      const target = event.target;
+      const isTriggerEvent = target instanceof Node && triggerRef.current?.contains(target);
+      if (!resolvedOpen || isTriggerEvent) {
+        event.preventDefault();
+      }
+    }
   };
   const resolvedContentProps = hoverOpen ? {
     ...restContentProps,
@@ -3013,59 +4695,61 @@ function DropdownMenu({
     onInteractOutside
   } : {
     ...restContentProps,
-    onKeyDown: handleContentKeyDown
+    onKeyDown: handleContentKeyDown,
+    ...keepMounted ? { onPointerDownOutside, onInteractOutside } : void 0
   };
-  return /* @__PURE__ */ jsx19(DropdownMenuOrientationContext.Provider, { value: resolvedItemsOrientation, children: /* @__PURE__ */ jsxs11(DropdownMenuPrimitive.Root, { open: resolvedOpen, onOpenChange: handleOpenChange, modal, children: [
-    /* @__PURE__ */ jsx19(DropdownMenuPrimitive.Trigger, { asChild: true, children: resolvedTrigger }),
-    /* @__PURE__ */ jsx19(DropdownMenuPrimitive.Portal, { forceMount: true, container: portalContainer, children: /* @__PURE__ */ jsx19(AnimatePresence4, { children: resolvedOpen ? /* @__PURE__ */ jsx19(
-      DropdownMenuPrimitive.Content,
-      {
-        asChild: true,
-        forceMount: true,
-        side,
-        align,
-        sideOffset,
-        alignOffset,
-        collisionPadding,
-        "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
-        "aria-labelledby": ariaLabelledBy,
-        ...resolvedContentProps,
-        children: /* @__PURE__ */ jsx19(
-          motion4.div,
-          {
-            className: cn(
-              dropdownMenuContentVariants({ chrome, orientation }),
-              className,
-              contentClassName
-            ),
-            ref: composedContentRef,
-            initial: {
-              opacity: 0,
-              scale: 0.98,
-              x: "var(--menu-x)",
-              y: "var(--menu-y)"
-            },
-            animate: { opacity: 1, scale: 1, x: 0, y: 0 },
-            exit: {
-              opacity: 0,
-              scale: 0.98,
-              x: "var(--menu-x)",
-              y: "var(--menu-y)",
-              transition: { duration: motionDuration, ease: "easeIn" }
-            },
-            transition: { duration: motionDuration, ease: "easeOut" },
-            style: { ...style, ...contentStyle },
-            children
-          }
-        )
-      }
-    ) : null }) })
+  const contentNode = /* @__PURE__ */ jsx22(
+    DropdownMenuPrimitive.Content,
+    {
+      asChild: true,
+      forceMount: true,
+      side,
+      align,
+      sideOffset,
+      alignOffset,
+      collisionPadding,
+      "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      ...resolvedContentProps,
+      children: /* @__PURE__ */ jsx22(
+        motion4.div,
+        {
+          "aria-hidden": keepMounted ? !resolvedOpen : void 0,
+          className: cn(
+            dropdownMenuContentVariants({ chrome, orientation }),
+            keepMountedClassName,
+            className,
+            contentClassName
+          ),
+          ref: composedContentRef,
+          initial: initialMotionState,
+          animate: keepMounted ? resolvedOpen ? openMotionState : closedMotionState : openMotionState,
+          exit: keepMounted ? void 0 : {
+            opacity: 0,
+            scale: 0.98,
+            x: "var(--menu-x)",
+            y: "var(--menu-y)",
+            transition: { duration: motionDuration, ease: "easeIn" }
+          },
+          transition: {
+            duration: motionDuration,
+            ease: motionEase
+          },
+          style: { ...style, ...contentStyle },
+          children
+        }
+      )
+    }
+  );
+  return /* @__PURE__ */ jsx22(DropdownMenuOrientationContext.Provider, { value: resolvedItemsOrientation, children: /* @__PURE__ */ jsxs11(DropdownMenuPrimitive.Root, { open: resolvedOpen, onOpenChange: handleOpenChange, modal, children: [
+    /* @__PURE__ */ jsx22(DropdownMenuPrimitive.Trigger, { asChild: true, children: resolvedTrigger }),
+    /* @__PURE__ */ jsx22(DropdownMenuPrimitive.Portal, { forceMount: true, container: portalContainer, children: keepMounted ? contentNode : /* @__PURE__ */ jsx22(AnimatePresence4, { children: resolvedOpen ? contentNode : null }) })
   ] }) });
 }
 var DropdownMenuItem = React13.forwardRef(
   ({ className, inset, destructive, ...props }, ref) => {
     const orientation = React13.useContext(DropdownMenuOrientationContext);
-    return /* @__PURE__ */ jsx19(
+    return /* @__PURE__ */ jsx22(
       DropdownMenuPrimitive.Item,
       {
         ref,
@@ -3079,14 +4763,14 @@ DropdownMenuItem.displayName = "DropdownMenuItem";
 var DropdownMenuSeparator = React13.forwardRef(({ className, ...props }, ref) => {
   const orientation = React13.useContext(DropdownMenuOrientationContext);
   const orientationClassName = orientation === "horizontal" ? "mx-1 w-px self-stretch bg-(--divider)" : "my-1 h-px bg-(--divider)";
-  return /* @__PURE__ */ jsx19(DropdownMenuPrimitive.Separator, { ref, className: cn(orientationClassName, className), ...props });
+  return /* @__PURE__ */ jsx22(DropdownMenuPrimitive.Separator, { ref, className: cn(orientationClassName, className), ...props });
 });
 DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
 
 // src/ui/components/Kbd.tsx
 import { cva as cva8 } from "class-variance-authority";
 import * as React14 from "react";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 var kbdVariants = cva8(
   cn(
     "inline-flex min-w-7 items-center justify-center gap-1",
@@ -3108,7 +4792,7 @@ var kbdVariants = cva8(
     }
   }
 );
-var Kbd = React14.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx20("span", { ref, className: cn(kbdVariants({ variant }), className), ...props }));
+var Kbd = React14.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx23("span", { ref, className: cn(kbdVariants({ variant }), className), ...props }));
 Kbd.displayName = "Kbd";
 export {
   AuthController,
@@ -3126,27 +4810,42 @@ export {
   DialogContent,
   DialogController,
   DialogHost,
+  DisableScopeUseCase,
   DropdownMenu,
   DropdownMenuItem,
   DropdownMenuSeparator,
+  EnableScopeUseCase,
   Field,
   HttpError,
+  InMemorySelectionStore,
   InfoDialog,
   Input,
   Kbd,
+  KeyboardProvider,
+  ListShortcutsUseCase,
   MockAuthHttpClient,
   MockHttpClient,
   NotificationHost,
   NotifierController,
   Popover,
   RedirectIfAuthed,
+  RegisterShortcutUseCase,
   RequireAuth,
+  ScopeManager,
+  SelectionController,
+  SelectionControllerProvider,
   Skeleton,
   Textarea,
   Tooltip,
+  UnregisterShortcutUseCase,
+  VimController,
+  VimControllerProvider,
+  VimRegionRegistry,
   authController,
   controllerFactory,
   createAuthController,
+  createSelectionController,
+  createVimController,
   dialogController,
   httpClient as fetchHttpClient,
   getDialogTemplate,
@@ -3162,5 +4861,12 @@ export {
   useAuthDispatch,
   useAuthedUser,
   useDialog,
-  useResponsiveMutation
+  useKeyboardController,
+  useResponsiveMutation,
+  useSelectionController,
+  useShortcut,
+  useShortcutScope,
+  useVimBindings,
+  useVimController,
+  useVimRegion
 };