@fluentui/react-northstar
Version:
A themable React component library.
78 lines (77 loc) • 2.48 kB
JavaScript
import _noop from "lodash/noop";
import { unstable_getStyles as getStyles, unstable_createAnimationStyles as createAnimationStyles, useFluentContext } from '@fluentui/react-bindings';
var animationCache = new WeakMap();
export var animationClassName = 'ui-animation';
export var useAnimationStyles = function useAnimationStyles(displayName, props) {
var _useFluentContext = 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 = getStyles({
allDisplayNames: [displayName],
className: animationClassName,
primaryDisplayName: displayName,
componentProps: {},
inlineStylesProps: {
styles: createAnimationStyles(animation, theme)
},
disableAnimations: disableAnimations,
renderer: renderer,
rtl: rtl,
performance: {
enableSanitizeCssPlugin: false,
enableStylesCaching: false,
enableVariablesCaching: false,
enableBooleanVariablesCaching: false
},
saveDebug: _noop,
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;
};
//# sourceMappingURL=useAnimationStyles.js.map