@lobehub/editor 4.15.1 → 4.16.0

package/es/plugins/virtual-block/plugin/register.js

@@ -0,0 +1,150 @@
+import { createDebugLogger, init_debug } from "../../../utils/debug.js";
+import { $closest } from "../../../editor-kernel/utils.js";
+import { SELECT_AFTER_CODEMIRROR_COMMAND, SELECT_BEFORE_CODEMIRROR_COMMAND } from "../../codemirror-block/command/index.js";
+import { $createParagraphNode, $getNodeByKey, $getRoot, $getSelection, $isDecoratorNode, $isNodeSelection, $isRangeSelection, $isRootOrShadowRoot, $isTextNode, COMMAND_PRIORITY_NORMAL, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, ParagraphNode } from "lexical";
+import { mergeRegister } from "@lexical/utils";
+import "@lexical/code-core";
+//#region src/plugins/virtual-block/plugin/register.ts
+init_debug();
+const logger = createDebugLogger("plugin", "virtual-block");
+function toRootElement(node) {
+	let currentNode = node;
+	let parent = currentNode.getParent();
+	while (parent !== null && !$isRootOrShadowRoot(parent)) {
+		currentNode = parent;
+		parent = currentNode.getParent();
+	}
+	return currentNode;
+}
+function $isEmptyNode(node) {
+	if (node.getChildrenSize() === 0) return true;
+	for (const child of node.getChildren()) if ($isTextNode(child)) {
+		if (child.getTextContent().trim().length > 0) return false;
+	} else if (!$isEmptyNode(child)) return false;
+	return true;
+}
+function registerRichKeydown(editor, kernel) {
+	let needRemoveOnFocusNode = null;
+	return mergeRegister(editor.registerUpdateListener((payload) => {
+		const { mutatedNodes } = payload;
+		if (needRemoveOnFocusNode) {
+			if (mutatedNodes?.get(ParagraphNode)?.get(needRemoveOnFocusNode.getKey()) === "destroyed") {
+				console.info("Virtual block node was removed externally", needRemoveOnFocusNode);
+				needRemoveOnFocusNode = null;
+				return;
+			}
+			editor.update(() => {
+				try {
+					const selection = $getSelection();
+					if ($isRangeSelection(selection)) {
+						const focusNode = selection.focus.getNode();
+						if (needRemoveOnFocusNode && !$closest(focusNode, (node) => node === needRemoveOnFocusNode)) {
+							if ($isEmptyNode(needRemoveOnFocusNode)) {
+								logger.info("Removing virtual block node after focus moved away", needRemoveOnFocusNode);
+								needRemoveOnFocusNode?.remove();
+								needRemoveOnFocusNode = null;
+							} else needRemoveOnFocusNode = null;
+							return;
+						}
+					} else if ($isNodeSelection(selection) && needRemoveOnFocusNode) {
+						if ($isEmptyNode(needRemoveOnFocusNode)) {
+							needRemoveOnFocusNode?.remove();
+							needRemoveOnFocusNode = null;
+						} else needRemoveOnFocusNode = null;
+						return;
+					}
+				} catch (error) {
+					console.error("Error during virtual block cleanup", error);
+				}
+			});
+		}
+	}), kernel.registerHighCommand(KEY_ARROW_UP_COMMAND, (event) => {
+		const selection = $getSelection();
+		if (event.shiftKey) return false;
+		if ($isNodeSelection(selection)) {
+			const nodes = selection.getNodes();
+			if (nodes.length > 0) {
+				const elementNode = toRootElement(nodes[0]);
+				event.preventDefault();
+				const p = $createParagraphNode();
+				needRemoveOnFocusNode = p;
+				elementNode.insertBefore(p);
+				p.selectEnd();
+				return true;
+			}
+		} else if ($isRangeSelection(selection)) {
+			const possibleNode = toRootElement(selection.focus.getNode());
+			if (possibleNode === needRemoveOnFocusNode || $isEmptyNode(possibleNode)) return false;
+			if ($getRoot().getFirstChild() === possibleNode) {
+				event.preventDefault();
+				const p = $createParagraphNode();
+				possibleNode.insertBefore(p);
+				needRemoveOnFocusNode = p;
+				p.selectStart();
+				return true;
+			} else if ($isDecoratorNode(possibleNode.getPreviousSibling())) {
+				event.preventDefault();
+				const p = $createParagraphNode();
+				possibleNode.insertBefore(p);
+				needRemoveOnFocusNode = p;
+				p.selectStart();
+				return true;
+			}
+		}
+		return false;
+	}, COMMAND_PRIORITY_NORMAL), kernel.registerHighCommand(KEY_ARROW_DOWN_COMMAND, (event) => {
+		const selection = $getSelection();
+		if ($isNodeSelection(selection)) {
+			const nodes = selection.getNodes();
+			if (nodes.length > 0) {
+				const node = nodes[0];
+				const blockNode = toRootElement(node);
+				event.preventDefault();
+				const p = $createParagraphNode();
+				needRemoveOnFocusNode = p;
+				blockNode.insertAfter(p);
+				p.selectStart();
+				return true;
+			}
+		} else if ($isRangeSelection(selection)) {
+			if (!selection.isCollapsed()) return false;
+			const possibleNode = toRootElement(selection.focus.getNode());
+			if (possibleNode === needRemoveOnFocusNode || $isEmptyNode(possibleNode)) return false;
+			if ($getRoot().getLastChild() === possibleNode) {
+				event.preventDefault();
+				const p = $createParagraphNode();
+				possibleNode.insertAfter(p);
+				needRemoveOnFocusNode = p;
+				p.selectStart();
+			}
+			return true;
+		}
+		return false;
+	}, COMMAND_PRIORITY_NORMAL), editor.registerCommand(SELECT_BEFORE_CODEMIRROR_COMMAND, (payload) => {
+		editor.update(() => {
+			const node = $getNodeByKey(payload.key);
+			if (!node) return;
+			const p = $createParagraphNode();
+			needRemoveOnFocusNode = p;
+			node.insertBefore(p);
+			p.selectEnd();
+			editor.focus();
+			return true;
+		});
+		return true;
+	}, COMMAND_PRIORITY_NORMAL), editor.registerCommand(SELECT_AFTER_CODEMIRROR_COMMAND, (payload) => {
+		editor.update(() => {
+			const node = $getNodeByKey(payload.key);
+			if (!node) return;
+			const p = $createParagraphNode();
+			needRemoveOnFocusNode = p;
+			node.insertAfter(p);
+			p.selectEnd();
+			editor.focus();
+			return true;
+		});
+		return true;
+	}, COMMAND_PRIORITY_NORMAL));
+}
+//#endregion
+export { registerRichKeydown };

