@lobehub/ui 5.0.1 → 5.1.1

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 (152) hide show
  1. package/es/Accordion/Accordion.d.mts +2 -2
  2. package/es/Accordion/AccordionItem.d.mts +2 -2
  3. package/es/ActionIcon/ActionIcon.d.mts +2 -2
  4. package/es/Alert/Alert.d.mts +2 -2
  5. package/es/AutoComplete/Select.d.mts +2 -2
  6. package/es/Avatar/AvatarGroup/index.d.mts +2 -2
  7. package/es/Burger/Burger.d.mts +2 -2
  8. package/es/CodeDiff/CodeDiff.d.mts +2 -2
  9. package/es/CodeDiff/PatchDiff.d.mts +2 -2
  10. package/es/CodeEditor/CodeEditor.d.mts +2 -2
  11. package/es/Collapse/Collapse.d.mts +2 -2
  12. package/es/ConfigProvider/index.d.mts +2 -2
  13. package/es/CopyButton/CopyButton.d.mts +2 -2
  14. package/es/DatePicker/DatePicker.d.mts +2 -2
  15. package/es/DraggablePanel/components/DraggablePanelBody.d.mts +2 -2
  16. package/es/DraggablePanel/components/DraggablePanelContainer.d.mts +2 -2
  17. package/es/DraggablePanel/components/DraggablePanelFooter.d.mts +2 -2
  18. package/es/DraggablePanel/components/DraggablePanelHeader.d.mts +2 -2
  19. package/es/DraggableSideNav/DraggableSideNav.d.mts +2 -2
  20. package/es/Drawer/Drawer.d.mts +2 -2
  21. package/es/Dropdown/Dropdown.d.mts +2 -2
  22. package/es/EditableText/EditableText.d.mts +2 -2
  23. package/es/EditorSlashMenu/atoms.d.mts +13 -13
  24. package/es/EmojiPicker/EmojiPicker.d.mts +2 -2
  25. package/es/Flex/FlexBasic.d.mts +2 -2
  26. package/es/FontLoader/index.d.mts +2 -2
  27. package/es/Footer/Footer.d.mts +2 -2
  28. package/es/Form/components/FormGroup.d.mts +2 -2
  29. package/es/Form/components/FormItem.d.mts +2 -2
  30. package/es/Form/components/FormSubmitFooter.d.mts +2 -2
  31. package/es/FormModal/FormModal.d.mts +2 -2
  32. package/es/Freeze/Freeze.d.mts +2 -2
  33. package/es/GuideCard/GuideCard.d.mts +2 -2
  34. package/es/Header/Header.d.mts +2 -2
  35. package/es/Highlighter/Highlighter.d.mts +2 -2
  36. package/es/Highlighter/SyntaxHighlighter/index.d.mts +2 -2
  37. package/es/Hotkey/Hotkey.d.mts +2 -2
  38. package/es/HotkeyInput/HotkeyInput.d.mts +2 -2
  39. package/es/Icon/Icon.d.mts +2 -2
  40. package/es/Icon/components/IconProvider.d.mts +3 -3
  41. package/es/Image/PreviewGroup.d.mts +2 -2
  42. package/es/ImageSelect/ImageSelect.d.mts +2 -2
  43. package/es/Input/Input.d.mts +2 -2
  44. package/es/Input/InputNumber.d.mts +2 -2
  45. package/es/Input/InputOPT.d.mts +2 -2
  46. package/es/Input/InputPassword.d.mts +2 -2
  47. package/es/Input/TextArea.d.mts +2 -2
  48. package/es/Layout/components/LayoutFooter.d.mts +2 -2
  49. package/es/Layout/components/LayoutHeader.d.mts +2 -2
  50. package/es/Layout/components/LayoutMain.d.mts +2 -2
  51. package/es/Layout/components/LayoutSidebar.d.mts +2 -2
  52. package/es/Layout/components/LayoutSidebarInner.d.mts +2 -2
  53. package/es/Layout/components/LayoutToc.d.mts +2 -2
  54. package/es/List/ListItem/index.d.mts +2 -2
  55. package/es/Markdown/Markdown.d.mts +2 -2
  56. package/es/Markdown/Typography.d.mts +2 -2
  57. package/es/Markdown/components/SearchResultCards/index.d.mts +2 -2
  58. package/es/MaskShadow/MaskShadow.d.mts +2 -2
  59. package/es/Menu/Menu.d.mts +2 -2
  60. package/es/Mermaid/Mermaid.d.mts +2 -2
  61. package/es/Mermaid/SyntaxMermaid/index.d.mts +2 -2
  62. package/es/Modal/Modal.d.mts +2 -2
  63. package/es/Modal/ModalProvider.d.mts +2 -2
  64. package/es/Modal/imperative.d.mts +2 -2
  65. package/es/MotionProvider/index.d.mts +2 -2
  66. package/es/Popover/ArrowIcon.d.mts +2 -2
  67. package/es/Popover/atoms.d.mts +9 -9
  68. package/es/Popover/context.d.mts +2 -2
  69. package/es/SearchBar/SearchBar.d.mts +2 -2
  70. package/es/Segmented/Segmented.d.mts +2 -2
  71. package/es/Select/Select.d.mts +2 -2
  72. package/es/SideNav/SideNav.d.mts +2 -2
  73. package/es/SliderWithInput/SliderWithInput.d.mts +2 -2
  74. package/es/ThemeProvider/ThemeProvider.d.mts +2 -2
  75. package/es/Toc/Toc.d.mts +2 -2
  76. package/es/Video/index.d.mts +2 -2
  77. package/es/awesome/AuroraBackground/AuroraBackground.d.mts +2 -2
  78. package/es/awesome/BottomGradientButton/BottomGradientButton.d.mts +2 -2
  79. package/es/awesome/Features/Features.d.mts +2 -2
  80. package/es/awesome/Giscus/Giscus.d.mts +2 -2
  81. package/es/awesome/GradientButton/GradientButton.d.mts +2 -2
  82. package/es/awesome/GridBackground/GridBackground.d.mts +2 -2
  83. package/es/awesome/GridBackground/GridShowcase.d.mts +2 -2
  84. package/es/awesome/Hero/Hero.d.mts +2 -2
  85. package/es/awesome/Spline/Spine.d.mts +2 -2
  86. package/es/awesome/Spotlight/Spotlight.d.mts +2 -2
  87. package/es/awesome/SpotlightCard/SpotlightCard.d.mts +2 -2
  88. package/es/awesome/TypewriterEffect/TypewriterEffect.d.mts +2 -2
  89. package/es/base-ui/ContextMenu/ContextMenuHost.d.mts +3 -3
  90. package/es/base-ui/DropdownMenu/DropdownMenu.d.mts +2 -2
  91. package/es/base-ui/Modal/Modal.d.mts +8 -0
  92. package/es/base-ui/Modal/Modal.mjs +230 -0
  93. package/es/base-ui/Modal/Modal.mjs.map +1 -0
  94. package/es/base-ui/Modal/atoms.d.mts +100 -0
  95. package/es/base-ui/Modal/atoms.mjs +187 -0
  96. package/es/base-ui/Modal/atoms.mjs.map +1 -0
  97. package/es/base-ui/Modal/constants.d.mts +10 -0
  98. package/es/base-ui/Modal/constants.mjs +27 -0
  99. package/es/base-ui/Modal/constants.mjs.map +1 -0
  100. package/es/base-ui/Modal/context.d.mts +9 -0
  101. package/es/base-ui/Modal/context.mjs +14 -0
  102. package/es/base-ui/Modal/context.mjs.map +1 -0
  103. package/es/base-ui/Modal/imperative.d.mts +25 -0
  104. package/es/base-ui/Modal/imperative.mjs +221 -0
  105. package/es/base-ui/Modal/imperative.mjs.map +1 -0
  106. package/es/base-ui/Modal/index.d.mts +6 -0
  107. package/es/base-ui/Modal/style.mjs +295 -0
  108. package/es/base-ui/Modal/style.mjs.map +1 -0
  109. package/es/base-ui/Modal/type.d.mts +110 -0
  110. package/es/base-ui/Select/Select.d.mts +2 -2
  111. package/es/base-ui/Select/atoms.d.mts +19 -19
  112. package/es/base-ui/Switch/Switch.d.mts +2 -2
  113. package/es/base-ui/Toast/imperative.d.mts +2 -2
  114. package/es/base-ui/index.d.mts +8 -1
  115. package/es/base-ui/index.mjs +6 -1
  116. package/es/brand/LobeChat/index.d.mts +2 -2
  117. package/es/brand/LobeHub/index.d.mts +2 -2
  118. package/es/brand/LogoThree/LogoSpline.d.mts +2 -2
  119. package/es/brand/LogoThree/index.d.mts +2 -2
  120. package/es/chat/BackBottom/BackBottom.d.mts +2 -2
  121. package/es/chat/ChatInputArea/components/ChatInputAreaInner.d.mts +2 -2
  122. package/es/chat/ChatItem/ChatItem.d.mts +2 -2
  123. package/es/chat/ChatList/ChatList.d.mts +2 -2
  124. package/es/chat/EditableMessage/EditableMessage.d.mts +2 -2
  125. package/es/chat/EditableMessageList/EditableMessageList.d.mts +2 -2
  126. package/es/chat/MessageInput/MessageInput.d.mts +2 -2
  127. package/es/chat/MessageModal/MessageModal.d.mts +2 -2
  128. package/es/color/ColorScales/index.d.mts +2 -2
  129. package/es/color/CssVar/index.d.mts +2 -2
  130. package/es/i18n/context.d.mts +2 -2
  131. package/es/icons/lucideExtra/BotPromptIcon.d.mts +2 -2
  132. package/es/icons/lucideExtra/CreateBotIcon.d.mts +2 -2
  133. package/es/icons/lucideExtra/DiscordIcon.d.mts +2 -2
  134. package/es/icons/lucideExtra/GlobeOffIcon.d.mts +2 -2
  135. package/es/icons/lucideExtra/GroupBotIcon.d.mts +2 -2
  136. package/es/icons/lucideExtra/GroupBotSquareIcon.d.mts +3 -3
  137. package/es/icons/lucideExtra/LeftClickIcon.d.mts +3 -3
  138. package/es/icons/lucideExtra/LeftDoubleClickIcon.d.mts +3 -3
  139. package/es/icons/lucideExtra/McpIcon.d.mts +3 -3
  140. package/es/icons/lucideExtra/ProviderIcon.d.mts +3 -3
  141. package/es/icons/lucideExtra/RightClickIcon.d.mts +3 -3
  142. package/es/icons/lucideExtra/RightDoubleClickIcon.d.mts +3 -3
  143. package/es/icons/lucideExtra/ShapesUploadIcon.d.mts +3 -3
  144. package/es/icons/lucideExtra/SkillsIcon.d.mts +2 -2
  145. package/es/icons/lucideExtra/TreeDownRightIcon.d.mts +2 -2
  146. package/es/icons/lucideExtra/TreeUpDownRightIcon.d.mts +3 -3
  147. package/es/mdx/Mdx/index.d.mts +2 -2
  148. package/es/mobile/ChatHeader/ChatHeaderTitle.d.mts +2 -2
  149. package/es/mobile/ChatInputArea/components/ChatSendButton.d.mts +2 -2
  150. package/es/mobile/TabBar/TabBar.d.mts +2 -2
  151. package/es/storybook/StoryBook/index.d.mts +2 -2
  152. package/package.json +1 -1
