@lobehub/ui 4.11.1 → 4.11.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (162) hide show
  1. package/es/Accordion/Accordion.d.mts +2 -2
  2. package/es/Accordion/Accordion.mjs +2 -2
  3. package/es/Accordion/Accordion.mjs.map +1 -1
  4. package/es/Accordion/AccordionItem.d.mts +2 -2
  5. package/es/Accordion/AccordionItem.mjs +2 -2
  6. package/es/Accordion/AccordionItem.mjs.map +1 -1
  7. package/es/ActionIcon/ActionIcon.d.mts +2 -2
  8. package/es/Alert/Alert.d.mts +2 -2
  9. package/es/AutoComplete/Select.d.mts +2 -2
  10. package/es/Avatar/AvatarGroup/index.d.mts +2 -2
  11. package/es/Burger/Burger.d.mts +2 -2
  12. package/es/Checkbox/Checkbox.mjs +2 -2
  13. package/es/Checkbox/Checkbox.mjs.map +1 -1
  14. package/es/Checkbox/CheckboxGroup.mjs +2 -2
  15. package/es/Checkbox/CheckboxGroup.mjs.map +1 -1
  16. package/es/CodeEditor/CodeEditor.d.mts +2 -2
  17. package/es/CodeEditor/CodeEditor.mjs +2 -2
  18. package/es/CodeEditor/CodeEditor.mjs.map +1 -1
  19. package/es/Collapse/Collapse.d.mts +2 -2
  20. package/es/ColorSwatches/ColorSwatches.mjs +2 -2
  21. package/es/ColorSwatches/ColorSwatches.mjs.map +1 -1
  22. package/es/ConfigProvider/index.d.mts +2 -2
  23. package/es/ContextMenu/ContextMenuHost.mjs +7 -12
  24. package/es/ContextMenu/ContextMenuHost.mjs.map +1 -1
  25. package/es/CopyButton/CopyButton.d.mts +2 -2
  26. package/es/DatePicker/DatePicker.d.mts +2 -2
  27. package/es/DraggablePanel/DraggablePanel.mjs +2 -2
  28. package/es/DraggablePanel/DraggablePanel.mjs.map +1 -1
  29. package/es/DraggablePanel/components/DraggablePanelBody.d.mts +2 -2
  30. package/es/DraggablePanel/components/DraggablePanelContainer.d.mts +2 -2
  31. package/es/DraggablePanel/components/DraggablePanelFooter.d.mts +2 -2
  32. package/es/DraggablePanel/components/DraggablePanelHeader.d.mts +2 -2
  33. package/es/DraggablePanel/components/DraggablePanelHeader.mjs +2 -2
  34. package/es/DraggablePanel/components/DraggablePanelHeader.mjs.map +1 -1
  35. package/es/DraggableSideNav/DraggableSideNav.d.mts +2 -2
  36. package/es/DraggableSideNav/DraggableSideNav.mjs +2 -2
  37. package/es/DraggableSideNav/DraggableSideNav.mjs.map +1 -1
  38. package/es/Drawer/Drawer.d.mts +2 -2
  39. package/es/Dropdown/Dropdown.d.mts +2 -2
  40. package/es/DropdownMenu/DropdownMenu.d.mts +2 -2
  41. package/es/DropdownMenu/DropdownMenu.mjs +3 -12
  42. package/es/DropdownMenu/DropdownMenu.mjs.map +1 -1
  43. package/es/EditableText/EditableText.d.mts +2 -2
  44. package/es/EditableText/EditableText.mjs +2 -2
  45. package/es/EditableText/EditableText.mjs.map +1 -1
  46. package/es/EmojiPicker/EmojiPicker.d.mts +2 -2
  47. package/es/EmojiPicker/EmojiPicker.mjs +3 -3
  48. package/es/EmojiPicker/EmojiPicker.mjs.map +1 -1
  49. package/es/Flex/FlexBasic.d.mts +2 -2
  50. package/es/FontLoader/index.d.mts +2 -2
  51. package/es/Footer/Footer.d.mts +2 -2
  52. package/es/Form/components/FormGroup.d.mts +2 -2
  53. package/es/Form/components/FormItem.d.mts +2 -2
  54. package/es/Form/components/FormSubmitFooter.d.mts +2 -2
  55. package/es/FormModal/FormModal.d.mts +2 -2
  56. package/es/GuideCard/GuideCard.d.mts +2 -2
  57. package/es/Header/Header.d.mts +2 -2
  58. package/es/Highlighter/Highlighter.d.mts +2 -2
  59. package/es/Highlighter/SyntaxHighlighter/index.d.mts +2 -2
  60. package/es/Hotkey/Hotkey.d.mts +2 -2
  61. package/es/HotkeyInput/HotkeyInput.d.mts +2 -2
  62. package/es/HotkeyInput/HotkeyInput.mjs +2 -2
  63. package/es/HotkeyInput/HotkeyInput.mjs.map +1 -1
  64. package/es/Icon/Icon.d.mts +2 -2
  65. package/es/Icon/components/IconProvider.d.mts +3 -3
  66. package/es/Image/PreviewGroup.d.mts +2 -2
  67. package/es/ImageSelect/ImageSelect.d.mts +2 -2
  68. package/es/ImageSelect/ImageSelect.mjs +2 -2
  69. package/es/ImageSelect/ImageSelect.mjs.map +1 -1
  70. package/es/Input/Input.d.mts +2 -2
  71. package/es/Input/InputNumber.d.mts +2 -2
  72. package/es/Input/InputOPT.d.mts +2 -2
  73. package/es/Input/InputPassword.d.mts +2 -2
  74. package/es/Input/TextArea.d.mts +2 -2
  75. package/es/Layout/components/LayoutFooter.d.mts +2 -2
  76. package/es/Layout/components/LayoutHeader.d.mts +2 -2
  77. package/es/Layout/components/LayoutMain.d.mts +2 -2
  78. package/es/Layout/components/LayoutSidebar.d.mts +2 -2
  79. package/es/Layout/components/LayoutSidebarInner.d.mts +2 -2
  80. package/es/Layout/components/LayoutToc.d.mts +2 -2
  81. package/es/List/ListItem/index.d.mts +2 -2
  82. package/es/Markdown/Markdown.d.mts +2 -2
  83. package/es/Markdown/Typography.d.mts +2 -2
  84. package/es/MaskShadow/MaskShadow.d.mts +2 -2
  85. package/es/Menu/Menu.d.mts +2 -2
  86. package/es/Mermaid/Mermaid.d.mts +2 -2
  87. package/es/Mermaid/SyntaxMermaid/StreamMermaid.mjs +2 -10
  88. package/es/Mermaid/SyntaxMermaid/StreamMermaid.mjs.map +1 -1
  89. package/es/Mermaid/SyntaxMermaid/index.d.mts +2 -2
  90. package/es/Modal/Modal.d.mts +2 -2
  91. package/es/Modal/ModalProvider.d.mts +2 -2
  92. package/es/Popover/PopoverStandalone.mjs +1 -1
  93. package/es/Popover/context.d.mts +2 -2
  94. package/es/SearchBar/SearchBar.d.mts +2 -2
  95. package/es/SearchBar/SearchBar.mjs +2 -2
  96. package/es/SearchBar/SearchBar.mjs.map +1 -1
  97. package/es/Segmented/Segmented.d.mts +2 -2
  98. package/es/Select/Select.d.mts +2 -2
  99. package/es/SideNav/SideNav.d.mts +2 -2
  100. package/es/SliderWithInput/SliderWithInput.d.mts +2 -2
  101. package/es/ThemeProvider/ThemeProvider.d.mts +2 -2
  102. package/es/Toc/Toc.d.mts +2 -2
  103. package/es/Toc/TocMobile.mjs +2 -2
  104. package/es/Toc/TocMobile.mjs.map +1 -1
  105. package/es/Tooltip/TooltipPortal.mjs +1 -1
  106. package/es/Tooltip/TooltipPortal.mjs.map +1 -1
  107. package/es/awesome/AuroraBackground/AuroraBackground.d.mts +2 -2
  108. package/es/awesome/BottomGradientButton/BottomGradientButton.d.mts +2 -2
  109. package/es/awesome/Features/Features.d.mts +2 -2
  110. package/es/awesome/Giscus/Giscus.d.mts +2 -2
  111. package/es/awesome/GradientButton/GradientButton.d.mts +2 -2
  112. package/es/awesome/GridBackground/GridBackground.d.mts +2 -2
  113. package/es/awesome/GridBackground/GridShowcase.d.mts +2 -2
  114. package/es/awesome/Hero/Hero.d.mts +2 -2
  115. package/es/awesome/Spline/Spine.d.mts +2 -2
  116. package/es/awesome/Spotlight/Spotlight.d.mts +2 -2
  117. package/es/awesome/SpotlightCard/SpotlightCard.d.mts +2 -2
  118. package/es/awesome/TypewriterEffect/TypewriterEffect.d.mts +2 -2
  119. package/es/brand/LobeChat/index.d.mts +2 -2
  120. package/es/brand/LobeHub/index.d.mts +2 -2
  121. package/es/brand/LogoThree/LogoSpline.d.mts +2 -2
  122. package/es/brand/LogoThree/index.d.mts +2 -2
  123. package/es/chat/BackBottom/BackBottom.d.mts +2 -2
  124. package/es/chat/ChatInputArea/components/ChatInputAreaInner.d.mts +2 -2
  125. package/es/chat/ChatItem/ChatItem.d.mts +2 -2
  126. package/es/chat/ChatList/ChatList.d.mts +2 -2
  127. package/es/chat/EditableMessage/EditableMessage.d.mts +2 -2
  128. package/es/chat/EditableMessage/EditableMessage.mjs +3 -3
  129. package/es/chat/EditableMessage/EditableMessage.mjs.map +1 -1
  130. package/es/chat/EditableMessageList/EditableMessageList.d.mts +2 -2
  131. package/es/chat/MessageInput/MessageInput.d.mts +2 -2
  132. package/es/chat/MessageModal/MessageModal.d.mts +2 -2
  133. package/es/chat/MessageModal/MessageModal.mjs +3 -3
  134. package/es/chat/MessageModal/MessageModal.mjs.map +1 -1
  135. package/es/color/ColorScales/index.d.mts +2 -2
  136. package/es/color/CssVar/index.d.mts +2 -2
  137. package/es/hooks/usePortalContainer.mjs +24 -0
  138. package/es/hooks/usePortalContainer.mjs.map +1 -0
  139. package/es/i18n/context.d.mts +2 -2
  140. package/es/icons/lucideExtra/BotPromptIcon.d.mts +3 -3
  141. package/es/icons/lucideExtra/CreateBotIcon.d.mts +3 -3
  142. package/es/icons/lucideExtra/DiscordIcon.d.mts +3 -3
  143. package/es/icons/lucideExtra/GlobeOffIcon.d.mts +3 -3
  144. package/es/icons/lucideExtra/GroupBotIcon.d.mts +3 -3
  145. package/es/icons/lucideExtra/GroupBotSquareIcon.d.mts +3 -3
  146. package/es/icons/lucideExtra/LeftClickIcon.d.mts +3 -3
  147. package/es/icons/lucideExtra/LeftDoubleClickIcon.d.mts +3 -3
  148. package/es/icons/lucideExtra/McpIcon.d.mts +3 -3
  149. package/es/icons/lucideExtra/ProviderIcon.d.mts +3 -3
  150. package/es/icons/lucideExtra/RightClickIcon.d.mts +2 -2
  151. package/es/icons/lucideExtra/RightDoubleClickIcon.d.mts +3 -3
  152. package/es/icons/lucideExtra/ShapesUploadIcon.d.mts +3 -3
  153. package/es/icons/lucideExtra/TreeDownRightIcon.d.mts +3 -3
  154. package/es/icons/lucideExtra/TreeUpDownRightIcon.d.mts +2 -2
  155. package/es/mdx/Mdx/index.d.mts +2 -2
  156. package/es/mobile/ChatHeader/ChatHeaderTitle.d.mts +2 -2
  157. package/es/mobile/ChatInputArea/components/ChatSendButton.d.mts +2 -2
  158. package/es/mobile/TabBar/TabBar.d.mts +2 -2
  159. package/es/mobile/TabBar/TabBar.mjs +2 -2
  160. package/es/mobile/TabBar/TabBar.mjs.map +1 -1
  161. package/es/storybook/StoryBook/index.d.mts +2 -2
  162. package/package.json +1 -1
