feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-toast/lib-commonjs/components/Timer/Timer.js

@@ -0,0 +1,33 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Timer", {
+    enumerable: true,
+    get: function() {
+        return Timer;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _useTimerStylesstyles = require("./useTimerStyles.styles");
+const Timer = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const baseAnimationStyles = (0, _useTimerStylesstyles.useBaseAnimationStyles)();
+    const { running, timeout, onTimeout } = props;
+    const style = {
+        animationDuration: `${timeout}ms`,
+        animationPlayState: running ? 'running' : 'paused'
+    };
+    if (timeout < 0) {
+        return null;
+    }
+    return /*#__PURE__*/ _react.createElement("span", {
+        onAnimationEnd: onTimeout,
+        "data-timer-status": style.animationPlayState,
+        ref: ref,
+        style: style,
+        className: baseAnimationStyles
+    });
+});
+Timer.displayName = 'Timer';

node_modules/@fluentui/react-toast/lib-commonjs/components/Timer/Timer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Timer/Timer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useBaseAnimationStyles } from './useTimerStyles.styles';\n\nexport type TimerProps = {\n  running: boolean;\n  timeout: number;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n  onTimeout: () => void;\n  as?: 'span';\n};\n\nexport const Timer = React.forwardRef<HTMLDivElement, TimerProps>((props, ref) => {\n  const baseAnimationStyles = useBaseAnimationStyles();\n  const { running, timeout, onTimeout } = props;\n\n  const style: React.CSSProperties = {\n    animationDuration: `${timeout}ms`,\n    animationPlayState: running ? 'running' : 'paused',\n  };\n\n  if (timeout < 0) {\n    return null;\n  }\n\n  return (\n    <span\n      onAnimationEnd={onTimeout}\n      data-timer-status={style.animationPlayState}\n      ref={ref}\n      style={style}\n      className={baseAnimationStyles}\n    />\n  );\n});\n\nTimer.displayName = 'Timer';\n"],"names":["React","useBaseAnimationStyles","Timer","forwardRef","props","ref","baseAnimationStyles","running","timeout","onTimeout","style","animationDuration","animationPlayState","span","onAnimationEnd","data-timer-status","className","displayName"],"mappings":"AAAA;;;;;+BAaaE;;;;;;;iEAXU,QAAQ;sCACQ,0BAA0B;AAU1D,cAAMA,WAAAA,GAAQF,OAAMG,UAAU,CAA6B,CAACC,OAAOC;IACxE,MAAMC,0BAAsBL,4CAAAA;IAC5B,MAAM,EAAEM,OAAO,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGL;IAExC,MAAMM,QAA6B;QACjCC,mBAAmB,GAAGH,QAAQ,EAAE,CAAC;QACjCI,oBAAoBL,UAAU,YAAY;IAC5C;IAEA,IAAIC,UAAU,GAAG;QACf,OAAO;IACT;IAEA,OAAA,WAAA,GACE,OAAA,aAAA,CAACK,QAAAA;QACCC,gBAAgBL;QAChBM,qBAAmBL,MAAME,kBAAkB;QAC3CP,KAAKA;QACLK,OAAOA;QACPM,WAAWV;;AAGjB,GAAG;AAEHJ,MAAMe,WAAW,GAAG"}

node_modules/@fluentui/react-toast/lib-commonjs/components/Timer/index.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Timer", {
+    enumerable: true,
+    get: function() {
+        return _Timer.Timer;
+    }
+});
+const _Timer = require("./Timer");

node_modules/@fluentui/react-toast/lib-commonjs/components/Timer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Timer/index.ts"],"sourcesContent":["export type { TimerProps } from './Timer';\nexport { Timer } from './Timer';\n"],"names":["Timer"],"mappings":";;;;;;;eACSA,YAAK;;;uBAAQ,UAAU"}

node_modules/@fluentui/react-toast/lib-commonjs/components/Timer/useTimerStyles.styles.js

@@ -0,0 +1,17 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useBaseAnimationStyles", {
+    enumerable: true,
+    get: function() {
+        return useBaseAnimationStyles;
+    }
+});
+const _react = require("@griffel/react");
+const useBaseAnimationStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r16zaflb", "r75casi", [
+    ".r16zaflb{animation-name:rsacmq1;}",
+    "@keyframes rsacmq1{from{opacity:0;}to{opacity:0;}}",
+    ".r75casi{animation-name:rsacmq1;}"
+]);

node_modules/@fluentui/react-toast/lib-commonjs/components/Timer/useTimerStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useTimerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles } from '@griffel/react';\nexport const useBaseAnimationStyles = makeResetStyles({\n    animationName: {\n        from: {\n            opacity: 0\n        },\n        to: {\n            opacity: 0\n        }\n    }\n});\n"],"names":["__resetStyles","useBaseAnimationStyles"],"mappings":"AAAA,YAAY;;;;;;;;;;;uBACoB,gBAAgB;AACzC,MAAMC,sBAAsB,GAAA,WAAA,OAAGD,oBAAA,EAAA,YAAA,WAAA;IAAA;IAAA;IAAA;CASrC,CAAC"}

node_modules/@fluentui/react-toast/lib-commonjs/components/Timer/useTimerStyles.styles.raw.js

@@ -0,0 +1,22 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useBaseAnimationStyles", {
+    enumerable: true,
+    get: function() {
+        return useBaseAnimationStyles;
+    }
+});
+const _react = require("@griffel/react");
+const useBaseAnimationStyles = (0, _react.makeResetStyles)({
+    animationName: {
+        from: {
+            opacity: 0
+        },
+        to: {
+            opacity: 0
+        }
+    }
+});

node_modules/@fluentui/react-toast/lib-commonjs/components/Timer/useTimerStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Timer/useTimerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles } from '@griffel/react';\n\nexport const useBaseAnimationStyles = makeResetStyles({\n  animationName: {\n    from: {\n      opacity: 0,\n    },\n    to: {\n      opacity: 0,\n    },\n  },\n});\n"],"names":["makeResetStyles","useBaseAnimationStyles","animationName","from","opacity","to"],"mappings":"AAAA;;;;;;;;;;;uBAEgC,iBAAiB;AAE1C,MAAMC,6BAAyBD,sBAAAA,EAAgB;IACpDE,eAAe;QACbC,MAAM;YACJC,SAAS;QACX;QACAC,IAAI;YACFD,SAAS;QACX;IACF;AACF,GAAG"}