/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-af8d194 | Cube Dev Team */
import { parseStyle } from "../utils/styles.js";

//#region src/tasty/styles/transition.ts
const SECOND_FILL_COLOR_PROPERTY = "--tasty-second-fill-color";
const MAP = {
	fade: ["mask", "mask-composite"],
	translate: ["transform", "translate"],
	rotate: ["transform", "rotate"],
	scale: ["transform", "scale"],
	fill: [
		"background-color",
		"background-image",
		SECOND_FILL_COLOR_PROPERTY
	],
	image: [
		"background-image",
		"background-position",
		"background-size",
		"background-repeat",
		"background-attachment",
		"background-origin",
		"background-clip",
		SECOND_FILL_COLOR_PROPERTY
	],
	background: [
		"background-color",
		"background-image",
		"background-position",
		"background-size",
		"background-repeat",
		"background-attachment",
		"background-origin",
		"background-clip",
		SECOND_FILL_COLOR_PROPERTY
	],
	border: [
		"border",
		"border-top",
		"border-right",
		"border-bottom",
		"border-left"
	],
	filter: ["filter", "backdrop-filter"],
	radius: ["border-radius"],
	shadow: ["box-shadow"],
	outline: ["outline", "outline-offset"],
	preset: [
		"font-size",
		"line-height",
		"letter-spacing",
		"font-weight",
		"font-style"
	],
	text: ["font-weight", "text-decoration-color"],
	color: ["color"],
	opacity: ["opacity"],
	theme: [
		"color",
		"background-color",
		"background-image",
		"box-shadow",
		"border",
		"border-radius",
		"outline",
		"opacity",
		SECOND_FILL_COLOR_PROPERTY
	],
	width: [
		"max-width",
		"min-width",
		"width"
	],
	height: [
		"max-height",
		"min-height",
		"height"
	],
	gap: ["gap", "margin"],
	zIndex: ["z-index"],
	inset: [
		"inset",
		"top",
		"right",
		"bottom",
		"left"
	]
};
const DEFAULT_EASING = "linear";
function getTiming(name) {
	return `var(--${name}-transition, var(--transition))`;
}
function transitionStyle({ transition }) {
	if (!transition) return;
	const processed = parseStyle(transition);
	const tokens = [];
	processed.groups.forEach((g, idx) => {
		tokens.push(...g.all);
		if (idx < processed.groups.length - 1) tokens.push(",");
	});
	if (!tokens) return;
	let tempTransition = [];
	const transitions = [];
	tokens.forEach((token) => {
		if (token === ",") {
			if (tempTransition) {
				transitions.push(tempTransition);
				tempTransition = [];
			}
		} else tempTransition.push(token);
	});
	if (tempTransition) transitions.push(tempTransition);
	const map = {};
	transitions.forEach((transition) => {
		const name = transition[0];
		const timing = transition[1];
		const easing = transition[2];
		const delay = transition[3];
		(MAP[name] || [name]).forEach((style) => {
			map[style] = [
				name,
				easing,
				timing,
				delay
			];
		});
	});
	return { transition: Object.entries(map).map(([style, [name, easing, timing, delay]]) => {
		let value = `${style} ${timing || getTiming(name)}`;
		if (easing || delay) value += ` ${easing || DEFAULT_EASING}`;
		if (delay) value += ` ${delay}`;
		return value;
	}).join(", ") };
}
transitionStyle.__lookupStyles = ["transition"];

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