package/es/plugins/virtual-block/react/ReactVirtualBlock.d.ts

@@ -0,0 +1,6 @@
+import { FC } from "react";
+
+//#region src/plugins/virtual-block/react/ReactVirtualBlock.d.ts
+declare const ReactVirtualBlockPlugin: FC;
+//#endregion
+export { ReactVirtualBlockPlugin };

package/es/plugins/virtual-block/react/ReactVirtualBlock.js

@@ -0,0 +1,15 @@
+"use client";
+import { useLexicalComposerContext } from "../../../editor-kernel/react/react-context.js";
+import { VirtualBlockPlugin } from "../plugin/index.js";
+import { useLayoutEffect } from "react";
+//#region src/plugins/virtual-block/react/ReactVirtualBlock.tsx
+const ReactVirtualBlockPlugin = () => {
+	const [editor] = useLexicalComposerContext();
+	useLayoutEffect(() => {
+		editor.registerPlugin(VirtualBlockPlugin);
+	}, []);
+	return null;
+};
+ReactVirtualBlockPlugin.displayName = "ReactVirtualBlockPlugin";
+//#endregion
+export { ReactVirtualBlockPlugin as default };

package/es/plugins/virtual-block/react/index.d.ts

@@ -0,0 +1 @@
+import { ReactVirtualBlockPlugin } from "./ReactVirtualBlock.js";

package/es/react/ChatInput/ChatInput.d.ts

@@ -0,0 +1,7 @@
+import { ChatInputProps } from "./type.js";
+import { FC } from "react";
+
+//#region src/react/ChatInput/ChatInput.d.ts
+declare const ChatInput: FC<ChatInputProps>;
+//#endregion
+export { ChatInput };

