@lobehub/ui 5.2.0 → 5.2.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.
- package/es/ActionIcon/ActionIcon.d.mts +2 -2
- package/es/Alert/Alert.d.mts +2 -2
- package/es/AutoComplete/Select.d.mts +2 -2
- package/es/Avatar/AvatarGroup/index.d.mts +2 -2
- package/es/Burger/Burger.d.mts +2 -2
- package/es/CodeDiff/CodeDiff.d.mts +2 -2
- package/es/CodeDiff/PatchDiff.d.mts +2 -2
- package/es/CodeEditor/CodeEditor.d.mts +2 -2
- package/es/Collapse/Collapse.d.mts +2 -2
- package/es/ConfigProvider/index.d.mts +2 -2
- package/es/CopyButton/CopyButton.d.mts +2 -2
- package/es/DatePicker/DatePicker.d.mts +2 -2
- package/es/DraggablePanel/components/DraggablePanelBody.d.mts +2 -2
- package/es/DraggablePanel/components/DraggablePanelContainer.d.mts +2 -2
- package/es/DraggablePanel/components/DraggablePanelFooter.d.mts +2 -2
- package/es/DraggablePanel/components/DraggablePanelHeader.d.mts +2 -2
- package/es/DraggableSideNav/DraggableSideNav.d.mts +2 -2
- package/es/Drawer/Drawer.d.mts +2 -2
- package/es/Dropdown/Dropdown.d.mts +2 -2
- package/es/EditableText/EditableText.d.mts +2 -2
- package/es/EditorSlashMenu/atoms.d.mts +13 -13
- package/es/EmojiPicker/EmojiPicker.d.mts +2 -2
- package/es/Flex/FlexBasic.d.mts +2 -2
- package/es/FontLoader/index.d.mts +2 -2
- package/es/Footer/Footer.d.mts +2 -2
- package/es/Form/components/FormGroup.d.mts +2 -2
- package/es/Form/components/FormItem.d.mts +2 -2
- package/es/Form/components/FormSubmitFooter.d.mts +2 -2
- package/es/FormModal/FormModal.d.mts +2 -2
- package/es/Freeze/Freeze.d.mts +2 -2
- package/es/GuideCard/GuideCard.d.mts +2 -2
- package/es/Header/Header.d.mts +2 -2
- package/es/Highlighter/Highlighter.d.mts +2 -2
- package/es/Highlighter/SyntaxHighlighter/index.d.mts +2 -2
- package/es/Hotkey/Hotkey.d.mts +2 -2
- package/es/HotkeyInput/HotkeyInput.d.mts +2 -2
- package/es/Icon/Icon.d.mts +2 -2
- package/es/Icon/components/IconProvider.d.mts +3 -3
- package/es/Image/PreviewGroup.d.mts +2 -2
- package/es/ImageSelect/ImageSelect.d.mts +2 -2
- package/es/Input/Input.d.mts +2 -2
- package/es/Input/InputNumber.d.mts +2 -2
- package/es/Input/InputOPT.d.mts +2 -2
- package/es/Input/InputPassword.d.mts +2 -2
- package/es/Input/TextArea.d.mts +2 -2
- package/es/Layout/components/LayoutFooter.d.mts +2 -2
- package/es/Layout/components/LayoutHeader.d.mts +2 -2
- package/es/Layout/components/LayoutMain.d.mts +2 -2
- package/es/Layout/components/LayoutSidebar.d.mts +2 -2
- package/es/Layout/components/LayoutSidebarInner.d.mts +2 -2
- package/es/Layout/components/LayoutToc.d.mts +2 -2
- package/es/List/ListItem/index.d.mts +2 -2
- package/es/Markdown/Markdown.d.mts +2 -2
- package/es/Markdown/Typography.d.mts +2 -2
- package/es/Markdown/components/SearchResultCards/index.d.mts +2 -2
- package/es/MaskShadow/MaskShadow.d.mts +2 -2
- package/es/Menu/Menu.d.mts +2 -2
- package/es/Mermaid/Mermaid.d.mts +2 -2
- package/es/Mermaid/SyntaxMermaid/index.d.mts +2 -2
- package/es/Modal/Modal.d.mts +2 -2
- package/es/Modal/ModalProvider.d.mts +2 -2
- package/es/Modal/imperative.d.mts +2 -2
- package/es/MotionProvider/index.d.mts +2 -2
- package/es/Popover/ArrowIcon.d.mts +2 -2
- package/es/Popover/atoms.d.mts +9 -9
- package/es/Popover/context.d.mts +2 -2
- package/es/SearchBar/SearchBar.d.mts +2 -2
- package/es/Segmented/Segmented.d.mts +2 -2
- package/es/Select/Select.d.mts +2 -2
- package/es/SideNav/SideNav.d.mts +2 -2
- package/es/SliderWithInput/SliderWithInput.d.mts +2 -2
- package/es/SortableList/components/DragHandle.d.mts +2 -2
- package/es/SortableList/components/SortableItem.d.mts +2 -2
- package/es/ThemeProvider/ThemeProvider.d.mts +2 -2
- package/es/Toc/Toc.d.mts +2 -2
- package/es/Video/index.d.mts +2 -2
- package/es/awesome/AuroraBackground/AuroraBackground.d.mts +2 -2
- package/es/awesome/BottomGradientButton/BottomGradientButton.d.mts +2 -2
- package/es/awesome/Features/Features.d.mts +2 -2
- package/es/awesome/Giscus/Giscus.d.mts +2 -2
- package/es/awesome/GradientButton/GradientButton.d.mts +2 -2
- package/es/awesome/GridBackground/GridBackground.d.mts +2 -2
- package/es/awesome/GridBackground/GridShowcase.d.mts +2 -2
- package/es/awesome/Hero/Hero.d.mts +2 -2
- package/es/awesome/Spline/Spine.d.mts +2 -2
- package/es/awesome/Spotlight/Spotlight.d.mts +2 -2
- package/es/awesome/SpotlightCard/SpotlightCard.d.mts +2 -2
- package/es/awesome/TypewriterEffect/TypewriterEffect.d.mts +2 -2
- package/es/base-ui/DropdownMenu/DropdownMenu.d.mts +2 -2
- package/es/base-ui/DropdownMenu/atoms.d.mts +18 -18
- package/es/base-ui/Modal/Modal.mjs +16 -4
- package/es/base-ui/Modal/Modal.mjs.map +1 -1
- package/es/base-ui/Modal/atoms.mjs +7 -4
- package/es/base-ui/Modal/atoms.mjs.map +1 -1
- package/es/base-ui/Modal/context.d.mts +2 -2
- package/es/base-ui/Modal/imperative.d.mts +2 -2
- package/es/base-ui/Modal/style.mjs +16 -0
- package/es/base-ui/Modal/style.mjs.map +1 -1
- package/es/base-ui/ScrollArea/atoms.d.mts +7 -7
- package/es/base-ui/Toast/imperative.d.mts +2 -2
- package/es/brand/LobeChat/index.d.mts +2 -2
- package/es/brand/LobeHub/index.d.mts +2 -2
- package/es/brand/LogoThree/LogoSpline.d.mts +2 -2
- package/es/brand/LogoThree/index.d.mts +2 -2
- package/es/chat/BackBottom/BackBottom.d.mts +2 -2
- package/es/chat/ChatInputArea/components/ChatInputAreaInner.d.mts +2 -2
- package/es/chat/ChatItem/ChatItem.d.mts +2 -2
- package/es/chat/ChatList/ChatList.d.mts +2 -2
- package/es/chat/EditableMessage/EditableMessage.d.mts +2 -2
- package/es/chat/EditableMessageList/EditableMessageList.d.mts +2 -2
- package/es/chat/MessageInput/MessageInput.d.mts +2 -2
- package/es/chat/MessageModal/MessageModal.d.mts +2 -2
- package/es/color/ColorScales/index.d.mts +2 -2
- package/es/color/CssVar/index.d.mts +2 -2
- package/es/i18n/context.d.mts +2 -2
- package/es/icons/lucideExtra/CreateBotIcon.d.mts +2 -2
- package/es/icons/lucideExtra/DiscordIcon.d.mts +2 -2
- package/es/icons/lucideExtra/GlobeOffIcon.d.mts +3 -3
- package/es/icons/lucideExtra/GroupBotIcon.d.mts +3 -3
- package/es/icons/lucideExtra/GroupBotSquareIcon.d.mts +3 -3
- package/es/icons/lucideExtra/LeftClickIcon.d.mts +3 -3
- package/es/icons/lucideExtra/LeftDoubleClickIcon.d.mts +3 -3
- package/es/icons/lucideExtra/McpIcon.d.mts +3 -3
- package/es/icons/lucideExtra/ProviderIcon.d.mts +3 -3
- package/es/icons/lucideExtra/RightClickIcon.d.mts +3 -3
- package/es/icons/lucideExtra/RightDoubleClickIcon.d.mts +3 -3
- package/es/icons/lucideExtra/ShapesUploadIcon.d.mts +3 -3
- package/es/icons/lucideExtra/SkillsIcon.d.mts +3 -3
- package/es/icons/lucideExtra/TreeDownRightIcon.d.mts +3 -3
- package/es/icons/lucideExtra/TreeUpDownRightIcon.d.mts +3 -3
- package/es/mdx/Mdx/index.d.mts +2 -2
- package/es/mobile/ChatHeader/ChatHeaderTitle.d.mts +2 -2
- package/es/mobile/ChatInputArea/components/ChatSendButton.d.mts +2 -2
- package/es/mobile/TabBar/TabBar.d.mts +2 -2
- package/es/storybook/StoryBook/index.d.mts +2 -2
- package/package.json +1 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { SpotlightCardProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react137 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/awesome/SpotlightCard/SpotlightCard.d.ts
|
|
5
|
-
declare const SpotlightCard:
|
|
5
|
+
declare const SpotlightCard: react137.NamedExoticComponent<SpotlightCardProps<any>>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { SpotlightCard };
|
|
8
8
|
//# sourceMappingURL=SpotlightCard.d.mts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { TypewriterEffectProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react140 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/awesome/TypewriterEffect/TypewriterEffect.d.ts
|
|
5
|
-
declare const TypewriterEffect:
|
|
5
|
+
declare const TypewriterEffect: react140.NamedExoticComponent<TypewriterEffectProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { TypewriterEffect };
|
|
8
8
|
//# sourceMappingURL=TypewriterEffect.d.mts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { DropdownMenuProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react149 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/base-ui/DropdownMenu/DropdownMenu.d.ts
|
|
5
|
-
declare const DropdownMenu:
|
|
5
|
+
declare const DropdownMenu: react149.NamedExoticComponent<DropdownMenuProps<unknown>>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { DropdownMenu };
|
|
8
8
|
//# sourceMappingURL=DropdownMenu.d.mts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DropdownMenuPlacement } from "./type.mjs";
|
|
2
2
|
import React from "react";
|
|
3
|
-
import * as
|
|
3
|
+
import * as react_jsx_runtime26 from "react/jsx-runtime";
|
|
4
4
|
import * as _base_ui_react_menu0 from "@base-ui/react/menu";
|
|
5
5
|
import { Menu } from "@base-ui/react/menu";
|
|
6
6
|
|
|
@@ -18,7 +18,7 @@ declare const DropdownMenuTrigger: {
|
|
|
18
18
|
nativeButton,
|
|
19
19
|
ref: refProp,
|
|
20
20
|
...rest
|
|
21
|
-
}: DropdownMenuTriggerProps):
|
|
21
|
+
}: DropdownMenuTriggerProps): react_jsx_runtime26.JSX.Element;
|
|
22
22
|
displayName: string;
|
|
23
23
|
};
|
|
24
24
|
type DropdownMenuPortalProps = React.ComponentProps<typeof Menu.Portal> & {
|
|
@@ -31,7 +31,7 @@ declare const DropdownMenuPortal: {
|
|
|
31
31
|
({
|
|
32
32
|
container,
|
|
33
33
|
...rest
|
|
34
|
-
}: DropdownMenuPortalProps):
|
|
34
|
+
}: DropdownMenuPortalProps): react_jsx_runtime26.JSX.Element;
|
|
35
35
|
displayName: string;
|
|
36
36
|
};
|
|
37
37
|
type DropdownMenuPositionerProps = React.ComponentProps<typeof Menu.Positioner> & {
|
|
@@ -48,7 +48,7 @@ declare const DropdownMenuPositioner: {
|
|
|
48
48
|
sideOffset,
|
|
49
49
|
children,
|
|
50
50
|
...rest
|
|
51
|
-
}: DropdownMenuPositionerProps):
|
|
51
|
+
}: DropdownMenuPositionerProps): react_jsx_runtime26.JSX.Element;
|
|
52
52
|
displayName: string;
|
|
53
53
|
};
|
|
54
54
|
type DropdownMenuPopupProps = React.ComponentProps<typeof Menu.Popup>;
|
|
@@ -56,7 +56,7 @@ declare const DropdownMenuPopup: {
|
|
|
56
56
|
({
|
|
57
57
|
className,
|
|
58
58
|
...rest
|
|
59
|
-
}: DropdownMenuPopupProps):
|
|
59
|
+
}: DropdownMenuPopupProps): react_jsx_runtime26.JSX.Element;
|
|
60
60
|
displayName: string;
|
|
61
61
|
};
|
|
62
62
|
type DropdownMenuItemProps = React.ComponentProps<typeof Menu.Item> & {
|
|
@@ -67,7 +67,7 @@ declare const DropdownMenuItem: {
|
|
|
67
67
|
className,
|
|
68
68
|
danger,
|
|
69
69
|
...rest
|
|
70
|
-
}: DropdownMenuItemProps):
|
|
70
|
+
}: DropdownMenuItemProps): react_jsx_runtime26.JSX.Element;
|
|
71
71
|
displayName: string;
|
|
72
72
|
};
|
|
73
73
|
type DropdownMenuCheckboxItemProps = React.ComponentProps<typeof Menu.CheckboxItem> & {
|
|
@@ -78,7 +78,7 @@ declare const DropdownMenuCheckboxItemPrimitive: {
|
|
|
78
78
|
className,
|
|
79
79
|
danger,
|
|
80
80
|
...rest
|
|
81
|
-
}: DropdownMenuCheckboxItemProps):
|
|
81
|
+
}: DropdownMenuCheckboxItemProps): react_jsx_runtime26.JSX.Element;
|
|
82
82
|
displayName: string;
|
|
83
83
|
};
|
|
84
84
|
type DropdownMenuSeparatorProps = React.ComponentProps<typeof Menu.Separator>;
|
|
@@ -86,7 +86,7 @@ declare const DropdownMenuSeparator: {
|
|
|
86
86
|
({
|
|
87
87
|
className,
|
|
88
88
|
...rest
|
|
89
|
-
}: DropdownMenuSeparatorProps):
|
|
89
|
+
}: DropdownMenuSeparatorProps): react_jsx_runtime26.JSX.Element;
|
|
90
90
|
displayName: string;
|
|
91
91
|
};
|
|
92
92
|
declare const DropdownMenuGroup: React.ForwardRefExoticComponent<_base_ui_react_menu0.MenuGroupProps & React.RefAttributes<Element>>;
|
|
@@ -95,7 +95,7 @@ declare const DropdownMenuGroupLabel: {
|
|
|
95
95
|
({
|
|
96
96
|
className,
|
|
97
97
|
...rest
|
|
98
|
-
}: DropdownMenuGroupLabelProps):
|
|
98
|
+
}: DropdownMenuGroupLabelProps): react_jsx_runtime26.JSX.Element;
|
|
99
99
|
displayName: string;
|
|
100
100
|
};
|
|
101
101
|
type DropdownMenuSubmenuTriggerProps = React.ComponentProps<typeof Menu.SubmenuTrigger> & {
|
|
@@ -106,7 +106,7 @@ declare const DropdownMenuSubmenuTrigger: {
|
|
|
106
106
|
className,
|
|
107
107
|
danger,
|
|
108
108
|
...rest
|
|
109
|
-
}: DropdownMenuSubmenuTriggerProps):
|
|
109
|
+
}: DropdownMenuSubmenuTriggerProps): react_jsx_runtime26.JSX.Element;
|
|
110
110
|
displayName: string;
|
|
111
111
|
};
|
|
112
112
|
type DropdownMenuItemContentProps = React.HTMLAttributes<HTMLDivElement>;
|
|
@@ -114,7 +114,7 @@ declare const DropdownMenuItemContent: {
|
|
|
114
114
|
({
|
|
115
115
|
className,
|
|
116
116
|
...rest
|
|
117
|
-
}: DropdownMenuItemContentProps):
|
|
117
|
+
}: DropdownMenuItemContentProps): react_jsx_runtime26.JSX.Element;
|
|
118
118
|
displayName: string;
|
|
119
119
|
};
|
|
120
120
|
type DropdownMenuItemIconProps = React.HTMLAttributes<HTMLSpanElement>;
|
|
@@ -122,7 +122,7 @@ declare const DropdownMenuItemIcon: {
|
|
|
122
122
|
({
|
|
123
123
|
className,
|
|
124
124
|
...rest
|
|
125
|
-
}: DropdownMenuItemIconProps):
|
|
125
|
+
}: DropdownMenuItemIconProps): react_jsx_runtime26.JSX.Element;
|
|
126
126
|
displayName: string;
|
|
127
127
|
};
|
|
128
128
|
type DropdownMenuItemLabelGroupProps = React.HTMLAttributes<HTMLDivElement>;
|
|
@@ -130,7 +130,7 @@ declare const DropdownMenuItemLabelGroup: {
|
|
|
130
130
|
({
|
|
131
131
|
className,
|
|
132
132
|
...rest
|
|
133
|
-
}: DropdownMenuItemLabelGroupProps):
|
|
133
|
+
}: DropdownMenuItemLabelGroupProps): react_jsx_runtime26.JSX.Element;
|
|
134
134
|
displayName: string;
|
|
135
135
|
};
|
|
136
136
|
type DropdownMenuItemLabelProps = React.HTMLAttributes<HTMLSpanElement>;
|
|
@@ -138,7 +138,7 @@ declare const DropdownMenuItemLabel: {
|
|
|
138
138
|
({
|
|
139
139
|
className,
|
|
140
140
|
...rest
|
|
141
|
-
}: DropdownMenuItemLabelProps):
|
|
141
|
+
}: DropdownMenuItemLabelProps): react_jsx_runtime26.JSX.Element;
|
|
142
142
|
displayName: string;
|
|
143
143
|
};
|
|
144
144
|
type DropdownMenuItemDescProps = React.HTMLAttributes<HTMLSpanElement>;
|
|
@@ -146,7 +146,7 @@ declare const DropdownMenuItemDesc: {
|
|
|
146
146
|
({
|
|
147
147
|
className,
|
|
148
148
|
...rest
|
|
149
|
-
}: DropdownMenuItemDescProps):
|
|
149
|
+
}: DropdownMenuItemDescProps): react_jsx_runtime26.JSX.Element;
|
|
150
150
|
displayName: string;
|
|
151
151
|
};
|
|
152
152
|
type DropdownMenuItemExtraProps = React.HTMLAttributes<HTMLSpanElement>;
|
|
@@ -154,7 +154,7 @@ declare const DropdownMenuItemExtra: {
|
|
|
154
154
|
({
|
|
155
155
|
className,
|
|
156
156
|
...rest
|
|
157
|
-
}: DropdownMenuItemExtraProps):
|
|
157
|
+
}: DropdownMenuItemExtraProps): react_jsx_runtime26.JSX.Element;
|
|
158
158
|
displayName: string;
|
|
159
159
|
};
|
|
160
160
|
type DropdownMenuSubmenuArrowProps = React.HTMLAttributes<HTMLSpanElement>;
|
|
@@ -162,7 +162,7 @@ declare const DropdownMenuSubmenuArrow: {
|
|
|
162
162
|
({
|
|
163
163
|
className,
|
|
164
164
|
...rest
|
|
165
|
-
}: DropdownMenuSubmenuArrowProps):
|
|
165
|
+
}: DropdownMenuSubmenuArrowProps): react_jsx_runtime26.JSX.Element;
|
|
166
166
|
displayName: string;
|
|
167
167
|
};
|
|
168
168
|
type DropdownMenuSwitchItemProps = Omit<React.ComponentProps<typeof Menu.Item>, 'onClick'> & {
|
|
@@ -183,7 +183,7 @@ declare const DropdownMenuSwitchItem: {
|
|
|
183
183
|
onCheckedChange,
|
|
184
184
|
children,
|
|
185
185
|
...rest
|
|
186
|
-
}: DropdownMenuSwitchItemProps):
|
|
186
|
+
}: DropdownMenuSwitchItemProps): react_jsx_runtime26.JSX.Element;
|
|
187
187
|
displayName: string;
|
|
188
188
|
};
|
|
189
189
|
//#endregion
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
import { stopPropagation } from "../../utils/dom.mjs";
|
|
4
4
|
import { styles } from "./style.mjs";
|
|
5
5
|
import { ModalBackdrop, ModalContent, ModalFooter, ModalHeader, ModalPopup, ModalPortal, ModalRoot, ModalTitle } from "./atoms.mjs";
|
|
6
|
-
import { memo, useCallback, useMemo, useRef, useState } from "react";
|
|
6
|
+
import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
7
7
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
8
8
|
import { cx } from "antd-style";
|
|
9
9
|
import { useDragControls } from "motion/react";
|
|
@@ -42,16 +42,28 @@ const Modal = memo(({ open, title, children, onOk, onCancel, okText = "OK", canc
|
|
|
42
42
|
const constraintsRef = useRef(null);
|
|
43
43
|
const [isFullscreen, setIsFullscreen] = useState(false);
|
|
44
44
|
const [isDragging, setIsDragging] = useState(false);
|
|
45
|
+
const [isDenying, setIsDenying] = useState(false);
|
|
46
|
+
const denyTimerRef = useRef(void 0);
|
|
47
|
+
useEffect(() => () => clearTimeout(denyTimerRef.current), []);
|
|
48
|
+
const triggerDeny = useCallback(() => {
|
|
49
|
+
clearTimeout(denyTimerRef.current);
|
|
50
|
+
setIsDenying(true);
|
|
51
|
+
denyTimerRef.current = setTimeout(() => setIsDenying(false), 400);
|
|
52
|
+
}, []);
|
|
45
53
|
const handleOpenChange = useCallback((nextOpen, eventDetails) => {
|
|
46
54
|
if (!open) return;
|
|
47
55
|
if (!nextOpen && keyboard === false && eventDetails.reason === "escape-key") return;
|
|
48
|
-
if (!nextOpen && !maskClosable && eventDetails.reason === "outside-press")
|
|
56
|
+
if (!nextOpen && !maskClosable && eventDetails.reason === "outside-press") {
|
|
57
|
+
triggerDeny();
|
|
58
|
+
return;
|
|
59
|
+
}
|
|
49
60
|
if (!nextOpen) onCancel?.(new MouseEvent("click"));
|
|
50
61
|
}, [
|
|
51
62
|
onCancel,
|
|
52
63
|
keyboard,
|
|
53
64
|
maskClosable,
|
|
54
|
-
open
|
|
65
|
+
open,
|
|
66
|
+
triggerDeny
|
|
55
67
|
]);
|
|
56
68
|
const handleExitComplete = useCallback(() => {
|
|
57
69
|
setIsFullscreen(false);
|
|
@@ -147,7 +159,6 @@ const Modal = memo(({ open, title, children, onOk, onCancel, okText = "OK", canc
|
|
|
147
159
|
}
|
|
148
160
|
}), /* @__PURE__ */ jsxs(ModalPopup, {
|
|
149
161
|
className: classNames?.wrapper,
|
|
150
|
-
panelClassName: cx(className, isFullscreen && styles.fullscreenPopupInner),
|
|
151
162
|
popupStyle: {
|
|
152
163
|
...popupZIndex,
|
|
153
164
|
...semanticStyles?.wrapper
|
|
@@ -159,6 +170,7 @@ const Modal = memo(({ open, title, children, onOk, onCancel, okText = "OK", canc
|
|
|
159
170
|
...dragProps,
|
|
160
171
|
onAnimationComplete: handleAnimationComplete
|
|
161
172
|
},
|
|
173
|
+
panelClassName: cx(className, isFullscreen && styles.fullscreenPopupInner, isDenying && styles.denyAnimation),
|
|
162
174
|
children: [
|
|
163
175
|
showHeader && /* @__PURE__ */ jsxs(ModalHeader, {
|
|
164
176
|
className: cx(classNames?.header, shouldDrag && styles.headerDraggable),
|
|
@@ -1 +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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"}
|
|
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, useEffect, 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 const [isDenying, setIsDenying] = useState(false);\n const denyTimerRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n useEffect(() => () => clearTimeout(denyTimerRef.current), []);\n\n const triggerDeny = useCallback(() => {\n clearTimeout(denyTimerRef.current);\n setIsDenying(true);\n denyTimerRef.current = setTimeout(() => setIsDenying(false), 400);\n }, []);\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') {\n triggerDeny();\n return;\n }\n if (!nextOpen) {\n onCancel?.(new MouseEvent('click') as unknown as MouseEvent<HTMLButtonElement>);\n }\n },\n [onCancel, keyboard, maskClosable, open, triggerDeny],\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 popupStyle={{ ...popupZIndex, ...semanticStyles?.wrapper }}\n ref={constraintsRef}\n style={panelStyle}\n width={isFullscreen ? undefined : width}\n motionProps={{\n ...dragProps,\n onAnimationComplete: handleAnimationComplete,\n }}\n panelClassName={cx(\n className,\n isFullscreen && styles.fullscreenPopupInner,\n isDenying && styles.denyAnimation,\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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"}
|
|
@@ -72,15 +72,18 @@ const ModalViewport = ({ className, ...rest }) => /* @__PURE__ */ jsx(Dialog.Vie
|
|
|
72
72
|
const ModalBackdrop = ({ className, style, ...rest }) => {
|
|
73
73
|
const open = useModalOpen();
|
|
74
74
|
const Motion = useMotionComponent();
|
|
75
|
-
if (open !== null) return /* @__PURE__ */ jsx(
|
|
76
|
-
|
|
75
|
+
if (open !== null) return /* @__PURE__ */ jsx(Dialog.Backdrop, {
|
|
76
|
+
...rest,
|
|
77
77
|
className: cx(styles.backdrop, className),
|
|
78
|
-
initial: { opacity: 0 },
|
|
79
78
|
style: {
|
|
80
79
|
...style,
|
|
81
80
|
transition: "none"
|
|
82
81
|
},
|
|
83
|
-
|
|
82
|
+
render: /* @__PURE__ */ jsx(Motion.div, {
|
|
83
|
+
animate: { opacity: open ? 1 : 0 },
|
|
84
|
+
initial: { opacity: 0 },
|
|
85
|
+
transition: backdropTransition
|
|
86
|
+
})
|
|
84
87
|
});
|
|
85
88
|
return /* @__PURE__ */ jsx(Dialog.Backdrop, {
|
|
86
89
|
...rest,
|
|
@@ -1 +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":"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"}
|
|
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 <Dialog.Backdrop\n {...rest}\n className={cx(styles.backdrop, className as string)}\n style={{ ...style, transition: 'none' }}\n render={\n <Motion.div\n animate={{ opacity: open ? 1 : 0 }}\n initial={{ opacity: 0 }}\n transition={backdropTransition}\n />\n }\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":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { ModalContextValue } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react151 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/base-ui/Modal/context.d.ts
|
|
5
|
-
declare const ModalContext:
|
|
5
|
+
declare const ModalContext: react151.Context<ModalContextValue>;
|
|
6
6
|
declare const useModalContext: () => ModalContextValue;
|
|
7
7
|
//#endregion
|
|
8
8
|
export { ModalContext, useModalContext };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ImperativeModalProps, ModalConfirmConfig, ModalInstance } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react152 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/base-ui/Modal/imperative.d.ts
|
|
5
5
|
interface ModalHostProps {
|
|
@@ -14,7 +14,7 @@ interface ModalSystem {
|
|
|
14
14
|
ModalHost: React.FC<ModalHostProps>;
|
|
15
15
|
}
|
|
16
16
|
declare function createModalSystem(): ModalSystem;
|
|
17
|
-
declare const ModalHost:
|
|
17
|
+
declare const ModalHost: react152.FC<ModalHostProps>;
|
|
18
18
|
declare const createModal: (props: ImperativeModalProps) => ModalInstance;
|
|
19
19
|
declare const confirmModal: (config: ModalConfirmConfig) => {
|
|
20
20
|
close: () => void;
|
|
@@ -281,6 +281,22 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
|
|
|
281
281
|
border-color: ${cssVar$1.colorPrimaryActive};
|
|
282
282
|
background: ${cssVar$1.colorPrimaryActive};
|
|
283
283
|
}
|
|
284
|
+
`,
|
|
285
|
+
denyAnimation: css$1`
|
|
286
|
+
@keyframes modal-deny {
|
|
287
|
+
0% {
|
|
288
|
+
outline-color: ${cssVar$1.colorPrimary};
|
|
289
|
+
outline-offset: 0;
|
|
290
|
+
}
|
|
291
|
+
|
|
292
|
+
100% {
|
|
293
|
+
outline-color: transparent;
|
|
294
|
+
outline-offset: 4px;
|
|
295
|
+
}
|
|
296
|
+
}
|
|
297
|
+
|
|
298
|
+
outline: 2px solid transparent;
|
|
299
|
+
animation: modal-deny 400ms ease-out;
|
|
284
300
|
`,
|
|
285
301
|
viewport: css$1`
|
|
286
302
|
position: fixed;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","names":["cssVar"],"sources":["../../../src/base-ui/Modal/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n backdrop: css`\n position: fixed;\n z-index: 1000;\n inset: 0;\n\n background: color-mix(in srgb, ${cssVar.colorBgContainer} 60%, transparent);\n\n transition: opacity 150ms ease-out;\n\n &[data-starting-style],\n &[data-ending-style] {\n opacity: 0;\n }\n `,\n\n close: css`\n cursor: pointer;\n\n position: absolute;\n inset-block-start: 12px;\n inset-inline-end: 12px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n width: 32px;\n height: 32px;\n padding: 0;\n border: none;\n border-radius: ${cssVar.borderRadiusSM};\n\n color: ${cssVar.colorTextTertiary};\n\n background: transparent;\n\n transition: all 150ms ease-out;\n\n &:hover {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillSecondary};\n }\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n `,\n\n closeInline: css`\n cursor: pointer;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n width: 32px;\n height: 32px;\n padding: 0;\n border: none;\n border-radius: ${cssVar.borderRadiusSM};\n\n color: ${cssVar.colorTextTertiary};\n\n background: transparent;\n\n transition: all 150ms ease-out;\n\n &:hover {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillSecondary};\n }\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n `,\n\n content: css`\n overflow: hidden auto;\n padding-block: 12px;\n padding-inline: 16px;\n `,\n\n footer: css`\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: flex-end;\n\n padding-block: 12px;\n padding-inline: 16px;\n border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n `,\n\n header: css`\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n padding-block: 12px;\n padding-inline: 16px;\n border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n `,\n\n headerDraggable: css`\n cursor: default;\n user-select: none;\n `,\n\n popup: css`\n pointer-events: none;\n\n position: fixed;\n z-index: 1001;\n inset: 0;\n\n display: flex;\n align-items: center;\n justify-content: center;\n `,\n\n popupInner: css`\n pointer-events: auto;\n\n position: relative;\n\n display: flex;\n flex-direction: column;\n\n box-sizing: border-box;\n width: calc(100% - 32px);\n max-width: 520px;\n max-height: calc(100dvh - 64px);\n border: 1px solid ${cssVar.colorBorderSecondary};\n border-radius: 12px;\n\n background: ${cssVar.colorBgContainer};\n box-shadow: ${cssVar.boxShadow};\n\n transition:\n transform 150ms cubic-bezier(0.22, 1, 0.36, 1),\n opacity 150ms ease-out;\n\n &[data-starting-style],\n &[data-ending-style] {\n transform: scale(0.96) translateY(4px);\n opacity: 0;\n }\n `,\n\n title: css`\n margin: 0;\n\n font-size: 16px;\n font-weight: 600;\n line-height: 1.5;\n color: ${cssVar.colorText};\n `,\n\n buttonBase: css`\n cursor: pointer;\n\n display: inline-flex;\n gap: 6px;\n align-items: center;\n justify-content: center;\n\n height: 36px;\n padding-block: 0;\n padding-inline: 16px;\n border: 1px solid ${cssVar.colorBorder};\n border-radius: ${cssVar.borderRadiusSM};\n\n font-size: 14px;\n font-weight: 500;\n line-height: 1;\n\n transition: all 150ms ease-out;\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n `,\n\n cancelButton: css`\n color: ${cssVar.colorText};\n background: ${cssVar.colorBgContainer};\n\n &:hover:not(:disabled) {\n border-color: ${cssVar.colorPrimaryBorder};\n color: ${cssVar.colorPrimaryText};\n }\n `,\n\n loadingSpinner: css`\n @keyframes modal-spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n display: inline-block;\n\n width: 14px;\n height: 14px;\n border: 2px solid currentcolor;\n border-block-start-color: transparent;\n border-radius: 50%;\n\n animation: modal-spin 0.6s linear infinite;\n `,\n\n dangerOkButton: css`\n border-color: ${cssVar.colorError};\n color: #fff;\n background: ${cssVar.colorError};\n\n &:hover:not(:disabled) {\n border-color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorErrorHover};\n }\n\n &:active:not(:disabled) {\n border-color: ${cssVar.colorErrorActive};\n background: ${cssVar.colorErrorActive};\n }\n `,\n\n fullscreenPopupInner: css`\n width: 100% !important;\n max-width: 100% !important;\n height: 100dvh !important;\n max-height: 100dvh !important;\n border: none;\n border-radius: 0;\n `,\n\n fullscreenToggle: css`\n cursor: pointer;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n width: 28px;\n height: 28px;\n padding: 0;\n border: none;\n border-radius: ${cssVar.borderRadiusSM};\n\n color: ${cssVar.colorTextTertiary};\n\n background: transparent;\n\n transition: all 150ms ease-out;\n\n &:hover {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillSecondary};\n }\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n `,\n\n headerActions: css`\n display: flex;\n gap: 4px;\n align-items: center;\n margin-inline-end: -4px;\n `,\n\n okButton: css`\n border-color: ${cssVar.colorPrimary};\n color: #fff;\n background: ${cssVar.colorPrimary};\n\n &:hover:not(:disabled) {\n border-color: ${cssVar.colorPrimaryHover};\n background: ${cssVar.colorPrimaryHover};\n }\n\n &:active:not(:disabled) {\n border-color: ${cssVar.colorPrimaryActive};\n background: ${cssVar.colorPrimaryActive};\n }\n `,\n\n viewport: css`\n position: fixed;\n z-index: 1000;\n inset: 0;\n overflow: auto;\n `,\n}));\n"],"mappings":";;;AAEA,MAAa,SAAS,oBAAoB,EAAE,YAAK,wBAAc;CAC7D,UAAU,KAAG;;;;;qCAKsBA,SAAO,iBAAiB;;;;;;;;;CAU3D,OAAO,KAAG;;;;;;;;;;;;;;;qBAeSA,SAAO,eAAe;;aAE9BA,SAAO,kBAAkB;;;;;;;eAOvBA,SAAO,UAAU;oBACZA,SAAO,mBAAmB;;;;2BAInBA,SAAO,mBAAmB;;;;CAKnD,aAAa,KAAG;;;;;;;;;;;qBAWGA,SAAO,eAAe;;aAE9BA,SAAO,kBAAkB;;;;;;;eAOvBA,SAAO,UAAU;oBACZA,SAAO,mBAAmB;;;;2BAInBA,SAAO,mBAAmB;;;;CAKnD,SAAS,KAAG;;;;;CAMZ,QAAQ,KAAG;;;;;;;;oCAQuBA,SAAO,qBAAqB;;CAG9D,QAAQ,KAAG;;;;;;;kCAOqBA,SAAO,qBAAqB;;CAG5D,iBAAiB,KAAG;;;;CAKpB,OAAO,KAAG;;;;;;;;;;;CAYV,YAAY,KAAG;;;;;;;;;;;;wBAYOA,SAAO,qBAAqB;;;kBAGlCA,SAAO,iBAAiB;kBACxBA,SAAO,UAAU;;;;;;;;;;;;CAajC,OAAO,KAAG;;;;;;aAMCA,SAAO,UAAU;;CAG5B,YAAY,KAAG;;;;;;;;;;;wBAWOA,SAAO,YAAY;qBACtBA,SAAO,eAAe;;;;;;;;;2BAShBA,SAAO,mBAAmB;;;;;;;;;CAUnD,cAAc,KAAG;aACNA,SAAO,UAAU;kBACZA,SAAO,iBAAiB;;;sBAGpBA,SAAO,mBAAmB;eACjCA,SAAO,iBAAiB;;;CAIrC,gBAAgB,KAAG;;;;;;;;;;;;;;;;;CAkBnB,gBAAgB,KAAG;oBACDA,SAAO,WAAW;;kBAEpBA,SAAO,WAAW;;;sBAGdA,SAAO,gBAAgB;oBACzBA,SAAO,gBAAgB;;;;sBAIrBA,SAAO,iBAAiB;oBAC1BA,SAAO,iBAAiB;;;CAI1C,sBAAsB,KAAG;;;;;;;;CASzB,kBAAkB,KAAG;;;;;;;;;;;qBAWFA,SAAO,eAAe;;aAE9BA,SAAO,kBAAkB;;;;;;;eAOvBA,SAAO,UAAU;oBACZA,SAAO,mBAAmB;;;;2BAInBA,SAAO,mBAAmB;;;;CAKnD,eAAe,KAAG;;;;;;CAOlB,UAAU,KAAG;oBACKA,SAAO,aAAa;;kBAEtBA,SAAO,aAAa;;;sBAGhBA,SAAO,kBAAkB;oBAC3BA,SAAO,kBAAkB;;;;sBAIvBA,SAAO,mBAAmB;oBAC5BA,SAAO,mBAAmB;;;CAI5C,UAAU,KAAG;;;;;;CAMd,EAAE"}
|
|
1
|
+
{"version":3,"file":"style.mjs","names":["cssVar"],"sources":["../../../src/base-ui/Modal/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n backdrop: css`\n position: fixed;\n z-index: 1000;\n inset: 0;\n\n background: color-mix(in srgb, ${cssVar.colorBgContainer} 60%, transparent);\n\n transition: opacity 150ms ease-out;\n\n &[data-starting-style],\n &[data-ending-style] {\n opacity: 0;\n }\n `,\n\n close: css`\n cursor: pointer;\n\n position: absolute;\n inset-block-start: 12px;\n inset-inline-end: 12px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n width: 32px;\n height: 32px;\n padding: 0;\n border: none;\n border-radius: ${cssVar.borderRadiusSM};\n\n color: ${cssVar.colorTextTertiary};\n\n background: transparent;\n\n transition: all 150ms ease-out;\n\n &:hover {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillSecondary};\n }\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n `,\n\n closeInline: css`\n cursor: pointer;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n width: 32px;\n height: 32px;\n padding: 0;\n border: none;\n border-radius: ${cssVar.borderRadiusSM};\n\n color: ${cssVar.colorTextTertiary};\n\n background: transparent;\n\n transition: all 150ms ease-out;\n\n &:hover {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillSecondary};\n }\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n `,\n\n content: css`\n overflow: hidden auto;\n padding-block: 12px;\n padding-inline: 16px;\n `,\n\n footer: css`\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: flex-end;\n\n padding-block: 12px;\n padding-inline: 16px;\n border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n `,\n\n header: css`\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n padding-block: 12px;\n padding-inline: 16px;\n border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n `,\n\n headerDraggable: css`\n cursor: default;\n user-select: none;\n `,\n\n popup: css`\n pointer-events: none;\n\n position: fixed;\n z-index: 1001;\n inset: 0;\n\n display: flex;\n align-items: center;\n justify-content: center;\n `,\n\n popupInner: css`\n pointer-events: auto;\n\n position: relative;\n\n display: flex;\n flex-direction: column;\n\n box-sizing: border-box;\n width: calc(100% - 32px);\n max-width: 520px;\n max-height: calc(100dvh - 64px);\n border: 1px solid ${cssVar.colorBorderSecondary};\n border-radius: 12px;\n\n background: ${cssVar.colorBgContainer};\n box-shadow: ${cssVar.boxShadow};\n\n transition:\n transform 150ms cubic-bezier(0.22, 1, 0.36, 1),\n opacity 150ms ease-out;\n\n &[data-starting-style],\n &[data-ending-style] {\n transform: scale(0.96) translateY(4px);\n opacity: 0;\n }\n `,\n\n title: css`\n margin: 0;\n\n font-size: 16px;\n font-weight: 600;\n line-height: 1.5;\n color: ${cssVar.colorText};\n `,\n\n buttonBase: css`\n cursor: pointer;\n\n display: inline-flex;\n gap: 6px;\n align-items: center;\n justify-content: center;\n\n height: 36px;\n padding-block: 0;\n padding-inline: 16px;\n border: 1px solid ${cssVar.colorBorder};\n border-radius: ${cssVar.borderRadiusSM};\n\n font-size: 14px;\n font-weight: 500;\n line-height: 1;\n\n transition: all 150ms ease-out;\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n\n &:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n `,\n\n cancelButton: css`\n color: ${cssVar.colorText};\n background: ${cssVar.colorBgContainer};\n\n &:hover:not(:disabled) {\n border-color: ${cssVar.colorPrimaryBorder};\n color: ${cssVar.colorPrimaryText};\n }\n `,\n\n loadingSpinner: css`\n @keyframes modal-spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n display: inline-block;\n\n width: 14px;\n height: 14px;\n border: 2px solid currentcolor;\n border-block-start-color: transparent;\n border-radius: 50%;\n\n animation: modal-spin 0.6s linear infinite;\n `,\n\n dangerOkButton: css`\n border-color: ${cssVar.colorError};\n color: #fff;\n background: ${cssVar.colorError};\n\n &:hover:not(:disabled) {\n border-color: ${cssVar.colorErrorHover};\n background: ${cssVar.colorErrorHover};\n }\n\n &:active:not(:disabled) {\n border-color: ${cssVar.colorErrorActive};\n background: ${cssVar.colorErrorActive};\n }\n `,\n\n fullscreenPopupInner: css`\n width: 100% !important;\n max-width: 100% !important;\n height: 100dvh !important;\n max-height: 100dvh !important;\n border: none;\n border-radius: 0;\n `,\n\n fullscreenToggle: css`\n cursor: pointer;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n width: 28px;\n height: 28px;\n padding: 0;\n border: none;\n border-radius: ${cssVar.borderRadiusSM};\n\n color: ${cssVar.colorTextTertiary};\n\n background: transparent;\n\n transition: all 150ms ease-out;\n\n &:hover {\n color: ${cssVar.colorText};\n background: ${cssVar.colorFillSecondary};\n }\n\n &:focus-visible {\n outline: 2px solid ${cssVar.colorPrimaryBorder};\n outline-offset: 1px;\n }\n `,\n\n headerActions: css`\n display: flex;\n gap: 4px;\n align-items: center;\n margin-inline-end: -4px;\n `,\n\n okButton: css`\n border-color: ${cssVar.colorPrimary};\n color: #fff;\n background: ${cssVar.colorPrimary};\n\n &:hover:not(:disabled) {\n border-color: ${cssVar.colorPrimaryHover};\n background: ${cssVar.colorPrimaryHover};\n }\n\n &:active:not(:disabled) {\n border-color: ${cssVar.colorPrimaryActive};\n background: ${cssVar.colorPrimaryActive};\n }\n `,\n\n denyAnimation: css`\n @keyframes modal-deny {\n 0% {\n outline-color: ${cssVar.colorPrimary};\n outline-offset: 0;\n }\n\n 100% {\n outline-color: transparent;\n outline-offset: 4px;\n }\n }\n\n outline: 2px solid transparent;\n animation: modal-deny 400ms ease-out;\n `,\n\n viewport: css`\n position: fixed;\n z-index: 1000;\n inset: 0;\n overflow: auto;\n `,\n}));\n"],"mappings":";;;AAEA,MAAa,SAAS,oBAAoB,EAAE,YAAK,wBAAc;CAC7D,UAAU,KAAG;;;;;qCAKsBA,SAAO,iBAAiB;;;;;;;;;CAU3D,OAAO,KAAG;;;;;;;;;;;;;;;qBAeSA,SAAO,eAAe;;aAE9BA,SAAO,kBAAkB;;;;;;;eAOvBA,SAAO,UAAU;oBACZA,SAAO,mBAAmB;;;;2BAInBA,SAAO,mBAAmB;;;;CAKnD,aAAa,KAAG;;;;;;;;;;;qBAWGA,SAAO,eAAe;;aAE9BA,SAAO,kBAAkB;;;;;;;eAOvBA,SAAO,UAAU;oBACZA,SAAO,mBAAmB;;;;2BAInBA,SAAO,mBAAmB;;;;CAKnD,SAAS,KAAG;;;;;CAMZ,QAAQ,KAAG;;;;;;;;oCAQuBA,SAAO,qBAAqB;;CAG9D,QAAQ,KAAG;;;;;;;kCAOqBA,SAAO,qBAAqB;;CAG5D,iBAAiB,KAAG;;;;CAKpB,OAAO,KAAG;;;;;;;;;;;CAYV,YAAY,KAAG;;;;;;;;;;;;wBAYOA,SAAO,qBAAqB;;;kBAGlCA,SAAO,iBAAiB;kBACxBA,SAAO,UAAU;;;;;;;;;;;;CAajC,OAAO,KAAG;;;;;;aAMCA,SAAO,UAAU;;CAG5B,YAAY,KAAG;;;;;;;;;;;wBAWOA,SAAO,YAAY;qBACtBA,SAAO,eAAe;;;;;;;;;2BAShBA,SAAO,mBAAmB;;;;;;;;;CAUnD,cAAc,KAAG;aACNA,SAAO,UAAU;kBACZA,SAAO,iBAAiB;;;sBAGpBA,SAAO,mBAAmB;eACjCA,SAAO,iBAAiB;;;CAIrC,gBAAgB,KAAG;;;;;;;;;;;;;;;;;CAkBnB,gBAAgB,KAAG;oBACDA,SAAO,WAAW;;kBAEpBA,SAAO,WAAW;;;sBAGdA,SAAO,gBAAgB;oBACzBA,SAAO,gBAAgB;;;;sBAIrBA,SAAO,iBAAiB;oBAC1BA,SAAO,iBAAiB;;;CAI1C,sBAAsB,KAAG;;;;;;;;CASzB,kBAAkB,KAAG;;;;;;;;;;;qBAWFA,SAAO,eAAe;;aAE9BA,SAAO,kBAAkB;;;;;;;eAOvBA,SAAO,UAAU;oBACZA,SAAO,mBAAmB;;;;2BAInBA,SAAO,mBAAmB;;;;CAKnD,eAAe,KAAG;;;;;;CAOlB,UAAU,KAAG;oBACKA,SAAO,aAAa;;kBAEtBA,SAAO,aAAa;;;sBAGhBA,SAAO,kBAAkB;oBAC3BA,SAAO,kBAAkB;;;;sBAIvBA,SAAO,mBAAmB;oBAC5BA,SAAO,mBAAmB;;;CAI5C,eAAe,KAAG;;;yBAGKA,SAAO,aAAa;;;;;;;;;;;;;CAc3C,UAAU,KAAG;;;;;;CAMd,EAAE"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime20 from "react/jsx-runtime";
|
|
3
3
|
import { ScrollArea } from "@base-ui/react/scroll-area";
|
|
4
4
|
|
|
5
5
|
//#region src/base-ui/ScrollArea/atoms.d.ts
|
|
@@ -19,7 +19,7 @@ declare const ScrollAreaRoot: {
|
|
|
19
19
|
({
|
|
20
20
|
className,
|
|
21
21
|
...rest
|
|
22
|
-
}: ScrollAreaRootProps):
|
|
22
|
+
}: ScrollAreaRootProps): react_jsx_runtime20.JSX.Element;
|
|
23
23
|
displayName: string;
|
|
24
24
|
};
|
|
25
25
|
declare const ScrollAreaViewport: {
|
|
@@ -27,35 +27,35 @@ declare const ScrollAreaViewport: {
|
|
|
27
27
|
className,
|
|
28
28
|
scrollFade,
|
|
29
29
|
...rest
|
|
30
|
-
}: ScrollAreaViewportProps):
|
|
30
|
+
}: ScrollAreaViewportProps): react_jsx_runtime20.JSX.Element;
|
|
31
31
|
displayName: string;
|
|
32
32
|
};
|
|
33
33
|
declare const ScrollAreaContent: {
|
|
34
34
|
({
|
|
35
35
|
className,
|
|
36
36
|
...rest
|
|
37
|
-
}: ScrollAreaContentProps):
|
|
37
|
+
}: ScrollAreaContentProps): react_jsx_runtime20.JSX.Element;
|
|
38
38
|
displayName: string;
|
|
39
39
|
};
|
|
40
40
|
declare const ScrollAreaScrollbar: {
|
|
41
41
|
({
|
|
42
42
|
className,
|
|
43
43
|
...rest
|
|
44
|
-
}: ScrollAreaScrollbarProps):
|
|
44
|
+
}: ScrollAreaScrollbarProps): react_jsx_runtime20.JSX.Element;
|
|
45
45
|
displayName: string;
|
|
46
46
|
};
|
|
47
47
|
declare const ScrollAreaThumb: {
|
|
48
48
|
({
|
|
49
49
|
className,
|
|
50
50
|
...rest
|
|
51
|
-
}: ScrollAreaThumbProps):
|
|
51
|
+
}: ScrollAreaThumbProps): react_jsx_runtime20.JSX.Element;
|
|
52
52
|
displayName: string;
|
|
53
53
|
};
|
|
54
54
|
declare const ScrollAreaCorner: {
|
|
55
55
|
({
|
|
56
56
|
className,
|
|
57
57
|
...rest
|
|
58
|
-
}: ScrollAreaCornerProps):
|
|
58
|
+
}: ScrollAreaCornerProps): react_jsx_runtime20.JSX.Element;
|
|
59
59
|
displayName: string;
|
|
60
60
|
};
|
|
61
61
|
//#endregion
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ToastAPI, ToastPosition } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react142 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/base-ui/Toast/imperative.d.ts
|
|
5
5
|
declare const toast: ToastAPI;
|
|
@@ -30,7 +30,7 @@ interface ToastHostProps {
|
|
|
30
30
|
*/
|
|
31
31
|
swipeDirection?: ('left' | 'right' | 'up' | 'down') | ('left' | 'right' | 'up' | 'down')[];
|
|
32
32
|
}
|
|
33
|
-
declare const ToastHost:
|
|
33
|
+
declare const ToastHost: react142.MemoExoticComponent<({
|
|
34
34
|
root,
|
|
35
35
|
className,
|
|
36
36
|
duration,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { DivProps } from "../../types/index.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react39 from "react";
|
|
3
3
|
import { ReactNode } from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/brand/LobeChat/index.d.ts
|
|
@@ -8,7 +8,7 @@ interface LobeChatProps extends DivProps {
|
|
|
8
8
|
size?: number;
|
|
9
9
|
type?: '3d' | 'flat' | 'mono' | 'text' | 'combine';
|
|
10
10
|
}
|
|
11
|
-
declare const LobeChat:
|
|
11
|
+
declare const LobeChat: react39.NamedExoticComponent<LobeChatProps>;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { LobeChat, LobeChatProps };
|
|
14
14
|
//# sourceMappingURL=index.d.mts.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { DivProps } from "../../types/index.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react40 from "react";
|
|
3
3
|
import { ReactNode } from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/brand/LobeHub/index.d.ts
|
|
@@ -8,7 +8,7 @@ interface LobeHubProps extends DivProps {
|
|
|
8
8
|
size?: number;
|
|
9
9
|
type?: '3d' | 'flat' | 'mono' | 'text' | 'combine';
|
|
10
10
|
}
|
|
11
|
-
declare const LobeHub:
|
|
11
|
+
declare const LobeHub: react40.NamedExoticComponent<LobeHubProps>;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { LobeHub, LobeHubProps };
|
|
14
14
|
//# sourceMappingURL=index.d.mts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { SplineProps } from "../../awesome/Spline/type.mjs";
|
|
2
2
|
import "../../awesome/Spline/index.mjs";
|
|
3
|
-
import * as
|
|
3
|
+
import * as react42 from "react";
|
|
4
4
|
import { CSSProperties } from "react";
|
|
5
5
|
|
|
6
6
|
//#region src/brand/LogoThree/LogoSpline.d.ts
|
|
@@ -10,7 +10,7 @@ interface LogoSplineProps extends Partial<SplineProps> {
|
|
|
10
10
|
style?: CSSProperties;
|
|
11
11
|
width?: number | string;
|
|
12
12
|
}
|
|
13
|
-
declare const LogoSpline:
|
|
13
|
+
declare const LogoSpline: react42.NamedExoticComponent<LogoSplineProps>;
|
|
14
14
|
//#endregion
|
|
15
15
|
export { LogoSpline, LogoSplineProps };
|
|
16
16
|
//# sourceMappingURL=LogoSpline.d.mts.map
|