feat: Fluent UI Outlook Lite + connections mockup

node_modules/embla-carousel-autoplay/cjs/components/Autoplay.d.ts

@@ -0,0 +1,27 @@
+import { OptionsType } from './Options';
+import { CreatePluginType } from 'embla-carousel';
+declare module 'embla-carousel' {
+    interface EmblaPluginsType {
+        autoplay: AutoplayType;
+    }
+    interface EmblaEventListType {
+        autoplayPlay: 'autoplay:play';
+        autoplayStop: 'autoplay:stop';
+        autoplaySelect: 'autoplay:select';
+        autoplayTimerSet: 'autoplay:timerset';
+        autoplayTimerStopped: 'autoplay:timerstopped';
+    }
+}
+export type AutoplayType = CreatePluginType<{
+    play: (jump?: boolean) => void;
+    stop: () => void;
+    reset: () => void;
+    isPlaying: () => boolean;
+    timeUntilNext: () => number | null;
+}, OptionsType>;
+export type AutoplayOptionsType = AutoplayType['options'];
+declare function Autoplay(userOptions?: AutoplayOptionsType): AutoplayType;
+declare namespace Autoplay {
+    let globalOptions: AutoplayOptionsType | undefined;
+}
+export default Autoplay;

node_modules/embla-carousel-autoplay/cjs/components/Options.d.ts

@@ -0,0 +1,14 @@
+import { CreateOptionsType, EmblaCarouselType } from 'embla-carousel';
+export type DelayOptionType = number | ((scrollSnaps: number[], emblaApi: EmblaCarouselType) => number[]);
+export type RootNodeType = null | ((emblaRoot: HTMLElement) => HTMLElement | null);
+export type OptionsType = CreateOptionsType<{
+    delay: DelayOptionType;
+    jump: boolean;
+    playOnInit: boolean;
+    stopOnFocusIn: boolean;
+    stopOnInteraction: boolean;
+    stopOnMouseEnter: boolean;
+    stopOnLastSnap: boolean;
+    rootNode: RootNodeType;
+}>;
+export declare const defaultOptions: OptionsType;

node_modules/embla-carousel-autoplay/cjs/components/utils.d.ts

@@ -0,0 +1,4 @@
+import { EmblaCarouselType } from 'embla-carousel/components/EmblaCarousel';
+import { DelayOptionType, RootNodeType } from './Options';
+export declare function normalizeDelay(emblaApi: EmblaCarouselType, delay: DelayOptionType): number[];
+export declare function getAutoplayRootNode(emblaApi: EmblaCarouselType, rootNode: RootNodeType): HTMLElement;

node_modules/embla-carousel-autoplay/cjs/embla-carousel-autoplay.cjs.js