package/es/react/ChatInput/ChatInput.js

@@ -0,0 +1,91 @@
+"use client";
+import { useHeight } from "../hooks/useSize.js";
+import { styles } from "./style.js";
+import { Flexbox } from "@lobehub/ui";
+import { useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+import { Resizable } from "re-resizable";
+import useMergeState from "use-merge-value";
+//#region src/react/ChatInput/ChatInput.tsx
+const ChatInput = (props) => {
+	const { defaultHeight = props.defaultHeight || props.minHeight || 64, height, maxHeight = 320, minHeight = 64, resizeMaxHeightOffset = 120, resize = true, onSizeChange, onSizeDragging, className, children, footer, header, style, slashMenuRef, classNames, fullscreen, showResizeHandle, onBodyClick, styles: customStyles, ...rest } = props;
+	const { isDarkMode } = useThemeMode();
+	const { ref: headerRef, height: headerHeight = 0 } = useHeight();
+	const [currentHeight, setCurrentHeight] = useMergeState(defaultHeight, {
+		defaultValue: defaultHeight,
+		onChange: onSizeChange,
+		value: height
+	});
+	const handleResizeStop = useCallback((e, direction, ref) => {
+		setCurrentHeight(ref.style.height ? parseInt(ref.style.height) : defaultHeight);
+	}, [setCurrentHeight, defaultHeight]);
+	const handleResize = useCallback((e, direction, ref) => {
+		const newHeight = ref.style.height ? parseInt(ref.style.height) : defaultHeight;
+		onSizeDragging?.(newHeight);
+	}, [onSizeDragging, defaultHeight]);
+	const bodyNode = /* @__PURE__ */ jsx("div", {
+		className: cx(styles.editor, styles.bodyEditor, classNames?.body),
+		draggable: false,
+		onClick: onBodyClick,
+		style: {
+			...customStyles?.body,
+			maxHeight: fullscreen ? "100%" : maxHeight,
+			minHeight: resize ? currentHeight : minHeight
+		},
+		children
+	});
+	return /* @__PURE__ */ jsxs(Flexbox, {
+		className: cx(isDarkMode ? styles.containerDark : styles.containerLight, styles.root, className),
+		height: fullscreen ? "100%" : void 0,
+		style,
+		width: "100%",
+		...rest,
+		children: [
+			slashMenuRef && /* @__PURE__ */ jsx("div", { ref: slashMenuRef }),
+			/* @__PURE__ */ jsx("div", {
+				className: cx(styles.header, classNames?.header),
+				ref: headerRef,
+				style: customStyles?.header,
+				children: header
+			}),
+			resize ? /* @__PURE__ */ jsx(Resizable, {
+				className: styles.resizableContainer,
+				enable: fullscreen ? false : { top: true },
+				handleClasses: { top: showResizeHandle ? styles.resizeHandle : void 0 },
+				handleStyles: { top: {
+					backgroundColor: "transparent",
+					borderRadius: "4px",
+					cursor: "ns-resize",
+					height: "8px",
+					left: "50%",
+					top: !!header ? -3 - headerHeight : -3,
+					transform: "translateX(-50%)",
+					width: "100%"
+				} },
+				maxHeight: fullscreen ? void 0 : maxHeight + resizeMaxHeightOffset,
+				minHeight: fullscreen ? void 0 : minHeight,
+				onResize: handleResize,
+				onResizeStop: handleResizeStop,
+				size: {
+					height: fullscreen ? void 0 : "auto",
+					width: "100%"
+				},
+				style: fullscreen ? {
+					flex: 1,
+					overflow: "hidden",
+					position: "relative"
+				} : void 0,
+				children: bodyNode
+			}) : bodyNode,
+			/* @__PURE__ */ jsx("div", {
+				className: cx(styles.footer, classNames?.footer),
+				style: customStyles?.footer,
+				children: footer
+			})
+		]
+	});
+};
+ChatInput.displayName = "ChatInput";
+//#endregion
+export { ChatInput as default };

package/es/react/ChatInput/index.d.ts

@@ -0,0 +1,2 @@
+import { ChatInputProps } from "./type.js";
+import { ChatInput } from "./ChatInput.js";

package/es/react/ChatInput/style.js

@@ -0,0 +1,115 @@
+import { createStaticStyles } from "antd-style";
+//#region src/react/ChatInput/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	bodyEditor: css`
+    z-index: 0;
+    flex: 1;
+  `,
+	containerDark: css`
+    position: relative;
+
+    display: flex;
+    flex-direction: column;
+
+    height: 100%;
+    border: 1px solid ${cssVar.colorFillSecondary};
+    border-radius: ${cssVar.borderRadiusLG};
+
+    background-color: ${cssVar.colorBgElevated};
+    box-shadow: 0 4px 4px color-mix(in srgb, #000 40%, transparent);
+  `,
+	containerLight: css`
+    position: relative;
+
+    display: flex;
+    flex-direction: column;
+
+    height: 100%;
+    border: 1px solid ${cssVar.colorFill};
+    border-radius: ${cssVar.borderRadiusLG};
+
+    background-color: ${cssVar.colorBgElevated};
+    box-shadow: 0 4px 4px color-mix(in srgb, #000 4%, transparent);
+  `,
+	editor: css`
+    cursor: text;
+
+    overflow: hidden auto;
+    flex: 1;
+
+    width: 100%;
+    padding-block: 8px 0;
+    padding-inline: 12px;
+  `,
+	footer: css`
+    z-index: 1;
+    width: 100%;
+  `,
+	header: css`
+    z-index: 1;
+    width: 100%;
+  `,
+	resizableContainer: css`
+    position: relative;
+
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    align-self: flex-end;
+
+    width: 100%;
+
+    &:hover .resize-handle {
+      opacity: 1;
+    }
+  `,
+	resizeHandle: css`
+    position: absolute;
+    inset-block-start: -4px;
+    inset-inline-start: 50%;
+    transform: translateX(-50%);
+
+    width: 100%;
+    height: 8px;
+
+    opacity: 0;
+
+    transition: opacity 0.2s ease-in-out;
+
+    &::before {
+      content: '';
+
+      position: absolute;
+      inset-block-start: 0;
+      inset-inline-start: 50%;
+      transform: translateX(-50%);
+
+      width: 32px;
+      height: 4px;
+      border-radius: 4px;
+
+      background-color: ${cssVar.colorPrimary};
+      box-shadow: 0 1px 2px color-mix(in srgb, ${cssVar.colorTextSecondary} 12.5%, transparent);
+    }
+
+    &:hover {
+      opacity: 1 !important;
+
+      &::before {
+        background-color: ${cssVar.colorPrimaryHover};
+        box-shadow: 0 2px 4px color-mix(in srgb, ${cssVar.colorTextSecondary} 25%, transparent);
+      }
+    }
+
+    &:active {
+      &::before {
+        background-color: ${cssVar.colorPrimaryActive};
+      }
+    }
+  `,
+	root: css`
+    position: relative;
+  `
+}));
+//#endregion
+export { styles };

package/es/react/ChatInput/type.d.ts

@@ -0,0 +1,32 @@
+import { FlexboxProps } from "@lobehub/ui";
+import { CSSProperties, ReactNode, Ref } from "react";
+
+//#region src/react/ChatInput/type.d.ts
+interface ChatInputProps extends Omit<FlexboxProps, 'height'> {
+  classNames?: {
+    body?: string;
+    footer?: string;
+    header?: string;
+  };
+  defaultHeight?: number;
+  footer?: ReactNode;
+  fullscreen?: boolean;
+  header?: ReactNode;
+  height?: number;
+  maxHeight?: number;
+  minHeight?: number;
+  onBodyClick?: FlexboxProps['onClick'];
+  onSizeChange?: (height: number) => void;
+  onSizeDragging?: (height: number) => void;
+  resize?: boolean;
+  resizeMaxHeightOffset?: number;
+  showResizeHandle?: boolean;
+  slashMenuRef?: Ref<HTMLDivElement>;
+  styles?: {
+    body?: CSSProperties;
+    footer?: CSSProperties;
+    header?: CSSProperties;
+  };
+}
+//#endregion
+export { ChatInputProps };

package/es/react/ChatInputActionBar/ChatInputActionBar.d.ts

@@ -0,0 +1,7 @@
+import { ChatInputActionBarProps } from "./type.js";
+import { FC } from "react";
+
+//#region src/react/ChatInputActionBar/ChatInputActionBar.d.ts
+declare const ChatInputActionBar: FC<ChatInputActionBarProps>;
+//#endregion
+export { ChatInputActionBar };

package/es/react/ChatInputActionBar/ChatInputActionBar.js

@@ -0,0 +1,22 @@
+"use client";
+import { styles } from "./style.js";
+import { Flexbox } from "@lobehub/ui";
+import { jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/react/ChatInputActionBar/ChatInputActionBar.tsx
+const ChatInputActionBar = ({ className, style, left, right, ...rest }) => {
+	return /* @__PURE__ */ jsxs(Flexbox, {
+		align: "center",
+		className: cx(styles.container, className),
+		gap: 4,
+		horizontal: true,
+		justify: "space-between",
+		padding: 4,
+		style,
+		...rest,
+		children: [left, right]
+	});
+};
+ChatInputActionBar.displayName = "ChatInputActionBar";
+//#endregion
+export { ChatInputActionBar as default };

package/es/react/ChatInputActionBar/index.d.ts

@@ -0,0 +1,2 @@
+import { ChatInputActionBarProps } from "./type.js";
+import { ChatInputActionBar } from "./ChatInputActionBar.js";

package/es/react/ChatInputActionBar/style.js

@@ -0,0 +1,7 @@
+import { createStaticStyles } from "antd-style";
+//#region src/react/ChatInputActionBar/style.ts
+const styles = createStaticStyles(({ css }) => ({ container: css`
+    overflow: hidden;
+  ` }));
+//#endregion
+export { styles };

package/es/react/ChatInputActionBar/type.d.ts

@@ -0,0 +1,10 @@
+import { FlexboxProps } from "@lobehub/ui";
+import { ReactNode } from "react";
+
+//#region src/react/ChatInputActionBar/type.d.ts
+interface ChatInputActionBarProps extends Omit<FlexboxProps, 'children'> {
+  left?: ReactNode;
+  right?: ReactNode;
+}
+//#endregion
+export { ChatInputActionBarProps };

package/es/react/ChatInputActions/ChatInputActions.d.ts

@@ -0,0 +1,7 @@
+import { ChatInputActionsProps } from "./type.js";
+import * as _$react from "react";
+
+//#region src/react/ChatInputActions/ChatInputActions.d.ts
+declare const ChatInputActions: _$react.NamedExoticComponent<ChatInputActionsProps>;
+//#endregion
+export { ChatInputActions };

package/es/react/ChatInputActions/ChatInputActions.js

@@ -0,0 +1,65 @@
+"use client";
+import { styles } from "./style.js";
+import ActionItem from "./components/ActionItem.js";
+import { useDisplayActionCount } from "./components/useDisplayActionCount.js";
+import { Flexbox, TooltipGroup } from "@lobehub/ui";
+import { memo, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import useMergeState from "use-merge-value";
+//#region src/react/ChatInputActions/ChatInputActions.tsx
+const ChatInputActions = memo(({ gap = 2, disabled, items = [], onActionClick, className, collapseOffset = 0, autoCollapse = true, defaultGroupCollapse = false, onGroupCollapseChange, groupCollapse, ...rest }) => {
+	const [groupCollapsed, setGroupCollapsed] = useMergeState(defaultGroupCollapse, {
+		defaultValue: defaultGroupCollapse,
+		onChange: onGroupCollapseChange,
+		value: groupCollapse
+	});
+	const { ref, maxCount, collapsed } = useDisplayActionCount({
+		autoCollapse,
+		collapseOffset,
+		items
+	});
+	const calcItem = useMemo(() => {
+		if (!collapsed) return items;
+		const alwaysDisplayItems = items.filter((item) => item.alwaysDisplay);
+		const normalItems = items.filter((item) => item.type !== "collapse" && !item.alwaysDisplay);
+		const collapseItems = items.find((item) => item.type === "collapse" && item.children) || {
+			children: [],
+			type: "collapse"
+		};
+		const sliceCount = maxCount - alwaysDisplayItems.length - 1;
+		return [
+			...normalItems.slice(0, sliceCount),
+			{
+				...collapseItems,
+				children: [...normalItems.filter((item) => item.type !== "divider").slice(sliceCount), ...collapseItems.children]
+			},
+			...alwaysDisplayItems
+		].filter(Boolean);
+	}, [
+		collapsed,
+		items,
+		maxCount
+	]);
+	return /* @__PURE__ */ jsx(TooltipGroup, { children: /* @__PURE__ */ jsx(Flexbox, {
+		align: "center",
+		className: cx(styles.container, className),
+		flex: 1,
+		gap,
+		horizontal: true,
+		ref,
+		...rest,
+		children: calcItem.map((item, index) => /* @__PURE__ */ jsx(ActionItem, {
+			collapsed,
+			disabled,
+			gap,
+			groupCollapsed,
+			item,
+			onActionClick,
+			setGroupCollapsed
+		}, item.key || index))
+	}) });
+});
+ChatInputActions.displayName = "ChatInputActions";
+//#endregion
+export { ChatInputActions as default };

package/es/react/ChatInputActions/components/ActionItem.js

@@ -0,0 +1,46 @@
+"use client";
+import ActionRender from "./ActionRender.js";
+import CollapsedActions from "./CollapsedActions.js";
+import { ActionIcon, Dropdown } from "@lobehub/ui";
+import { jsx } from "react/jsx-runtime";
+//#region src/react/ChatInputActions/components/ActionItem.tsx
+const ActionItem = ({ item, disabled, onActionClick, groupCollapsed, collapsed, gap, setGroupCollapsed }) => {
+	if (item.type === "collapse") return /* @__PURE__ */ jsx(CollapsedActions, {
+		gap,
+		groupCollapse: groupCollapsed,
+		mode: collapsed ? "popup" : "default",
+		onGroupCollapseChange: setGroupCollapsed,
+		children: item.children.map((child, childIndex) => /* @__PURE__ */ jsx(ActionRender, {
+			disabled,
+			item: child,
+			onActionClick
+		}, child?.key || `action-${childIndex}`))
+	});
+	if (item.type === "dropdown") return /* @__PURE__ */ jsx(Dropdown, {
+		menu: { items: item.children },
+		children: /* @__PURE__ */ jsx(ActionIcon, {
+			active: item.active,
+			danger: item.danger,
+			disabled: disabled || item.loading || item?.disabled,
+			icon: item.icon,
+			loading: item.loading,
+			size: {
+				blockSize: 36,
+				size: 20
+			},
+			title: item.label,
+			tooltipProps: {
+				placement: "top",
+				...item.tooltipProps
+			}
+		})
+	}, item.key);
+	return /* @__PURE__ */ jsx(ActionRender, {
+		disabled,
+		item,
+		onActionClick
+	});
+};
+ActionItem.displayName = "ChatInputActionItem";
+//#endregion
+export { ActionItem as default };

package/es/react/ChatInputActions/components/ActionRender.js

@@ -0,0 +1,45 @@
+import { styles } from "../style.js";
+import { ActionIcon } from "@lobehub/ui";
+import { isValidElement } from "react";
+import { jsx } from "react/jsx-runtime";
+import { Divider } from "antd";
+//#region src/react/ChatInputActions/components/ActionRender.tsx
+const ActionRender = ({ item, onActionClick, disabled }) => {
+	if (item.type === "divider") return /* @__PURE__ */ jsx(Divider, {
+		className: styles.divider,
+		orientation: "vertical"
+	});
+	const { wrapper, icon, key, label, onClick, danger, loading, active, tooltipProps, ...itemRest } = item;
+	if (item.children && isValidElement(item.children)) {
+		if (!wrapper) return item.children;
+		return wrapper(item.children);
+	}
+	const action = /* @__PURE__ */ jsx(ActionIcon, {
+		active,
+		danger,
+		disabled: disabled || loading || itemRest?.disabled,
+		icon,
+		loading,
+		onClick: (e) => {
+			onActionClick?.({
+				domEvent: e,
+				key: String(key),
+				keyPath: [String(key)]
+			});
+			onClick?.(e);
+		},
+		size: {
+			blockSize: 36,
+			size: 20
+		},
+		title: label,
+		tooltipProps: {
+			placement: "top",
+			...tooltipProps
+		}
+	});
+	if (!wrapper) return action;
+	return wrapper(action);
+};
+//#endregion
+export { ActionRender as default };