@hexdspace/react 0.1.55 → 0.1.57

package/dist/index.d.ts

@@ -989,6 +989,27 @@ type UseVimRegionResult = {
 };
 declare function useVimRegion(containerRef: React__default.RefObject<HTMLElement | null>, args: UseVimRegionArgs): UseVimRegionResult;
 
+type Theme = 'light' | 'dark' | 'system';
+
+interface WatchSystemTheme {
+    execute(onChange: (theme: Exclude<Theme, 'system'>) => void): () => void;
+}
+
+interface SetDocumentTheme {
+    execute(theme: Theme): void;
+}
+
+declare class ThemeController {
+    private readonly setDocumentTheme;
+    private readonly watchSystemThemeUpdate;
+    constructor(setDocumentTheme: SetDocumentTheme, watchSystemThemeUpdate: WatchSystemTheme);
+    handleNewTheme(theme: Theme): void;
+    handleSystemThemeUpdated(onChange: (theme: Exclude<Theme, 'system'>) => void): () => void;
+}
+declare const themeController: ThemeController;
+
+declare function useIsDark(): boolean;
+
 declare const dialogSurfaceVariants: (props?: ({
     chrome?: "flat" | "glass" | "glow" | "hairline" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
@@ -1162,4 +1183,4 @@ declare const Kbd: React.ForwardRefExoticComponent<KbdProps & React.RefAttribute
 
 declare function useMotionDuration(varName: string, fallbackSeconds: number): number;
 
-export { AuthController, AuthControllerCtx, type AuthControllerDeps, AuthControllerProvider, AuthDispatchCtx, AuthProvider, type AuthState, AuthStateCtx, Button, type ButtonProps, type CacheInstruction, type ClearSelectionArgs, type ClearTarget, type CombineMode, ConfirmDialog, type ConfirmDialogProps, type ConfirmPayload, type CursorFallback, CustomDialog, type CustomDialogPayload, type CustomDialogProps, type CustomInstruction, DEFAULT_NOTIFICATION_CHANNEL, type DefaultDialogPayloads, type DefaultDialogTemplateKey, DefaultDialogTemplateKeys, Dialog, DialogContent, DialogController, DialogHost, type DialogInstance, type DialogOptions, type DialogProps, type DialogTemplate, type DisableScope, DisableScopeUseCase, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, DropdownMenuSeparator, type EnableScope, EnableScopeUseCase, type ErrorResponse, Field, type FieldProps, type GenericResponse, type GroupedShortcuts, type HandleSelection, type HttpClient, HttpError, type HttpMethod, type HttpResponse, InMemorySelectionStore, InfoDialog, type InfoDialogProps, type InfoPayload, Input, type InputProps, type Instruction, type InstructionContext, type ItemId, Kbd, type KbdProps, KeyboardController, KeyboardProvider, type ListShortcuts, ListShortcutsUseCase, type ListedShortcut, MockAuthHttpClient, MockHttpClient, type Mode, type MutationFn, type Notification, type NotificationAction, NotificationHost, type NotificationInstruction, type NotificationVariant, NotifierController, type OnSuccessFn, type OptimisticSnapshot, type OptimisticUpdateFn, Popover, type PopoverProps, type QuerySelection, RedirectIfAuthed, type RedirectIfAuthedProps, type RegionId, type RegionKey, type RegionSelection, type RegisterRegionArgs, type RegisterShortcut, RegisterShortcutUseCase, type RequestConfig, RequireAuth, type RequireAuthProps, type ResolvedToastTheme, type ResponsiveMutation, type ScopeId, ScopeManager, type ScopeState, SelectionController, type SelectionControllerDeps, SelectionControllerProvider, type SelectionState, type SelectionStore, type ShortcutBinding, type ShortcutHandler, type ShortcutRegistration, type ShortcutScope, Skeleton, type SkeletonProps, Textarea, type TextareaProps, type ToastActionTheme, type ToastTheme, type ToastTransition, type ToastifyCSSVars, Tooltip, type UIFail, type UIOk, type UIResult, type UnregisterShortcut, UnregisterShortcutUseCase, type UseVimRegionArgs, type UseVimRegionResult, type User, VimController, type VimControllerDeps, VimControllerProvider, type VimDirection, type VimInterDirection, type VimKeyState, type VimModifierMovementAction, type VimModifierMovementActionArgs, type VimModifierMovementActions, type VimMovementModifier, type VimPending, type VimRegionMeta, VimRegionRegistry, authController, controllerFactory, createAuthController, createSelectionController, createVimController, dialogController, httpClient as fetchHttpClient, getDialogTemplate, keyboardController, notifierController, registerDefaultDialogs, registerDialogTemplate, resolveToastTheme, ui, unregisterDialogTemplate, useAuth, useAuthActions, useAuthController, useAuthDispatch, useAuthedUser, useDialog, useKeyboardController, useMotionDuration, useResponsiveMutation, useSelectionController, useShortcut, useShortcutScope, useVimBindings, useVimController, useVimRegion };
+export { AuthController, AuthControllerCtx, type AuthControllerDeps, AuthControllerProvider, AuthDispatchCtx, AuthProvider, type AuthState, AuthStateCtx, Button, type ButtonProps, type CacheInstruction, type ClearSelectionArgs, type ClearTarget, type CombineMode, ConfirmDialog, type ConfirmDialogProps, type ConfirmPayload, type CursorFallback, CustomDialog, type CustomDialogPayload, type CustomDialogProps, type CustomInstruction, DEFAULT_NOTIFICATION_CHANNEL, type DefaultDialogPayloads, type DefaultDialogTemplateKey, DefaultDialogTemplateKeys, Dialog, DialogContent, DialogController, DialogHost, type DialogInstance, type DialogOptions, type DialogProps, type DialogTemplate, type DisableScope, DisableScopeUseCase, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, DropdownMenuSeparator, type EnableScope, EnableScopeUseCase, type ErrorResponse, Field, type FieldProps, type GenericResponse, type GroupedShortcuts, type HandleSelection, type HttpClient, HttpError, type HttpMethod, type HttpResponse, InMemorySelectionStore, InfoDialog, type InfoDialogProps, type InfoPayload, Input, type InputProps, type Instruction, type InstructionContext, type ItemId, Kbd, type KbdProps, KeyboardController, KeyboardProvider, type ListShortcuts, ListShortcutsUseCase, type ListedShortcut, MockAuthHttpClient, MockHttpClient, type Mode, type MutationFn, type Notification, type NotificationAction, NotificationHost, type NotificationInstruction, type NotificationVariant, NotifierController, type OnSuccessFn, type OptimisticSnapshot, type OptimisticUpdateFn, Popover, type PopoverProps, type QuerySelection, RedirectIfAuthed, type RedirectIfAuthedProps, type RegionId, type RegionKey, type RegionSelection, type RegisterRegionArgs, type RegisterShortcut, RegisterShortcutUseCase, type RequestConfig, RequireAuth, type RequireAuthProps, type ResolvedToastTheme, type ResponsiveMutation, type ScopeId, ScopeManager, type ScopeState, SelectionController, type SelectionControllerDeps, SelectionControllerProvider, type SelectionState, type SelectionStore, type SetDocumentTheme, type ShortcutBinding, type ShortcutHandler, type ShortcutRegistration, type ShortcutScope, Skeleton, type SkeletonProps, Textarea, type TextareaProps, type Theme, ThemeController, type ToastActionTheme, type ToastTheme, type ToastTransition, type ToastifyCSSVars, Tooltip, type UIFail, type UIOk, type UIResult, type UnregisterShortcut, UnregisterShortcutUseCase, type UseVimRegionArgs, type UseVimRegionResult, type User, VimController, type VimControllerDeps, VimControllerProvider, type VimDirection, type VimInterDirection, type VimKeyState, type VimModifierMovementAction, type VimModifierMovementActionArgs, type VimModifierMovementActions, type VimMovementModifier, type VimPending, type VimRegionMeta, VimRegionRegistry, type WatchSystemTheme, authController, controllerFactory, createAuthController, createSelectionController, createVimController, dialogController, httpClient as fetchHttpClient, getDialogTemplate, keyboardController, notifierController, registerDefaultDialogs, registerDialogTemplate, resolveToastTheme, themeController, ui, unregisterDialogTemplate, useAuth, useAuthActions, useAuthController, useAuthDispatch, useAuthedUser, useDialog, useIsDark, useKeyboardController, useMotionDuration, useResponsiveMutation, useSelectionController, useShortcut, useShortcutScope, useVimBindings, useVimController, useVimRegion };

package/dist/index.js

@@ -3684,8 +3684,7 @@ function getScopeEntry(keyboardScopeId) {
   const entry = {
     ownerId: null,
     subscribers: /* @__PURE__ */ new Map(),
-    modifierActionsByOwner: /* @__PURE__ */ new Map(),
-    modifierActionsVersion: 0
+    modifierActionsByOwner: /* @__PURE__ */ new Map()
   };
   scopeBindings.set(keyboardScopeId, entry);
   return entry;
@@ -3697,10 +3696,8 @@ function useVimBindings(regionKey, keyboardScopeId, options = {}) {
   const modifierMovementActions = options.modifierMovementActions;
   const ownerIdRef = useRef3(Symbol("vim-binding-owner"));
   const [isOwner, setIsOwner] = useState5(false);
-  const [modifierActionsVersion, setModifierActionsVersion] = useState5(0);
   const handleEntryChange = useCallback5((entry) => {
     setIsOwner(entry.ownerId === ownerIdRef.current);
-    setModifierActionsVersion(entry.modifierActionsVersion);
   }, []);
   const blockWhileTyping = useCallback5(
     (e) => allowArrowKeys && e.key.startsWith("Arrow"),
@@ -3740,13 +3737,11 @@ function useVimBindings(regionKey, keyboardScopeId, options = {}) {
     }
     const entry = getScopeEntry(keyboardScopeId);
     entry.modifierActionsByOwner.set(ownerIdRef.current, modifierMovementActions ?? null);
-    entry.modifierActionsVersion += 1;
     notify(entry);
     return () => {
       const existing = scopeBindings.get(keyboardScopeId);
       if (!existing) return;
       existing.modifierActionsByOwner.delete(ownerIdRef.current);
-      existing.modifierActionsVersion += 1;
       if (!existing.ownerId && existing.subscribers.size === 0 && existing.modifierActionsByOwner.size === 0) {
         scopeBindings.delete(keyboardScopeId);
         return;
@@ -3860,7 +3855,7 @@ function useVimBindings(regionKey, keyboardScopeId, options = {}) {
       ...modifierBindings("shift", modifierAvailability?.shift),
       ...modifierBindings("ctrlShift", modifierAvailability?.ctrlShift)
     ];
-  }, [allowArrowKeys, enabled, isOwner, keyboardScopeId, modifierActionsVersion, vim]);
+  }, [allowArrowKeys, enabled, isOwner, keyboardScopeId, vim]);
   useShortcut(keyboardScopeId, bindings, {
     ignoreTyping: true,
     preventDefault: true,
@@ -4053,6 +4048,77 @@ function useVimRegion(containerRef, args) {
   };
 }
 
+// src/feature/theme-select/application/use-case/set-document-theme-use-case.ts
+var SetDocumentThemeUseCase = class {
+  execute(next) {
+    const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+    const effective = next === "system" ? prefersDark ? "dark" : "light" : next;
+    const root = document.documentElement;
+    root.classList.add("theme-switching");
+    root.classList.toggle("dark", effective === "dark");
+    root.setAttribute("data-theme", effective);
+    window.setTimeout(() => root.classList.remove("theme-switching"), 0);
+    localStorage.setItem("theme", next);
+  }
+};
+
+// src/feature/theme-select/application/use-case/watch-system-theme-use-case.ts
+var WatchSystemThemeUseCase = class {
+  execute(onChange) {
+    const mql = window.matchMedia("(prefers-color-scheme: dark)");
+    const emit = () => onChange(mql.matches ? "dark" : "light");
+    const shouldReact = () => {
+      try {
+        return localStorage.getItem("theme") === "system";
+      } catch {
+        return true;
+      }
+    };
+    const handler = () => {
+      if (shouldReact()) emit();
+    };
+    if (shouldReact()) emit();
+    mql.addEventListener("change", handler);
+    return () => mql.removeEventListener("change", handler);
+  }
+};
+
+// src/feature/theme-select/interface/controller/theme-controller.ts
+var ThemeController = class {
+  constructor(setDocumentTheme, watchSystemThemeUpdate) {
+    this.setDocumentTheme = setDocumentTheme;
+    this.watchSystemThemeUpdate = watchSystemThemeUpdate;
+  }
+  handleNewTheme(theme) {
+    return this.setDocumentTheme.execute(theme);
+  }
+  handleSystemThemeUpdated(onChange) {
+    return this.watchSystemThemeUpdate.execute(onChange);
+  }
+};
+var themeController = new ThemeController(new SetDocumentThemeUseCase(), new WatchSystemThemeUseCase());
+
+// src/feature/theme-select/interface/web/react/hook/use-is-dark.ts
+import { useEffect as useEffect10, useState as useState6 } from "react";
+function useIsDark() {
+  const [isDark, setIsDark] = useState6(() => {
+    if (typeof document === "undefined") return false;
+    return document.documentElement.classList.contains("dark");
+  });
+  useEffect10(() => {
+    if (typeof document === "undefined") return;
+    const el = document.documentElement;
+    const observer = new MutationObserver(() => {
+      setIsDark(el.classList.contains("dark"));
+    });
+    observer.observe(el, { attributes: true, attributeFilter: ["class"] });
+    return () => {
+      observer.disconnect();
+    };
+  }, []);
+  return isDark;
+}
+
 // src/ui/components/Field.tsx
 import * as React6 from "react";
 
@@ -4442,7 +4508,7 @@ import { Tooltip as TooltipPrimitive } from "radix-ui";
 import * as React10 from "react";
 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",
+  "panel border border-surface-1 shadow-none px-4 py-2.5 text-xs z-5000 select-none",
   "origin-center",
   "[--tooltip-x:0px] [--tooltip-y:4px]",
   "data-[side=bottom]:[--tooltip-y:-4px]",
@@ -4490,7 +4556,13 @@ function Tooltip({
         },
         children: [
           content,
-          /* @__PURE__ */ jsx20(TooltipPrimitive.Arrow, { style: { fill: "var(--surface-2)" } })
+          /* @__PURE__ */ jsx20(
+            TooltipPrimitive.Arrow,
+            {
+              className: "fill-(--surface-2) stroke-(--surface-1)",
+              style: { strokeWidth: 1 }
+            }
+          )
         ]
       }
     ) }) }) : null })
@@ -5067,6 +5139,7 @@ export {
   SelectionControllerProvider,
   Skeleton,
   Textarea,
+  ThemeController,
   Tooltip,
   UnregisterShortcutUseCase,
   VimController,
@@ -5085,6 +5158,7 @@ export {
   registerDefaultDialogs,
   registerDialogTemplate,
   resolveToastTheme,
+  themeController,
   ui,
   unregisterDialogTemplate,
   useAuth,
@@ -5093,6 +5167,7 @@ export {
   useAuthDispatch,
   useAuthedUser,
   useDialog,
+  useIsDark,
   useKeyboardController,
   useMotionDuration,
   useResponsiveMutation,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hexdspace/react",
-  "version": "0.1.55",
+  "version": "0.1.57",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",