@@ -0,0 +1,197 @@
+'use strict';
+
+const defaultOptions = {
+  active: true,
+  breakpoints: {},
+  delay: 4000,
+  jump: false,
+  playOnInit: true,
+  stopOnFocusIn: true,
+  stopOnInteraction: true,
+  stopOnMouseEnter: false,
+  stopOnLastSnap: false,
+  rootNode: null
+};
+
+function normalizeDelay(emblaApi, delay) {
+  const scrollSnaps = emblaApi.scrollSnapList();
+  if (typeof delay === 'number') {
+    return scrollSnaps.map(() => delay);
+  }
+  return delay(scrollSnaps, emblaApi);
+}
+function getAutoplayRootNode(emblaApi, rootNode) {
+  const emblaRootNode = emblaApi.rootNode();
+  return rootNode && rootNode(emblaRootNode) || emblaRootNode;
+}
+
+function Autoplay(userOptions = {}) {
+  let options;
+  let emblaApi;
+  let destroyed;
+  let delay;
+  let timerStartTime = null;
+  let timerId = 0;
+  let autoplayActive = false;
+  let mouseIsOver = false;
+  let playOnDocumentVisible = false;
+  let jump = false;
+  function init(emblaApiInstance, optionsHandler) {
+    emblaApi = emblaApiInstance;
+    const {
+      mergeOptions,
+      optionsAtMedia
+    } = optionsHandler;
+    const optionsBase = mergeOptions(defaultOptions, Autoplay.globalOptions);
+    const allOptions = mergeOptions(optionsBase, userOptions);
+    options = optionsAtMedia(allOptions);
+    if (emblaApi.scrollSnapList().length <= 1) return;
+    jump = options.jump;
+    destroyed = false;
+    delay = normalizeDelay(emblaApi, options.delay);
+    const {
+      eventStore,
+      ownerDocument
+    } = emblaApi.internalEngine();
+    const isDraggable = !!emblaApi.internalEngine().options.watchDrag;
+    const root = getAutoplayRootNode(emblaApi, options.rootNode);
+    eventStore.add(ownerDocument, 'visibilitychange', visibilityChange);
+    if (isDraggable) {
+      emblaApi.on('pointerDown', pointerDown);
+    }
+    if (isDraggable && !options.stopOnInteraction) {
+      emblaApi.on('pointerUp', pointerUp);
+    }
+    if (options.stopOnMouseEnter) {
+      eventStore.add(root, 'mouseenter', mouseEnter);
+    }
+    if (options.stopOnMouseEnter && !options.stopOnInteraction) {
+      eventStore.add(root, 'mouseleave', mouseLeave);
+    }
+    if (options.stopOnFocusIn) {
+      emblaApi.on('slideFocusStart', stopAutoplay);
+    }
+    if (options.stopOnFocusIn && !options.stopOnInteraction) {
+      eventStore.add(emblaApi.containerNode(), 'focusout', startAutoplay);
+    }
+    if (options.playOnInit) startAutoplay();
+  }
+  function destroy() {
+    emblaApi.off('pointerDown', pointerDown).off('pointerUp', pointerUp).off('slideFocusStart', stopAutoplay);
+    stopAutoplay();
+    destroyed = true;
+    autoplayActive = false;
+  }
+  function setTimer() {
+    const {
+      ownerWindow
+    } = emblaApi.internalEngine();
+    ownerWindow.clearTimeout(timerId);
+    timerId = ownerWindow.setTimeout(next, delay[emblaApi.selectedScrollSnap()]);
+    timerStartTime = new Date().getTime();
+    emblaApi.emit('autoplay:timerset');
+  }
+  function clearTimer() {
+    const {
+      ownerWindow
+    } = emblaApi.internalEngine();
+    ownerWindow.clearTimeout(timerId);
+    timerId = 0;
+    timerStartTime = null;
+    emblaApi.emit('autoplay:timerstopped');
+  }
+  function startAutoplay() {
+    if (destroyed) return;
+    if (documentIsHidden()) {
+      playOnDocumentVisible = true;
+      return;
+    }
+    if (!autoplayActive) emblaApi.emit('autoplay:play');
+    setTimer();
+    autoplayActive = true;
+  }
+  function stopAutoplay() {
+    if (destroyed) return;
+    if (autoplayActive) emblaApi.emit('autoplay:stop');
+    clearTimer();
+    autoplayActive = false;
+  }
+  function visibilityChange() {
+    if (documentIsHidden()) {
+      playOnDocumentVisible = autoplayActive;
+      return stopAutoplay();
+    }
+    if (playOnDocumentVisible) startAutoplay();
+  }
+  function documentIsHidden() {
+    const {
+      ownerDocument
+    } = emblaApi.internalEngine();
+    return ownerDocument.visibilityState === 'hidden';
+  }
+  function pointerDown() {
+    if (!mouseIsOver) stopAutoplay();
+  }
+  function pointerUp() {
+    if (!mouseIsOver) startAutoplay();
+  }
+  function mouseEnter() {
+    mouseIsOver = true;
+    stopAutoplay();
+  }
+  function mouseLeave() {
+    mouseIsOver = false;
+    startAutoplay();
+  }
+  function play(jumpOverride) {
+    if (typeof jumpOverride !== 'undefined') jump = jumpOverride;
+    startAutoplay();
+  }
+  function stop() {
+    if (autoplayActive) stopAutoplay();
+  }
+  function reset() {
+    if (autoplayActive) startAutoplay();
+  }
+  function isPlaying() {
+    return autoplayActive;
+  }
+  function next() {
+    const {
+      index
+    } = emblaApi.internalEngine();
+    const nextIndex = index.clone().add(1).get();
+    const lastIndex = emblaApi.scrollSnapList().length - 1;
+    const kill = options.stopOnLastSnap && nextIndex === lastIndex;
+    if (emblaApi.canScrollNext()) {
+      emblaApi.scrollNext(jump);
+    } else {
+      emblaApi.scrollTo(0, jump);
+    }
+    emblaApi.emit('autoplay:select');
+    if (kill) return stopAutoplay();
+    startAutoplay();
+  }
+  function timeUntilNext() {
+    if (!timerStartTime) return null;
+    const currentDelay = delay[emblaApi.selectedScrollSnap()];
+    const timePastSinceStart = new Date().getTime() - timerStartTime;
+    return currentDelay - timePastSinceStart;
+  }
+  const self = {
+    name: 'autoplay',
+    options: userOptions,
+    init,
+    destroy,
+    play,
+    stop,
+    reset,
+    isPlaying,
+    timeUntilNext
+  };
+  return self;
+}
+Autoplay.globalOptions = undefined;
+
+module.exports = Autoplay;
+//# sourceMappingURL=embla-carousel-autoplay.cjs.js.map

node_modules/embla-carousel-autoplay/cjs/index.d.ts

@@ -0,0 +1,2 @@
+export { AutoplayType, AutoplayOptionsType } from './components/Autoplay';
+export { default } from './components/Autoplay';

node_modules/embla-carousel-autoplay/cjs/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "embla-carousel-autoplay",
+  "version": "8.6.0",
+  "author": "David Jerleke",
+  "description": "An autoplay plugin for Embla Carousel",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/davidjerleke/embla-carousel"
+  },
+  "bugs": {
+    "url": "https://github.com/davidjerleke/embla-carousel/issues"
+  },
+  "homepage": "https://www.embla-carousel.com",
+  "license": "MIT",
+  "keywords": [
+    "slider",
+    "carousel",
+    "slideshow",
+    "gallery",
+    "lightweight",
+    "touch",
+    "javascript",
+    "typescript",
+    "react",
+    "vue",
+    "svelte",
+    "solid"
+  ],
+  "types": "index.d.ts",
+  "sideEffects": false,
+  "files": [
+    "embla-carousel-autoplay*",
+    "components/**/*",
+    "index.d.ts"
+  ],
+  "devDependencies": {
+    "@types/jest": "^29.5.6",
+    "@typescript-eslint/eslint-plugin": "^6.9.0",
+    "@typescript-eslint/parser": "^6.9.0",
+    "eslint": "^8.52.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-prettier": "^4.0.0",
+    "jest": "^29.5.0",
+    "jest-environment-jsdom": "^29.5.0",
+    "prettier": "2.8.8",
+    "rollup": "^4.22.4",
+    "ts-jest": "^29.1.1",
+    "typescript": "^5.2.2"
+  },
+  "peerDependencies": {
+    "embla-carousel": "8.6.0"
+  },
+  "main": "embla-carousel-autoplay.cjs.js",
+  "type": "commonjs"
+}