44 lines
1.2 KiB
JavaScript
44 lines
1.2 KiB
JavaScript
"use strict";
|
||
Object.defineProperty(exports, "__esModule", {
|
||
value: true
|
||
});
|
||
Object.defineProperty(exports, "ProgressBarIndeterminateMotion", {
|
||
enumerable: true,
|
||
get: function() {
|
||
return ProgressBarIndeterminateMotion;
|
||
}
|
||
});
|
||
const _reactmotion = require("@fluentui/react-motion");
|
||
const ProgressBarIndeterminateMotion = (0, _reactmotion.createMotionComponent)({
|
||
// translate percentages are relative to the element's own width, not the container's.
|
||
// The indeterminate bar is ~33% the width of its container, so:
|
||
// translate: '-100%' === left: '-33%' (one bar-width off-screen to the left)
|
||
// translate: '300%' === left: '100%' (3 × bar-width ≈ full container width, off-screen to the right)
|
||
keyframes: [
|
||
{
|
||
translate: '-100%'
|
||
},
|
||
{
|
||
translate: '300%'
|
||
}
|
||
],
|
||
duration: 3000,
|
||
iterations: Infinity,
|
||
easing: _reactmotion.motionTokens.curveLinear,
|
||
reducedMotion: {
|
||
keyframes: [
|
||
{
|
||
opacity: 0.2
|
||
},
|
||
{
|
||
opacity: 1
|
||
},
|
||
{
|
||
opacity: 0.2
|
||
}
|
||
],
|
||
duration: 3000,
|
||
iterations: Infinity
|
||
}
|
||
});
|