@@ -1,8 +1,8 @@
1
1
  import { TypewriterEffectProps } from "./type.mjs";
2
- import * as react119 from "react";
2
+ import * as react130 from "react";
3
3
 
4
4
  //#region src/awesome/TypewriterEffect/TypewriterEffect.d.ts
5
- declare const TypewriterEffect: react119.NamedExoticComponent<TypewriterEffectProps>;
5
+ declare const TypewriterEffect: react130.NamedExoticComponent<TypewriterEffectProps>;
6
6
  //#endregion
7
7
  export { TypewriterEffect };
8
8
  //# sourceMappingURL=TypewriterEffect.d.mts.map
@@ -1,8 +1,8 @@
1
- import * as react156 from "react";
2
- import * as react_jsx_runtime61 from "react/jsx-runtime";
1
+ import * as react158 from "react";
2
+ import * as react_jsx_runtime72 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/base-ui/ContextMenu/ContextMenuHost.d.ts
5
- declare const ContextMenuHost: react156.MemoExoticComponent<() => react_jsx_runtime61.JSX.Element | null>;
5
+ declare const ContextMenuHost: react158.MemoExoticComponent<() => react_jsx_runtime72.JSX.Element | null>;
6
6
  //#endregion
7
7
  export { ContextMenuHost };
8
8
  //# sourceMappingURL=ContextMenuHost.d.mts.map
@@ -1,8 +1,8 @@
1
1
  import { DropdownMenuProps } from "./type.mjs";
2
- import * as react149 from "react";
2
+ import * as react120 from "react";
3
3
 
4
4
  //#region src/base-ui/DropdownMenu/DropdownMenu.d.ts
5
- declare const DropdownMenu: react149.NamedExoticComponent<DropdownMenuProps<unknown>>;
5
+ declare const DropdownMenu: react120.NamedExoticComponent<DropdownMenuProps<unknown>>;
6
6
  //#endregion
7
7
  export { DropdownMenu };
8
8
  //# sourceMappingURL=DropdownMenu.d.mts.map