@@ -1,8 +1,8 @@
1
1
  import { FlexBasicProps } from "./type.mjs";
2
- import * as react53 from "react";
2
+ import * as react30 from "react";
3
3
 
4
4
  //#region src/Flex/FlexBasic.d.ts
5
- declare const _default: react53.NamedExoticComponent<FlexBasicProps>;
5
+ declare const _default: react30.NamedExoticComponent<FlexBasicProps>;
6
6
  //#endregion
7
7
  export { _default };
8
8
  //# sourceMappingURL=FlexBasic.d.mts.map
@@ -1,10 +1,10 @@
1
- import * as react72 from "react";
1
+ import * as react69 from "react";
2
2
 
3
3
  //#region src/FontLoader/index.d.ts
4
4
  interface FontLoaderProps {
5
5
  url: string;
6
6
  }
7
- declare const FontLoader: react72.NamedExoticComponent<FontLoaderProps>;
7
+ declare const FontLoader: react69.NamedExoticComponent<FontLoaderProps>;
8
8
  //#endregion
9
9
  export { FontLoader, FontLoaderProps };
10
10
  //# sourceMappingURL=index.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { FooterProps } from "./type.mjs";
2
- import * as react66 from "react";
2
+ import * as react11 from "react";
3
3
 
4
4
  //#region src/Footer/Footer.d.ts
5
- declare const Footer: react66.NamedExoticComponent<FooterProps>;
5
+ declare const Footer: react11.NamedExoticComponent<FooterProps>;
6
6
  //#endregion
7
7
  export { Footer };
8
8
  //# sourceMappingURL=Footer.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { FormGroupProps } from "../type.mjs";
2
- import * as react37 from "react";
2
+ import * as react3 from "react";
3
3
 
4
4
  //#region src/Form/components/FormGroup.d.ts
5
- declare const FormGroup: react37.NamedExoticComponent<FormGroupProps>;
5
+ declare const FormGroup: react3.NamedExoticComponent<FormGroupProps>;
6
6
  //#endregion
7
7
  export { FormGroup };
8
8
  //# sourceMappingURL=FormGroup.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { FormItemProps } from "../type.mjs";
2
- import * as react38 from "react";
2
+ import * as react4 from "react";
3
3
 
4
4
  //#region src/Form/components/FormItem.d.ts
5
- declare const FormItem: react38.NamedExoticComponent<FormItemProps>;
5
+ declare const FormItem: react4.NamedExoticComponent<FormItemProps>;
6
6
  //#endregion
7
7
  export { FormItem };
8
8
  //# sourceMappingURL=FormItem.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { FormSubmitFooterProps } from "../type.mjs";
2
- import * as react39 from "react";
2
+ import * as react5 from "react";
3
3
 
4
4
  //#region src/Form/components/FormSubmitFooter.d.ts
5
- declare const FormSubmitFooter: react39.NamedExoticComponent<FormSubmitFooterProps>;
5
+ declare const FormSubmitFooter: react5.NamedExoticComponent<FormSubmitFooterProps>;
6
6
  //#endregion
7
7
  export { FormSubmitFooter };
8
8
  //# sourceMappingURL=FormSubmitFooter.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { FormModalProps } from "./type.mjs";
2
- import * as react36 from "react";
2
+ import * as react26 from "react";
3
3
 
4
4
  //#region src/FormModal/FormModal.d.ts
5
- declare const FormModal: react36.NamedExoticComponent<FormModalProps>;
5
+ declare const FormModal: react26.NamedExoticComponent<FormModalProps>;
6
6
  //#endregion
7
7
  export { FormModal };
8
8
  //# sourceMappingURL=FormModal.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { GuideCardProps } from "./type.mjs";
2
- import * as react137 from "react";
2
+ import * as react125 from "react";
3
3
 
4
4
  //#region src/GuideCard/GuideCard.d.ts
5
- declare const GuideCard: react137.NamedExoticComponent<GuideCardProps>;
5
+ declare const GuideCard: react125.NamedExoticComponent<GuideCardProps>;
6
6
  //#endregion
7
7
  export { GuideCard };
8
8
  //# sourceMappingURL=GuideCard.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { HeaderProps } from "./type.mjs";
2
- import * as react33 from "react";
2
+ import * as react60 from "react";
3
3
 
4
4
  //#region src/Header/Header.d.ts
5
- declare const Header: react33.NamedExoticComponent<HeaderProps>;
5
+ declare const Header: react60.NamedExoticComponent<HeaderProps>;
6
6
  //#endregion
7
7
  export { Header };
8
8
  //# sourceMappingURL=Header.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { HighlighterProps } from "./type.mjs";
2
- import * as react35 from "react";
2
+ import * as react58 from "react";
3
3
 
4
4
  //#region src/Highlighter/Highlighter.d.ts
5
- declare const Highlighter: react35.NamedExoticComponent<HighlighterProps>;
5
+ declare const Highlighter: react58.NamedExoticComponent<HighlighterProps>;
6
6
  //#endregion
7
7
  export { Highlighter };
8
8
  //# sourceMappingURL=Highlighter.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { SyntaxHighlighterProps } from "../type.mjs";
2
- import * as react34 from "react";
2
+ import * as react59 from "react";
3
3
 
4
4
  //#region src/Highlighter/SyntaxHighlighter/index.d.ts
5
- declare const SyntaxHighlighter: react34.NamedExoticComponent<SyntaxHighlighterProps>;
5
+ declare const SyntaxHighlighter: react59.NamedExoticComponent<SyntaxHighlighterProps>;
6
6
  //#endregion
7
7
  export { SyntaxHighlighter };
8
8
  //# sourceMappingURL=index.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { HotkeyProps } from "./type.mjs";
2
- import * as react32 from "react";
2
+ import * as react56 from "react";
3
3
 
4
4
  //#region src/Hotkey/Hotkey.d.ts
