@carbon/motion
Version:
Motion helpers for digital and software products using the Carbon Design System
56 lines (55 loc) • 1.74 kB
JavaScript
//#region src/index.ts
/**
* Copyright IBM Corp. 2018, 2026
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
const fast01 = "70ms";
const fast02 = "110ms";
const moderate01 = "150ms";
const moderate02 = "240ms";
const slow01 = "400ms";
const slow02 = "700ms";
const durationFast01 = fast01;
const durationFast02 = fast02;
const durationModerate01 = moderate01;
const durationModerate02 = moderate02;
const durationSlow01 = slow01;
const durationSlow02 = slow02;
const unstable_tokens = [
"fast01",
"fast02",
"moderate01",
"moderate02",
"slow01",
"slow02",
"durationFast01",
"durationFast02",
"durationModerate01",
"durationModerate02",
"durationSlow01",
"durationSlow02"
];
const easings = {
standard: {
productive: "cubic-bezier(0.2, 0, 0.38, 0.9)",
expressive: "cubic-bezier(0.4, 0.14, 0.3, 1)"
},
entrance: {
productive: "cubic-bezier(0, 0, 0.38, 0.9)",
expressive: "cubic-bezier(0, 0, 0.3, 1)"
},
exit: {
productive: "cubic-bezier(0.2, 0, 1, 0.9)",
expressive: "cubic-bezier(0.4, 0.14, 1, 1)"
}
};
const motion = (name, mode) => {
if (!easings[name]) throw new Error(`Unable to find easing \`${name}\` in our supported easings. Expected one of: ${Object.keys(easings).join(", ")}`);
const easing = easings[name];
if (!easing[mode]) throw new Error(`Unable to find a mode for the easing \`${name}\` called: \`${mode}\`. Expected one of: ${Object.keys(easing).join(", ")}`);
return easing[mode];
};
//#endregion
export { durationFast01, durationFast02, durationModerate01, durationModerate02, durationSlow01, durationSlow02, easings, fast01, fast02, moderate01, moderate02, motion, slow01, slow02, unstable_tokens };