@yamada-ui/react/dist/esm/core/css/animation.js

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

"use client";


import { utils_exports } from "../../utils/index.js";
import { globalValues, tokenToVar } from "./utils.js";
import { keyframes } from "@emotion/react";
import { StyleSheet } from "@emotion/sheet";

//#region src/core/css/animation.ts
const styleSheet = (0, utils_exports.createdDom)() ? new StyleSheet({
	key: "css",
	container: document.head
}) : void 0;
function transformAnimationValue(value) {
	return Object.entries(value).reduce((prev, [key, value$1]) => {
		if (key === "keyframes") prev._keyframes = value$1;
		else if (key === "duration") prev.animationDuration = value$1;
		else if (key === "timingFunction") prev.animationTimingFunction = value$1;
		else prev[key] = value$1;
		return prev;
	}, {});
}
function injectKeyframes(value) {
	const { name, styles } = keyframes(value);
	styleSheet?.insert(styles);
	return name;
}
function animation(value, { css, system, theme }) {
	if (value == null || globalValues.has(value)) return value;
	if ((0, utils_exports.isObject)(value)) {
		const { animationDuration = "0s", animationName, animationTimingFunction = "ease", delay = "0s", direction = "normal", fillMode = "none", iterationCount = "1", playState = "running" } = css?.(system, theme)(transformAnimationValue(value)) ?? {};
		return `${animationName} ${animationDuration} ${animationTimingFunction} ${delay} ${iterationCount} ${direction} ${fillMode} ${playState}`;
	} else if (value.includes(",")) {
		value = value.split(",").map((value$1) => {
			value$1 = value$1.trim();
			value$1 = tokenToVar(system)("animations", value$1);
			return value$1;
		}).join(",");
		return value;
	} else {
		value = tokenToVar(system)("animations", value);
		return value;
	}
}
function keyframes$1(value, { css, system, theme }) {
	if (value == null) return value;
	if ((0, utils_exports.isObject)(value)) {
		value = css?.(system, theme)(value);
		return injectKeyframes(value);
	} else return value;
}

//#endregion
export { animation, injectKeyframes, keyframes$1 as keyframes };
//# sourceMappingURL=animation.js.map