@carbon/motion
Version:
Motion helpers for digital and software products using the Carbon Design System
75 lines (74 loc) • 2.53 kB
JavaScript
(function(global, factory) {
typeof exports === "object" && typeof module !== "undefined" ? factory(exports) : typeof define === "function" && define.amd ? define(["exports"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.CarbonMotion = {}));
})(this, function(exports) {
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
//#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
exports.durationFast01 = durationFast01;
exports.durationFast02 = durationFast02;
exports.durationModerate01 = durationModerate01;
exports.durationModerate02 = durationModerate02;
exports.durationSlow01 = durationSlow01;
exports.durationSlow02 = durationSlow02;
exports.easings = easings;
exports.fast01 = fast01;
exports.fast02 = fast02;
exports.moderate01 = moderate01;
exports.moderate02 = moderate02;
exports.motion = motion;
exports.slow01 = slow01;
exports.slow02 = slow02;
exports.unstable_tokens = unstable_tokens;
});