@lobehub/ui 4.14.0 → 4.15.0
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/Accordion/Accordion.d.mts +2 -2
- package/es/Accordion/AccordionItem.d.mts +2 -2
- 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/CodeEditor/CodeEditor.d.mts +2 -2
- package/es/Collapse/Collapse.d.mts +2 -2
- package/es/ConfigProvider/index.d.mts +2 -2
- package/es/ContextMenu/ContextMenuHost.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/DropdownMenu/DropdownMenu.d.mts +2 -2
- package/es/EditableText/EditableText.d.mts +2 -2
- 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/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/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/MotionProvider/index.d.mts +2 -2
- package/es/Popover/PopoverGroup.mjs +18 -9
- package/es/Popover/PopoverGroup.mjs.map +1 -1
- package/es/Popover/PopoverStandalone.mjs +3 -2
- package/es/Popover/PopoverStandalone.mjs.map +1 -1
- package/es/Popover/context.d.mts +2 -2
- package/es/Popover/groupContext.d.mts +10 -0
- package/es/Popover/groupContext.mjs.map +1 -1
- package/es/Popover/index.d.mts +2 -2
- package/es/Popover/style.mjs +11 -2
- package/es/Popover/style.mjs.map +1 -1
- package/es/Popover/type.d.mts +10 -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/Tooltip/TooltipGroup.mjs +18 -9
- package/es/Tooltip/TooltipGroup.mjs.map +1 -1
- package/es/Tooltip/TooltipStandalone.mjs +3 -2
- package/es/Tooltip/TooltipStandalone.mjs.map +1 -1
- package/es/Tooltip/index.d.mts +1 -1
- package/es/Tooltip/style.mjs +7 -0
- package/es/Tooltip/style.mjs.map +1 -1
- package/es/Tooltip/type.d.mts +21 -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/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/ChatItem/ChatItem.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/BotPromptIcon.d.mts +2 -2
- package/es/icons/lucideExtra/CreateBotIcon.d.mts +3 -3
- package/es/icons/lucideExtra/DiscordIcon.d.mts +3 -3
- 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/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/TabBar/TabBar.d.mts +2 -2
- package/es/storybook/StoryBook/index.d.mts +2 -2
- package/es/utils/destroyOnInvalidActiveTriggerElement.mjs +88 -0
- package/es/utils/destroyOnInvalidActiveTriggerElement.mjs.map +1 -0
- package/package.json +1 -1
package/es/Menu/Menu.d.mts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { MenuProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react59 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/Menu/Menu.d.ts
|
|
5
|
-
declare const Menu:
|
|
5
|
+
declare const Menu: react59.NamedExoticComponent<MenuProps<unknown>>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { Menu };
|
|
8
8
|
//# sourceMappingURL=Menu.d.mts.map
|
package/es/Mermaid/Mermaid.d.mts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { MermaidProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react6 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/Mermaid/Mermaid.d.ts
|
|
5
|
-
declare const Mermaid:
|
|
5
|
+
declare const Mermaid: react6.NamedExoticComponent<MermaidProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { Mermaid };
|
|
8
8
|
//# sourceMappingURL=Mermaid.d.mts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { SyntaxMermaidProps } from "../type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react5 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/Mermaid/SyntaxMermaid/index.d.ts
|
|
5
|
-
declare const SyntaxMermaid:
|
|
5
|
+
declare const SyntaxMermaid: react5.NamedExoticComponent<SyntaxMermaidProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { SyntaxMermaid };
|
|
8
8
|
//# sourceMappingURL=index.d.mts.map
|
package/es/Modal/Modal.d.mts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { ModalProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react2 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/Modal/Modal.d.ts
|
|
5
|
-
declare const Modal:
|
|
5
|
+
declare const Modal: react2.NamedExoticComponent<ModalProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { Modal };
|
|
8
8
|
//# sourceMappingURL=Modal.d.mts.map
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { ModalContextValue } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react3 from "react";
|
|
3
3
|
import { ReactNode } from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/Modal/ModalProvider.d.ts
|
|
6
|
-
declare const ModalProvider:
|
|
6
|
+
declare const ModalProvider: react3.NamedExoticComponent<{
|
|
7
7
|
children: ReactNode;
|
|
8
8
|
value: ModalContextValue;
|
|
9
9
|
}>;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react73 from "react";
|
|
2
2
|
import { Context, ReactNode } from "react";
|
|
3
3
|
import * as motion_react0 from "motion/react";
|
|
4
4
|
import * as m from "motion/react-m";
|
|
@@ -6,7 +6,7 @@ import * as m from "motion/react-m";
|
|
|
6
6
|
//#region src/MotionProvider/index.d.ts
|
|
7
7
|
type MotionComponentType = typeof motion_react0.motion | typeof m;
|
|
8
8
|
declare const MotionComponent: Context<MotionComponentType>;
|
|
9
|
-
declare const MotionProvider:
|
|
9
|
+
declare const MotionProvider: react73.NamedExoticComponent<{
|
|
10
10
|
children: ReactNode;
|
|
11
11
|
motion: MotionComponentType;
|
|
12
12
|
}>;
|
|
@@ -1,21 +1,32 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
3
|
import { placementMap } from "../utils/placement.mjs";
|
|
4
|
+
import { useDestroyOnInvalidActiveTriggerElement, useHidePopupWhenPositionerAtOrigin } from "../utils/destroyOnInvalidActiveTriggerElement.mjs";
|
|
4
5
|
import { PopoverProvider } from "./context.mjs";
|
|
5
6
|
import { PopoverGroupHandleContext, PopoverGroupPropsContext } from "./groupContext.mjs";
|
|
6
7
|
import { parseTrigger } from "./parseTrigger.mjs";
|
|
7
8
|
import { PopoverArrowIcon } from "./ArrowIcon.mjs";
|
|
8
9
|
import { usePopoverPortalContainer } from "./PopoverPortal.mjs";
|
|
9
10
|
import { styles } from "./style.mjs";
|
|
10
|
-
import { useCallback,
|
|
11
|
+
import { useCallback, useMemo, useRef, useState } from "react";
|
|
11
12
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
12
13
|
import { cx } from "antd-style";
|
|
13
14
|
import { Popover } from "@base-ui/react/popover";
|
|
14
15
|
|
|
15
16
|
//#region src/Popover/PopoverGroup.tsx
|
|
16
|
-
const PopoverGroup = ({ children, contentLayoutAnimation = false, ...sharedProps }) => {
|
|
17
|
-
const handle =
|
|
17
|
+
const PopoverGroup = ({ children, contentLayoutAnimation = false, disableDestroyOnInvalidTrigger = false, disableZeroOriginGuard = false, ...sharedProps }) => {
|
|
18
|
+
const [{ handle, key }, setHandleState] = useState(() => ({
|
|
19
|
+
handle: Popover.createHandle(),
|
|
20
|
+
key: 0
|
|
21
|
+
}));
|
|
18
22
|
const activeItemRef = useRef(null);
|
|
23
|
+
const destroy = useCallback(() => {
|
|
24
|
+
activeItemRef.current = null;
|
|
25
|
+
setHandleState(({ key: key$1 }) => ({
|
|
26
|
+
handle: Popover.createHandle(),
|
|
27
|
+
key: key$1 + 1
|
|
28
|
+
}));
|
|
29
|
+
}, []);
|
|
19
30
|
const close = useCallback(() => {
|
|
20
31
|
handle.close();
|
|
21
32
|
}, [handle]);
|
|
@@ -23,10 +34,8 @@ const PopoverGroup = ({ children, contentLayoutAnimation = false, ...sharedProps
|
|
|
23
34
|
const handleOpenChange = useCallback((open) => {
|
|
24
35
|
activeItemRef.current?.onOpenChange?.(open);
|
|
25
36
|
}, []);
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
setUpdateKey((prev) => prev + 1);
|
|
29
|
-
}, [handle]);
|
|
37
|
+
useDestroyOnInvalidActiveTriggerElement(handle.store, destroy, { enabled: !disableDestroyOnInvalidTrigger });
|
|
38
|
+
useHidePopupWhenPositionerAtOrigin(handle.store, { enabled: !disableZeroOriginGuard });
|
|
30
39
|
const portalContainer = usePopoverPortalContainer();
|
|
31
40
|
return /* @__PURE__ */ jsx(PopoverGroupHandleContext.Provider, {
|
|
32
41
|
value: handle,
|
|
@@ -96,9 +105,9 @@ const PopoverGroup = ({ children, contentLayoutAnimation = false, ...sharedProps
|
|
|
96
105
|
return portalContainer ? /* @__PURE__ */ jsx(Popover.Portal, {
|
|
97
106
|
container: portalContainer,
|
|
98
107
|
children: popup
|
|
99
|
-
}) :
|
|
108
|
+
}) : null;
|
|
100
109
|
}
|
|
101
|
-
},
|
|
110
|
+
}, key)]
|
|
102
111
|
})
|
|
103
112
|
});
|
|
104
113
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PopoverGroup.mjs","names":["PopoverGroup: FC<PopoverGroupProps>","BasePopover"],"sources":["../../src/Popover/PopoverGroup.tsx"],"sourcesContent":["'use client';\n\nimport { Popover as BasePopover } from '@base-ui/react/popover';\nimport type { Side } from '@base-ui/react/utils/useAnchorPositioning';\nimport { cx } from 'antd-style';\nimport { type FC, type ReactNode, useCallback,
|
|
1
|
+
{"version":3,"file":"PopoverGroup.mjs","names":["PopoverGroup: FC<PopoverGroupProps>","BasePopover","key"],"sources":["../../src/Popover/PopoverGroup.tsx"],"sourcesContent":["'use client';\n\nimport { Popover as BasePopover } from '@base-ui/react/popover';\nimport type { Side } from '@base-ui/react/utils/useAnchorPositioning';\nimport { cx } from 'antd-style';\nimport { type FC, type ReactNode, useCallback, useMemo, useRef, useState } from 'react';\n\nimport {\n useDestroyOnInvalidActiveTriggerElement,\n useHidePopupWhenPositionerAtOrigin,\n} from '@/utils/destroyOnInvalidActiveTriggerElement';\nimport { placementMap } from '@/utils/placement';\n\nimport { PopoverArrowIcon } from './ArrowIcon';\nimport { usePopoverPortalContainer } from './PopoverPortal';\nimport { PopoverProvider } from './context';\nimport {\n PopoverGroupHandleContext,\n type PopoverGroupItem,\n PopoverGroupPropsContext,\n type PopoverGroupSharedProps,\n} from './groupContext';\nimport { parseTrigger } from './parseTrigger';\nimport { styles } from './style';\n\ntype PopoverGroupProps = PopoverGroupSharedProps & {\n children: ReactNode;\n};\n\nconst PopoverGroup: FC<PopoverGroupProps> = ({\n children,\n contentLayoutAnimation = false,\n disableDestroyOnInvalidTrigger = false,\n disableZeroOriginGuard = false,\n ...sharedProps\n}) => {\n const [{ handle, key }, setHandleState] = useState(() => ({\n handle: BasePopover.createHandle<PopoverGroupItem>(),\n key: 0,\n }));\n const activeItemRef = useRef<PopoverGroupItem | null>(null);\n const destroy = useCallback(() => {\n activeItemRef.current = null;\n setHandleState(({ key }) => ({\n handle: BasePopover.createHandle<PopoverGroupItem>(),\n key: key + 1,\n }));\n }, []);\n const close = useCallback(() => {\n handle.close();\n }, [handle]);\n const contextValue = useMemo(() => ({ close }), [close]);\n\n const handleOpenChange = useCallback((open: boolean) => {\n activeItemRef.current?.onOpenChange?.(open);\n }, []);\n\n useDestroyOnInvalidActiveTriggerElement(handle.store, destroy, {\n enabled: !disableDestroyOnInvalidTrigger,\n });\n useHidePopupWhenPositionerAtOrigin(handle.store, { enabled: !disableZeroOriginGuard });\n\n const portalContainer = usePopoverPortalContainer();\n\n return (\n <PopoverGroupHandleContext.Provider value={handle}>\n <PopoverGroupPropsContext.Provider value={sharedProps}>\n {children}\n <BasePopover.Root handle={handle} key={key} onOpenChange={handleOpenChange}>\n {({ payload }) => {\n const item = (payload as PopoverGroupItem | null) ?? null;\n activeItemRef.current = item;\n\n if (!item?.content) return null;\n\n const arrow = item.inset ? false : (item.arrow ?? false);\n const placement = item.placement ?? 'top';\n const { openOnHover } = parseTrigger(item.trigger ?? 'hover');\n\n const placementConfig = placementMap[placement] ?? placementMap.top;\n const baseSideOffset = arrow ? 10 : 6;\n const resolvedSideOffset = item.inset\n ? ({\n side,\n positioner,\n }: {\n positioner: { height: number; width: number };\n side: Side;\n }) => {\n if (\n side === 'left' ||\n side === 'right' ||\n side === 'inline-start' ||\n side === 'inline-end'\n ) {\n return -positioner.width;\n }\n return -positioner.height;\n }\n : baseSideOffset;\n\n const resolvedClassNames = {\n arrow: cx(styles.arrow, item.classNames?.arrow),\n popup: cx(styles.popup, item.className),\n positioner: cx(styles.positioner, item.classNames?.root),\n viewport: cx(styles.viewport, item.classNames?.content),\n };\n\n const resolvedStyles = {\n arrow: item.styles?.arrow,\n positioner: {\n ...item.styles?.root,\n zIndex: item.zIndex ?? 1100,\n },\n viewport: item.styles?.content,\n };\n\n const contentNode = (\n <PopoverProvider value={contextValue}>{item.content}</PopoverProvider>\n );\n\n const popup = (\n <BasePopover.Positioner\n align={placementConfig.align}\n className={resolvedClassNames.positioner}\n data-hover-trigger={openOnHover || undefined}\n data-placement={placement}\n side={placementConfig.side}\n sideOffset={resolvedSideOffset}\n style={resolvedStyles.positioner}\n {...item.positionerProps}\n >\n <BasePopover.Popup className={resolvedClassNames.popup} {...item.popupProps}>\n {arrow && (\n <BasePopover.Arrow\n className={resolvedClassNames.arrow}\n style={resolvedStyles.arrow}\n >\n {PopoverArrowIcon}\n </BasePopover.Arrow>\n )}\n {contentLayoutAnimation ? (\n <BasePopover.Viewport\n className={resolvedClassNames.viewport}\n style={resolvedStyles.viewport}\n >\n {contentNode}\n </BasePopover.Viewport>\n ) : (\n <div className={resolvedClassNames.viewport} style={resolvedStyles.viewport}>\n {contentNode}\n </div>\n )}\n </BasePopover.Popup>\n </BasePopover.Positioner>\n );\n\n return portalContainer ? (\n <BasePopover.Portal container={portalContainer}>{popup}</BasePopover.Portal>\n ) : null;\n }}\n </BasePopover.Root>\n </PopoverGroupPropsContext.Provider>\n </PopoverGroupHandleContext.Provider>\n );\n};\n\nPopoverGroup.displayName = 'PopoverGroup';\n\nexport default PopoverGroup;\n"],"mappings":";;;;;;;;;;;;;;;;AA6BA,MAAMA,gBAAuC,EAC3C,UACA,yBAAyB,OACzB,iCAAiC,OACjC,yBAAyB,OACzB,GAAG,kBACC;CACJ,MAAM,CAAC,EAAE,QAAQ,OAAO,kBAAkB,gBAAgB;EACxD,QAAQC,QAAY,cAAgC;EACpD,KAAK;EACN,EAAE;CACH,MAAM,gBAAgB,OAAgC,KAAK;CAC3D,MAAM,UAAU,kBAAkB;AAChC,gBAAc,UAAU;AACxB,kBAAgB,EAAE,kBAAW;GAC3B,QAAQA,QAAY,cAAgC;GACpD,KAAKC,QAAM;GACZ,EAAE;IACF,EAAE,CAAC;CACN,MAAM,QAAQ,kBAAkB;AAC9B,SAAO,OAAO;IACb,CAAC,OAAO,CAAC;CACZ,MAAM,eAAe,eAAe,EAAE,OAAO,GAAG,CAAC,MAAM,CAAC;CAExD,MAAM,mBAAmB,aAAa,SAAkB;AACtD,gBAAc,SAAS,eAAe,KAAK;IAC1C,EAAE,CAAC;AAEN,yCAAwC,OAAO,OAAO,SAAS,EAC7D,SAAS,CAAC,gCACX,CAAC;AACF,oCAAmC,OAAO,OAAO,EAAE,SAAS,CAAC,wBAAwB,CAAC;CAEtF,MAAM,kBAAkB,2BAA2B;AAEnD,QACE,oBAAC,0BAA0B;EAAS,OAAO;YACzC,qBAAC,yBAAyB;GAAS,OAAO;cACvC,UACD,oBAACD,QAAY;IAAa;IAAkB,cAAc;eACtD,EAAE,cAAc;KAChB,MAAM,OAAQ,WAAuC;AACrD,mBAAc,UAAU;AAExB,SAAI,CAAC,MAAM,QAAS,QAAO;KAE3B,MAAM,QAAQ,KAAK,QAAQ,QAAS,KAAK,SAAS;KAClD,MAAM,YAAY,KAAK,aAAa;KACpC,MAAM,EAAE,gBAAgB,aAAa,KAAK,WAAW,QAAQ;KAE7D,MAAM,kBAAkB,aAAa,cAAc,aAAa;KAChE,MAAM,iBAAiB,QAAQ,KAAK;KACpC,MAAM,qBAAqB,KAAK,SAC3B,EACC,MACA,iBAII;AACJ,UACE,SAAS,UACT,SAAS,WACT,SAAS,kBACT,SAAS,aAET,QAAO,CAAC,WAAW;AAErB,aAAO,CAAC,WAAW;SAErB;KAEJ,MAAM,qBAAqB;MACzB,OAAO,GAAG,OAAO,OAAO,KAAK,YAAY,MAAM;MAC/C,OAAO,GAAG,OAAO,OAAO,KAAK,UAAU;MACvC,YAAY,GAAG,OAAO,YAAY,KAAK,YAAY,KAAK;MACxD,UAAU,GAAG,OAAO,UAAU,KAAK,YAAY,QAAQ;MACxD;KAED,MAAM,iBAAiB;MACrB,OAAO,KAAK,QAAQ;MACpB,YAAY;OACV,GAAG,KAAK,QAAQ;OAChB,QAAQ,KAAK,UAAU;OACxB;MACD,UAAU,KAAK,QAAQ;MACxB;KAED,MAAM,cACJ,oBAAC;MAAgB,OAAO;gBAAe,KAAK;OAA0B;KAGxE,MAAM,QACJ,oBAACA,QAAY;MACX,OAAO,gBAAgB;MACvB,WAAW,mBAAmB;MAC9B,sBAAoB,eAAe;MACnC,kBAAgB;MAChB,MAAM,gBAAgB;MACtB,YAAY;MACZ,OAAO,eAAe;MACtB,GAAI,KAAK;gBAET,qBAACA,QAAY;OAAM,WAAW,mBAAmB;OAAO,GAAI,KAAK;kBAC9D,SACC,oBAACA,QAAY;QACX,WAAW,mBAAmB;QAC9B,OAAO,eAAe;kBAErB;SACiB,EAErB,yBACC,oBAACA,QAAY;QACX,WAAW,mBAAmB;QAC9B,OAAO,eAAe;kBAErB;SACoB,GAEvB,oBAAC;QAAI,WAAW,mBAAmB;QAAU,OAAO,eAAe;kBAChE;SACG;QAEU;OACG;AAG3B,YAAO,kBACL,oBAACA,QAAY;MAAO,WAAW;gBAAkB;OAA2B,GAC1E;;MA3F+B,IA6FpB;IACe;GACD;;AAIzC,aAAa,cAAc;AAE3B,2BAAe"}
|
|
@@ -20,7 +20,7 @@ import { Popover } from "@base-ui/react/popover";
|
|
|
20
20
|
* Popover component - displays floating content relative to a trigger element
|
|
21
21
|
* Compatible with Ant Design Popover API
|
|
22
22
|
*/
|
|
23
|
-
const PopoverStandalone = memo(({ children, content, arrow: originArrow = false, inset = false, trigger = "hover", placement = "top", styles: styleProps, classNames, className, open, onOpenChange, defaultOpen = false, mouseEnterDelay = .1, mouseLeaveDelay = .1, openDelay, closeDelay, getPopupContainer, disabled = false, zIndex, nativeButton, ref: refProp, positionerProps, triggerProps, popupProps, backdropProps }) => {
|
|
23
|
+
const PopoverStandalone = memo(({ children, content, arrow: originArrow = false, inset = false, trigger = "hover", placement = "top", styles: styleProps, classNames, className, open, onOpenChange, defaultOpen = false, mouseEnterDelay = .1, mouseLeaveDelay = .1, openDelay, closeDelay, getPopupContainer, disabled = false, zIndex, nativeButton, ref: refProp, positionerProps, triggerProps, popupProps, backdropProps, portalProps }) => {
|
|
24
24
|
const arrow = inset ? false : originArrow;
|
|
25
25
|
const isClient = useIsClient();
|
|
26
26
|
const popoverHandle = useMemo(() => Popover.createHandle(), []);
|
|
@@ -187,8 +187,9 @@ const PopoverStandalone = memo(({ children, content, arrow: originArrow = false,
|
|
|
187
187
|
backdropProps && /* @__PURE__ */ jsx(Popover.Backdrop, { ...backdropProps }),
|
|
188
188
|
resolvedPortalContainer ? /* @__PURE__ */ jsx(Popover.Portal, {
|
|
189
189
|
container: resolvedPortalContainer,
|
|
190
|
+
...portalProps,
|
|
190
191
|
children: popup
|
|
191
|
-
}) :
|
|
192
|
+
}) : null
|
|
192
193
|
]
|
|
193
194
|
});
|
|
194
195
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PopoverStandalone.mjs","names":["BasePopover"],"sources":["../../src/Popover/PopoverStandalone.tsx"],"sourcesContent":["'use client';\n\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { Popover as BasePopover } from '@base-ui/react/popover';\nimport type { Side } from '@base-ui/react/utils/useAnchorPositioning';\nimport { cx } from 'antd-style';\nimport { cloneElement, isValidElement, memo, useCallback, useMemo, useState } from 'react';\nimport { mergeRefs } from 'react-merge-refs';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { placementMap } from '@/utils/placement';\n\nimport { PopoverArrowIcon } from './ArrowIcon';\nimport { usePopoverPortalContainer } from './PopoverPortal';\nimport { PopoverProvider } from './context';\nimport { parseTrigger } from './parseTrigger';\nimport { styles } from './style';\nimport type { PopoverProps } from './type';\n\n/**\n * Popover component - displays floating content relative to a trigger element\n * Compatible with Ant Design Popover API\n */\nexport const PopoverStandalone = memo<PopoverProps>(\n ({\n children,\n content,\n arrow: originArrow = false,\n inset = false,\n trigger = 'hover',\n placement = 'top',\n styles: styleProps,\n classNames,\n className,\n open,\n onOpenChange,\n defaultOpen = false,\n mouseEnterDelay = 0.1,\n mouseLeaveDelay = 0.1,\n openDelay,\n closeDelay,\n getPopupContainer,\n disabled = false,\n zIndex,\n nativeButton,\n ref: refProp,\n positionerProps,\n triggerProps,\n popupProps,\n backdropProps,\n }) => {\n const arrow = inset ? false : originArrow;\n const isClient = useIsClient();\n const popoverHandle = useMemo(() => BasePopover.createHandle(), []);\n const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));\n const close = useCallback(() => {\n popoverHandle.close();\n }, [popoverHandle]);\n const contextValue = useMemo(() => ({ close }), [close]);\n\n const mergedOpen = open ?? uncontrolledOpen;\n const resolvedOpen = disabled ? false : mergedOpen;\n\n const handleOpenChange = useCallback(\n (nextOpen: boolean) => {\n // Don't open if disabled\n if (disabled && nextOpen) return;\n\n onOpenChange?.(nextOpen);\n if (open === undefined) {\n setUncontrolledOpen(nextOpen);\n }\n },\n [onOpenChange, open, disabled],\n );\n\n // Parse trigger mode\n const { openOnHover } = useMemo(() => parseTrigger(trigger), [trigger]);\n\n // Calculate delays (milliseconds take precedence over seconds)\n const resolvedOpenDelay = openDelay ?? mouseEnterDelay * 1000;\n const resolvedCloseDelay = closeDelay ?? mouseLeaveDelay * 1000;\n\n // Get placement configuration\n const placementConfig = placementMap[placement] ?? placementMap.top;\n const baseSideOffset = arrow ? 10 : 6;\n const resolvedSideOffset = useMemo(() => {\n if (!inset) return baseSideOffset;\n return ({\n side,\n positioner,\n }: {\n positioner: { height: number; width: number };\n side: Side;\n }) => {\n if (\n side === 'left' ||\n side === 'right' ||\n side === 'inline-start' ||\n side === 'inline-end'\n ) {\n return -positioner.width;\n }\n return -positioner.height;\n };\n }, [baseSideOffset, inset]);\n\n // Determine portal container\n const portalContainer = usePopoverPortalContainer();\n\n const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({\n children,\n nativeButton,\n });\n\n const resolvedClassNames = useMemo(\n () => ({\n arrow: cx(styles.arrow, classNames?.arrow),\n popup: cx(styles.popup, className),\n positioner: cx(styles.positioner, classNames?.root),\n trigger: classNames?.trigger,\n viewport: cx(styles.viewport, classNames?.content),\n }),\n [className, classNames?.arrow, classNames?.content, classNames?.root, classNames?.trigger],\n );\n\n // Render trigger element\n const triggerElement = useMemo(() => {\n const baseTriggerProps = {\n closeDelay: resolvedCloseDelay,\n delay: resolvedOpenDelay,\n disabled,\n openOnHover: openOnHover && !disabled,\n ...triggerProps,\n };\n\n if (isValidElement(children)) {\n return (\n <BasePopover.Trigger\n handle={popoverHandle}\n {...baseTriggerProps}\n nativeButton={resolvedNativeButton}\n render={(props) => {\n // Base UI's trigger props include `type=\"button\"` by default.\n // If we render into a non-<button> element, that prop is invalid and can warn.\n const resolvedProps = (() => {\n if (isNativeButtonTriggerElement) return props as any;\n // eslint-disable-next-line unused-imports/no-unused-vars, @typescript-eslint/no-unused-vars\n const { type, ref: triggerRef, ...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 className: cx(mergedProps.className, resolvedClassNames.trigger),\n ref: mergeRefs([(children as any).ref, (props as any).ref, refProp]),\n });\n }}\n />\n );\n }\n return (\n <BasePopover.Trigger\n handle={popoverHandle}\n {...baseTriggerProps}\n className={resolvedClassNames.trigger}\n nativeButton={resolvedNativeButton}\n ref={refProp}\n >\n {children}\n </BasePopover.Trigger>\n );\n }, [\n children,\n disabled,\n isNativeButtonTriggerElement,\n openOnHover,\n popoverHandle,\n refProp,\n resolvedClassNames.trigger,\n resolvedNativeButton,\n resolvedOpenDelay,\n resolvedCloseDelay,\n triggerProps,\n ]);\n\n // Custom container from getPopupContainer\n const customContainer = useMemo(() => {\n if (!getPopupContainer || !isClient) return undefined;\n // We need a reference element, but we don't have it until render\n // This will be handled by the portal container logic\n return undefined;\n }, [getPopupContainer, isClient]);\n\n const resolvedStyles = useMemo(\n () => ({\n arrow: styleProps?.arrow,\n positioner: {\n ...styleProps?.root,\n zIndex: zIndex ?? 1100,\n },\n viewport: styleProps?.content,\n }),\n [styleProps?.arrow, styleProps?.content, styleProps?.root, zIndex],\n );\n\n const popup = useMemo(\n () => (\n <BasePopover.Positioner\n align={placementConfig.align}\n className={resolvedClassNames.positioner}\n data-hover-trigger={openOnHover || undefined}\n data-placement={placement}\n side={placementConfig.side}\n sideOffset={resolvedSideOffset}\n style={resolvedStyles.positioner}\n {...positionerProps}\n >\n <BasePopover.Popup className={resolvedClassNames.popup} {...popupProps}>\n {arrow && (\n <BasePopover.Arrow className={resolvedClassNames.arrow} style={resolvedStyles.arrow}>\n {PopoverArrowIcon}\n </BasePopover.Arrow>\n )}\n <BasePopover.Viewport\n className={resolvedClassNames.viewport}\n style={resolvedStyles.viewport}\n >\n <PopoverProvider value={contextValue}>{content}</PopoverProvider>\n </BasePopover.Viewport>\n </BasePopover.Popup>\n </BasePopover.Positioner>\n ),\n [\n arrow,\n content,\n contextValue,\n openOnHover,\n placement,\n placementConfig.align,\n placementConfig.side,\n popupProps,\n positionerProps,\n resolvedClassNames,\n resolvedSideOffset,\n resolvedStyles,\n ],\n );\n\n // Don't render popup if no content\n if (!content) {\n return children;\n }\n\n const resolvedPortalContainer = customContainer ?? portalContainer;\n\n return (\n <BasePopover.Root\n defaultOpen={defaultOpen}\n handle={popoverHandle}\n onOpenChange={handleOpenChange}\n open={resolvedOpen}\n >\n {triggerElement}\n {backdropProps && <BasePopover.Backdrop {...backdropProps} />}\n {resolvedPortalContainer ? (\n <BasePopover.Portal container={resolvedPortalContainer}>{popup}</BasePopover.Portal>\n ) : (\n popup\n )}\n </BasePopover.Root>\n );\n },\n);\n\nPopoverStandalone.displayName = 'PopoverStandalone';\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PopoverStandalone.mjs","names":["BasePopover"],"sources":["../../src/Popover/PopoverStandalone.tsx"],"sourcesContent":["'use client';\n\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { Popover as BasePopover } from '@base-ui/react/popover';\nimport type { Side } from '@base-ui/react/utils/useAnchorPositioning';\nimport { cx } from 'antd-style';\nimport { cloneElement, isValidElement, memo, useCallback, useMemo, useState } from 'react';\nimport { mergeRefs } from 'react-merge-refs';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { placementMap } from '@/utils/placement';\n\nimport { PopoverArrowIcon } from './ArrowIcon';\nimport { usePopoverPortalContainer } from './PopoverPortal';\nimport { PopoverProvider } from './context';\nimport { parseTrigger } from './parseTrigger';\nimport { styles } from './style';\nimport type { PopoverProps } from './type';\n\n/**\n * Popover component - displays floating content relative to a trigger element\n * Compatible with Ant Design Popover API\n */\nexport const PopoverStandalone = memo<PopoverProps>(\n ({\n children,\n content,\n arrow: originArrow = false,\n inset = false,\n trigger = 'hover',\n placement = 'top',\n styles: styleProps,\n classNames,\n className,\n open,\n onOpenChange,\n defaultOpen = false,\n mouseEnterDelay = 0.1,\n mouseLeaveDelay = 0.1,\n openDelay,\n closeDelay,\n getPopupContainer,\n disabled = false,\n zIndex,\n nativeButton,\n ref: refProp,\n positionerProps,\n triggerProps,\n popupProps,\n backdropProps,\n portalProps,\n }) => {\n const arrow = inset ? false : originArrow;\n const isClient = useIsClient();\n const popoverHandle = useMemo(() => BasePopover.createHandle(), []);\n const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));\n const close = useCallback(() => {\n popoverHandle.close();\n }, [popoverHandle]);\n const contextValue = useMemo(() => ({ close }), [close]);\n\n const mergedOpen = open ?? uncontrolledOpen;\n const resolvedOpen = disabled ? false : mergedOpen;\n\n const handleOpenChange = useCallback(\n (nextOpen: boolean) => {\n // Don't open if disabled\n if (disabled && nextOpen) return;\n\n onOpenChange?.(nextOpen);\n if (open === undefined) {\n setUncontrolledOpen(nextOpen);\n }\n },\n [onOpenChange, open, disabled],\n );\n\n // Parse trigger mode\n const { openOnHover } = useMemo(() => parseTrigger(trigger), [trigger]);\n\n // Calculate delays (milliseconds take precedence over seconds)\n const resolvedOpenDelay = openDelay ?? mouseEnterDelay * 1000;\n const resolvedCloseDelay = closeDelay ?? mouseLeaveDelay * 1000;\n\n // Get placement configuration\n const placementConfig = placementMap[placement] ?? placementMap.top;\n const baseSideOffset = arrow ? 10 : 6;\n const resolvedSideOffset = useMemo(() => {\n if (!inset) return baseSideOffset;\n return ({\n side,\n positioner,\n }: {\n positioner: { height: number; width: number };\n side: Side;\n }) => {\n if (\n side === 'left' ||\n side === 'right' ||\n side === 'inline-start' ||\n side === 'inline-end'\n ) {\n return -positioner.width;\n }\n return -positioner.height;\n };\n }, [baseSideOffset, inset]);\n\n // Determine portal container\n const portalContainer = usePopoverPortalContainer();\n\n const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({\n children,\n nativeButton,\n });\n\n const resolvedClassNames = useMemo(\n () => ({\n arrow: cx(styles.arrow, classNames?.arrow),\n popup: cx(styles.popup, className),\n positioner: cx(styles.positioner, classNames?.root),\n trigger: classNames?.trigger,\n viewport: cx(styles.viewport, classNames?.content),\n }),\n [className, classNames?.arrow, classNames?.content, classNames?.root, classNames?.trigger],\n );\n\n // Render trigger element\n const triggerElement = useMemo(() => {\n const baseTriggerProps = {\n closeDelay: resolvedCloseDelay,\n delay: resolvedOpenDelay,\n disabled,\n openOnHover: openOnHover && !disabled,\n ...triggerProps,\n };\n\n if (isValidElement(children)) {\n return (\n <BasePopover.Trigger\n handle={popoverHandle}\n {...baseTriggerProps}\n nativeButton={resolvedNativeButton}\n render={(props) => {\n // Base UI's trigger props include `type=\"button\"` by default.\n // If we render into a non-<button> element, that prop is invalid and can warn.\n const resolvedProps = (() => {\n if (isNativeButtonTriggerElement) return props as any;\n // eslint-disable-next-line unused-imports/no-unused-vars, @typescript-eslint/no-unused-vars\n const { type, ref: triggerRef, ...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 className: cx(mergedProps.className, resolvedClassNames.trigger),\n ref: mergeRefs([(children as any).ref, (props as any).ref, refProp]),\n });\n }}\n />\n );\n }\n return (\n <BasePopover.Trigger\n handle={popoverHandle}\n {...baseTriggerProps}\n className={resolvedClassNames.trigger}\n nativeButton={resolvedNativeButton}\n ref={refProp}\n >\n {children}\n </BasePopover.Trigger>\n );\n }, [\n children,\n disabled,\n isNativeButtonTriggerElement,\n openOnHover,\n popoverHandle,\n refProp,\n resolvedClassNames.trigger,\n resolvedNativeButton,\n resolvedOpenDelay,\n resolvedCloseDelay,\n triggerProps,\n ]);\n\n // Custom container from getPopupContainer\n const customContainer = useMemo(() => {\n if (!getPopupContainer || !isClient) return undefined;\n // We need a reference element, but we don't have it until render\n // This will be handled by the portal container logic\n return undefined;\n }, [getPopupContainer, isClient]);\n\n const resolvedStyles = useMemo(\n () => ({\n arrow: styleProps?.arrow,\n positioner: {\n ...styleProps?.root,\n zIndex: zIndex ?? 1100,\n },\n viewport: styleProps?.content,\n }),\n [styleProps?.arrow, styleProps?.content, styleProps?.root, zIndex],\n );\n\n const popup = useMemo(\n () => (\n <BasePopover.Positioner\n align={placementConfig.align}\n className={resolvedClassNames.positioner}\n data-hover-trigger={openOnHover || undefined}\n data-placement={placement}\n side={placementConfig.side}\n sideOffset={resolvedSideOffset}\n style={resolvedStyles.positioner}\n {...positionerProps}\n >\n <BasePopover.Popup className={resolvedClassNames.popup} {...popupProps}>\n {arrow && (\n <BasePopover.Arrow className={resolvedClassNames.arrow} style={resolvedStyles.arrow}>\n {PopoverArrowIcon}\n </BasePopover.Arrow>\n )}\n <BasePopover.Viewport\n className={resolvedClassNames.viewport}\n style={resolvedStyles.viewport}\n >\n <PopoverProvider value={contextValue}>{content}</PopoverProvider>\n </BasePopover.Viewport>\n </BasePopover.Popup>\n </BasePopover.Positioner>\n ),\n [\n arrow,\n content,\n contextValue,\n openOnHover,\n placement,\n placementConfig.align,\n placementConfig.side,\n popupProps,\n positionerProps,\n resolvedClassNames,\n resolvedSideOffset,\n resolvedStyles,\n ],\n );\n\n // Don't render popup if no content\n if (!content) {\n return children;\n }\n\n const resolvedPortalContainer = customContainer ?? portalContainer;\n\n return (\n <BasePopover.Root\n defaultOpen={defaultOpen}\n handle={popoverHandle}\n onOpenChange={handleOpenChange}\n open={resolvedOpen}\n >\n {triggerElement}\n {backdropProps && <BasePopover.Backdrop {...backdropProps} />}\n {resolvedPortalContainer ? (\n <BasePopover.Portal container={resolvedPortalContainer} {...portalProps}>\n {popup}\n </BasePopover.Portal>\n ) : null}\n </BasePopover.Root>\n );\n },\n);\n\nPopoverStandalone.displayName = 'PopoverStandalone';\n"],"mappings":"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"}
|
package/es/Popover/context.d.mts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react0 from "react";
|
|
2
2
|
import { ReactNode } from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/Popover/context.d.ts
|
|
5
5
|
type PopoverContextValue = {
|
|
6
6
|
close: () => void;
|
|
7
7
|
};
|
|
8
|
-
declare const PopoverProvider:
|
|
8
|
+
declare const PopoverProvider: react0.NamedExoticComponent<{
|
|
9
9
|
children: ReactNode;
|
|
10
10
|
value: PopoverContextValue;
|
|
11
11
|
}>;
|
|
@@ -8,6 +8,16 @@ type PopoverGroupSharedProps = Omit<PopoverProps, 'children' | 'content' | 'defa
|
|
|
8
8
|
* @default false
|
|
9
9
|
*/
|
|
10
10
|
contentLayoutAnimation?: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* Disable the "destroy on invalid trigger (display:none / disconnected)" guard for performance.
|
|
13
|
+
* @default false
|
|
14
|
+
*/
|
|
15
|
+
disableDestroyOnInvalidTrigger?: boolean;
|
|
16
|
+
/**
|
|
17
|
+
* Disable the "hide when positioner falls back to (0,0)" visual guard for performance.
|
|
18
|
+
* @default false
|
|
19
|
+
*/
|
|
20
|
+
disableZeroOriginGuard?: boolean;
|
|
11
21
|
};
|
|
12
22
|
//#endregion
|
|
13
23
|
export { PopoverGroupSharedProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"groupContext.mjs","names":[],"sources":["../../src/Popover/groupContext.ts"],"sourcesContent":["'use client';\n\nimport type { PopoverHandle } from '@base-ui/react/popover/store/PopoverHandle';\nimport { createContext } from 'react';\n\nimport type { PopoverProps } from './type';\n\nexport type PopoverGroupItem = Omit<PopoverProps, 'children' | 'open' | 'defaultOpen' | 'ref'>;\n\nexport type PopoverGroupSharedProps = Omit<\n PopoverProps,\n 'children' | 'content' | 'defaultOpen' | 'open' | 'ref'\n> & {\n /**\n * @description Whether to enable content layout animation when switching triggers\n * @default false\n */\n contentLayoutAnimation?: boolean;\n};\n\nexport const PopoverGroupHandleContext = createContext<PopoverHandle<PopoverGroupItem> | null>(\n null,\n);\nexport const PopoverGroupPropsContext = createContext<PopoverGroupSharedProps | null>(null);\n"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"groupContext.mjs","names":[],"sources":["../../src/Popover/groupContext.ts"],"sourcesContent":["'use client';\n\nimport type { PopoverHandle } from '@base-ui/react/popover/store/PopoverHandle';\nimport { createContext } from 'react';\n\nimport type { PopoverProps } from './type';\n\nexport type PopoverGroupItem = Omit<PopoverProps, 'children' | 'open' | 'defaultOpen' | 'ref'>;\n\nexport type PopoverGroupSharedProps = Omit<\n PopoverProps,\n 'children' | 'content' | 'defaultOpen' | 'open' | 'ref'\n> & {\n /**\n * @description Whether to enable content layout animation when switching triggers\n * @default false\n */\n contentLayoutAnimation?: boolean;\n /**\n * Disable the \"destroy on invalid trigger (display:none / disconnected)\" guard for performance.\n * @default false\n */\n disableDestroyOnInvalidTrigger?: boolean;\n /**\n * Disable the \"hide when positioner falls back to (0,0)\" visual guard for performance.\n * @default false\n */\n disableZeroOriginGuard?: boolean;\n};\n\nexport const PopoverGroupHandleContext = createContext<PopoverHandle<PopoverGroupItem> | null>(\n null,\n);\nexport const PopoverGroupPropsContext = createContext<PopoverGroupSharedProps | null>(null);\n"],"mappings":";;;;;AA8BA,MAAa,4BAA4B,cACvC,KACD;AACD,MAAa,2BAA2B,cAA8C,KAAK"}
|
package/es/Popover/index.d.mts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { PopoverContextValue, PopoverProvider, usePopoverContext } from "./context.mjs";
|
|
2
|
-
import { PopoverBackdropProps, PopoverPlacement, PopoverPopupProps, PopoverPositionerProps, PopoverProps, PopoverTrigger, PopoverTriggerComponentProps } from "./type.mjs";
|
|
2
|
+
import { PopoverBackdropProps, PopoverPlacement, PopoverPopupProps, PopoverPortalProps, PopoverPositionerProps, PopoverProps, PopoverTrigger, PopoverTriggerComponentProps } from "./type.mjs";
|
|
3
3
|
import { parseTrigger } from "./parseTrigger.mjs";
|
|
4
4
|
import { Popover } from "./Popover.mjs";
|
|
5
5
|
import { PopoverGroup } from "./PopoverGroup.mjs";
|
|
6
|
-
export { type PopoverBackdropProps, type PopoverContextValue, PopoverGroup, type PopoverPlacement, type PopoverPopupProps, type PopoverPositionerProps, type PopoverProps, PopoverProvider, type PopoverTrigger, type PopoverTriggerComponentProps, Popover as default, parseTrigger, usePopoverContext };
|
|
6
|
+
export { type PopoverBackdropProps, type PopoverContextValue, PopoverGroup, type PopoverPlacement, type PopoverPopupProps, type PopoverPortalProps, type PopoverPositionerProps, type PopoverProps, PopoverProvider, type PopoverTrigger, type PopoverTriggerComponentProps, Popover as default, parseTrigger, usePopoverContext };
|
package/es/Popover/style.mjs
CHANGED
|
@@ -16,7 +16,8 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
|
|
|
16
16
|
width: 12px;
|
|
17
17
|
height: 6px;
|
|
18
18
|
|
|
19
|
-
transition: inset-inline-start var(--lobe-popover-animation-duration)
|
|
19
|
+
transition: inset-inline-start var(--lobe-popover-animation-duration)
|
|
20
|
+
var(--lobe-popover-animation-ease-out);
|
|
20
21
|
|
|
21
22
|
& > svg {
|
|
22
23
|
display: block;
|
|
@@ -109,12 +110,20 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
|
|
|
109
110
|
|
|
110
111
|
transition-timing-function: var(--lobe-popover-animation-ease-out);
|
|
111
112
|
transition-duration: var(--lobe-popover-animation-duration);
|
|
112
|
-
transition-property:
|
|
113
|
+
transition-property:
|
|
114
|
+
inset-block-start, inset-inline-start, inset-inline-end, inset-block-end, transform;
|
|
113
115
|
|
|
114
116
|
&[data-instant] {
|
|
115
117
|
transition: none;
|
|
116
118
|
}
|
|
117
119
|
|
|
120
|
+
/* Fallback: never show a popover when the anchor is hidden or the positioner falls back to (0,0). */
|
|
121
|
+
&[data-anchor-hidden],
|
|
122
|
+
&[data-zero-origin='true'] {
|
|
123
|
+
pointer-events: none;
|
|
124
|
+
visibility: hidden;
|
|
125
|
+
}
|
|
126
|
+
|
|
118
127
|
&[data-placement='top'],
|
|
119
128
|
&[data-placement='topLeft'],
|
|
120
129
|
&[data-placement='topRight'] {
|
package/es/Popover/style.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","names":["cssVar"],"sources":["../../src/Popover/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n arrow: css`\n --lobe-popover-arrow-offset-block: 5px;\n --lobe-popover-arrow-offset-inline: 8px;\n\n pointer-events: none;\n\n position: absolute;\n transform-origin: center;\n\n display: flex;\n\n width: 12px;\n height: 6px;\n\n transition: inset-inline-start var(--lobe-popover-animation-duration)
|
|
1
|
+
{"version":3,"file":"style.mjs","names":["cssVar"],"sources":["../../src/Popover/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n arrow: css`\n --lobe-popover-arrow-offset-block: 5px;\n --lobe-popover-arrow-offset-inline: 8px;\n\n pointer-events: none;\n\n position: absolute;\n transform-origin: center;\n\n display: flex;\n\n width: 12px;\n height: 6px;\n\n transition: inset-inline-start var(--lobe-popover-animation-duration)\n var(--lobe-popover-animation-ease-out);\n\n & > svg {\n display: block;\n width: 100%;\n height: 100%;\n }\n\n & [data-role='fill'] {\n fill: ${cssVar.colorBgElevated};\n }\n\n & [data-role='stroke'] {\n fill: none;\n stroke: ${cssVar.colorBorder};\n stroke-width: 1px;\n }\n\n &[data-side='top'] {\n inset-block-end: calc(var(--lobe-popover-arrow-offset-block) * -1);\n transform: rotate(180deg);\n }\n\n &[data-side='left'] {\n inset-inline-end: calc(var(--lobe-popover-arrow-offset-inline) * -1);\n transform: rotate(90deg);\n }\n\n &[data-side='right'] {\n inset-inline-start: calc(var(--lobe-popover-arrow-offset-inline) * -1);\n transform: rotate(-90deg);\n }\n\n &[data-side='bottom'] {\n inset-block-start: calc(var(--lobe-popover-arrow-offset-block) * -1);\n }\n `,\n\n popup: css`\n position: relative;\n transform-origin: var(--transform-origin);\n\n width: var(--popup-width, auto);\n min-width: 120px;\n height: var(--popup-height, auto);\n border-radius: ${cssVar.borderRadius};\n\n color: ${cssVar.colorText};\n\n background: ${cssVar.colorBgElevated};\n outline: none;\n box-shadow:\n 0 0 15px 0 #00000008,\n 0 2px 30px 0 #00000014,\n 0 0 0 1px ${cssVar.colorBorder} inset;\n\n transition-timing-function: var(--lobe-popover-animation-ease-out);\n transition-duration: var(--lobe-popover-animation-duration);\n transition-property: width, height, opacity, transform;\n\n &[data-starting-style],\n &[data-ending-style] {\n transform: translate3d(var(--lobe-popover-translate-x), var(--lobe-popover-translate-y), 0)\n scale(var(--lobe-popover-animation-scale));\n opacity: 0;\n }\n\n &[data-ending-style] {\n transition-timing-function: var(--lobe-popover-animation-ease-in);\n transition-duration: var(--lobe-popover-animation-duration-exit);\n }\n\n &[data-instant] {\n transition: none;\n }\n `,\n\n positioner: css`\n --lobe-popover-animation-duration: 150ms;\n --lobe-popover-animation-translate: 6px;\n --lobe-popover-animation-scale: 0.96;\n --lobe-popover-animation-ease-in: ease-in;\n --lobe-popover-animation-duration-exit: 75ms;\n --lobe-popover-animation-ease-out: ${cssVar.motionEaseOut};\n --lobe-popover-translate-x: 0;\n --lobe-popover-translate-y: calc(var(--lobe-popover-animation-translate) * -1);\n\n z-index: 1100;\n\n width: var(--positioner-width);\n max-width: var(--available-width);\n height: var(--positioner-height);\n\n transition-timing-function: var(--lobe-popover-animation-ease-out);\n transition-duration: var(--lobe-popover-animation-duration);\n transition-property:\n inset-block-start, inset-inline-start, inset-inline-end, inset-block-end, transform;\n\n &[data-instant] {\n transition: none;\n }\n\n /* Fallback: never show a popover when the anchor is hidden or the positioner falls back to (0,0). */\n &[data-anchor-hidden],\n &[data-zero-origin='true'] {\n pointer-events: none;\n visibility: hidden;\n }\n\n &[data-placement='top'],\n &[data-placement='topLeft'],\n &[data-placement='topRight'] {\n --lobe-popover-translate-x: 0;\n --lobe-popover-translate-y: var(--lobe-popover-animation-translate);\n }\n\n &[data-placement='bottom'],\n &[data-placement='bottomLeft'],\n &[data-placement='bottomRight'] {\n --lobe-popover-translate-x: 0;\n --lobe-popover-translate-y: calc(var(--lobe-popover-animation-translate) * -1);\n }\n\n &[data-placement='left'],\n &[data-placement='leftTop'],\n &[data-placement='leftBottom'] {\n --lobe-popover-translate-x: var(--lobe-popover-animation-translate);\n --lobe-popover-translate-y: 0;\n }\n\n &[data-placement='right'],\n &[data-placement='rightTop'],\n &[data-placement='rightBottom'] {\n --lobe-popover-translate-x: calc(var(--lobe-popover-animation-translate) * -1);\n --lobe-popover-translate-y: 0;\n }\n `,\n\n root: css`\n user-select: none;\n position: relative;\n filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 12%));\n `,\n\n viewport: css`\n --lobe-popover-viewport-inline-padding: 12px;\n\n position: relative;\n\n overflow: clip;\n\n width: 100%;\n height: 100%;\n padding-block: 12px;\n padding-inline: var(--lobe-popover-viewport-inline-padding);\n\n [data-previous],\n [data-current] {\n transform: translateX(0);\n width: calc(var(--popup-width) - 2 * var(--lobe-popover-viewport-inline-padding));\n opacity: 1;\n transition:\n transform var(--lobe-popover-animation-duration) var(--lobe-popover-animation-ease-out),\n opacity calc(var(--lobe-popover-animation-duration) / 2)\n var(--lobe-popover-animation-ease-out);\n }\n\n &[data-activation-direction~='right'] [data-previous][data-ending-style] {\n transform: translateX(-50%);\n opacity: 0;\n }\n\n &[data-activation-direction~='right'] [data-current][data-starting-style] {\n transform: translateX(50%);\n opacity: 0;\n }\n\n &[data-activation-direction~='left'] [data-previous][data-ending-style] {\n transform: translateX(50%);\n opacity: 0;\n }\n\n &[data-activation-direction~='left'] [data-current][data-starting-style] {\n transform: translateX(-50%);\n opacity: 0;\n }\n\n &[data-activation-direction~='down'] [data-previous][data-ending-style] {\n transform: translateY(-50%);\n opacity: 0;\n }\n\n &[data-activation-direction~='down'] [data-current][data-starting-style] {\n transform: translateY(50%);\n opacity: 0;\n }\n\n &[data-activation-direction~='up'] [data-previous][data-ending-style] {\n transform: translateY(50%);\n opacity: 0;\n }\n\n &[data-activation-direction~='up'] [data-current][data-starting-style] {\n transform: translateY(-50%);\n opacity: 0;\n }\n `,\n}));\n"],"mappings":";;;AAEA,MAAa,SAAS,oBAAoB,EAAE,YAAK,wBAAc;CAC7D,OAAO,KAAG;;;;;;;;;;;;;;;;;;;;;;;;cAwBEA,SAAO,gBAAgB;;;;;gBAKrBA,SAAO,YAAY;;;;;;;;;;;;;;;;;;;;;;;CAwBjC,OAAO,KAAG;;;;;;;qBAOSA,SAAO,aAAa;;aAE5BA,SAAO,UAAU;;kBAEZA,SAAO,gBAAgB;;;;;kBAKvBA,SAAO,YAAY;;;;;;;;;;;;;;;;;;;;;;CAuBnC,YAAY,KAAG;;;;;;yCAMwBA,SAAO,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuD5D,MAAM,KAAG;;;;;CAMT,UAAU,KAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+Dd,EAAE"}
|
package/es/Popover/type.d.mts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Placement } from "../utils/placement.mjs";
|
|
2
2
|
import { CSSProperties, ReactElement, ReactNode, Ref } from "react";
|
|
3
|
-
import { PopoverBackdropProps, PopoverPopupProps, PopoverPositionerProps, PopoverTriggerProps } from "@base-ui/react/popover";
|
|
3
|
+
import { PopoverBackdropProps, PopoverPopupProps, PopoverPortalProps, PopoverPositionerProps, PopoverTriggerProps } from "@base-ui/react/popover";
|
|
4
4
|
|
|
5
5
|
//#region src/Popover/type.d.ts
|
|
6
6
|
type PopoverPlacement = Placement;
|
|
@@ -21,6 +21,10 @@ type PopoverPopupProps$1 = Omit<PopoverPopupProps, 'className' | 'style' | 'chil
|
|
|
21
21
|
* Base UI Backdrop props that can be passed through
|
|
22
22
|
*/
|
|
23
23
|
type PopoverBackdropProps$1 = Omit<PopoverBackdropProps, 'className' | 'style'>;
|
|
24
|
+
/**
|
|
25
|
+
* Base UI Portal props that can be passed through
|
|
26
|
+
*/
|
|
27
|
+
type PopoverPortalProps$1 = Omit<PopoverPortalProps, 'children' | 'container'>;
|
|
24
28
|
interface PopoverProps {
|
|
25
29
|
/**
|
|
26
30
|
* 是否显示箭头, 在 `inset` 下无法使用
|
|
@@ -110,6 +114,10 @@ interface PopoverProps {
|
|
|
110
114
|
* Base UI Popup 组件的 props
|
|
111
115
|
*/
|
|
112
116
|
popupProps?: PopoverPopupProps$1;
|
|
117
|
+
/**
|
|
118
|
+
* Base UI Portal 组件的 props
|
|
119
|
+
*/
|
|
120
|
+
portalProps?: PopoverPortalProps$1;
|
|
113
121
|
/**
|
|
114
122
|
* Base UI Positioner 组件的 props
|
|
115
123
|
*/
|
|
@@ -145,5 +153,5 @@ interface PopoverProps {
|
|
|
145
153
|
zIndex?: number;
|
|
146
154
|
}
|
|
147
155
|
//#endregion
|
|
148
|
-
export { PopoverBackdropProps$1 as PopoverBackdropProps, PopoverPlacement, PopoverPopupProps$1 as PopoverPopupProps, PopoverPositionerProps$1 as PopoverPositionerProps, PopoverProps, PopoverTrigger, PopoverTriggerComponentProps };
|
|
156
|
+
export { PopoverBackdropProps$1 as PopoverBackdropProps, PopoverPlacement, PopoverPopupProps$1 as PopoverPopupProps, PopoverPortalProps$1 as PopoverPortalProps, PopoverPositionerProps$1 as PopoverPositionerProps, PopoverProps, PopoverTrigger, PopoverTriggerComponentProps };
|
|
149
157
|
//# sourceMappingURL=type.d.mts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { SearchBarProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react0 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/SearchBar/SearchBar.d.ts
|
|
5
|
-
declare const SearchBar:
|
|
5
|
+
declare const SearchBar: react0.NamedExoticComponent<SearchBarProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { SearchBar };
|
|
8
8
|
//# sourceMappingURL=SearchBar.d.mts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { SegmentedProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react75 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/Segmented/Segmented.d.ts
|
|
5
|
-
declare const Segmented:
|
|
5
|
+
declare const Segmented: react75.NamedExoticComponent<SegmentedProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { Segmented };
|
|
8
8
|
//# sourceMappingURL=Segmented.d.mts.map
|
package/es/Select/Select.d.mts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { SelectProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react7 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/Select/Select.d.ts
|
|
5
|
-
declare const Input:
|
|
5
|
+
declare const Input: react7.NamedExoticComponent<SelectProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { Input };
|
|
8
8
|
//# sourceMappingURL=Select.d.mts.map
|
package/es/SideNav/SideNav.d.mts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { SideNavProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react20 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/SideNav/SideNav.d.ts
|
|
5
|
-
declare const SideNav:
|
|
5
|
+
declare const SideNav: react20.NamedExoticComponent<SideNavProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { SideNav };
|
|
8
8
|
//# sourceMappingURL=SideNav.d.mts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { SliderWithInputProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react19 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/SliderWithInput/SliderWithInput.d.ts
|
|
5
|
-
declare const SliderWithInput:
|
|
5
|
+
declare const SliderWithInput: react19.NamedExoticComponent<SliderWithInputProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { SliderWithInput };
|
|
8
8
|
//# sourceMappingURL=SliderWithInput.d.mts.map
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { ActionIconProps } from "../../ActionIcon/type.mjs";
|
|
2
2
|
import "../../ActionIcon/index.mjs";
|
|
3
|
-
import * as
|
|
3
|
+
import * as react80 from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/SortableList/components/DragHandle.d.ts
|
|
6
|
-
declare const DragHandle:
|
|
6
|
+
declare const DragHandle: react80.NamedExoticComponent<ActionIconProps>;
|
|
7
7
|
//#endregion
|
|
8
8
|
export { DragHandle };
|
|
9
9
|
//# sourceMappingURL=DragHandle.d.mts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { FlexboxProps } from "../../Flex/type.mjs";
|
|
2
2
|
import "../../Flex/index.mjs";
|
|
3
|
-
import * as
|
|
3
|
+
import * as react78 from "react";
|
|
4
4
|
import "@dnd-kit/core";
|
|
5
5
|
|
|
6
6
|
//#region src/SortableList/components/SortableItem.d.ts
|
|
@@ -9,7 +9,7 @@ interface SortableItemProps extends Omit<FlexboxProps, 'id'> {
|
|
|
9
9
|
id: string | number;
|
|
10
10
|
variant?: 'borderless' | 'filled' | 'outlined';
|
|
11
11
|
}
|
|
12
|
-
declare const SortableItem:
|
|
12
|
+
declare const SortableItem: react78.NamedExoticComponent<SortableItemProps>;
|
|
13
13
|
//#endregion
|
|
14
14
|
export { SortableItem };
|
|
15
15
|
//# sourceMappingURL=SortableItem.d.mts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { ThemeProviderProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react22 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/ThemeProvider/ThemeProvider.d.ts
|
|
5
|
-
declare const ThemeProvider:
|
|
5
|
+
declare const ThemeProvider: react22.NamedExoticComponent<ThemeProviderProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { ThemeProvider };
|
|
8
8
|
//# sourceMappingURL=ThemeProvider.d.mts.map
|
package/es/Toc/Toc.d.mts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { TocProps } from "./type.mjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react12 from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/Toc/Toc.d.ts
|
|
5
|
-
declare const Toc:
|
|
5
|
+
declare const Toc: react12.NamedExoticComponent<TocProps>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { Toc };
|
|
8
8
|
//# sourceMappingURL=Toc.d.mts.map
|
|
@@ -6,23 +6,32 @@ import { TooltipArrowIcon } from "./ArrowIcon.mjs";
|
|
|
6
6
|
import TooltipContent_default from "./TooltipContent.mjs";
|
|
7
7
|
import { useTooltipPortalContainer } from "./TooltipPortal.mjs";
|
|
8
8
|
import { styles } from "./style.mjs";
|
|
9
|
-
import {
|
|
9
|
+
import { useDestroyOnInvalidActiveTriggerElement, useHidePopupWhenPositionerAtOrigin } from "../utils/destroyOnInvalidActiveTriggerElement.mjs";
|
|
10
|
+
import { useCallback, useRef, useState } from "react";
|
|
10
11
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
11
12
|
import { cx } from "antd-style";
|
|
12
13
|
import { Tooltip } from "@base-ui/react/tooltip";
|
|
13
14
|
|
|
14
15
|
//#region src/Tooltip/TooltipGroup.tsx
|
|
15
|
-
const TooltipGroup = ({ children, layoutAnimation = false, ...sharedProps }) => {
|
|
16
|
-
const handle =
|
|
16
|
+
const TooltipGroup = ({ children, disableDestroyOnInvalidTrigger = false, disableZeroOriginGuard = false, layoutAnimation = false, ...sharedProps }) => {
|
|
17
|
+
const [{ handle, key }, setHandleState] = useState(() => ({
|
|
18
|
+
handle: Tooltip.createHandle(),
|
|
19
|
+
key: 0
|
|
20
|
+
}));
|
|
17
21
|
const activeItemRef = useRef(null);
|
|
18
|
-
const
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
+
const destroy = useCallback(() => {
|
|
23
|
+
activeItemRef.current = null;
|
|
24
|
+
setHandleState(({ key: key$1 }) => ({
|
|
25
|
+
handle: Tooltip.createHandle(),
|
|
26
|
+
key: key$1 + 1
|
|
27
|
+
}));
|
|
28
|
+
}, []);
|
|
22
29
|
const handleOpenChange = useCallback((open) => {
|
|
23
30
|
activeItemRef.current?.onOpenChange?.(open);
|
|
24
31
|
}, []);
|
|
25
32
|
const portalContainer = useTooltipPortalContainer();
|
|
33
|
+
useDestroyOnInvalidActiveTriggerElement(handle.store, destroy, { enabled: !disableDestroyOnInvalidTrigger });
|
|
34
|
+
useHidePopupWhenPositionerAtOrigin(handle.store, { enabled: !disableZeroOriginGuard });
|
|
26
35
|
return /* @__PURE__ */ jsx(TooltipGroupHandleContext.Provider, {
|
|
27
36
|
value: handle,
|
|
28
37
|
children: /* @__PURE__ */ jsxs(TooltipGroupPropsContext.Provider, {
|
|
@@ -96,9 +105,9 @@ const TooltipGroup = ({ children, layoutAnimation = false, ...sharedProps }) =>
|
|
|
96
105
|
return portalContainer ? /* @__PURE__ */ jsx(Tooltip.Portal, {
|
|
97
106
|
container: portalContainer,
|
|
98
107
|
children: popup
|
|
99
|
-
}) :
|
|
108
|
+
}) : null;
|
|
100
109
|
}
|
|
101
|
-
},
|
|
110
|
+
}, key)]
|
|
102
111
|
})
|
|
103
112
|
});
|
|
104
113
|
};
|