@@ -0,0 +1,8 @@
1
+ import { ModalComponentProps } from "./type.mjs";
2
+ import React from "react";
3
+
4
+ //#region src/base-ui/Modal/Modal.d.ts
5
+ declare const Modal: React.NamedExoticComponent<ModalComponentProps>;
6
+ //#endregion
7
+ export { Modal };
8
+ //# sourceMappingURL=Modal.d.mts.map
@@ -0,0 +1,230 @@
1
+ 'use client';
2
+
3
+ import { stopPropagation } from "../../utils/dom.mjs";
4
+ import { styles } from "./style.mjs";
5
+ import { ModalBackdrop, ModalContent, ModalFooter, ModalHeader, ModalPopup, ModalPortal, ModalRoot, ModalTitle } from "./atoms.mjs";
6
+ import { memo, useCallback, useMemo, useRef, useState } from "react";
7
+ import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
8
+ import { cx } from "antd-style";
9
+ import { useDragControls } from "motion/react";
10
+ import { Maximize2, Minimize2, X } from "lucide-react";
11
+
12
+ //#region src/base-ui/Modal/Modal.tsx
13
+ const OkBtn = ({ confirmLoading, okButtonProps, okText, onOk }) => {
14
+ const { className: userCls, danger, disabled: userDisabled, onClick: userOnClick, ...restOk } = okButtonProps ?? {};
15
+ return /* @__PURE__ */ jsxs("button", {
16
+ type: "button",
17
+ ...restOk,
18
+ className: cx(styles.buttonBase, danger ? styles.dangerOkButton : styles.okButton, userCls),
19
+ disabled: confirmLoading || userDisabled,
20
+ onClick: (e) => {
21
+ onOk(e);
22
+ userOnClick?.(e);
23
+ },
24
+ children: [confirmLoading && /* @__PURE__ */ jsx("span", { className: styles.loadingSpinner }), okText]
25
+ });
26
+ };
27
+ const CancelBtn = ({ cancelButtonProps, cancelText, onCancel }) => {
28
+ const { className: userCls, onClick: userOnClick, ...restCancel } = cancelButtonProps ?? {};
29
+ return /* @__PURE__ */ jsx("button", {
30
+ type: "button",
31
+ ...restCancel,
32
+ className: cx(styles.buttonBase, styles.cancelButton, userCls),
33
+ onClick: (e) => {
34
+ onCancel(e);
35
+ userOnClick?.(e);
36
+ },
37
+ children: cancelText
38
+ });
39
+ };
40
+ const Modal = memo(({ open, title, children, onOk, onCancel, okText = "OK", cancelText = "Cancel", okButtonProps, cancelButtonProps, confirmLoading, footer, width, height, maskClosable = true, closable = true, closeIcon, className, style, classNames, styles: semanticStyles, zIndex, afterClose, afterOpenChange, loading, getContainer, mask = true, keyboard, draggable = true, allowFullscreen = false }) => {
41
+ const dragControls = useDragControls();
42
+ const constraintsRef = useRef(null);
43
+ const [isFullscreen, setIsFullscreen] = useState(false);
44
+ const [isDragging, setIsDragging] = useState(false);
45
+ const handleOpenChange = useCallback((nextOpen, eventDetails) => {
46
+ if (!open) return;
47
+ if (!nextOpen && keyboard === false && eventDetails.reason === "escape-key") return;
48
+ if (!nextOpen && !maskClosable && eventDetails.reason === "outside-press") return;
49
+ if (!nextOpen) onCancel?.(new MouseEvent("click"));
50
+ }, [
51
+ onCancel,
52
+ keyboard,
53
+ maskClosable,
54
+ open
55
+ ]);
56
+ const handleExitComplete = useCallback(() => {
57
+ setIsFullscreen(false);
58
+ afterClose?.();
59
+ afterOpenChange?.(false);
60
+ }, [afterClose, afterOpenChange]);
61
+ const handleAnimationComplete = useCallback(() => {
62
+ if (open) afterOpenChange?.(true);
63
+ }, [open, afterOpenChange]);
64
+ const handleDragStart = useCallback((e) => {
65
+ if (draggable && !isFullscreen) {
66
+ dragControls.start(e);
67
+ setIsDragging(true);
68
+ }
69
+ }, [
70
+ draggable,
71
+ dragControls,
72
+ isFullscreen
73
+ ]);
74
+ const handleDragEnd = useCallback(() => {
75
+ setIsDragging(false);
76
+ }, []);
77
+ const handleOk = useCallback((e) => {
78
+ onOk?.(e);
79
+ }, [onOk]);
80
+ const handleCancel = useCallback((e) => {
81
+ onCancel?.(e);
82
+ }, [onCancel]);
83
+ const footerNode = useMemo(() => {
84
+ if (footer === false || footer === null) return null;
85
+ const cancelBtnNode = /* @__PURE__ */ jsx(CancelBtn, {
86
+ cancelButtonProps,
87
+ cancelText,
88
+ onCancel: handleCancel
89
+ });
90
+ const okBtnNode = /* @__PURE__ */ jsx(OkBtn, {
91
+ confirmLoading,
92
+ okButtonProps,
93
+ okText,
94
+ onOk: handleOk
95
+ });
96
+ const defaultFooter = /* @__PURE__ */ jsxs(Fragment$1, { children: [cancelBtnNode, okBtnNode] });
97
+ if (typeof footer === "function") {
98
+ const BoundCancelBtn = () => cancelBtnNode;
99
+ const BoundOkBtn = () => okBtnNode;
100
+ return footer(defaultFooter, {
101
+ CancelBtn: BoundCancelBtn,
102
+ OkBtn: BoundOkBtn
103
+ });
104
+ }
105
+ return footer ?? defaultFooter;
106
+ }, [
107
+ footer,
108
+ cancelButtonProps,
109
+ cancelText,
110
+ handleCancel,
111
+ confirmLoading,
112
+ okButtonProps,
113
+ okText,
114
+ handleOk
115
+ ]);
116
+ const container = getContainer === false ? void 0 : getContainer ?? void 0;
117
+ const backdropZIndex = zIndex ? { zIndex } : void 0;
118
+ const popupZIndex = zIndex ? { zIndex: (zIndex || 1e3) + 1 } : void 0;
119
+ const shouldDrag = draggable && !isFullscreen;
120
+ const dragProps = shouldDrag ? {
121
+ drag: true,
122
+ dragConstraints: constraintsRef,
123
+ dragControls,
124
+ dragElastic: 0,
125
+ dragListener: false,
126
+ dragMomentum: false,
127
+ whileDrag: { cursor: "grabbing" }
128
+ } : {};
129
+ const showTitle = title !== void 0 && title !== false && title !== null;
130
+ const showHeader = showTitle || closable || allowFullscreen;
131
+ const hasHeight = height !== void 0;
132
+ const panelStyle = {
133
+ ...hasHeight && !isFullscreen ? { height } : {},
134
+ ...style
135
+ };
136
+ return /* @__PURE__ */ jsx(ModalRoot, {
137
+ open: open ?? false,
138
+ onExitComplete: handleExitComplete,
139
+ onOpenChange: handleOpenChange,
140
+ children: /* @__PURE__ */ jsxs(ModalPortal, {
141
+ container,
142
+ children: [mask && /* @__PURE__ */ jsx(ModalBackdrop, {
143
+ className: classNames?.mask,
144
+ style: {
145
+ ...backdropZIndex,
146
+ ...semanticStyles?.mask
147
+ }
148
+ }), /* @__PURE__ */ jsxs(ModalPopup, {
149
+ className: classNames?.wrapper,
150
+ panelClassName: cx(className, isFullscreen && styles.fullscreenPopupInner),
151
+ popupStyle: {
152
+ ...popupZIndex,
153
+ ...semanticStyles?.wrapper
154
+ },
155
+ ref: constraintsRef,
156
+ style: panelStyle,
157
+ width: isFullscreen ? void 0 : width,
158
+ motionProps: {
159
+ ...dragProps,
160
+ onAnimationComplete: handleAnimationComplete
161
+ },
162
+ children: [
163
+ showHeader && /* @__PURE__ */ jsxs(ModalHeader, {
164
+ className: cx(classNames?.header, shouldDrag && styles.headerDraggable),
165
+ style: {
166
+ ...isDragging ? { cursor: "grabbing" } : {},
167
+ ...semanticStyles?.header
168
+ },
169
+ onPointerCancel: handleDragEnd,
170
+ onPointerDown: handleDragStart,
171
+ onPointerUp: handleDragEnd,
172
+ children: [showTitle ? /* @__PURE__ */ jsx(ModalTitle, {
173
+ className: classNames?.title,
174
+ style: semanticStyles?.title,
175
+ children: title
176
+ }) : /* @__PURE__ */ jsx("span", {}), /* @__PURE__ */ jsxs("div", {
177
+ className: styles.headerActions,
178
+ onPointerDown: stopPropagation,
179
+ children: [allowFullscreen && /* @__PURE__ */ jsx("button", {
180
+ "aria-label": isFullscreen ? "Exit fullscreen" : "Fullscreen",
181
+ className: styles.fullscreenToggle,
182
+ type: "button",
183
+ onClick: () => setIsFullscreen((prev) => !prev),
184
+ children: isFullscreen ? /* @__PURE__ */ jsx(Minimize2, { size: 14 }) : /* @__PURE__ */ jsx(Maximize2, { size: 14 })
185
+ }), closable && /* @__PURE__ */ jsx("button", {
186
+ "aria-label": "Close",
187
+ className: styles.closeInline,
188
+ type: "button",
189
+ onClick: handleCancel,
190
+ children: closeIcon ?? /* @__PURE__ */ jsx(X, { size: 18 })
191
+ })]
192
+ })]
193
+ }),
194
+ /* @__PURE__ */ jsx(ModalContent, {
195
+ className: classNames?.body,
196
+ style: {
197
+ ...hasHeight || isFullscreen ? { flex: 1 } : {},
198
+ ...semanticStyles?.body
199
+ },
200
+ children: loading ? /* @__PURE__ */ jsx("div", {
201
+ style: {
202
+ display: "flex",
203
+ justifyContent: "center",
204
+ padding: "32px 0"
205
+ },
206
+ children: /* @__PURE__ */ jsx("span", {
207
+ className: styles.loadingSpinner,
208
+ style: {
209
+ height: 24,
210
+ width: 24
211
+ }
212
+ })
213
+ }) : children
214
+ }),
215
+ footerNode !== null && /* @__PURE__ */ jsx(ModalFooter, {
216
+ className: classNames?.footer,
217
+ style: semanticStyles?.footer,
218
+ children: footerNode
219
+ })
220
+ ]
221
+ })]
222
+ })
223
+ });
224
+ });
225
+ Modal.displayName = "Modal";
226
+ var Modal_default = Modal;
227
+
228
+ //#endregion
229
+ export { Modal_default as default };
230
+ //# sourceMappingURL=Modal.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Modal.mjs","names":["OkBtn: React.FC<OkBtnProps>","CancelBtn: React.FC<CancelBtnProps>","BoundCancelBtn: React.FC","BoundOkBtn: React.FC","panelStyle: React.CSSProperties"],"sources":["../../../src/base-ui/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { Maximize2, Minimize2, X } from 'lucide-react';\nimport { useDragControls } from 'motion/react';\nimport type { MouseEvent, PointerEvent } from 'react';\nimport type React from 'react';\nimport { memo, useCallback, useMemo, useRef, useState } from 'react';\n\nimport { stopPropagation } from '@/utils/dom';\n\nimport {\n ModalBackdrop,\n ModalContent,\n ModalFooter,\n ModalHeader,\n ModalPopup,\n ModalPortal,\n ModalRoot,\n ModalTitle,\n} from './atoms';\nimport { styles } from './style';\nimport type { ModalComponentProps } from './type';\n\ninterface OkBtnProps {\n confirmLoading?: boolean;\n okButtonProps?: ModalComponentProps['okButtonProps'];\n okText?: React.ReactNode;\n onOk: (e: MouseEvent<HTMLButtonElement>) => void;\n}\n\nconst OkBtn: React.FC<OkBtnProps> = ({ confirmLoading, okButtonProps, okText, onOk }) => {\n const {\n className: userCls,\n danger,\n disabled: userDisabled,\n onClick: userOnClick,\n ...restOk\n } = okButtonProps ?? {};\n return (\n <button\n type=\"button\"\n {...restOk}\n className={cx(styles.buttonBase, danger ? styles.dangerOkButton : styles.okButton, userCls)}\n disabled={confirmLoading || userDisabled}\n onClick={(e) => {\n onOk(e);\n userOnClick?.(e);\n }}\n >\n {confirmLoading && <span className={styles.loadingSpinner} />}\n {okText}\n </button>\n );\n};\ninterface CancelBtnProps {\n cancelButtonProps?: ModalComponentProps['cancelButtonProps'];\n cancelText?: React.ReactNode;\n onCancel: (e: MouseEvent<HTMLButtonElement>) => void;\n}\n\nconst CancelBtn: React.FC<CancelBtnProps> = ({ cancelButtonProps, cancelText, onCancel }) => {\n const { className: userCls, onClick: userOnClick, ...restCancel } = cancelButtonProps ?? {};\n return (\n <button\n type=\"button\"\n {...restCancel}\n className={cx(styles.buttonBase, styles.cancelButton, userCls)}\n onClick={(e) => {\n onCancel(e);\n userOnClick?.(e);\n }}\n >\n {cancelText}\n </button>\n );\n};\n\nconst Modal = memo<ModalComponentProps>(\n ({\n open,\n title,\n children,\n onOk,\n onCancel,\n okText = 'OK',\n cancelText = 'Cancel',\n okButtonProps,\n cancelButtonProps,\n confirmLoading,\n footer,\n width,\n height,\n maskClosable = true,\n closable = true,\n closeIcon,\n className,\n style,\n classNames,\n styles: semanticStyles,\n zIndex,\n afterClose,\n afterOpenChange,\n loading,\n getContainer,\n mask = true,\n keyboard,\n draggable = true,\n allowFullscreen = false,\n }) => {\n const dragControls = useDragControls();\n const constraintsRef = useRef<HTMLDivElement>(null);\n const [isFullscreen, setIsFullscreen] = useState(false);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleOpenChange = useCallback(\n (nextOpen: boolean, eventDetails: { reason: string }) => {\n if (!open) return;\n if (!nextOpen && keyboard === false && eventDetails.reason === 'escape-key') return;\n if (!nextOpen && !maskClosable && eventDetails.reason === 'outside-press') return;\n if (!nextOpen) {\n onCancel?.(new MouseEvent('click') as unknown as MouseEvent<HTMLButtonElement>);\n }\n },\n [onCancel, keyboard, maskClosable, open],\n );\n\n const handleExitComplete = useCallback(() => {\n setIsFullscreen(false);\n afterClose?.();\n afterOpenChange?.(false);\n }, [afterClose, afterOpenChange]);\n\n const handleAnimationComplete = useCallback(() => {\n if (open) afterOpenChange?.(true);\n }, [open, afterOpenChange]);\n\n const handleDragStart = useCallback(\n (e: PointerEvent) => {\n if (draggable && !isFullscreen) {\n dragControls.start(e);\n setIsDragging(true);\n }\n },\n [draggable, dragControls, isFullscreen],\n );\n\n const handleDragEnd = useCallback(() => {\n setIsDragging(false);\n }, []);\n\n const handleOk = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n onOk?.(e);\n },\n [onOk],\n );\n\n const handleCancel = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n onCancel?.(e);\n },\n [onCancel],\n );\n\n const footerNode = useMemo(() => {\n if (footer === false || footer === null) return null;\n const cancelBtnNode = (\n <CancelBtn\n cancelButtonProps={cancelButtonProps}\n cancelText={cancelText}\n onCancel={handleCancel}\n />\n );\n const okBtnNode = (\n <OkBtn\n confirmLoading={confirmLoading}\n okButtonProps={okButtonProps}\n okText={okText}\n onOk={handleOk}\n />\n );\n const defaultFooter = (\n <>\n {cancelBtnNode}\n {okBtnNode}\n </>\n );\n\n if (typeof footer === 'function') {\n const BoundCancelBtn: React.FC = () => cancelBtnNode;\n const BoundOkBtn: React.FC = () => okBtnNode;\n return footer(defaultFooter, { CancelBtn: BoundCancelBtn, OkBtn: BoundOkBtn });\n }\n\n return footer ?? defaultFooter;\n }, [\n footer,\n cancelButtonProps,\n cancelText,\n handleCancel,\n confirmLoading,\n okButtonProps,\n okText,\n handleOk,\n ]);\n\n const container = getContainer === false ? undefined : (getContainer ?? undefined);\n const backdropZIndex = zIndex ? { zIndex } : undefined;\n const popupZIndex = zIndex ? { zIndex: (zIndex || 1000) + 1 } : undefined;\n\n const shouldDrag = draggable && !isFullscreen;\n const dragProps = shouldDrag\n ? {\n drag: true as const,\n dragConstraints: constraintsRef,\n dragControls,\n dragElastic: 0,\n dragListener: false,\n dragMomentum: false,\n whileDrag: { cursor: 'grabbing' as const },\n }\n : {};\n\n const showTitle = title !== undefined && title !== false && title !== null;\n const showHeader = showTitle || closable || allowFullscreen;\n\n const hasHeight = height !== undefined;\n const panelStyle: React.CSSProperties = {\n ...(hasHeight && !isFullscreen ? { height } : {}),\n ...style,\n };\n\n return (\n <ModalRoot\n open={open ?? false}\n onExitComplete={handleExitComplete}\n onOpenChange={handleOpenChange}\n >\n <ModalPortal container={container}>\n {mask && (\n <ModalBackdrop\n className={classNames?.mask}\n style={{ ...backdropZIndex, ...semanticStyles?.mask }}\n />\n )}\n <ModalPopup\n className={classNames?.wrapper}\n panelClassName={cx(className, isFullscreen && styles.fullscreenPopupInner)}\n popupStyle={{ ...popupZIndex, ...semanticStyles?.wrapper }}\n ref={constraintsRef}\n style={panelStyle}\n width={isFullscreen ? undefined : width}\n motionProps={{\n ...dragProps,\n onAnimationComplete: handleAnimationComplete,\n }}\n >\n {showHeader && (\n <ModalHeader\n className={cx(classNames?.header, shouldDrag && styles.headerDraggable)}\n style={{\n ...(isDragging ? { cursor: 'grabbing' } : {}),\n ...semanticStyles?.header,\n }}\n onPointerCancel={handleDragEnd}\n onPointerDown={handleDragStart}\n onPointerUp={handleDragEnd}\n >\n {showTitle ? (\n <ModalTitle className={classNames?.title} style={semanticStyles?.title}>\n {title}\n </ModalTitle>\n ) : (\n <span />\n )}\n <div className={styles.headerActions} onPointerDown={stopPropagation}>\n {allowFullscreen && (\n <button\n aria-label={isFullscreen ? 'Exit fullscreen' : 'Fullscreen'}\n className={styles.fullscreenToggle}\n type=\"button\"\n onClick={() => setIsFullscreen((prev) => !prev)}\n >\n {isFullscreen ? <Minimize2 size={14} /> : <Maximize2 size={14} />}\n </button>\n )}\n {closable && (\n <button\n aria-label=\"Close\"\n className={styles.closeInline}\n type=\"button\"\n onClick={handleCancel}\n >\n {closeIcon ?? <X size={18} />}\n </button>\n )}\n </div>\n </ModalHeader>\n )}\n <ModalContent\n className={classNames?.body}\n style={{\n ...(hasHeight || isFullscreen ? { flex: 1 } : {}),\n ...semanticStyles?.body,\n }}\n >\n {loading ? (\n <div\n style={{\n display: 'flex',\n justifyContent: 'center',\n padding: '32px 0',\n }}\n >\n <span className={styles.loadingSpinner} style={{ height: 24, width: 24 }} />\n </div>\n ) : (\n children\n )}\n </ModalContent>\n {footerNode !== null && (\n <ModalFooter className={classNames?.footer} style={semanticStyles?.footer}>\n {footerNode}\n </ModalFooter>\n )}\n </ModalPopup>\n </ModalPortal>\n </ModalRoot>\n );\n },\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"mappings":"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"}
@@ -0,0 +1,100 @@
1
+ import React from "react";
2
+ import * as react_jsx_runtime46 from "react/jsx-runtime";
3
+ import { Dialog } from "@base-ui/react/dialog";
4
+
5
+ //#region src/base-ui/Modal/atoms.d.ts
6
+ interface ModalAnimationActions {
7
+ onExitComplete: () => void;
8
+ }
9
+ declare const useModalOpen: () => boolean | null;
10
+ declare const useModalActions: () => ModalAnimationActions | null;
11
+ type ModalRootProps = Dialog.Root.Props & {
12
+ onExitComplete?: () => void;
13
+ };
14
+ declare const ModalRoot: ({
15
+ open,
16
+ onExitComplete,
17
+ ...rest
18
+ }: ModalRootProps) => react_jsx_runtime46.JSX.Element;
19
+ type ModalPortalProps = React.ComponentProps<typeof Dialog.Portal> & {
20
+ container?: HTMLElement | null;
21
+ };
22
+ declare const ModalPortal: ({
23
+ container,
24
+ ...rest
25
+ }: ModalPortalProps) => react_jsx_runtime46.JSX.Element;
26
+ type ModalViewportProps = React.ComponentProps<typeof Dialog.Viewport>;
27
+ declare const ModalViewport: ({
28
+ className,
29
+ ...rest
30
+ }: ModalViewportProps) => react_jsx_runtime46.JSX.Element;
31
+ type ModalBackdropProps = React.ComponentProps<typeof Dialog.Backdrop>;
32
+ declare const ModalBackdrop: ({
33
+ className,
34
+ style,
35
+ ...rest
36
+ }: ModalBackdropProps) => react_jsx_runtime46.JSX.Element;
37
+ type ModalPopupProps = React.ComponentProps<typeof Dialog.Popup> & {
38
+ motionProps?: Record<string, any>;
39
+ panelClassName?: string;
40
+ popupStyle?: React.CSSProperties;
41
+ width?: number | string;
42
+ };
43
+ declare const ModalPopup: ({
44
+ className,
45
+ children,
46
+ width,
47
+ style,
48
+ motionProps,
49
+ panelClassName,
50
+ popupStyle,
51
+ ...rest
52
+ }: ModalPopupProps) => react_jsx_runtime46.JSX.Element;
53
+ type ModalHeaderProps = React.HTMLAttributes<HTMLDivElement> & {
54
+ ref?: React.Ref<HTMLDivElement>;
55
+ };
56
+ declare const ModalHeader: ({
57
+ className,
58
+ ...rest
59
+ }: ModalHeaderProps) => react_jsx_runtime46.JSX.Element;
60
+ type ModalTitleProps = React.ComponentProps<typeof Dialog.Title>;
61
+ declare const ModalTitle: ({
62
+ className,
63
+ ...rest
64
+ }: ModalTitleProps) => react_jsx_runtime46.JSX.Element;
65
+ type ModalDescriptionProps = React.ComponentProps<typeof Dialog.Description>;
66
+ declare const ModalDescription: React.FC<ModalDescriptionProps>;
67
+ type ModalContentProps = React.HTMLAttributes<HTMLDivElement> & {
68
+ ref?: React.Ref<HTMLDivElement>;
69
+ };
70
+ declare const ModalContent: ({
71
+ className,
72
+ ...rest
73
+ }: ModalContentProps) => react_jsx_runtime46.JSX.Element;
74
+ type ModalFooterProps = React.HTMLAttributes<HTMLDivElement> & {
75
+ ref?: React.Ref<HTMLDivElement>;
76
+ };
77
+ declare const ModalFooter: ({
78
+ className,
79
+ ...rest
80
+ }: ModalFooterProps) => react_jsx_runtime46.JSX.Element;
81
+ type ModalCloseProps = React.ComponentProps<typeof Dialog.Close>;
82
+ declare const ModalClose: ({
83
+ className,
84
+ children,
85
+ ...rest
86
+ }: ModalCloseProps) => react_jsx_runtime46.JSX.Element;
87
+ type ModalTriggerProps = Omit<React.ComponentPropsWithRef<typeof Dialog.Trigger>, 'children' | 'render'> & {
88
+ children?: React.ReactNode;
89
+ nativeButton?: boolean;
90
+ };
91
+ declare const ModalTrigger: ({
92
+ children,
93
+ className,
94
+ nativeButton,
95
+ ref: refProp,
96
+ ...rest
97
+ }: ModalTriggerProps) => react_jsx_runtime46.JSX.Element;
98
+ //#endregion
99
+ export { ModalBackdrop, ModalBackdropProps, ModalClose, ModalCloseProps, ModalContent, ModalContentProps, ModalDescription, ModalDescriptionProps, ModalFooter, ModalFooterProps, ModalHeader, ModalHeaderProps, ModalPopup, ModalPopupProps, ModalPortal, ModalPortalProps, ModalRoot, ModalRootProps, ModalTitle, ModalTitleProps, ModalTrigger, ModalTriggerProps, ModalViewport, ModalViewportProps, useModalActions, useModalOpen };
100
+ //# sourceMappingURL=atoms.d.mts.map
@@ -0,0 +1,187 @@
1
+ 'use client';
2
+
3
+ import { useMotionComponent } from "../../MotionProvider/index.mjs";
4
+ import { useNativeButton } from "../../hooks/useNativeButton.mjs";
5
+ import { useAppElement } from "../../ThemeProvider/AppElementContext.mjs";
6
+ import { backdropTransition, modalMotionConfig } from "./constants.mjs";
7
+ import { styles } from "./style.mjs";
8
+ import { cloneElement, createContext, createElement, isValidElement, use, useCallback, useEffect, useMemo, useState } from "react";
9
+ import { jsx } from "react/jsx-runtime";
10
+ import { cx } from "antd-style";
11
+ import { AnimatePresence } from "motion/react";
12
+ import { mergeProps } from "@base-ui/react/merge-props";
13
+ import { mergeRefs } from "react-merge-refs";
14
+ import { X } from "lucide-react";
15
+ import { Dialog } from "@base-ui/react/dialog";
16
+
17
+ //#region src/base-ui/Modal/atoms.tsx
18
+ const mergeStateClassName = (base, className) => {
19
+ if (typeof className === "function") return (state) => cx(base, className(state));
20
+ return cx(base, className);
21
+ };
22
+ const ModalOpenContext = createContext(null);
23
+ const ModalActionsContext = createContext(null);
24
+ const useModalOpen = () => use(ModalOpenContext);
25
+ const useModalActions = () => use(ModalActionsContext);
26
+ const AnimatedModalRoot = ({ open, children, onExitComplete: onExitCompleteProp, ...rest }) => {
27
+ const [isPresent, setIsPresent] = useState(!!open);
28
+ useEffect(() => {
29
+ if (open) setIsPresent(true);
30
+ }, [open]);
31
+ const handleExitComplete = useCallback(() => {
32
+ setIsPresent(false);
33
+ onExitCompleteProp?.();
34
+ }, [onExitCompleteProp]);
35
+ const actions = useMemo(() => ({ onExitComplete: handleExitComplete }), [handleExitComplete]);
36
+ if (!isPresent) return null;
37
+ return /* @__PURE__ */ jsx(ModalOpenContext, {
38
+ value: open,
39
+ children: /* @__PURE__ */ jsx(ModalActionsContext, {
40
+ value: actions,
41
+ children: /* @__PURE__ */ jsx(Dialog.Root, {
42
+ modal: true,
43
+ open: true,
44
+ ...rest,
45
+ children
46
+ })
47
+ })
48
+ });
49
+ };
50
+ const ModalRoot = ({ open, onExitComplete, ...rest }) => {
51
+ if (open !== void 0) return /* @__PURE__ */ jsx(AnimatedModalRoot, {
52
+ open,
53
+ onExitComplete,
54
+ ...rest
55
+ });
56
+ return /* @__PURE__ */ jsx(Dialog.Root, {
57
+ modal: true,
58
+ ...rest
59
+ });
60
+ };
61
+ const ModalPortal = ({ container, ...rest }) => {
62
+ const appElement = useAppElement();
63
+ return /* @__PURE__ */ jsx(Dialog.Portal, {
64
+ container: container ?? appElement ?? void 0,
65
+ ...rest
66
+ });
67
+ };
68
+ const ModalViewport = ({ className, ...rest }) => /* @__PURE__ */ jsx(Dialog.Viewport, {
69
+ ...rest,
70
+ className: mergeStateClassName(styles.viewport, className)
71
+ });
72
+ const ModalBackdrop = ({ className, style, ...rest }) => {
73
+ const open = useModalOpen();
74
+ const Motion = useMotionComponent();
75
+ if (open !== null) return /* @__PURE__ */ jsx(Motion.div, {
76
+ animate: { opacity: open ? 1 : 0 },
77
+ className: cx(styles.backdrop, className),
78
+ initial: { opacity: 0 },
79
+ style: {
80
+ ...style,
81
+ transition: "none"
82
+ },
83
+ transition: backdropTransition
84
+ });
85
+ return /* @__PURE__ */ jsx(Dialog.Backdrop, {
86
+ ...rest,
87
+ className: mergeStateClassName(styles.backdrop, className),
88
+ style
89
+ });
90
+ };
91
+ const ModalPopup = ({ className, children, width, style, motionProps, panelClassName, popupStyle, ...rest }) => {
92
+ const open = useModalOpen();
93
+ const actions = useModalActions();
94
+ const Motion = useMotionComponent();
95
+ if (open !== null && actions) return /* @__PURE__ */ jsx(Dialog.Popup, {
96
+ ...rest,
97
+ className: cx(styles.popup, className),
98
+ style: popupStyle,
99
+ children: /* @__PURE__ */ jsx(AnimatePresence, {
100
+ onExitComplete: actions.onExitComplete,
101
+ children: open ? /* @__PURE__ */ createElement(Motion.div, {
102
+ ...modalMotionConfig,
103
+ ...motionProps,
104
+ className: cx(styles.popupInner, panelClassName),
105
+ key: "modal-popup-panel",
106
+ style: {
107
+ maxWidth: width ?? void 0,
108
+ transition: "none",
109
+ ...style
110
+ }
111
+ }, children) : null
112
+ })
113
+ });
114
+ return /* @__PURE__ */ jsx(Dialog.Popup, {
115
+ ...rest,
116
+ className: mergeStateClassName(styles.popup, className),
117
+ style: popupStyle,
118
+ children: /* @__PURE__ */ jsx("div", {
119
+ className: cx(styles.popupInner, panelClassName),
120
+ style: {
121
+ maxWidth: width ?? void 0,
122
+ ...style
123
+ },
124
+ children
125
+ })
126
+ });
127
+ };
128
+ const ModalHeader = ({ className, ...rest }) => /* @__PURE__ */ jsx("div", {
129
+ ...rest,
130
+ className: cx(styles.header, className)
131
+ });
132
+ const ModalTitle = ({ className, ...rest }) => /* @__PURE__ */ jsx(Dialog.Title, {
133
+ ...rest,
134
+ className: mergeStateClassName(styles.title, className)
135
+ });
136
+ const ModalDescription = Dialog.Description;
137
+ const ModalContent = ({ className, ...rest }) => /* @__PURE__ */ jsx("div", {
138
+ ...rest,
139
+ className: cx(styles.content, className)
140
+ });
141
+ const ModalFooter = ({ className, ...rest }) => /* @__PURE__ */ jsx("div", {
142
+ ...rest,
143
+ className: cx(styles.footer, className)
144
+ });
145
+ const ModalClose = ({ className, children, ...rest }) => /* @__PURE__ */ jsx(Dialog.Close, {
146
+ ...rest,
147
+ className: mergeStateClassName(styles.close, className),
148
+ children: children ?? /* @__PURE__ */ jsx(X, { size: 18 })
149
+ });
150
+ const ModalTrigger = ({ children, className, nativeButton, ref: refProp, ...rest }) => {
151
+ const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({
152
+ children,
153
+ nativeButton
154
+ });
155
+ const renderer = (props) => {
156
+ const resolvedProps = (() => {
157
+ if (isNativeButtonTriggerElement) return props;
158
+ const { type, ...restProps } = props;
159
+ return restProps;
160
+ })();
161
+ return cloneElement(children, {
162
+ ...mergeProps(children.props, resolvedProps),
163
+ ref: mergeRefs([
164
+ children.ref,
165
+ props.ref,
166
+ refProp
167
+ ])
168
+ });
169
+ };
170
+ if (isValidElement(children)) return /* @__PURE__ */ jsx(Dialog.Trigger, {
171
+ ...rest,
172
+ className,
173
+ nativeButton: resolvedNativeButton,
174
+ render: renderer
175
+ });
176
+ return /* @__PURE__ */ jsx(Dialog.Trigger, {
177
+ ...rest,
178
+ className,
179
+ nativeButton: resolvedNativeButton,
180
+ ref: refProp,
181
+ children
182
+ });
183
+ };
184
+
185
+ //#endregion
186
+ export { ModalBackdrop, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalPopup, ModalPortal, ModalRoot, ModalTitle, ModalTrigger, ModalViewport, useModalActions, useModalOpen };
187
+ //# sourceMappingURL=atoms.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"atoms.mjs","names":["ModalDescription: React.FC<ModalDescriptionProps>"],"sources":["../../../src/base-ui/Modal/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Dialog } from '@base-ui/react/dialog';\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { cx } from 'antd-style';\nimport { X } from 'lucide-react';\nimport { AnimatePresence } from 'motion/react';\nimport type React from 'react';\nimport {\n cloneElement,\n createContext,\n isValidElement,\n use,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from 'react';\nimport { mergeRefs } from 'react-merge-refs';\n\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { useMotionComponent } from '@/MotionProvider';\nimport { useAppElement } from '@/ThemeProvider';\n\nimport { backdropTransition, modalMotionConfig } from './constants';\nimport { styles } from './style';\n\nconst mergeStateClassName = <TState,>(\n base: string,\n className: string | ((state: TState) => string | undefined) | undefined,\n) => {\n if (typeof className === 'function') return (state: TState) => cx(base, className(state));\n return cx(base, className);\n};\n\n// --- Animation Contexts (granular to minimize re-renders) ---\n\n// State: open boolean, null = non-animated mode\nconst ModalOpenContext = createContext<boolean | null>(null);\n\n// Actions: stable callbacks, null = non-animated mode\ninterface ModalAnimationActions {\n onExitComplete: () => void;\n}\nconst ModalActionsContext = createContext<ModalAnimationActions | null>(null);\n\nexport const useModalOpen = () => use(ModalOpenContext);\nexport const useModalActions = () => use(ModalActionsContext);\n\n// --- Root ---\nexport type ModalRootProps = Dialog.Root.Props & {\n onExitComplete?: () => void;\n};\n\nconst AnimatedModalRoot = ({\n open,\n children,\n onExitComplete: onExitCompleteProp,\n ...rest\n}: Omit<ModalRootProps, 'open'> & { open: boolean }) => {\n const [isPresent, setIsPresent] = useState(!!open);\n\n useEffect(() => {\n if (open) setIsPresent(true);\n }, [open]);\n\n const handleExitComplete = useCallback(() => {\n setIsPresent(false);\n onExitCompleteProp?.();\n }, [onExitCompleteProp]);\n\n const actions = useMemo(() => ({ onExitComplete: handleExitComplete }), [handleExitComplete]);\n\n if (!isPresent) return null;\n\n return (\n <ModalOpenContext value={open}>\n <ModalActionsContext value={actions}>\n <Dialog.Root modal open {...rest}>\n {children}\n </Dialog.Root>\n </ModalActionsContext>\n </ModalOpenContext>\n );\n};\n\nexport const ModalRoot = ({ open, onExitComplete, ...rest }: ModalRootProps) => {\n if (open !== undefined) {\n return <AnimatedModalRoot open={open} onExitComplete={onExitComplete} {...rest} />;\n }\n return <Dialog.Root modal {...rest} />;\n};\n\n// --- Portal ---\nexport type ModalPortalProps = React.ComponentProps<typeof Dialog.Portal> & {\n container?: HTMLElement | null;\n};\nexport const ModalPortal = ({ container, ...rest }: ModalPortalProps) => {\n const appElement = useAppElement();\n return <Dialog.Portal container={container ?? appElement ?? undefined} {...rest} />;\n};\n\n// --- Viewport ---\nexport type ModalViewportProps = React.ComponentProps<typeof Dialog.Viewport>;\nexport const ModalViewport = ({ className, ...rest }: ModalViewportProps) => (\n <Dialog.Viewport\n {...rest}\n className={mergeStateClassName(styles.viewport, className as any) as any}\n />\n);\n\n// --- Backdrop ---\nexport type ModalBackdropProps = React.ComponentProps<typeof Dialog.Backdrop>;\nexport const ModalBackdrop = ({ className, style, ...rest }: ModalBackdropProps) => {\n const open = useModalOpen();\n const Motion = useMotionComponent();\n\n if (open !== null) {\n return (\n <Motion.div\n animate={{ opacity: open ? 1 : 0 }}\n className={cx(styles.backdrop, className as string)}\n initial={{ opacity: 0 }}\n style={{ ...style, transition: 'none' }}\n transition={backdropTransition}\n />\n );\n }\n\n return (\n <Dialog.Backdrop\n {...rest}\n className={mergeStateClassName(styles.backdrop, className as any) as any}\n style={style}\n />\n );\n};\n\n// --- Popup ---\nexport type ModalPopupProps = React.ComponentProps<typeof Dialog.Popup> & {\n motionProps?: Record<string, any>;\n panelClassName?: string;\n popupStyle?: React.CSSProperties;\n width?: number | string;\n};\nexport const ModalPopup = ({\n className,\n children,\n width,\n style,\n motionProps,\n panelClassName,\n popupStyle,\n ...rest\n}: ModalPopupProps) => {\n const open = useModalOpen();\n const actions = useModalActions();\n const Motion = useMotionComponent();\n\n if (open !== null && actions) {\n return (\n <Dialog.Popup {...rest} className={cx(styles.popup, className as string)} style={popupStyle}>\n <AnimatePresence onExitComplete={actions.onExitComplete}>\n {open ? (\n <Motion.div\n {...modalMotionConfig}\n {...motionProps}\n className={cx(styles.popupInner, panelClassName)}\n key=\"modal-popup-panel\"\n style={{ maxWidth: width ?? undefined, transition: 'none', ...style }}\n >\n {children}\n </Motion.div>\n ) : null}\n </AnimatePresence>\n </Dialog.Popup>\n );\n }\n\n return (\n <Dialog.Popup\n {...rest}\n className={mergeStateClassName(styles.popup, className as any) as any}\n style={popupStyle}\n >\n <div\n className={cx(styles.popupInner, panelClassName)}\n style={{ maxWidth: width ?? undefined, ...style }}\n >\n {children}\n </div>\n </Dialog.Popup>\n );\n};\n\n// --- Header ---\nexport type ModalHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalHeader = ({ className, ...rest }: ModalHeaderProps) => (\n <div {...rest} className={cx(styles.header, className)} />\n);\n\n// --- Title ---\nexport type ModalTitleProps = React.ComponentProps<typeof Dialog.Title>;\nexport const ModalTitle = ({ className, ...rest }: ModalTitleProps) => (\n <Dialog.Title {...rest} className={mergeStateClassName(styles.title, className as any) as any} />\n);\n\n// --- Description ---\nexport type ModalDescriptionProps = React.ComponentProps<typeof Dialog.Description>;\nexport const ModalDescription: React.FC<ModalDescriptionProps> = Dialog.Description;\n\n// --- Content ---\nexport type ModalContentProps = React.HTMLAttributes<HTMLDivElement> & {\n ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalContent = ({ className, ...rest }: ModalContentProps) => (\n <div {...rest} className={cx(styles.content, className)} />\n);\n\n// --- Footer ---\nexport type ModalFooterProps = React.HTMLAttributes<HTMLDivElement> & {\n ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalFooter = ({ className, ...rest }: ModalFooterProps) => (\n <div {...rest} className={cx(styles.footer, className)} />\n);\n\n// --- Close ---\nexport type ModalCloseProps = React.ComponentProps<typeof Dialog.Close>;\nexport const ModalClose = ({ className, children, ...rest }: ModalCloseProps) => (\n <Dialog.Close {...rest} className={mergeStateClassName(styles.close, className as any) as any}>\n {children ?? <X size={18} />}\n </Dialog.Close>\n);\n\n// --- Trigger ---\nexport type ModalTriggerProps = Omit<\n React.ComponentPropsWithRef<typeof Dialog.Trigger>,\n 'children' | 'render'\n> & {\n children?: React.ReactNode;\n nativeButton?: boolean;\n};\n\nexport const ModalTrigger = ({\n children,\n className,\n nativeButton,\n ref: refProp,\n ...rest\n}: ModalTriggerProps) => {\n const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({\n children,\n nativeButton,\n });\n\n const renderer = (props: any) => {\n const resolvedProps = (() => {\n if (isNativeButtonTriggerElement) return props as any;\n // eslint-disable-next-line unused-imports/no-unused-vars\n const { type, ...restProps } = props as any;\n return restProps;\n })();\n\n const mergedProps = mergeProps((children as any).props, resolvedProps);\n return cloneElement(children as any, {\n ...mergedProps,\n ref: mergeRefs([(children as any).ref, (props as any).ref, refProp]),\n });\n };\n\n if (isValidElement(children)) {\n return (\n <Dialog.Trigger\n {...rest}\n className={className}\n nativeButton={resolvedNativeButton}\n render={renderer as any}\n />\n );\n }\n\n return (\n <Dialog.Trigger\n {...rest}\n className={className}\n nativeButton={resolvedNativeButton}\n ref={refProp as any}\n >\n {children}\n </Dialog.Trigger>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AA2BA,MAAM,uBACJ,MACA,cACG;AACH,KAAI,OAAO,cAAc,WAAY,SAAQ,UAAkB,GAAG,MAAM,UAAU,MAAM,CAAC;AACzF,QAAO,GAAG,MAAM,UAAU;;AAM5B,MAAM,mBAAmB,cAA8B,KAAK;AAM5D,MAAM,sBAAsB,cAA4C,KAAK;AAE7E,MAAa,qBAAqB,IAAI,iBAAiB;AACvD,MAAa,wBAAwB,IAAI,oBAAoB;AAO7D,MAAM,qBAAqB,EACzB,MACA,UACA,gBAAgB,oBAChB,GAAG,WACmD;CACtD,MAAM,CAAC,WAAW,gBAAgB,SAAS,CAAC,CAAC,KAAK;AAElD,iBAAgB;AACd,MAAI,KAAM,cAAa,KAAK;IAC3B,CAAC,KAAK,CAAC;CAEV,MAAM,qBAAqB,kBAAkB;AAC3C,eAAa,MAAM;AACnB,wBAAsB;IACrB,CAAC,mBAAmB,CAAC;CAExB,MAAM,UAAU,eAAe,EAAE,gBAAgB,oBAAoB,GAAG,CAAC,mBAAmB,CAAC;AAE7F,KAAI,CAAC,UAAW,QAAO;AAEvB,QACE,oBAAC;EAAiB,OAAO;YACvB,oBAAC;GAAoB,OAAO;aAC1B,oBAAC,OAAO;IAAK;IAAM;IAAK,GAAI;IACzB;KACW;IACM;GACL;;AAIvB,MAAa,aAAa,EAAE,MAAM,gBAAgB,GAAG,WAA2B;AAC9E,KAAI,SAAS,OACX,QAAO,oBAAC;EAAwB;EAAsB;EAAgB,GAAI;GAAQ;AAEpF,QAAO,oBAAC,OAAO;EAAK;EAAM,GAAI;GAAQ;;AAOxC,MAAa,eAAe,EAAE,WAAW,GAAG,WAA6B;CACvE,MAAM,aAAa,eAAe;AAClC,QAAO,oBAAC,OAAO;EAAO,WAAW,aAAa,cAAc;EAAW,GAAI;GAAQ;;AAKrF,MAAa,iBAAiB,EAAE,WAAW,GAAG,WAC5C,oBAAC,OAAO;CACN,GAAI;CACJ,WAAW,oBAAoB,OAAO,UAAU,UAAiB;EACjE;AAKJ,MAAa,iBAAiB,EAAE,WAAW,OAAO,GAAG,WAA+B;CAClF,MAAM,OAAO,cAAc;CAC3B,MAAM,SAAS,oBAAoB;AAEnC,KAAI,SAAS,KACX,QACE,oBAAC,OAAO;EACN,SAAS,EAAE,SAAS,OAAO,IAAI,GAAG;EAClC,WAAW,GAAG,OAAO,UAAU,UAAoB;EACnD,SAAS,EAAE,SAAS,GAAG;EACvB,OAAO;GAAE,GAAG;GAAO,YAAY;GAAQ;EACvC,YAAY;GACZ;AAIN,QACE,oBAAC,OAAO;EACN,GAAI;EACJ,WAAW,oBAAoB,OAAO,UAAU,UAAiB;EAC1D;GACP;;AAWN,MAAa,cAAc,EACzB,WACA,UACA,OACA,OACA,aACA,gBACA,YACA,GAAG,WACkB;CACrB,MAAM,OAAO,cAAc;CAC3B,MAAM,UAAU,iBAAiB;CACjC,MAAM,SAAS,oBAAoB;AAEnC,KAAI,SAAS,QAAQ,QACnB,QACE,oBAAC,OAAO;EAAM,GAAI;EAAM,WAAW,GAAG,OAAO,OAAO,UAAoB;EAAE,OAAO;YAC/E,oBAAC;GAAgB,gBAAgB,QAAQ;aACtC,OACC,8BAAC,OAAO;IACN,GAAI;IACJ,GAAI;IACJ,WAAW,GAAG,OAAO,YAAY,eAAe;IAChD,KAAI;IACJ,OAAO;KAAE,UAAU,SAAS;KAAW,YAAY;KAAQ,GAAG;KAAO;MAEpE,SACU,GACX;IACY;GACL;AAInB,QACE,oBAAC,OAAO;EACN,GAAI;EACJ,WAAW,oBAAoB,OAAO,OAAO,UAAiB;EAC9D,OAAO;YAEP,oBAAC;GACC,WAAW,GAAG,OAAO,YAAY,eAAe;GAChD,OAAO;IAAE,UAAU,SAAS;IAAW,GAAG;IAAO;GAEhD;IACG;GACO;;AAQnB,MAAa,eAAe,EAAE,WAAW,GAAG,WAC1C,oBAAC;CAAI,GAAI;CAAM,WAAW,GAAG,OAAO,QAAQ,UAAU;EAAI;AAK5D,MAAa,cAAc,EAAE,WAAW,GAAG,WACzC,oBAAC,OAAO;CAAM,GAAI;CAAM,WAAW,oBAAoB,OAAO,OAAO,UAAiB;EAAW;AAKnG,MAAaA,mBAAoD,OAAO;AAMxE,MAAa,gBAAgB,EAAE,WAAW,GAAG,WAC3C,oBAAC;CAAI,GAAI;CAAM,WAAW,GAAG,OAAO,SAAS,UAAU;EAAI;AAO7D,MAAa,eAAe,EAAE,WAAW,GAAG,WAC1C,oBAAC;CAAI,GAAI;CAAM,WAAW,GAAG,OAAO,QAAQ,UAAU;EAAI;AAK5D,MAAa,cAAc,EAAE,WAAW,UAAU,GAAG,WACnD,oBAAC,OAAO;CAAM,GAAI;CAAM,WAAW,oBAAoB,OAAO,OAAO,UAAiB;WACnF,YAAY,oBAAC,KAAE,MAAM,KAAM;EACf;AAYjB,MAAa,gBAAgB,EAC3B,UACA,WACA,cACA,KAAK,SACL,GAAG,WACoB;CACvB,MAAM,EAAE,8BAA8B,yBAAyB,gBAAgB;EAC7E;EACA;EACD,CAAC;CAEF,MAAM,YAAY,UAAe;EAC/B,MAAM,uBAAuB;AAC3B,OAAI,6BAA8B,QAAO;GAEzC,MAAM,EAAE,MAAM,GAAG,cAAc;AAC/B,UAAO;MACL;AAGJ,SAAO,aAAa,UAAiB;GACnC,GAFkB,WAAY,SAAiB,OAAO,cAAc;GAGpE,KAAK,UAAU;IAAE,SAAiB;IAAM,MAAc;IAAK;IAAQ,CAAC;GACrE,CAAC;;AAGJ,KAAI,eAAe,SAAS,CAC1B,QACE,oBAAC,OAAO;EACN,GAAI;EACO;EACX,cAAc;EACd,QAAQ;GACR;AAIN,QACE,oBAAC,OAAO;EACN,GAAI;EACO;EACX,cAAc;EACd,KAAK;EAEJ;GACc"}
@@ -0,0 +1,10 @@
1
+ import { MotionProps } from "motion/react";
2
+
3
+ //#region src/base-ui/Modal/constants.d.ts
4
+ declare const modalMotionConfig: MotionProps;
5
+ declare const backdropTransition: {
6
+ duration: number;
7
+ };
8
+ //#endregion
9
+ export { backdropTransition, modalMotionConfig };
10
+ //# sourceMappingURL=constants.d.mts.map
@@ -0,0 +1,27 @@
1
+ //#region src/base-ui/Modal/constants.ts
2
+ const enterStyle = {
3
+ opacity: 1,
4
+ scale: 1
5
+ };
6
+ const initialStyle = {
7
+ opacity: 0,
8
+ scale: .96
9
+ };
10
+ const modalMotionConfig = {
11
+ animate: enterStyle,
12
+ exit: {
13
+ ...initialStyle,
14
+ transition: { duration: .15 }
15
+ },
16
+ initial: initialStyle,
17
+ transition: {
18
+ damping: 20,
19
+ stiffness: 300,
20
+ type: "spring"
21
+ }
22
+ };
23
+ const backdropTransition = { duration: .15 };
24
+
25
+ //#endregion
26
+ export { backdropTransition, modalMotionConfig };
27
+ //# sourceMappingURL=constants.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.mjs","names":["modalMotionConfig: MotionProps"],"sources":["../../../src/base-ui/Modal/constants.ts"],"sourcesContent":["import type { MotionProps } from 'motion/react';\n\nconst enterStyle = { opacity: 1, scale: 1 };\nconst initialStyle = { opacity: 0, scale: 0.96 };\n\nexport const modalMotionConfig: MotionProps = {\n animate: enterStyle,\n exit: {\n ...initialStyle,\n transition: { duration: 0.15 },\n },\n initial: initialStyle,\n transition: {\n damping: 20,\n stiffness: 300,\n type: 'spring',\n },\n};\n\nexport const backdropTransition = { duration: 0.15 };\n"],"mappings":";AAEA,MAAM,aAAa;CAAE,SAAS;CAAG,OAAO;CAAG;AAC3C,MAAM,eAAe;CAAE,SAAS;CAAG,OAAO;CAAM;AAEhD,MAAaA,oBAAiC;CAC5C,SAAS;CACT,MAAM;EACJ,GAAG;EACH,YAAY,EAAE,UAAU,KAAM;EAC/B;CACD,SAAS;CACT,YAAY;EACV,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACF;AAED,MAAa,qBAAqB,EAAE,UAAU,KAAM"}