@lobehub/ui 4.8.1 → 4.9.0

package/es/EditableText/EditableText.d.mts

@@ -1,8 +1,8 @@
 import { EditableTextProps } from "./type.mjs";
-import * as react1 from "react";
+import * as react71 from "react";
 
 //#region src/EditableText/EditableText.d.ts
-declare const EditableText: react1.NamedExoticComponent<EditableTextProps>;
+declare const EditableText: react71.NamedExoticComponent<EditableTextProps>;
 //#endregion
 export { EditableText };
 //# sourceMappingURL=EditableText.d.mts.map

package/es/EmojiPicker/EmojiPicker.d.mts

@@ -1,8 +1,8 @@
 import { EmojiPickerProps } from "./type.mjs";
-import * as react5 from "react";
+import * as react0 from "react";
 
 //#region src/EmojiPicker/EmojiPicker.d.ts
-declare const EmojiPicker: react5.NamedExoticComponent<EmojiPickerProps>;
+declare const EmojiPicker: react0.NamedExoticComponent<EmojiPickerProps>;
 //#endregion
 export { EmojiPicker };
 //# sourceMappingURL=EmojiPicker.d.mts.map

package/es/Flex/FlexBasic.d.mts

@@ -1,8 +1,8 @@
 import { FlexBasicProps } from "./type.mjs";
-import * as react0 from "react";
+import * as react48 from "react";
 
 //#region src/Flex/FlexBasic.d.ts
-declare const _default: react0.NamedExoticComponent<FlexBasicProps>;
+declare const _default: react48.NamedExoticComponent<FlexBasicProps>;
 //#endregion
 export { _default };
 //# sourceMappingURL=FlexBasic.d.mts.map

package/es/FontLoader/index.d.mts

@@ -1,10 +1,10 @@
-import * as react66 from "react";
+import * as react67 from "react";
 
 //#region src/FontLoader/index.d.ts
 interface FontLoaderProps {
   url: string;
 }
-declare const FontLoader: react66.NamedExoticComponent<FontLoaderProps>;
+declare const FontLoader: react67.NamedExoticComponent<FontLoaderProps>;
 //#endregion
 export { FontLoader, FontLoaderProps };
 //# sourceMappingURL=index.d.mts.map

package/es/Footer/Footer.d.mts

@@ -1,8 +1,8 @@
 import { FooterProps } from "./type.mjs";
-import * as react0 from "react";
+import * as react47 from "react";
 
 //#region src/Footer/Footer.d.ts
-declare const Footer: react0.NamedExoticComponent<FooterProps>;
+declare const Footer: react47.NamedExoticComponent<FooterProps>;
 //#endregion
 export { Footer };
 //# sourceMappingURL=Footer.d.mts.map

package/es/Form/components/FormGroup.d.mts

@@ -1,8 +1,8 @@
 import { FormGroupProps } from "../type.mjs";
-import * as react64 from "react";
+import * as react43 from "react";
 
 //#region src/Form/components/FormGroup.d.ts
-declare const FormGroup: react64.NamedExoticComponent<FormGroupProps>;
+declare const FormGroup: react43.NamedExoticComponent<FormGroupProps>;
 //#endregion
 export { FormGroup };
 //# sourceMappingURL=FormGroup.d.mts.map

package/es/Form/components/FormItem.d.mts

@@ -1,8 +1,8 @@
 import { FormItemProps } from "../type.mjs";
-import * as react65 from "react";
+import * as react44 from "react";
 
 //#region src/Form/components/FormItem.d.ts
-declare const FormItem: react65.NamedExoticComponent<FormItemProps>;
+declare const FormItem: react44.NamedExoticComponent<FormItemProps>;
 //#endregion
 export { FormItem };
 //# sourceMappingURL=FormItem.d.mts.map

package/es/Form/components/FormSubmitFooter.d.mts

@@ -1,8 +1,8 @@
 import { FormSubmitFooterProps } from "../type.mjs";
-import * as react63 from "react";
+import * as react45 from "react";
 
 //#region src/Form/components/FormSubmitFooter.d.ts
-declare const FormSubmitFooter: react63.NamedExoticComponent<FormSubmitFooterProps>;
+declare const FormSubmitFooter: react45.NamedExoticComponent<FormSubmitFooterProps>;
 //#endregion
 export { FormSubmitFooter };
 //# sourceMappingURL=FormSubmitFooter.d.mts.map

