feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-progress/lib-commonjs/components/ProgressBar/progressBarMotions.js

@@ -0,0 +1,43 @@
+"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
+    }
+});