/** @license MIT | @cube-dev/ui-kit v0.147.0 | Cube Dev Team */
import { mergeProps } from "../../../utils/react/mergeProps.js";
import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
import { DANGER_CLEAR_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, NOTE_CLEAR_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, WARNING_CLEAR_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES } from "../../../data/item-themes.js";
import { CheckIcon } from "../../../icons/CheckIcon.js";
import { LoadingIcon } from "../../../icons/LoadingIcon.js";
import { useItemActionContext } from "../ItemActionContext.js";
import { useAction } from "../use-action.js";
import { tasty } from "@tenphi/tasty";
import { forwardRef, useMemo } from "react";
import { jsx, jsxs } from "react/jsx-runtime";

//#region src/components/actions/ItemAction/ItemAction.tsx
const ItemActionElement = tasty({
	qa: "ItemAction",
	styles: {
		...ITEM_ACTION_BASE_STYLES,
		recipe: "reset button",
		outlineOffset: 1,
		cursor: {
			"": "$pointer",
			disabled: "default"
		},
		preset: {
			"": "t4",
			"size=xlarge": "t3m"
		},
		padding: {
			"": "0 $inline-padding",
			"has-icon": 0,
			"has-icon & has-label": "0 $inline-padding 0 0"
		},
		"$inline-padding": {
			"": "max($min-inline-padding, (($action-size - 1lh - 2bw) / 2 + $inline-compensation))",
			"size=inline": ".25x"
		},
		"$inline-compensation": ".5x",
		"$min-inline-padding": "(.5x - 1bw)",
		"$local-icon-size": "$icon-size",
		Icon: {
			$: ">",
			...ITEM_ACTION_BASE_STYLES.Icon,
			"$icon-size": "min($local-icon-size, ($action-size - .25x))"
		}
	},
	variants: {
		"default.primary": DEFAULT_PRIMARY_STYLES,
		"default.outline": DEFAULT_OUTLINE_STYLES,
		"default.clear": DEFAULT_CLEAR_STYLES,
		"danger.primary": DANGER_PRIMARY_STYLES,
		"danger.outline": DANGER_OUTLINE_STYLES,
		"danger.clear": DANGER_CLEAR_STYLES,
		"success.primary": SUCCESS_PRIMARY_STYLES,
		"success.outline": SUCCESS_OUTLINE_STYLES,
		"success.clear": SUCCESS_CLEAR_STYLES,
		"warning.primary": WARNING_PRIMARY_STYLES,
		"warning.outline": WARNING_OUTLINE_STYLES,
		"warning.clear": WARNING_CLEAR_STYLES,
		"note.primary": NOTE_PRIMARY_STYLES,
		"note.outline": NOTE_OUTLINE_STYLES,
		"note.clear": NOTE_CLEAR_STYLES,
		"special.primary": SPECIAL_PRIMARY_STYLES,
		"special.outline": SPECIAL_OUTLINE_STYLES,
		"special.clear": SPECIAL_CLEAR_STYLES
	}
});
const ItemAction = forwardRef(function ItemAction(allProps, ref) {
	const { type: contextType, theme: contextTheme, disableActionsFocus, isDisabled: contextIsDisabled } = useItemActionContext();
	const { type = contextType ?? "clear", theme = contextTheme ?? "default", icon, children, isLoading = false, isSelected = false, tooltip, mods, styles, isDisabled: isDisabledProp, ...rest } = allProps;
	const isDisabled = isDisabledProp ?? contextIsDisabled;
	const hasCheckmark = icon === "checkmark";
	const finalIcon = isLoading ? /* @__PURE__ */ jsx(LoadingIcon, {}) : hasCheckmark ? /* @__PURE__ */ jsx(CheckIcon, {}) : icon;
	const finalMods = useMemo(() => ({
		checkmark: hasCheckmark,
		selected: isSelected,
		loading: isLoading,
		"has-label": !!children,
		context: !!contextType,
		"has-icon": !!icon,
		...mods
	}), [
		hasCheckmark,
		isSelected,
		isLoading,
		children,
		contextType,
		mods
	]);
	const ariaLabel = useMemo(() => {
		if (typeof tooltip === "string") return tooltip;
		if (typeof tooltip === "object" && tooltip.title) return tooltip.title;
		return rest["aria-label"];
	}, [tooltip, rest]);
	const { actionProps } = useAction({
		...rest,
		isDisabled,
		"aria-label": ariaLabel,
		mods: finalMods,
		htmlType: "button"
	}, ref);
	const finalTabIndex = disableActionsFocus ? -1 : rest.tabIndex;
	const showTooltip = !children && tooltip;
	const tooltipContent = useMemo(() => {
		if (typeof tooltip === "string") return tooltip;
		if (typeof tooltip === "object" && tooltip.title) return tooltip.title;
	}, [tooltip]);
	const tooltipProps = useMemo(() => {
		if (typeof tooltip === "object") {
			const { title, ...rest } = tooltip;
			return rest;
		}
		return {};
	}, [tooltip]);
	const finalType = type;
	const renderButton = (tooltipTriggerProps, tooltipRef) => {
		return /* @__PURE__ */ jsxs(ItemActionElement, {
			...tooltipRef ? mergeProps(actionProps, tooltipTriggerProps || {}, { ref: (element) => {
				if (tooltipRef) tooltipRef.current = element;
				const actionRef = actionProps.ref;
				if (actionRef) if (typeof actionRef === "function") actionRef(element);
				else actionRef.current = element;
			} }) : mergeProps(actionProps, tooltipTriggerProps || {}),
			variant: `${theme}.${finalType}`,
			"data-theme": theme,
			"data-type": finalType,
			tabIndex: finalTabIndex,
			styles,
			children: [finalIcon && /* @__PURE__ */ jsx("div", {
				"data-element": "Icon",
				children: finalIcon
			}), children]
		});
	};
	if (showTooltip && tooltipContent) return /* @__PURE__ */ jsx(TooltipProvider, {
		title: tooltipContent,
		...tooltipProps,
		children: (triggerProps, tooltipRef) => renderButton(triggerProps, tooltipRef)
	});
	return renderButton();
});

//#endregion
export { ItemAction };
//# sourceMappingURL=ItemAction.js.map