package/es/FormModal/FormModal.d.mts

@@ -1,8 +1,8 @@
 import { FormModalProps } from "./type.mjs";
-import * as react62 from "react";
+import * as react46 from "react";
 
 //#region src/FormModal/FormModal.d.ts
-declare const FormModal: react62.NamedExoticComponent<FormModalProps>;
+declare const FormModal: react46.NamedExoticComponent<FormModalProps>;
 //#endregion
 export { FormModal };
 //# sourceMappingURL=FormModal.d.mts.map

package/es/GuideCard/GuideCard.d.mts

@@ -1,8 +1,8 @@
 import { GuideCardProps } from "./type.mjs";
-import * as react133 from "react";
+import * as react131 from "react";
 
 //#region src/GuideCard/GuideCard.d.ts
-declare const GuideCard: react133.NamedExoticComponent<GuideCardProps>;
+declare const GuideCard: react131.NamedExoticComponent<GuideCardProps>;
 //#endregion
 export { GuideCard };
 //# sourceMappingURL=GuideCard.d.mts.map

package/es/Header/Header.d.mts

@@ -1,8 +1,8 @@
 import { HeaderProps } from "./type.mjs";
-import * as react59 from "react";
+import * as react42 from "react";
 
 //#region src/Header/Header.d.ts
-declare const Header: react59.NamedExoticComponent<HeaderProps>;
+declare const Header: react42.NamedExoticComponent<HeaderProps>;
 //#endregion
 export { Header };
 //# sourceMappingURL=Header.d.mts.map

package/es/Highlighter/Highlighter.d.mts

@@ -1,8 +1,8 @@
 import { HighlighterProps } from "./type.mjs";
-import * as react60 from "react";
+import * as react39 from "react";
 
 //#region src/Highlighter/Highlighter.d.ts
-declare const Highlighter: react60.NamedExoticComponent<HighlighterProps>;
+declare const Highlighter: react39.NamedExoticComponent<HighlighterProps>;
 //#endregion
 export { Highlighter };
 //# sourceMappingURL=Highlighter.d.mts.map

package/es/Highlighter/SyntaxHighlighter/index.d.mts

@@ -1,8 +1,8 @@
 import { SyntaxHighlighterProps } from "../type.mjs";
-import * as react61 from "react";
+import * as react40 from "react";
 
 //#region src/Highlighter/SyntaxHighlighter/index.d.ts
-declare const SyntaxHighlighter: react61.NamedExoticComponent<SyntaxHighlighterProps>;
+declare const SyntaxHighlighter: react40.NamedExoticComponent<SyntaxHighlighterProps>;
 //#endregion
 export { SyntaxHighlighter };
 //# sourceMappingURL=index.d.mts.map

package/es/Hotkey/Hotkey.d.mts

@@ -1,8 +1,8 @@
 import { HotkeyProps } from "./type.mjs";
-import * as react58 from "react";
+import * as react41 from "react";
 
 //#region src/Hotkey/Hotkey.d.ts
-declare const Hotkey: react58.NamedExoticComponent<HotkeyProps>;
+declare const Hotkey: react41.NamedExoticComponent<HotkeyProps>;
 //#endregion
 export { Hotkey };
 //# sourceMappingURL=Hotkey.d.mts.map

package/es/HotkeyInput/HotkeyInput.d.mts

@@ -1,8 +1,8 @@
 import { HotkeyInputProps } from "./type.mjs";
-import * as react54 from "react";
+import * as react38 from "react";
 
 //#region src/HotkeyInput/HotkeyInput.d.ts
-declare const HotkeyInput: react54.NamedExoticComponent<HotkeyInputProps>;
+declare const HotkeyInput: react38.NamedExoticComponent<HotkeyInputProps>;
 //#endregion
 export { HotkeyInput };
 //# sourceMappingURL=HotkeyInput.d.mts.map

package/es/Icon/Icon.d.mts

@@ -1,8 +1,8 @@
 import { IconProps } from "./type.mjs";
-import * as react57 from "react";
+import * as react36 from "react";
 
 //#region src/Icon/Icon.d.ts
-declare const Icon: react57.NamedExoticComponent<IconProps>;
+declare const Icon: react36.NamedExoticComponent<IconProps>;
 //#endregion
 export { Icon };
 //# sourceMappingURL=Icon.d.mts.map

package/es/Icon/components/IconProvider.d.mts

