@yamada-ui/react
Version:
React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion
65 lines (64 loc) • 1.32 kB
JavaScript
//#region src/core/css/transition.ts
const properties = {
size: ["width", "height"],
all: ["all"],
backgrounds: [
"background",
"background-color",
"background-image",
"background-position"
],
colors: [
"color",
"fill",
"stroke",
"background-color",
"border-color",
"outline-color",
"text-decoration-color"
],
common: [
"color",
"fill",
"stroke",
"background-color",
"border-color",
"outline-color",
"text-decoration-color",
"opacity",
"box-shadow",
"transform",
"translate",
"scale",
"rotate",
"filter",
"backdrop-filter"
],
opacity: ["opacity"],
position: [
"top",
"right",
"bottom",
"left",
"inset-inline",
"inset-block"
],
shadow: ["box-shadow"]
};
function generateTransition(type = "transition") {
return function(value, { prev }) {
switch (type) {
case "transition": if (value in properties) return {
transition: properties[value]?.join(", "),
transitionDuration: prev?.transitionDuration ?? "200ms",
transitionTimingFunction: prev?.transitionTimingFunction ?? "cubic-bezier(0.42, 0, 0.58, 1)"
};
else return value;
case "property": if (value in properties) return properties[value]?.join(", ");
else return value;
}
};
}
//#endregion
export { generateTransition };
//# sourceMappingURL=transition.js.map