@lobehub/ui/es/base-ui/ActionIcon/ActionIcon.mjs

Lobe UI is an open-source UI component library for building AIGC web apps

"use client";
import Icon from "../../Icon/Icon.mjs";
import { Tooltip } from "../Tooltip/Tooltip.mjs";
import Button from "../Button/Button.mjs";
import { variants } from "./style.mjs";
import { calcSize } from "./utils.mjs";
import { memo, useMemo } from "react";
import { jsx } from "react/jsx-runtime";
import { cx } from "antd-style";
//#region src/base-ui/ActionIcon/ActionIcon.tsx
const resolveButtonType = (variant) => {
	if (variant === "filled") return "fill";
	if (variant === "outlined") return "default";
	return "text";
};
const resolveButtonSize = (size) => {
	if (size === "small") return "small";
	if (size === "large") return "large";
	return "middle";
};
const ActionIcon = memo(({ active, className, classNames, color, danger, disabled, fill, fillOpacity, fillRule, focusable, glass, icon, loading, onClick, ref, shadow, size = "middle", spin: iconSpinning, style, styles, title, tooltipProps, variant = "borderless", ...rest }) => {
	const { blockSize, borderRadius } = useMemo(() => calcSize(size), [size]);
	const popupTriggerAria = rest;
	const isPopupTrigger = popupTriggerAria["aria-haspopup"] !== void 0 || popupTriggerAria["aria-expanded"] !== void 0;
	const popupTriggerLabel = popupTriggerAria["aria-label"] ?? (isPopupTrigger && typeof title === "string" ? title : void 0);
	const handleClick = (event) => {
		onClick?.(event);
	};
	const iconNode = icon ? /* @__PURE__ */ jsx(Icon, {
		className: classNames?.icon,
		color,
		fill,
		fillOpacity,
		fillRule,
		focusable,
		icon,
		size,
		spin: iconSpinning,
		style: {
			pointerEvents: "none",
			...styles?.icon
		}
	}) : void 0;
	const node = /* @__PURE__ */ jsx(Button, {
		...rest,
		"aria-label": popupTriggerLabel,
		className: cx(variants({
			active,
			danger,
			glass,
			shadow
		}), classNames?.root, className),
		danger,
		disabled,
		htmlType: "button",
		icon: iconNode,
		loading,
		ref,
		size: resolveButtonSize(size),
		tabIndex: disabled ? -1 : 0,
		type: resolveButtonType(variant),
		style: {
			borderRadius,
			height: blockSize,
			width: blockSize,
			...styles?.root,
			...style
		},
		onClick: handleClick
	});
	if (!title) return node;
	return /* @__PURE__ */ jsx(Tooltip, {
		title,
		...tooltipProps,
		styles: {
			...tooltipProps?.styles,
			container: {
				pointerEvents: "none",
				...tooltipProps?.styles?.container
			}
		},
		children: node
	});
});
ActionIcon.displayName = "BaseActionIcon";
//#endregion
export { ActionIcon as default };

//# sourceMappingURL=ActionIcon.mjs.map