@@ -1,11 +1,11 @@
 import { IconProps } from "../type.mjs";
-import * as react55 from "react";
+import * as react34 from "react";
 import { ReactNode } from "react";
 
 //#region src/Icon/components/IconProvider.d.ts
 type IconContentConfig = Omit<IconProps, 'icon' | 'ref'>;
-declare const IconContext: react55.Context<IconContentConfig>;
-declare const IconProvider: react55.NamedExoticComponent<{
+declare const IconContext: react34.Context<IconContentConfig>;
+declare const IconProvider: react34.NamedExoticComponent<{
   children: ReactNode;
   config?: IconContentConfig;
 }>;

package/es/Image/PreviewGroup.d.mts

@@ -1,8 +1,8 @@
 import { PreviewGroupProps } from "./type.mjs";
-import * as react53 from "react";
+import * as react37 from "react";
 
 //#region src/Image/PreviewGroup.d.ts
-declare const PreviewGroup: react53.NamedExoticComponent<PreviewGroupProps>;
+declare const PreviewGroup: react37.NamedExoticComponent<PreviewGroupProps>;
 //#endregion
 export { PreviewGroup };
 //# sourceMappingURL=PreviewGroup.d.mts.map

package/es/ImageSelect/ImageSelect.d.mts

@@ -1,8 +1,8 @@
 import { ImageSelectProps } from "./type.mjs";
-import * as react109 from "react";
+import * as react108 from "react";
 
 //#region src/ImageSelect/ImageSelect.d.ts
-declare const ImageSelect: react109.NamedExoticComponent<ImageSelectProps>;
+declare const ImageSelect: react108.NamedExoticComponent<ImageSelectProps>;
 //#endregion
 export { ImageSelect };
 //# sourceMappingURL=ImageSelect.d.mts.map

package/es/Input/Input.d.mts

@@ -1,8 +1,8 @@
 import { InputProps } from "./type.mjs";
-import * as react136 from "react";
+import * as react134 from "react";
 
 //#region src/Input/Input.d.ts
-declare const Input: react136.NamedExoticComponent<InputProps>;
+declare const Input: react134.NamedExoticComponent<InputProps>;
 //#endregion
 export { Input };
 //# sourceMappingURL=Input.d.mts.map

package/es/Input/InputNumber.d.mts

@@ -1,8 +1,8 @@
 import { InputNumberProps } from "./type.mjs";
-import * as react138 from "react";
+import * as react135 from "react";
 
 //#region src/Input/InputNumber.d.ts
-declare const InputNumber: react138.NamedExoticComponent<InputNumberProps>;
+declare const InputNumber: react135.NamedExoticComponent<InputNumberProps>;
 //#endregion
 export { InputNumber };
 //# sourceMappingURL=InputNumber.d.mts.map

package/es/Input/InputOPT.d.mts

@@ -1,8 +1,8 @@
 import { InputOPTProps } from "./type.mjs";
-import * as react135 from "react";
+import * as react136 from "react";
 
 //#region src/Input/InputOPT.d.ts
-declare const InputOPT: react135.NamedExoticComponent<InputOPTProps>;
+declare const InputOPT: react136.NamedExoticComponent<InputOPTProps>;
 //#endregion
 export { InputOPT };
 //# sourceMappingURL=InputOPT.d.mts.map

package/es/Input/InputPassword.d.mts

@@ -1,8 +1,8 @@
 import { InputPasswordProps } from "./type.mjs";
-import * as react134 from "react";
+import * as react137 from "react";
 
 //#region src/Input/InputPassword.d.ts
-declare const InputPassword: react134.NamedExoticComponent<InputPasswordProps>;
+declare const InputPassword: react137.NamedExoticComponent<InputPasswordProps>;
 //#endregion
 export { InputPassword };
 //# sourceMappingURL=InputPassword.d.mts.map

package/es/Input/TextArea.d.mts

@@ -1,8 +1,8 @@
 import { TextAreaProps } from "./type.mjs";
-import * as react137 from "react";
+import * as react138 from "react";
 
 //#region src/Input/TextArea.d.ts
-declare const TextArea: react137.NamedExoticComponent<TextAreaProps>;
+declare const TextArea: react138.NamedExoticComponent<TextAreaProps>;
 //#endregion
 export { TextArea };
 //# sourceMappingURL=TextArea.d.mts.map

package/es/Layout/components/LayoutFooter.d.mts

@@ -1,9 +1,9 @@
 import { DivProps } from "../../types/index.mjs";
 import "../../index.mjs";
-import * as react47 from "react";
+import * as react29 from "react";
 
 //#region src/Layout/components/LayoutFooter.d.ts
-declare const LayoutFooter: react47.NamedExoticComponent<DivProps>;
+declare const LayoutFooter: react29.NamedExoticComponent<DivProps>;
 //#endregion
 export { LayoutFooter };
 //# sourceMappingURL=LayoutFooter.d.mts.map

package/es/Layout/components/LayoutHeader.d.mts

@@ -1,8 +1,8 @@
 import { LayoutHeaderProps } from "../type.mjs";
-import * as react48 from "react";
+import * as react28 from "react";
 
 //#region src/Layout/components/LayoutHeader.d.ts
-declare const LayoutHeader: react48.NamedExoticComponent<LayoutHeaderProps>;
+declare const LayoutHeader: react28.NamedExoticComponent<LayoutHeaderProps>;
 //#endregion
 export { LayoutHeader };
 //# sourceMappingURL=LayoutHeader.d.mts.map

package/es/Layout/components/LayoutMain.d.mts

@@ -1,9 +1,9 @@
 import { DivProps } from "../../types/index.mjs";
 import "../../index.mjs";
-import * as react49 from "react";
+import * as react31 from "react";
 
 //#region src/Layout/components/LayoutMain.d.ts
-declare const LayoutMain: react49.NamedExoticComponent<DivProps>;
+declare const LayoutMain: react31.NamedExoticComponent<DivProps>;
 //#endregion
 export { LayoutMain };
 //# sourceMappingURL=LayoutMain.d.mts.map

package/es/Layout/components/LayoutSidebar.d.mts

@@ -1,8 +1,8 @@
 import { LayoutSidebarProps } from "../type.mjs";
-import * as react50 from "react";
+import * as react30 from "react";
 
 //#region src/Layout/components/LayoutSidebar.d.ts
-declare const LayoutSidebar: react50.NamedExoticComponent<LayoutSidebarProps>;
+declare const LayoutSidebar: react30.NamedExoticComponent<LayoutSidebarProps>;
 //#endregion
 export { LayoutSidebar };
 //# sourceMappingURL=LayoutSidebar.d.mts.map

package/es/Layout/components/LayoutSidebarInner.d.mts

@@ -1,8 +1,8 @@
 import { LayoutSidebarInnerProps } from "../type.mjs";
-import * as react51 from "react";
+import * as react32 from "react";
 
 //#region src/Layout/components/LayoutSidebarInner.d.ts
-declare const LayoutSidebarInner: react51.NamedExoticComponent<LayoutSidebarInnerProps>;
+declare const LayoutSidebarInner: react32.NamedExoticComponent<LayoutSidebarInnerProps>;
 //#endregion
 export { LayoutSidebarInner };
 //# sourceMappingURL=LayoutSidebarInner.d.mts.map

package/es/Layout/components/LayoutToc.d.mts

@@ -1,8 +1,8 @@
 import { LayoutTocProps } from "../type.mjs";
-import * as react52 from "react";
+import * as react33 from "react";
 
 //#region src/Layout/components/LayoutToc.d.ts
-declare const LayoutToc: react52.NamedExoticComponent<LayoutTocProps>;
+declare const LayoutToc: react33.NamedExoticComponent<LayoutTocProps>;
 //#endregion
 export { LayoutToc };
 //# sourceMappingURL=LayoutToc.d.mts.map

package/es/List/ListItem/index.d.mts

@@ -1,8 +1,8 @@
 import { ListItemProps } from "../type.mjs";
-import * as react46 from "react";
+import * as react27 from "react";
 
 //#region src/List/ListItem/index.d.ts
-declare const ListItem: react46.NamedExoticComponent<ListItemProps>;
+declare const ListItem: react27.NamedExoticComponent<ListItemProps>;
 //#endregion
 export { ListItem };
 //# sourceMappingURL=index.d.mts.map

package/es/Markdown/Markdown.d.mts

@@ -1,8 +1,8 @@
 import { MarkdownProps } from "./type.mjs";
-import * as react44 from "react";
+import * as react26 from "react";
 
 //#region src/Markdown/Markdown.d.ts
-declare const Markdown: react44.NamedExoticComponent<MarkdownProps>;
+declare const Markdown: react26.NamedExoticComponent<MarkdownProps>;
 //#endregion
 export { Markdown };
 //# sourceMappingURL=Markdown.d.mts.map

package/es/Markdown/Typography.d.mts

@@ -1,8 +1,8 @@
 import { TypographyProps } from "./type.mjs";
-import * as react43 from "react";
+import * as react25 from "react";
 
 //#region src/Markdown/Typography.d.ts
-declare const Typography: react43.NamedExoticComponent<TypographyProps>;
+declare const Typography: react25.NamedExoticComponent<TypographyProps>;
 //#endregion
 export { Typography };
 //# sourceMappingURL=Typography.d.mts.map

package/es/Markdown/components/SearchResultCards/index.d.mts

@@ -1,6 +1,6 @@
 import { FlexboxProps } from "../../../Flex/type.mjs";
 import "../../../Flex/index.mjs";
-import * as react70 from "react";
+import * as react68 from "react";
 import { Ref } from "react";
 
 //#region src/Markdown/components/SearchResultCards/index.d.ts
@@ -14,7 +14,7 @@ interface SearchResultCardsProps extends FlexboxProps {
   dataSource: string[] | SearchResultItem[];
   ref?: Ref<HTMLDivElement>;
 }
-declare const SearchResultCards: react70.NamedExoticComponent<SearchResultCardsProps>;
+declare const SearchResultCards: react68.NamedExoticComponent<SearchResultCardsProps>;
 //#endregion
 export { SearchResultCards, SearchResultCardsProps };
 //# sourceMappingURL=index.d.mts.map

package/es/MaskShadow/MaskShadow.d.mts

@@ -1,8 +1,8 @@
 import { MaskShadowProps } from "./type.mjs";
-import * as react45 from "react";
+import * as react24 from "react";
 
 //#region src/MaskShadow/MaskShadow.d.ts
-declare const MaskShadow: react45.NamedExoticComponent<MaskShadowProps>;
+declare const MaskShadow: react24.NamedExoticComponent<MaskShadowProps>;
 //#endregion
 export { MaskShadow };
 //# sourceMappingURL=MaskShadow.d.mts.map

package/es/Menu/Menu.d.mts

@@ -1,8 +1,8 @@
 import { MenuProps } from "./type.mjs";
-import * as react42 from "react";
+import * as react18 from "react";
 
 //#region src/Menu/Menu.d.ts
-declare const Menu: react42.NamedExoticComponent<MenuProps<unknown>>;
+declare const Menu: react18.NamedExoticComponent<MenuProps<unknown>>;
 //#endregion
 export { Menu };
 //# sourceMappingURL=Menu.d.mts.map

package/es/Menu/baseItem.d.mts

@@ -0,0 +1,15 @@
+import { MenuCheckboxItemType } from "./checkboxItem.mjs";
+import { GenericItemType } from "./type.mjs";
+
+//#region src/Menu/baseItem.d.ts
+
+/**
+ * Base item union for Base UI driven menus (DropdownMenu / ContextMenu).
+ *
+ * Note: This intentionally does NOT change `GenericItemType` itself,
+ * because `GenericItemType` maps to rc-menu/antd Menu item types.
+ */
+type BaseMenuItemType<T = unknown> = GenericItemType<T> | MenuCheckboxItemType;
+//#endregion
+export { BaseMenuItemType };
+//# sourceMappingURL=baseItem.d.mts.map

package/es/Menu/checkboxItem.d.mts

@@ -0,0 +1,27 @@
+import { IconProps } from "../Icon/type.mjs";
+import "../Icon/index.mjs";
+import { Key, ReactNode } from "react";
+
+//#region src/Menu/checkboxItem.d.ts
+
+/**
+ * Checkbox menu item shared by DropdownMenu / ContextMenu.
+ * This is intentionally aligned with Base UI's `Menu.CheckboxItem` API we use.
+ */
+interface MenuCheckboxItemType {
+  checked?: boolean;
+  closeOnClick?: boolean;
+  danger?: boolean;
+  defaultChecked?: boolean;
+  disabled?: boolean;
+  extra?: ReactNode;
+  icon?: IconProps['icon'];
+  key: Key;
+  label?: ReactNode;
+  onCheckedChange?: (checked: boolean) => void;
+  title?: ReactNode;
+  type: 'checkbox';
+}
+//#endregion
+export { MenuCheckboxItemType };
+//# sourceMappingURL=checkboxItem.d.mts.map

package/es/Menu/index.d.mts

@@ -1,4 +1,6 @@
+import { MenuCheckboxItemType } from "./checkboxItem.mjs";
 import { GenericItemType, ItemType, MenuDividerType, MenuInfo, MenuItemGroupType, MenuItemType, MenuProps, SubMenuType } from "./type.mjs";
+import { BaseMenuItemType } from "./baseItem.mjs";
 import { Menu } from "./Menu.mjs";
 import { mapItems } from "./utils.mjs";
-export { GenericItemType, ItemType, MenuDividerType, MenuInfo, MenuItemGroupType, MenuItemType, MenuProps, SubMenuType, Menu as default, mapItems };
+export { type BaseMenuItemType, GenericItemType, ItemType, type MenuCheckboxItemType, MenuDividerType, MenuInfo, MenuItemGroupType, MenuItemType, MenuProps, SubMenuType, Menu as default, mapItems };

package/es/Mermaid/Mermaid.d.mts

@@ -1,8 +1,8 @@
 import { MermaidProps } from "./type.mjs";
-import * as react35 from "react";
+import * as react19 from "react";
 
 //#region src/Mermaid/Mermaid.d.ts
-declare const Mermaid: react35.NamedExoticComponent<MermaidProps>;
+declare const Mermaid: react19.NamedExoticComponent<MermaidProps>;
 //#endregion
 export { Mermaid };
 //# sourceMappingURL=Mermaid.d.mts.map

package/es/Mermaid/SyntaxMermaid/index.d.mts

@@ -1,8 +1,8 @@
 import { SyntaxMermaidProps } from "../type.mjs";
-import * as react36 from "react";
+import * as react20 from "react";
 
 //#region src/Mermaid/SyntaxMermaid/index.d.ts
-declare const SyntaxMermaid: react36.NamedExoticComponent<SyntaxMermaidProps>;
+declare const SyntaxMermaid: react20.NamedExoticComponent<SyntaxMermaidProps>;
 //#endregion
 export { SyntaxMermaid };
 //# sourceMappingURL=index.d.mts.map

package/es/Modal/Modal.d.mts

@@ -1,8 +1,8 @@
 import { ModalProps } from "./type.mjs";
-import * as react38 from "react";
+import * as react21 from "react";
 
 //#region src/Modal/Modal.d.ts
-declare const Modal: react38.NamedExoticComponent<ModalProps>;
+declare const Modal: react21.NamedExoticComponent<ModalProps>;
 //#endregion
 export { Modal };
 //# sourceMappingURL=Modal.d.mts.map

package/es/Modal/ModalProvider.d.mts

@@ -1,9 +1,9 @@
 import { ModalContextValue } from "./type.mjs";
-import * as react39 from "react";
+import * as react22 from "react";
 import { ReactNode } from "react";
 
 //#region src/Modal/ModalProvider.d.ts
-declare const ModalProvider: react39.NamedExoticComponent<{
+declare const ModalProvider: react22.NamedExoticComponent<{
   children: ReactNode;
   value: ModalContextValue;
 }>;

package/es/Modal/imperative.mjs

@@ -1,9 +1,10 @@
 'use client';
 
 import { useIsClient } from "../hooks/useIsClient.mjs";
+import { registerDevSingleton } from "../utils/devSingleton.mjs";
 import { ModalStackItem } from "./ModalStackItem.mjs";
 import { RawModalStackItem } from "./RawModalStackItem.mjs";
-import { memo, useState, useSyncExternalStore } from "react";
+import { memo, useEffect, useState, useSyncExternalStore } from "react";
 import { jsx } from "react/jsx-runtime";
 import { createPortal } from "react-dom";
 
@@ -153,7 +154,12 @@ const ModalStack = memo(({ stack }) => {
 ModalStack.displayName = "ModalStack";
 const ModalHost = ({ root }) => {
 	const stack = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
-	if (!useIsClient()) return null;
+	const isClient = useIsClient();
+	useEffect(() => {
+		if (!isClient) return;
+		return registerDevSingleton("ModalHost", root ?? document.body);
+	}, [isClient, root]);
+	if (!isClient) return null;
 	if (stack.length === 0) return null;
 	return /* @__PURE__ */ jsx(ModalPortal, {
 		root,