5
- declare const Hotkey: react32.NamedExoticComponent<HotkeyProps>;
5
+ declare const Hotkey: react56.NamedExoticComponent<HotkeyProps>;
6
6
  //#endregion
7
7
  export { Hotkey };
8
8
  //# sourceMappingURL=Hotkey.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { HotkeyInputProps } from "./type.mjs";
2
- import * as react31 from "react";
2
+ import * as react57 from "react";
3
3
 
4
4
  //#region src/HotkeyInput/HotkeyInput.d.ts
5
- declare const HotkeyInput: react31.NamedExoticComponent<HotkeyInputProps>;
5
+ declare const HotkeyInput: react57.NamedExoticComponent<HotkeyInputProps>;
6
6
  //#endregion
7
7
  export { HotkeyInput };
8
8
  //# sourceMappingURL=HotkeyInput.d.mts.map
@@ -10,7 +10,7 @@ import { styles, variants } from "./style.mjs";
10
10
  import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
11
11
  import { jsx, jsxs } from "react/jsx-runtime";
12
12
  import { cx, useThemeMode } from "antd-style";
13
- import useMergeState from "use-merge-value";
13
+ import useControlledState from "use-merge-value";
14
14
  import { isEqual } from "es-toolkit/compat";
15
15
  import { Undo2Icon } from "lucide-react";
16
16
  import { useHotkeys, useRecordHotkeys } from "react-hotkeys-hook";
