@clerk/themes
Version:
Themes for the Clerk auth components
29 lines (28 loc) • 1.12 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.transitionDurationValues = exports.transitionProperty = exports.transitionTiming = exports.transitionDuration = void 0;
const transitionDurationValues = Object.freeze({
slowest: 600,
slower: 280,
slow: 200,
fast: 120,
focusRing: 200,
controls: 100,
textField: 450,
drawer: 500,
});
exports.transitionDurationValues = transitionDurationValues;
const toMs = (value) => `${value}ms`;
const transitionDuration = Object.freeze(Object.fromEntries(Object.entries(transitionDurationValues).map(([key, value]) => [key, toMs(value)])));
exports.transitionDuration = transitionDuration;
const transitionProperty = Object.freeze({
common: 'background-color,background,border-color,color,fill,stroke,opacity,box-shadow,transform',
});
exports.transitionProperty = transitionProperty;
const transitionTiming = Object.freeze({
common: 'ease',
easeOut: 'ease-out',
bezier: 'cubic-bezier(0.32, 0.72, 0, 1)',
slowBezier: 'cubic-bezier(0.16, 1, 0.3, 1)',
});
exports.transitionTiming = transitionTiming;