@fluentui/react-northstar
Version:
A themable React component library.
85 lines (83 loc) • 2.78 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.useAnimationStyles = exports.animationClassName = void 0;
var _noop2 = _interopRequireDefault(require("lodash/noop"));
var _reactBindings = require("@fluentui/react-bindings");
var animationCache = new WeakMap();
var animationClassName = 'ui-animation';
exports.animationClassName = animationClassName;
var useAnimationStyles = function useAnimationStyles(displayName, props) {
var _useFluentContext = (0, _reactBindings.useFluentContext)(),
theme = _useFluentContext.theme,
rtl = _useFluentContext.rtl,
disableAnimations = _useFluentContext.disableAnimations,
renderer = _useFluentContext.renderer,
performance = _useFluentContext.performance;
if (disableAnimations) {
return {
className: animationClassName,
animationDuration: '0ms',
animationDelay: '0ms'
};
}
var animation = {
name: props.name,
keyframeParams: props.keyframeParams,
duration: props.duration,
delay: props.delay,
iterationCount: props.iterationCount,
direction: props.direction,
fillMode: props.fillMode,
playState: props.playState,
timingFunction: props.timingFunction
};
var cacheEnabled = performance.enableStylesCaching;
var cachePerTheme = {};
var cacheKey = '';
if (cacheEnabled) {
if (!animationCache.has(theme)) {
animationCache.set(theme, {});
}
cachePerTheme = animationCache.get(theme);
cacheKey = JSON.stringify(animation);
if (cachePerTheme[cacheKey]) {
return cachePerTheme[cacheKey];
}
}
var _getStyles = (0, _reactBindings.unstable_getStyles)({
allDisplayNames: [displayName],
className: animationClassName,
primaryDisplayName: displayName,
componentProps: {},
inlineStylesProps: {
styles: (0, _reactBindings.unstable_createAnimationStyles)(animation, theme)
},
disableAnimations: disableAnimations,
renderer: renderer,
rtl: rtl,
performance: {
enableSanitizeCssPlugin: false,
enableStylesCaching: false,
enableVariablesCaching: false,
enableBooleanVariablesCaching: false
},
saveDebug: _noop2.default,
theme: theme,
telemetry: undefined
}),
classes = _getStyles.classes,
styles = _getStyles.styles;
var result = {
className: classes.root,
animationDuration: styles.root.animationDuration,
animationDelay: styles.root.animationDelay
};
if (cacheEnabled) {
cachePerTheme[cacheKey] = result;
animationCache.set(theme, cachePerTheme);
}
return result;
};
exports.useAnimationStyles = useAnimationStyles;
//# sourceMappingURL=useAnimationStyles.js.map