@@ -24,7 +24,7 @@ const HotkeyInput = memo(({ value = "", defaultValue = "", resetValue = "", onCh
24
24
  const { isDarkMode } = useThemeMode();
25
25
  const { t } = useTranslation(hotkey_default);
26
26
  const isAppleDevice = useMemo(() => checkIsAppleDevice(isApple), [isApple]);
27
- const [hotkeyValue, setHotkeyValue] = useMergeState(defaultValue, {
27
+ const [hotkeyValue, setHotkeyValue] = useControlledState(defaultValue, {
28
28
  defaultValue,
29
29
  onChange,
30
30
  value
@@ -1 +1 @@
1
- {"version":3,"file":"HotkeyInput.mjs","names":["hotkeyMessages","useControlledState","modifiers: string[]","normalKeys: string[]","normalizedKey: any","Flexbox","Hotkey","ActionIcon"],"sources":["../../src/HotkeyInput/HotkeyInput.tsx"],"sourcesContent":["'use client';\n\nimport type { InputRef } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { isEqual } from 'es-toolkit/compat';\nimport { Undo2Icon } from 'lucide-react';\nimport {\n type FocusEvent,\n type MouseEvent,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useHotkeys, useRecordHotkeys } from 'react-hotkeys-hook';\nimport useControlledState from 'use-merge-value';\n\nimport ActionIcon from '@/ActionIcon';\nimport { Flexbox } from '@/Flex';\nimport Hotkey from '@/Hotkey';\nimport { NORMATIVE_MODIFIER, checkIsAppleDevice, splitKeysByPlus } from '@/Hotkey/utils';\nimport hotkeyMessages from '@/i18n/resources/en/hotkey';\nimport { useTranslation } from '@/i18n/useTranslation';\n\nimport { styles, variants } from './style';\nimport type { HotkeyInputProps } from './type';\n\nconst HotkeyInput = memo<HotkeyInputProps>(\n ({\n value = '',\n defaultValue = '',\n resetValue = '',\n onChange,\n onConflict,\n placeholder,\n disabled,\n shadow,\n allowReset = true,\n style,\n className,\n hotkeyConflicts = [],\n variant,\n texts,\n isApple,\n onBlur,\n onReset,\n onFocus,\n }) => {\n const [isFocused, setIsFocused] = useState(false);\n const [hasConflict, setHasConflict] = useState(false);\n const [hasInvalidCombination, setHasInvalidCombination] = useState(false);\n const inputRef = useRef<InputRef>(null);\n const { isDarkMode } = useThemeMode();\n const { t } = useTranslation(hotkeyMessages);\n const isAppleDevice = useMemo(() => checkIsAppleDevice(isApple), [isApple]);\n const [hotkeyValue, setHotkeyValue] = useControlledState(defaultValue, {\n defaultValue,\n onChange,\n value,\n });\n\n // 使用 useRecordHotkeys 处理快捷键录入\n const [recordedKeys, { start, stop, isRecording, resetKeys }] = useRecordHotkeys();\n\n useHotkeys(\n '*',\n () => {\n inputRef.current?.blur();\n },\n {\n enableOnContentEditable: true,\n enableOnFormTags: true,\n enabled: isRecording && !disabled,\n keydown: false,\n keyup: true,\n preventDefault: true,\n },\n );\n\n // 处理按键,保证格式正确:修饰键在前,最多一个非修饰键在后\n const formatKeys = useCallback((keysSet: Set<string>) => {\n const modifiers: string[] = [];\n const normalKeys: string[] = [];\n\n for (const key of keysSet) {\n // 处理不同表示的修饰键\n const normalizedKey: any = key.toLowerCase();\n if (NORMATIVE_MODIFIER.includes(normalizedKey)) {\n // 统一修饰键表示\n if (\n (!isAppleDevice && normalizedKey === 'ctrl') ||\n (isAppleDevice && normalizedKey === 'meta')\n ) {\n if (!modifiers.includes('mod')) modifiers.push('mod');\n } else if (!modifiers.includes(normalizedKey)) {\n modifiers.push(normalizedKey);\n }\n } else {\n normalKeys.push(key);\n }\n }\n\n // 至少需要一个修饰键\n if (modifiers.length === 0 && normalKeys.length > 0) {\n return { isValid: false, keys: [] };\n }\n\n // 只允许一个非修饰键,如果有多个,只保留最后一个\n const finalKey = normalKeys.length > 0 ? [normalKeys.at(-1)] : [];\n const shortcuts = [modifiers, finalKey];\n\n return {\n // 组合必须包含至少一个按键\n isValid: shortcuts.every((k) => k.length > 0),\n keys: shortcuts.flat(),\n };\n }, []);\n\n // 获取格式化后的按键字符串\n const { isValid, keys } = formatKeys(recordedKeys);\n const keysString = keys.join('+');\n\n // 检查快捷键冲突\n const checkHotkeyConflict = useCallback(\n (newHotkey: string): boolean => {\n return hotkeyConflicts\n .filter((conflictKey) => conflictKey !== resetValue)\n .some((conflictKey) => {\n const newKeys = splitKeysByPlus(newHotkey);\n const conflictKeys = splitKeysByPlus(conflictKey);\n return isEqual(newKeys, conflictKeys);\n });\n },\n [hotkeyConflicts],\n );\n\n // 当按键组合完成时处理结果\n useEffect(() => {\n if (recordedKeys.size > 0 && !isRecording) {\n if (!isValid) {\n setHasInvalidCombination(true);\n setHasConflict(false);\n return;\n }\n\n setHasInvalidCombination(false);\n const newKeysString = keysString;\n\n // 检查冲突\n const conflict = checkHotkeyConflict(newKeysString);\n if (conflict) {\n setHasConflict(true);\n onConflict?.(newKeysString);\n } else {\n setHasConflict(false);\n setHotkeyValue?.(newKeysString);\n }\n }\n }, [\n recordedKeys,\n isRecording,\n isValid,\n keysString,\n checkHotkeyConflict,\n setHotkeyValue,\n onConflict,\n ]);\n\n // 处理输入框焦点\n const handleFocus = (e: FocusEvent<HTMLInputElement>) => {\n if (disabled) return;\n setIsFocused(true);\n setHasConflict(false);\n setHasInvalidCombination(false);\n start(); // 开始记录\n onFocus?.(e);\n };\n\n const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n setIsFocused(false);\n stop(); // 停止记录\n onBlur?.(e);\n };\n\n // 重置功能\n const handleReset = (e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setHotkeyValue?.(resetValue);\n resetKeys();\n setHasConflict(false);\n setHasInvalidCombination(false);\n setIsFocused(false);\n stop(); // 停止记录\n onReset?.(hotkeyValue, resetValue);\n };\n\n const handleClick = (e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n if (disabled || isFocused) return;\n inputRef.current?.focus();\n };\n\n const placeholderText = placeholder ?? t('hotkey.placeholder');\n const resetTitle = texts?.reset ?? t('hotkey.reset');\n const conflictText = texts?.conflicts ?? t('hotkey.conflict');\n const invalidText = texts?.invalidCombination ?? t('hotkey.invalidCombination');\n\n return (\n <Flexbox\n className={className}\n gap={8}\n style={{\n position: 'relative',\n ...style,\n }}\n >\n <Flexbox\n align={'center'}\n className={cx(\n variants({\n disabled,\n error: hasConflict || hasInvalidCombination,\n focused: isFocused,\n shadow,\n variant: variant || (isDarkMode ? 'filled' : 'outlined'),\n }),\n )}\n horizontal\n justify={'space-between'}\n onClick={handleClick}\n >\n <div style={{ pointerEvents: 'none' }}>\n {isRecording ? (\n <span className={styles.placeholder}>\n {keys.length > 0 ? <Hotkey keys={keysString} /> : placeholderText}\n </span>\n ) : hotkeyValue ? (\n <Hotkey keys={hotkeyValue} />\n ) : (\n <span className={styles.placeholder}>{placeholderText}</span>\n )}\n </div>\n\n {/* 隐藏的输入框,用于接收焦点 */}\n <input\n className={styles.hiddenInput}\n disabled={disabled}\n onBlur={handleBlur}\n onFocus={handleFocus}\n readOnly\n ref={inputRef as any}\n style={{ pointerEvents: 'none' }}\n />\n\n {!isFocused && allowReset && hotkeyValue && hotkeyValue !== resetValue && !disabled && (\n <ActionIcon\n icon={Undo2Icon}\n onClick={handleReset}\n size={'small'}\n title={resetTitle}\n variant={'filled'}\n />\n )}\n </Flexbox>\n {hasConflict && <div className={styles.errorText}>{conflictText}</div>}\n {hasInvalidCombination && <div className={styles.errorText}>{invalidText}</div>}\n </Flexbox>\n );\n },\n);\n\nHotkeyInput.displayName = 'HotkeyInput';\n\nexport default HotkeyInput;\n"],"mappings":"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"}
1
+ {"version":3,"file":"HotkeyInput.mjs","names":["hotkeyMessages","modifiers: string[]","normalKeys: string[]","normalizedKey: any","Flexbox","Hotkey","ActionIcon"],"sources":["../../src/HotkeyInput/HotkeyInput.tsx"],"sourcesContent":["'use client';\n\nimport type { InputRef } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { isEqual } from 'es-toolkit/compat';\nimport { Undo2Icon } from 'lucide-react';\nimport {\n type FocusEvent,\n type MouseEvent,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useHotkeys, useRecordHotkeys } from 'react-hotkeys-hook';\nimport useControlledState from 'use-merge-value';\n\nimport ActionIcon from '@/ActionIcon';\nimport { Flexbox } from '@/Flex';\nimport Hotkey from '@/Hotkey';\nimport { NORMATIVE_MODIFIER, checkIsAppleDevice, splitKeysByPlus } from '@/Hotkey/utils';\nimport hotkeyMessages from '@/i18n/resources/en/hotkey';\nimport { useTranslation } from '@/i18n/useTranslation';\n\nimport { styles, variants } from './style';\nimport type { HotkeyInputProps } from './type';\n\nconst HotkeyInput = memo<HotkeyInputProps>(\n ({\n value = '',\n defaultValue = '',\n resetValue = '',\n onChange,\n onConflict,\n placeholder,\n disabled,\n shadow,\n allowReset = true,\n style,\n className,\n hotkeyConflicts = [],\n variant,\n texts,\n isApple,\n onBlur,\n onReset,\n onFocus,\n }) => {\n const [isFocused, setIsFocused] = useState(false);\n const [hasConflict, setHasConflict] = useState(false);\n const [hasInvalidCombination, setHasInvalidCombination] = useState(false);\n const inputRef = useRef<InputRef>(null);\n const { isDarkMode } = useThemeMode();\n const { t } = useTranslation(hotkeyMessages);\n const isAppleDevice = useMemo(() => checkIsAppleDevice(isApple), [isApple]);\n const [hotkeyValue, setHotkeyValue] = useControlledState(defaultValue, {\n defaultValue,\n onChange,\n value,\n });\n\n // 使用 useRecordHotkeys 处理快捷键录入\n const [recordedKeys, { start, stop, isRecording, resetKeys }] = useRecordHotkeys();\n\n useHotkeys(\n '*',\n () => {\n inputRef.current?.blur();\n },\n {\n enableOnContentEditable: true,\n enableOnFormTags: true,\n enabled: isRecording && !disabled,\n keydown: false,\n keyup: true,\n preventDefault: true,\n },\n );\n\n // 处理按键,保证格式正确:修饰键在前,最多一个非修饰键在后\n const formatKeys = useCallback((keysSet: Set<string>) => {\n const modifiers: string[] = [];\n const normalKeys: string[] = [];\n\n for (const key of keysSet) {\n // 处理不同表示的修饰键\n const normalizedKey: any = key.toLowerCase();\n if (NORMATIVE_MODIFIER.includes(normalizedKey)) {\n // 统一修饰键表示\n if (\n (!isAppleDevice && normalizedKey === 'ctrl') ||\n (isAppleDevice && normalizedKey === 'meta')\n ) {\n if (!modifiers.includes('mod')) modifiers.push('mod');\n } else if (!modifiers.includes(normalizedKey)) {\n modifiers.push(normalizedKey);\n }\n } else {\n normalKeys.push(key);\n }\n }\n\n // 至少需要一个修饰键\n if (modifiers.length === 0 && normalKeys.length > 0) {\n return { isValid: false, keys: [] };\n }\n\n // 只允许一个非修饰键,如果有多个,只保留最后一个\n const finalKey = normalKeys.length > 0 ? [normalKeys.at(-1)] : [];\n const shortcuts = [modifiers, finalKey];\n\n return {\n // 组合必须包含至少一个按键\n isValid: shortcuts.every((k) => k.length > 0),\n keys: shortcuts.flat(),\n };\n }, []);\n\n // 获取格式化后的按键字符串\n const { isValid, keys } = formatKeys(recordedKeys);\n const keysString = keys.join('+');\n\n // 检查快捷键冲突\n const checkHotkeyConflict = useCallback(\n (newHotkey: string): boolean => {\n return hotkeyConflicts\n .filter((conflictKey) => conflictKey !== resetValue)\n .some((conflictKey) => {\n const newKeys = splitKeysByPlus(newHotkey);\n const conflictKeys = splitKeysByPlus(conflictKey);\n return isEqual(newKeys, conflictKeys);\n });\n },\n [hotkeyConflicts],\n );\n\n // 当按键组合完成时处理结果\n useEffect(() => {\n if (recordedKeys.size > 0 && !isRecording) {\n if (!isValid) {\n setHasInvalidCombination(true);\n setHasConflict(false);\n return;\n }\n\n setHasInvalidCombination(false);\n const newKeysString = keysString;\n\n // 检查冲突\n const conflict = checkHotkeyConflict(newKeysString);\n if (conflict) {\n setHasConflict(true);\n onConflict?.(newKeysString);\n } else {\n setHasConflict(false);\n setHotkeyValue?.(newKeysString);\n }\n }\n }, [\n recordedKeys,\n isRecording,\n isValid,\n keysString,\n checkHotkeyConflict,\n setHotkeyValue,\n onConflict,\n ]);\n\n // 处理输入框焦点\n const handleFocus = (e: FocusEvent<HTMLInputElement>) => {\n if (disabled) return;\n setIsFocused(true);\n setHasConflict(false);\n setHasInvalidCombination(false);\n start(); // 开始记录\n onFocus?.(e);\n };\n\n const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n setIsFocused(false);\n stop(); // 停止记录\n onBlur?.(e);\n };\n\n // 重置功能\n const handleReset = (e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setHotkeyValue?.(resetValue);\n resetKeys();\n setHasConflict(false);\n setHasInvalidCombination(false);\n setIsFocused(false);\n stop(); // 停止记录\n onReset?.(hotkeyValue, resetValue);\n };\n\n const handleClick = (e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n if (disabled || isFocused) return;\n inputRef.current?.focus();\n };\n\n const placeholderText = placeholder ?? t('hotkey.placeholder');\n const resetTitle = texts?.reset ?? t('hotkey.reset');\n const conflictText = texts?.conflicts ?? t('hotkey.conflict');\n const invalidText = texts?.invalidCombination ?? t('hotkey.invalidCombination');\n\n return (\n <Flexbox\n className={className}\n gap={8}\n style={{\n position: 'relative',\n ...style,\n }}\n >\n <Flexbox\n align={'center'}\n className={cx(\n variants({\n disabled,\n error: hasConflict || hasInvalidCombination,\n focused: isFocused,\n shadow,\n variant: variant || (isDarkMode ? 'filled' : 'outlined'),\n }),\n )}\n horizontal\n justify={'space-between'}\n onClick={handleClick}\n >\n <div style={{ pointerEvents: 'none' }}>\n {isRecording ? (\n <span className={styles.placeholder}>\n {keys.length > 0 ? <Hotkey keys={keysString} /> : placeholderText}\n </span>\n ) : hotkeyValue ? (\n <Hotkey keys={hotkeyValue} />\n ) : (\n <span className={styles.placeholder}>{placeholderText}</span>\n )}\n </div>\n\n {/* 隐藏的输入框,用于接收焦点 */}\n <input\n className={styles.hiddenInput}\n disabled={disabled}\n onBlur={handleBlur}\n onFocus={handleFocus}\n readOnly\n ref={inputRef as any}\n style={{ pointerEvents: 'none' }}\n />\n\n {!isFocused && allowReset && hotkeyValue && hotkeyValue !== resetValue && !disabled && (\n <ActionIcon\n icon={Undo2Icon}\n onClick={handleReset}\n size={'small'}\n title={resetTitle}\n variant={'filled'}\n />\n )}\n </Flexbox>\n {hasConflict && <div className={styles.errorText}>{conflictText}</div>}\n {hasInvalidCombination && <div className={styles.errorText}>{invalidText}</div>}\n </Flexbox>\n );\n },\n);\n\nHotkeyInput.displayName = 'HotkeyInput';\n\nexport default HotkeyInput;\n"],"mappings":"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"}
@@ -1,8 +1,8 @@
1
1
  import { IconProps } from "./type.mjs";
2
- import * as react29 from "react";
2
+ import * as react55 from "react";
3
3
 
4
4
  //#region src/Icon/Icon.d.ts
5
- declare const Icon: react29.NamedExoticComponent<IconProps>;
5
+ declare const Icon: react55.NamedExoticComponent<IconProps>;
6
6
  //#endregion
7
7
  export { Icon };
8
8
  //# sourceMappingURL=Icon.d.mts.map
@@ -1,11 +1,11 @@
1
1
  import { IconProps } from "../type.mjs";
2
- import * as react27 from "react";
2
+ import * as react53 from "react";
3
3
  import { ReactNode } from "react";
4
4
 
5
5
  //#region src/Icon/components/IconProvider.d.ts
6
6
  type IconContentConfig = Omit<IconProps, 'icon' | 'ref'>;
7
- declare const IconContext: react27.Context<IconContentConfig>;
8
- declare const IconProvider: react27.NamedExoticComponent<{
7
+ declare const IconContext: react53.Context<IconContentConfig>;
8
+ declare const IconProvider: react53.NamedExoticComponent<{
9
9
  children: ReactNode;
10
10
  config?: IconContentConfig;
11
11
  }>;
@@ -1,8 +1,8 @@
1
1
  import { PreviewGroupProps } from "./type.mjs";
2
- import * as react30 from "react";
2
+ import * as react52 from "react";
3
3
 
4
4
  //#region src/Image/PreviewGroup.d.ts
5
- declare const PreviewGroup: react30.NamedExoticComponent<PreviewGroupProps>;
5
+ declare const PreviewGroup: react52.NamedExoticComponent<PreviewGroupProps>;
6
6
  //#endregion
7
7
  export { PreviewGroup };
8
8
  //# sourceMappingURL=PreviewGroup.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { ImageSelectProps } from "./type.mjs";
2
- import * as react113 from "react";
2
+ import * as react83 from "react";
3
3
 
4
4
  //#region src/ImageSelect/ImageSelect.d.ts
5
- declare const ImageSelect: react113.NamedExoticComponent<ImageSelectProps>;
5
+ declare const ImageSelect: react83.NamedExoticComponent<ImageSelectProps>;
6
6
  //#endregion
7
7
  export { ImageSelect };
8
8
  //# sourceMappingURL=ImageSelect.d.mts.map
@@ -7,11 +7,11 @@ import { styles } from "./styles.mjs";
7
7
  import { memo } from "react";
8
8
  import { jsx, jsxs } from "react/jsx-runtime";
9
9
  import { cx } from "antd-style";
10
- import useMergeState from "use-merge-value";
10
+ import useControlledState from "use-merge-value";
11
11
 
12
12
  //#region src/ImageSelect/ImageSelect.tsx
13
13
  const ImageSelect = memo(({ ref, className, style, value, defaultValue, onChange, options, width = 144, height = 86, styles: customStyles, classNames, unoptimized, ...rest }) => {
14
- const [currentValue, setCurrentValue] = useMergeState(defaultValue, {
14
+ const [currentValue, setCurrentValue] = useControlledState(defaultValue, {
15
15
  defaultValue,
16
16
  onChange,
17
17
  value
@@ -1 +1 @@
1
- {"version":3,"file":"ImageSelect.mjs","names":["useControlledState","Flexbox","Img","Icon"],"sources":["../../src/ImageSelect/ImageSelect.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport Img from '@/Img';\n\nimport { styles } from './styles';\nimport type { ImageSelectProps } from './type';\n\nconst ImageSelect = memo<ImageSelectProps>(\n ({\n ref,\n className,\n style,\n value,\n defaultValue,\n onChange,\n options,\n width = 144,\n height = 86,\n styles: customStyles,\n classNames,\n unoptimized,\n ...rest\n }) => {\n const [currentValue, setCurrentValue] = useControlledState<string>(defaultValue, {\n defaultValue,\n onChange,\n value,\n });\n\n return (\n <Flexbox className={className} gap={16} horizontal ref={ref} style={style} {...rest}>\n {options?.map((item) => {\n const isActive = item.value === currentValue;\n return (\n <Flexbox\n align={'center'}\n className={cx(styles.container, isActive && styles.active)}\n gap={4}\n key={item.value}\n onClick={() => setCurrentValue(item.value)}\n >\n <Img\n alt={item.alt || item.value}\n className={cx(styles.img, isActive && styles.imgActive, classNames?.img)}\n height={height}\n src={item.img}\n style={{\n ...customStyles?.img,\n height,\n width,\n }}\n unoptimized={unoptimized}\n width={width}\n />\n\n <Flexbox align={'center'} gap={4} horizontal>\n {item.icon && <Icon icon={item.icon} />}\n {item.label}\n </Flexbox>\n </Flexbox>\n );\n })}\n </Flexbox>\n );\n },\n);\n\nImageSelect.displayName = 'ImageSelect';\n\nexport default ImageSelect;\n"],"mappings":";;;;;;;;;;;;AAaA,MAAM,cAAc,MACjB,EACC,KACA,WACA,OACA,OACA,cACA,UACA,SACA,QAAQ,KACR,SAAS,IACT,QAAQ,cACR,YACA,aACA,GAAG,WACC;CACJ,MAAM,CAAC,cAAc,mBAAmBA,cAA2B,cAAc;EAC/E;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAACC;EAAmB;EAAW,KAAK;EAAI;EAAgB;EAAY;EAAO,GAAI;YAC5E,SAAS,KAAK,SAAS;GACtB,MAAM,WAAW,KAAK,UAAU;AAChC,UACE,qBAACA;IACC,OAAO;IACP,WAAW,GAAG,OAAO,WAAW,YAAY,OAAO,OAAO;IAC1D,KAAK;IAEL,eAAe,gBAAgB,KAAK,MAAM;eAE1C,oBAACC;KACC,KAAK,KAAK,OAAO,KAAK;KACtB,WAAW,GAAG,OAAO,KAAK,YAAY,OAAO,WAAW,YAAY,IAAI;KAChE;KACR,KAAK,KAAK;KACV,OAAO;MACL,GAAG,cAAc;MACjB;MACA;MACD;KACY;KACN;MACP,EAEF,qBAACD;KAAQ,OAAO;KAAU,KAAK;KAAG;gBAC/B,KAAK,QAAQ,oBAACE,gBAAK,MAAM,KAAK,OAAQ,EACtC,KAAK;MACE;MApBL,KAAK,MAqBF;IAEZ;GACM;EAGf;AAED,YAAY,cAAc;AAE1B,0BAAe"}
1
+ {"version":3,"file":"ImageSelect.mjs","names":["Flexbox","Img","Icon"],"sources":["../../src/ImageSelect/ImageSelect.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport Img from '@/Img';\n\nimport { styles } from './styles';\nimport type { ImageSelectProps } from './type';\n\nconst ImageSelect = memo<ImageSelectProps>(\n ({\n ref,\n className,\n style,\n value,\n defaultValue,\n onChange,\n options,\n width = 144,\n height = 86,\n styles: customStyles,\n classNames,\n unoptimized,\n ...rest\n }) => {\n const [currentValue, setCurrentValue] = useControlledState<string>(defaultValue, {\n defaultValue,\n onChange,\n value,\n });\n\n return (\n <Flexbox className={className} gap={16} horizontal ref={ref} style={style} {...rest}>\n {options?.map((item) => {\n const isActive = item.value === currentValue;\n return (\n <Flexbox\n align={'center'}\n className={cx(styles.container, isActive && styles.active)}\n gap={4}\n key={item.value}\n onClick={() => setCurrentValue(item.value)}\n >\n <Img\n alt={item.alt || item.value}\n className={cx(styles.img, isActive && styles.imgActive, classNames?.img)}\n height={height}\n src={item.img}\n style={{\n ...customStyles?.img,\n height,\n width,\n }}\n unoptimized={unoptimized}\n width={width}\n />\n\n <Flexbox align={'center'} gap={4} horizontal>\n {item.icon && <Icon icon={item.icon} />}\n {item.label}\n </Flexbox>\n </Flexbox>\n );\n })}\n </Flexbox>\n );\n },\n);\n\nImageSelect.displayName = 'ImageSelect';\n\nexport default ImageSelect;\n"],"mappings":";;;;;;;;;;;;AAaA,MAAM,cAAc,MACjB,EACC,KACA,WACA,OACA,OACA,cACA,UACA,SACA,QAAQ,KACR,SAAS,IACT,QAAQ,cACR,YACA,aACA,GAAG,WACC;CACJ,MAAM,CAAC,cAAc,mBAAmB,mBAA2B,cAAc;EAC/E;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAACA;EAAmB;EAAW,KAAK;EAAI;EAAgB;EAAY;EAAO,GAAI;YAC5E,SAAS,KAAK,SAAS;GACtB,MAAM,WAAW,KAAK,UAAU;AAChC,UACE,qBAACA;IACC,OAAO;IACP,WAAW,GAAG,OAAO,WAAW,YAAY,OAAO,OAAO;IAC1D,KAAK;IAEL,eAAe,gBAAgB,KAAK,MAAM;eAE1C,oBAACC;KACC,KAAK,KAAK,OAAO,KAAK;KACtB,WAAW,GAAG,OAAO,KAAK,YAAY,OAAO,WAAW,YAAY,IAAI;KAChE;KACR,KAAK,KAAK;KACV,OAAO;MACL,GAAG,cAAc;MACjB;MACA;MACD;KACY;KACN;MACP,EAEF,qBAACD;KAAQ,OAAO;KAAU,KAAK;KAAG;gBAC/B,KAAK,QAAQ,oBAACE,gBAAK,MAAM,KAAK,OAAQ,EACtC,KAAK;MACE;MApBL,KAAK,MAqBF;IAEZ;GACM;EAGf;AAED,YAAY,cAAc;AAE1B,0BAAe"}
@@ -1,8 +1,8 @@
1
1
  import { InputProps } from "./type.mjs";
2
- import * as react138 from "react";
2
+ import * as react126 from "react";
3
3
 
4
4
  //#region src/Input/Input.d.ts
5
- declare const Input: react138.NamedExoticComponent<InputProps>;
5
+ declare const Input: react126.NamedExoticComponent<InputProps>;
6
6
  //#endregion
7
7
  export { Input };
8
8
  //# sourceMappingURL=Input.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { InputNumberProps } from "./type.mjs";
2
- import * as react139 from "react";
2
+ import * as react127 from "react";
3
3
 
4
4
  //#region src/Input/InputNumber.d.ts
5
- declare const InputNumber: react139.NamedExoticComponent<InputNumberProps>;
5
+ declare const InputNumber: react127.NamedExoticComponent<InputNumberProps>;
6
6
  //#endregion
7
7
  export { InputNumber };
8
8
  //# sourceMappingURL=InputNumber.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { InputOPTProps } from "./type.mjs";
2
- import * as react140 from "react";
2
+ import * as react128 from "react";
3
3
 
4
4
  //#region src/Input/InputOPT.d.ts
5
- declare const InputOPT: react140.NamedExoticComponent<InputOPTProps>;
5
+ declare const InputOPT: react128.NamedExoticComponent<InputOPTProps>;
6
6
  //#endregion
7
7
  export { InputOPT };
8
8
  //# sourceMappingURL=InputOPT.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { InputPasswordProps } from "./type.mjs";
2
- import * as react141 from "react";
2
+ import * as react129 from "react";
3
3
 
4
4
  //#region src/Input/InputPassword.d.ts
5
- declare const InputPassword: react141.NamedExoticComponent<InputPasswordProps>;
5
+ declare const InputPassword: react129.NamedExoticComponent<InputPasswordProps>;
6
6
  //#endregion
7
7
  export { InputPassword };
8
8
  //# sourceMappingURL=InputPassword.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { TextAreaProps } from "./type.mjs";
2
- import * as react142 from "react";
2
+ import * as react130 from "react";
3
3
 
4
4
  //#region src/Input/TextArea.d.ts
5
- declare const TextArea: react142.NamedExoticComponent<TextAreaProps>;
5
+ declare const TextArea: react130.NamedExoticComponent<TextAreaProps>;
6
6
  //#endregion
7
7
  export { TextArea };
8
8
  //# sourceMappingURL=TextArea.d.mts.map
@@ -1,9 +1,9 @@
1
1
  import { DivProps } from "../../types/index.mjs";
2
2
  import "../../index.mjs";
3
- import * as react20 from "react";
3
+ import * as react44 from "react";
4
4
 
5
5
  //#region src/Layout/components/LayoutFooter.d.ts
6
- declare const LayoutFooter: react20.NamedExoticComponent<DivProps>;
6
+ declare const LayoutFooter: react44.NamedExoticComponent<DivProps>;
7
7
  //#endregion
8
8
  export { LayoutFooter };
9
9
  //# sourceMappingURL=LayoutFooter.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { LayoutHeaderProps } from "../type.mjs";
2
- import * as react21 from "react";
2
+ import * as react45 from "react";
3
3
 
4
4
  //#region src/Layout/components/LayoutHeader.d.ts
5
- declare const LayoutHeader: react21.NamedExoticComponent<LayoutHeaderProps>;
5
+ declare const LayoutHeader: react45.NamedExoticComponent<LayoutHeaderProps>;
6
6
  //#endregion
7
7
  export { LayoutHeader };
8
8
  //# sourceMappingURL=LayoutHeader.d.mts.map
@@ -1,9 +1,9 @@
1
1
  import { DivProps } from "../../types/index.mjs";
2
2
  import "../../index.mjs";
3
- import * as react22 from "react";
3
+ import * as react46 from "react";
4
4
 
5
5
  //#region src/Layout/components/LayoutMain.d.ts
6
- declare const LayoutMain: react22.NamedExoticComponent<DivProps>;
6
+ declare const LayoutMain: react46.NamedExoticComponent<DivProps>;
7
7
  //#endregion
8
8
  export { LayoutMain };
9
9
  //# sourceMappingURL=LayoutMain.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { LayoutSidebarProps } from "../type.mjs";
2
- import * as react23 from "react";
2
+ import * as react47 from "react";
3
3
 
4
4
  //#region src/Layout/components/LayoutSidebar.d.ts
5
- declare const LayoutSidebar: react23.NamedExoticComponent<LayoutSidebarProps>;
5
+ declare const LayoutSidebar: react47.NamedExoticComponent<LayoutSidebarProps>;
6
6
  //#endregion
7
7
  export { LayoutSidebar };
8
8
  //# sourceMappingURL=LayoutSidebar.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { LayoutSidebarInnerProps } from "../type.mjs";
2
- import * as react24 from "react";
2
+ import * as react48 from "react";
3
3
 
4
4
  //#region src/Layout/components/LayoutSidebarInner.d.ts
5
- declare const LayoutSidebarInner: react24.NamedExoticComponent<LayoutSidebarInnerProps>;
5
+ declare const LayoutSidebarInner: react48.NamedExoticComponent<LayoutSidebarInnerProps>;
6
6
  //#endregion
7
7
  export { LayoutSidebarInner };
8
8
  //# sourceMappingURL=LayoutSidebarInner.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { LayoutTocProps } from "../type.mjs";
2
- import * as react25 from "react";
2
+ import * as react49 from "react";
3
3
 
4
4
  //#region src/Layout/components/LayoutToc.d.ts
5
- declare const LayoutToc: react25.NamedExoticComponent<LayoutTocProps>;
5
+ declare const LayoutToc: react49.NamedExoticComponent<LayoutTocProps>;
6
6
  //#endregion
7
7
  export { LayoutToc };
8
8
  //# sourceMappingURL=LayoutToc.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { ListItemProps } from "../type.mjs";
2
- import * as react19 from "react";
2
+ import * as react50 from "react";
3
3
 
4
4
  //#region src/List/ListItem/index.d.ts
5
- declare const ListItem: react19.NamedExoticComponent<ListItemProps>;
5
+ declare const ListItem: react50.NamedExoticComponent<ListItemProps>;
6
6
  //#endregion
7
7
  export { ListItem };
8
8
  //# sourceMappingURL=index.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { MarkdownProps } from "./type.mjs";
2
- import * as react18 from "react";
2
+ import * as react42 from "react";
3
3
 
4
4
  //#region src/Markdown/Markdown.d.ts
5
- declare const Markdown: react18.NamedExoticComponent<MarkdownProps>;
5
+ declare const Markdown: react42.NamedExoticComponent<MarkdownProps>;
6
6
  //#endregion
7
7
  export { Markdown };
8
8
  //# sourceMappingURL=Markdown.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { TypographyProps } from "./type.mjs";
2
- import * as react17 from "react";
2
+ import * as react43 from "react";
3
3
 
4
4
  //#region src/Markdown/Typography.d.ts
5
- declare const Typography: react17.NamedExoticComponent<TypographyProps>;
5
+ declare const Typography: react43.NamedExoticComponent<TypographyProps>;
6
6
  //#endregion
7
7
  export { Typography };
8
8
  //# sourceMappingURL=Typography.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { MaskShadowProps } from "./type.mjs";
2
- import * as react14 from "react";
2
+ import * as react40 from "react";
3
3
 
4
4
  //#region src/MaskShadow/MaskShadow.d.ts
5
- declare const MaskShadow: react14.NamedExoticComponent<MaskShadowProps>;
5
+ declare const MaskShadow: react40.NamedExoticComponent<MaskShadowProps>;
6
6
  //#endregion
7
7
  export { MaskShadow };
8
8
  //# sourceMappingURL=MaskShadow.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { MenuProps } from "./type.mjs";
2
- import * as react26 from "react";
2
+ import * as react41 from "react";
3
3
 
4
4
  //#region src/Menu/Menu.d.ts
5
- declare const Menu: react26.NamedExoticComponent<MenuProps<unknown>>;
5
+ declare const Menu: react41.NamedExoticComponent<MenuProps<unknown>>;
6
6
  //#endregion
7
7
  export { Menu };
8
8
  //# sourceMappingURL=Menu.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { MermaidProps } from "./type.mjs";
2
- import * as react15 from "react";
2
+ import * as react38 from "react";
3
3
 
4
4
  //#region src/Mermaid/Mermaid.d.ts
5
- declare const Mermaid: react15.NamedExoticComponent<MermaidProps>;
5
+ declare const Mermaid: react38.NamedExoticComponent<MermaidProps>;
6
6
  //#endregion
7
7
  export { Mermaid };
8
8
  //# sourceMappingURL=Mermaid.d.mts.map
@@ -29,10 +29,7 @@ const StreamMermaid = memo(({ children, className, fallbackClassName, ref, style
29
29
  }, [blobUrl]);
30
30
  useEffect(() => {
31
31
  if (isLoading || !data) {
32
- if (blobUrl) {
33
- URL.revokeObjectURL(blobUrl);
34
- setBlobUrl(void 0);
35
- }
32
+ setBlobUrl(void 0);
36
33
  return;
37
34
  }
38
35
  let finalSvgString = data;
@@ -48,14 +45,9 @@ const StreamMermaid = memo(({ children, className, fallbackClassName, ref, style
48
45
  finalSvgString = new XMLSerializer().serializeToString(svgDoc);
49
46
  }
50
47
  }
51
- if (blobUrl) URL.revokeObjectURL(blobUrl);
52
48
  const svgBlob = new Blob([finalSvgString], { type: "image/svg+xml" });
53
49
  setBlobUrl(URL.createObjectURL(svgBlob));
54
- }, [
55
- isLoading,
56
- data,
57
- blobUrl
58
- ]);
50
+ }, [isLoading, data]);
59
51
  if (!blobUrl) return /* @__PURE__ */ jsx("div", {
60
52
  className: fallbackClassName,
61
53
  style,
@@ -1 +1 @@
1
- {"version":3,"file":"StreamMermaid.mjs","names":["Image"],"sources":["../../../src/Mermaid/SyntaxMermaid/StreamMermaid.tsx"],"sourcesContent":["'use client';\n\nimport { kebabCase } from 'es-toolkit/compat';\nimport { memo, useEffect, useId, useMemo, useState } from 'react';\nimport type { Ref } from 'react';\n\nimport Image from '@/Image';\nimport { useStreamMermaid } from '@/hooks/useStreamMermaid';\n\nimport { mermaidThemes } from '../const';\nimport type { SyntaxMermaidProps } from '../type';\n\ninterface StreamMermaidProps {\n children: string;\n className?: string;\n fallbackClassName?: string;\n ref?: Ref<HTMLDivElement>;\n style?: SyntaxMermaidProps['style'];\n theme?: SyntaxMermaidProps['theme'];\n variant?: SyntaxMermaidProps['variant'];\n}\n\nconst StreamMermaid = memo<StreamMermaidProps>(\n ({ children, className, fallbackClassName, ref, style, theme: customTheme, variant }) => {\n const safeChildren = children ?? '';\n const isDefaultTheme = customTheme === 'lobe-theme' || !customTheme;\n\n const background = useMemo(() => {\n if (isDefaultTheme) return;\n return mermaidThemes.find((item) => item.id === customTheme)?.background;\n }, [isDefaultTheme, customTheme]);\n\n const id = useId();\n const mermaidId = kebabCase(`mermaid-${id}`);\n const data = useStreamMermaid(safeChildren, {\n enabled: true,\n id: mermaidId,\n theme: isDefaultTheme ? undefined : customTheme,\n });\n const isLoading = !data;\n const [blobUrl, setBlobUrl] = useState<string>();\n\n // 组件卸载时清理 Blob URL,避免内存泄漏\n useEffect(() => {\n return () => {\n if (blobUrl) URL.revokeObjectURL(blobUrl);\n };\n }, [blobUrl]);\n\n useEffect(() => {\n if (isLoading || !data) {\n // Clear blob URL when loading or no data\n if (blobUrl) {\n URL.revokeObjectURL(blobUrl);\n setBlobUrl(undefined);\n }\n return;\n }\n\n let finalSvgString = data;\n\n // 修复Firefox点击预览mermaid图时宽高为0导致不显示的异常\n if (\n typeof window !== 'undefined' &&\n typeof navigator !== 'undefined' &&\n navigator.userAgent.includes('Firefox')\n ) {\n const parser = new DOMParser();\n const svgDoc = parser.parseFromString(data, 'image/svg+xml');\n const svgElement = svgDoc.documentElement;\n if (svgElement && svgElement.hasAttribute('viewBox')) {\n const viewBox = svgElement.getAttribute('viewBox')!;\n const viewBoxParts = viewBox.split(' ');\n if (Array.isArray(viewBoxParts) && viewBoxParts.length === 4) {\n svgElement.setAttribute('width', viewBoxParts[2]);\n svgElement.setAttribute('height', viewBoxParts[3]);\n }\n finalSvgString = new XMLSerializer().serializeToString(svgDoc);\n }\n }\n\n // Revoke old blob URL before creating new one\n if (blobUrl) {\n URL.revokeObjectURL(blobUrl);\n }\n\n // 创建Blob对象\n const svgBlob = new Blob([finalSvgString], { type: 'image/svg+xml' });\n // 创建并保存Blob URL\n const url = URL.createObjectURL(svgBlob);\n setBlobUrl(url);\n }, [isLoading, data, blobUrl]);\n\n if (!blobUrl) {\n return (\n <div className={fallbackClassName} style={style}>\n <div style={{ padding: 16 }}>Rendering...</div>\n </div>\n );\n }\n\n return (\n <Image\n alt={'mermaid'}\n className={className}\n maxHeight={480}\n minWidth={300}\n objectFit={'contain'}\n ref={ref}\n src={blobUrl}\n style={{\n background: variant === 'filled' ? background : undefined,\n borderRadius: 0,\n margin: 0,\n minWidth: 300,\n padding: variant === 'borderless' ? 0 : 16,\n position: 'relative',\n width: '100%',\n ...style,\n }}\n variant={'borderless'}\n width={'100%'}\n />\n );\n },\n);\n\nStreamMermaid.displayName = 'StreamMermaid';\n\nexport default StreamMermaid;\n"],"mappings":";;;;;;;;;;AAsBA,MAAM,gBAAgB,MACnB,EAAE,UAAU,WAAW,mBAAmB,KAAK,OAAO,OAAO,aAAa,cAAc;CACvF,MAAM,eAAe,YAAY;CACjC,MAAM,iBAAiB,gBAAgB,gBAAgB,CAAC;CAExD,MAAM,aAAa,cAAc;AAC/B,MAAI,eAAgB;AACpB,SAAO,cAAc,MAAM,SAAS,KAAK,OAAO,YAAY,EAAE;IAC7D,CAAC,gBAAgB,YAAY,CAAC;CAIjC,MAAM,OAAO,iBAAiB,cAAc;EAC1C,SAAS;EACT,IAHgB,UAAU,WADjB,OAAO,GAC0B;EAI1C,OAAO,iBAAiB,SAAY;EACrC,CAAC;CACF,MAAM,YAAY,CAAC;CACnB,MAAM,CAAC,SAAS,cAAc,UAAkB;AAGhD,iBAAgB;AACd,eAAa;AACX,OAAI,QAAS,KAAI,gBAAgB,QAAQ;;IAE1C,CAAC,QAAQ,CAAC;AAEb,iBAAgB;AACd,MAAI,aAAa,CAAC,MAAM;AAEtB,OAAI,SAAS;AACX,QAAI,gBAAgB,QAAQ;AAC5B,eAAW,OAAU;;AAEvB;;EAGF,IAAI,iBAAiB;AAGrB,MACE,OAAO,WAAW,eAClB,OAAO,cAAc,eACrB,UAAU,UAAU,SAAS,UAAU,EACvC;GAEA,MAAM,SADS,IAAI,WAAW,CACR,gBAAgB,MAAM,gBAAgB;GAC5D,MAAM,aAAa,OAAO;AAC1B,OAAI,cAAc,WAAW,aAAa,UAAU,EAAE;IAEpD,MAAM,eADU,WAAW,aAAa,UAAU,CACrB,MAAM,IAAI;AACvC,QAAI,MAAM,QAAQ,aAAa,IAAI,aAAa,WAAW,GAAG;AAC5D,gBAAW,aAAa,SAAS,aAAa,GAAG;AACjD,gBAAW,aAAa,UAAU,aAAa,GAAG;;AAEpD,qBAAiB,IAAI,eAAe,CAAC,kBAAkB,OAAO;;;AAKlE,MAAI,QACF,KAAI,gBAAgB,QAAQ;EAI9B,MAAM,UAAU,IAAI,KAAK,CAAC,eAAe,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAGrE,aADY,IAAI,gBAAgB,QAAQ,CACzB;IACd;EAAC;EAAW;EAAM;EAAQ,CAAC;AAE9B,KAAI,CAAC,QACH,QACE,oBAAC;EAAI,WAAW;EAA0B;YACxC,oBAAC;GAAI,OAAO,EAAE,SAAS,IAAI;aAAE;IAAkB;GAC3C;AAIV,QACE,oBAACA;EACC,KAAK;EACM;EACX,WAAW;EACX,UAAU;EACV,WAAW;EACN;EACL,KAAK;EACL,OAAO;GACL,YAAY,YAAY,WAAW,aAAa;GAChD,cAAc;GACd,QAAQ;GACR,UAAU;GACV,SAAS,YAAY,eAAe,IAAI;GACxC,UAAU;GACV,OAAO;GACP,GAAG;GACJ;EACD,SAAS;EACT,OAAO;GACP;EAGP;AAED,cAAc,cAAc;AAE5B,4BAAe"}
1
+ {"version":3,"file":"StreamMermaid.mjs","names":["Image"],"sources":["../../../src/Mermaid/SyntaxMermaid/StreamMermaid.tsx"],"sourcesContent":["'use client';\n\nimport { kebabCase } from 'es-toolkit/compat';\nimport { memo, useEffect, useId, useMemo, useState } from 'react';\nimport type { Ref } from 'react';\n\nimport Image from '@/Image';\nimport { useStreamMermaid } from '@/hooks/useStreamMermaid';\n\nimport { mermaidThemes } from '../const';\nimport type { SyntaxMermaidProps } from '../type';\n\ninterface StreamMermaidProps {\n children: string;\n className?: string;\n fallbackClassName?: string;\n ref?: Ref<HTMLDivElement>;\n style?: SyntaxMermaidProps['style'];\n theme?: SyntaxMermaidProps['theme'];\n variant?: SyntaxMermaidProps['variant'];\n}\n\nconst StreamMermaid = memo<StreamMermaidProps>(\n ({ children, className, fallbackClassName, ref, style, theme: customTheme, variant }) => {\n const safeChildren = children ?? '';\n const isDefaultTheme = customTheme === 'lobe-theme' || !customTheme;\n\n const background = useMemo(() => {\n if (isDefaultTheme) return;\n return mermaidThemes.find((item) => item.id === customTheme)?.background;\n }, [isDefaultTheme, customTheme]);\n\n const id = useId();\n const mermaidId = kebabCase(`mermaid-${id}`);\n const data = useStreamMermaid(safeChildren, {\n enabled: true,\n id: mermaidId,\n theme: isDefaultTheme ? undefined : customTheme,\n });\n const isLoading = !data;\n const [blobUrl, setBlobUrl] = useState<string>();\n\n // 组件卸载时清理 Blob URL,避免内存泄漏\n useEffect(() => {\n return () => {\n if (blobUrl) URL.revokeObjectURL(blobUrl);\n };\n }, [blobUrl]);\n\n useEffect(() => {\n if (isLoading || !data) {\n // Clear blob URL when loading or no data\n setBlobUrl(undefined);\n return;\n }\n\n let finalSvgString = data;\n\n // 修复Firefox点击预览mermaid图时宽高为0导致不显示的异常\n if (\n typeof window !== 'undefined' &&\n typeof navigator !== 'undefined' &&\n navigator.userAgent.includes('Firefox')\n ) {\n const parser = new DOMParser();\n const svgDoc = parser.parseFromString(data, 'image/svg+xml');\n const svgElement = svgDoc.documentElement;\n if (svgElement && svgElement.hasAttribute('viewBox')) {\n const viewBox = svgElement.getAttribute('viewBox')!;\n const viewBoxParts = viewBox.split(' ');\n if (Array.isArray(viewBoxParts) && viewBoxParts.length === 4) {\n svgElement.setAttribute('width', viewBoxParts[2]);\n svgElement.setAttribute('height', viewBoxParts[3]);\n }\n finalSvgString = new XMLSerializer().serializeToString(svgDoc);\n }\n }\n\n // 创建Blob对象\n const svgBlob = new Blob([finalSvgString], { type: 'image/svg+xml' });\n // 创建并保存Blob URL\n const url = URL.createObjectURL(svgBlob);\n setBlobUrl(url);\n }, [isLoading, data]);\n\n if (!blobUrl) {\n return (\n <div className={fallbackClassName} style={style}>\n <div style={{ padding: 16 }}>Rendering...</div>\n </div>\n );\n }\n\n return (\n <Image\n alt={'mermaid'}\n className={className}\n maxHeight={480}\n minWidth={300}\n objectFit={'contain'}\n ref={ref}\n src={blobUrl}\n style={{\n background: variant === 'filled' ? background : undefined,\n borderRadius: 0,\n margin: 0,\n minWidth: 300,\n padding: variant === 'borderless' ? 0 : 16,\n position: 'relative',\n width: '100%',\n ...style,\n }}\n variant={'borderless'}\n width={'100%'}\n />\n );\n },\n);\n\nStreamMermaid.displayName = 'StreamMermaid';\n\nexport default StreamMermaid;\n"],"mappings":";;;;;;;;;;AAsBA,MAAM,gBAAgB,MACnB,EAAE,UAAU,WAAW,mBAAmB,KAAK,OAAO,OAAO,aAAa,cAAc;CACvF,MAAM,eAAe,YAAY;CACjC,MAAM,iBAAiB,gBAAgB,gBAAgB,CAAC;CAExD,MAAM,aAAa,cAAc;AAC/B,MAAI,eAAgB;AACpB,SAAO,cAAc,MAAM,SAAS,KAAK,OAAO,YAAY,EAAE;IAC7D,CAAC,gBAAgB,YAAY,CAAC;CAIjC,MAAM,OAAO,iBAAiB,cAAc;EAC1C,SAAS;EACT,IAHgB,UAAU,WADjB,OAAO,GAC0B;EAI1C,OAAO,iBAAiB,SAAY;EACrC,CAAC;CACF,MAAM,YAAY,CAAC;CACnB,MAAM,CAAC,SAAS,cAAc,UAAkB;AAGhD,iBAAgB;AACd,eAAa;AACX,OAAI,QAAS,KAAI,gBAAgB,QAAQ;;IAE1C,CAAC,QAAQ,CAAC;AAEb,iBAAgB;AACd,MAAI,aAAa,CAAC,MAAM;AAEtB,cAAW,OAAU;AACrB;;EAGF,IAAI,iBAAiB;AAGrB,MACE,OAAO,WAAW,eAClB,OAAO,cAAc,eACrB,UAAU,UAAU,SAAS,UAAU,EACvC;GAEA,MAAM,SADS,IAAI,WAAW,CACR,gBAAgB,MAAM,gBAAgB;GAC5D,MAAM,aAAa,OAAO;AAC1B,OAAI,cAAc,WAAW,aAAa,UAAU,EAAE;IAEpD,MAAM,eADU,WAAW,aAAa,UAAU,CACrB,MAAM,IAAI;AACvC,QAAI,MAAM,QAAQ,aAAa,IAAI,aAAa,WAAW,GAAG;AAC5D,gBAAW,aAAa,SAAS,aAAa,GAAG;AACjD,gBAAW,aAAa,UAAU,aAAa,GAAG;;AAEpD,qBAAiB,IAAI,eAAe,CAAC,kBAAkB,OAAO;;;EAKlE,MAAM,UAAU,IAAI,KAAK,CAAC,eAAe,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAGrE,aADY,IAAI,gBAAgB,QAAQ,CACzB;IACd,CAAC,WAAW,KAAK,CAAC;AAErB,KAAI,CAAC,QACH,QACE,oBAAC;EAAI,WAAW;EAA0B;YACxC,oBAAC;GAAI,OAAO,EAAE,SAAS,IAAI;aAAE;IAAkB;GAC3C;AAIV,QACE,oBAACA;EACC,KAAK;EACM;EACX,WAAW;EACX,UAAU;EACV,WAAW;EACN;EACL,KAAK;EACL,OAAO;GACL,YAAY,YAAY,WAAW,aAAa;GAChD,cAAc;GACd,QAAQ;GACR,UAAU;GACV,SAAS,YAAY,eAAe,IAAI;GACxC,UAAU;GACV,OAAO;GACP,GAAG;GACJ;EACD,SAAS;EACT,OAAO;GACP;EAGP;AAED,cAAc,cAAc;AAE5B,4BAAe"}
@@ -1,8 +1,8 @@
1
1
  import { SyntaxMermaidProps } from "../type.mjs";
2
- import * as react16 from "react";
2
+ import * as react39 from "react";
3
3
 
4
4
  //#region src/Mermaid/SyntaxMermaid/index.d.ts
5
- declare const SyntaxMermaid: react16.NamedExoticComponent<SyntaxMermaidProps>;
5
+ declare const SyntaxMermaid: react39.NamedExoticComponent<SyntaxMermaidProps>;
6
6
  //#endregion
7
7
  export { SyntaxMermaid };
8
8
  //# sourceMappingURL=index.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { ModalProps } from "./type.mjs";
2
- import * as react13 from "react";
2
+ import * as react33 from "react";
3
3
 
4
4
  //#region src/Modal/Modal.d.ts
5
- declare const Modal: react13.NamedExoticComponent<ModalProps>;
5
+ declare const Modal: react33.NamedExoticComponent<ModalProps>;
6
6
  //#endregion
7
7
  export { Modal };
8
8
  //# sourceMappingURL=Modal.d.mts.map