feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/Carousel.js

@@ -0,0 +1,134 @@
+'use client';
+import * as React from 'react';
+import { isHTMLElement, useMergedRefs, useControllableState, useEventCallback } from '@fluentui/react-utilities';
+import { useAnnounce, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
+import { CAROUSEL_ITEM } from './constants';
+import { useCarouselWalker_unstable } from './useCarouselWalker';
+import { createCarouselStore } from './createCarouselStore';
+// TODO: Migrate this into an external @fluentui/carousel component
+// For now, we won't export this publicly, is only for internal TeachingPopover use until stabilized.
+export function useCarousel_unstable(options) {
+    'use no memo';
+    const { announcement, onValueChange, onFinish } = options;
+    const { targetDocument } = useFluent();
+    const win = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView;
+    const { ref: carouselRef, walker: carouselWalker } = useCarouselWalker_unstable();
+    const [store] = React.useState(()=>createCarouselStore());
+    const [value, setValue] = useControllableState({
+        defaultState: options.defaultValue,
+        state: options.value,
+        initialState: null
+    });
+    const rootRef = React.useRef(null);
+    const { announce } = useAnnounce();
+    if (process.env.NODE_ENV !== 'production') {
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        React.useEffect(()=>{
+            if (value === null) {
+                // eslint-disable-next-line no-console
+                console.error('useCarousel: Carousel needs to have a `defaultValue` or `value` prop set. If you want to control the value, use the `value` prop.');
+            }
+        }, [
+            value
+        ]);
+    }
+    React.useEffect(()=>{
+        var _rootRef_current;
+        const allItems = (_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.querySelectorAll(`[${CAROUSEL_ITEM}]`);
+        for(let i = 0; i < allItems.length; i++){
+            store.addValue(allItems.item(i).getAttribute(CAROUSEL_ITEM));
+        }
+        return ()=>{
+            store.clear();
+        };
+    }, [
+        store
+    ]);
+    React.useEffect(()=>{
+        if (!win) {
+            return;
+        }
+        const config = {
+            attributes: true,
+            attributeFilter: [
+                CAROUSEL_ITEM
+            ],
+            childList: true,
+            subtree: true
+        };
+        // Callback function to execute when mutations are observed
+        const callback = (mutationList)=>{
+            for (const mutation of mutationList){
+                for (const addedNode of Array.from(mutation.addedNodes)){
+                    if (isHTMLElement(addedNode) && addedNode.hasAttribute(CAROUSEL_ITEM)) {
+                        const newValue = addedNode.getAttribute(CAROUSEL_ITEM);
+                        const newNode = carouselWalker.find(newValue);
+                        if (!(newNode === null || newNode === void 0 ? void 0 : newNode.value)) {
+                            return;
+                        }
+                        const previousNode = carouselWalker.prevPage(newNode === null || newNode === void 0 ? void 0 : newNode.value);
+                        var _previousNode_value;
+                        store.insertValue(newValue, (_previousNode_value = previousNode === null || previousNode === void 0 ? void 0 : previousNode.value) !== null && _previousNode_value !== void 0 ? _previousNode_value : null);
+                    }
+                }
+                for (const removedNode of Array.from(mutation.removedNodes)){
+                    if (isHTMLElement(removedNode) && (removedNode === null || removedNode === void 0 ? void 0 : removedNode.hasAttribute(CAROUSEL_ITEM))) {
+                        const removedValue = removedNode.getAttribute(CAROUSEL_ITEM);
+                        store.removeValue(removedValue);
+                    }
+                }
+            }
+        };
+        // Create an observer instance linked to the callback function
+        const observer = new win.MutationObserver(callback);
+        // Start observing the target node for configured mutations
+        observer.observe(rootRef.current, config);
+        // Later, you can stop observing
+        return ()=>{
+            observer.disconnect();
+        };
+    }, [
+        carouselWalker,
+        store,
+        win
+    ]);
+    const updateSlide = useEventCallback((event, newValue)=>{
+        setValue(newValue);
+        onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(event, {
+            event,
+            type: 'click',
+            value: newValue
+        });
+        const announceText = announcement === null || announcement === void 0 ? void 0 : announcement(newValue);
+        if (announceText) {
+            announce(announceText, {
+                polite: true
+            });
+        }
+    });
+    const selectPageByDirection = useEventCallback((event, direction)=>{
+        const active = carouselWalker.active();
+        if (!(active === null || active === void 0 ? void 0 : active.value)) {
+            return;
+        }
+        const newPage = direction === 'prev' ? carouselWalker.prevPage(active.value) : carouselWalker.nextPage(active.value);
+        if (newPage) {
+            updateSlide(event, newPage === null || newPage === void 0 ? void 0 : newPage.value);
+        } else {
+            onFinish === null || onFinish === void 0 ? void 0 : onFinish(event, {
+                event,
+                type: 'click',
+                value: active === null || active === void 0 ? void 0 : active.value
+            });
+        }
+    });
+    return {
+        carouselRef: useMergedRefs(rootRef, carouselRef),
+        carousel: {
+            store,
+            value,
+            selectPageByDirection,
+            selectPageByValue: updateSlide
+        }
+    };
+}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/Carousel.types.js

@@ -0,0 +1 @@
+import * as React from 'react';

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/Carousel.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/Carousel.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { EventData, EventHandler } from '@fluentui/react-utilities';\n\nexport type CarouselStore = {\n  clear: () => void;\n  addValue: (value: string) => void;\n  insertValue: (value: string, prev: string | null) => void;\n  removeValue: (value: string) => void;\n  subscribe: (listener: () => void) => () => void;\n  getSnapshot: () => string[];\n};\n\nexport type CarouselItem = {\n  el: HTMLElement;\n  value: string | null;\n};\n\nexport type UseCarouselOptions = {\n  /**\n   * Localizes the string used to announce carousel page changes to screen reader users\n   * Defaults to: undefined\n   */\n  announcement?: (newValue: string) => string;\n\n  /**\n   * The initial page to display in uncontrolled mode.\n   */\n  defaultValue?: string;\n\n  /**\n   * The value of the currently active page.\n   */\n  value?: string;\n\n  /**\n   * Callback to notify a page change.\n   */\n  onValueChange?: EventHandler<CarouselValueChangeData>;\n\n  /**\n   * Callback to notify when the final button step of a carousel has been activated.\n   */\n  onFinish?: EventHandler<CarouselValueChangeData>;\n};\n\nexport type CarouselValueChangeData = EventData<'click', React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>> & {\n  /**\n   * The value to be set after event has occurred.\n   */\n  value?: string;\n};\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselContext.js

@@ -0,0 +1,15 @@
+'use client';
+import { createContext, useContextSelector } from '@fluentui/react-context-selector';
+import * as React from 'react';
+import { createCarouselStore } from './createCarouselStore';
+export const carouselContextDefaultValue = {
+    store: createCarouselStore(),
+    value: null,
+    selectPageByDirection: ()=>{
+    /** noop */ },
+    selectPageByValue: ()=>{
+    /** noop */ }
+};
+const CarouselContext = createContext(undefined);
+export const CarouselProvider = CarouselContext.Provider;
+export const useCarouselContext_unstable = (selector)=>useContextSelector(CarouselContext, (ctx = carouselContextDefaultValue)=>selector(ctx));

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselContext.ts"],"sourcesContent":["'use client';\n\nimport { type Context, ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport * as React from 'react';\n\nimport type { CarouselStore } from './Carousel.types';\nimport { createCarouselStore } from './createCarouselStore';\n\nexport type CarouselContextValue = {\n  store: CarouselStore;\n  value: string | null;\n  selectPageByDirection: (\n    event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>,\n    direction: 'next' | 'prev',\n  ) => void;\n  selectPageByValue: (event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>, value: string) => void;\n};\n\nexport const carouselContextDefaultValue: CarouselContextValue = {\n  store: createCarouselStore(),\n  value: null,\n  selectPageByDirection: () => {\n    /** noop */\n  },\n  selectPageByValue: () => {\n    /** noop */\n  },\n};\n\nconst CarouselContext: Context<CarouselContextValue> = createContext<CarouselContextValue | undefined>(\n  undefined,\n) as Context<CarouselContextValue>;\n\nexport const CarouselProvider = CarouselContext.Provider;\n\nexport const useCarouselContext_unstable = <T>(selector: ContextSelector<CarouselContextValue, T>): T =>\n  useContextSelector(CarouselContext, (ctx = carouselContextDefaultValue) => selector(ctx));\n"],"names":["createContext","useContextSelector","React","createCarouselStore","carouselContextDefaultValue","store","value","selectPageByDirection","selectPageByValue","CarouselContext","undefined","CarouselProvider","Provider","useCarouselContext_unstable","selector","ctx"],"mappings":"AAAA;AAEA,SAAwCA,aAAa,EAAEC,kBAAkB,QAAQ,mCAAmC;AACpH,YAAYC,WAAW,QAAQ;AAG/B,SAASC,mBAAmB,QAAQ,wBAAwB;AAY5D,OAAO,MAAMC,8BAAoD;IAC/DC,OAAOF;IACPG,OAAO;IACPC,uBAAuB;IACrB,SAAS,GACX;IACAC,mBAAmB;IACjB,SAAS,GACX;AACF,EAAE;AAEF,MAAMC,kBAAiDT,cACrDU;AAGF,OAAO,MAAMC,mBAAmBF,gBAAgBG,QAAQ,CAAC;AAEzD,OAAO,MAAMC,8BAA8B,CAAIC,WAC7Cb,mBAAmBQ,iBAAiB,CAACM,MAAMX,2BAA2B,GAAKU,SAASC,MAAM"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselItem/CarouselItem.types.js

@@ -0,0 +1,3 @@
+/**
+ * TeachingPopoverCarousel State and Context Hooks
+ */ export { };

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselItem/CarouselItem.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselItem/CarouselItem.types.ts"],"sourcesContent":["import { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type CarouselItemSlots = {\n  /**\n   * The element wrapping carousel pages and navigation.\n   */\n  root: NonNullable<Slot<'div'>>;\n};\n\nexport type CarouselItemProps = ComponentProps<CarouselItemSlots> & {\n  /**\n   * The value used to identify a page,\n   * it should be unique and is necessary for pagination\n   */\n  value: string;\n};\n\n/**\n * TeachingPopoverCarousel State and Context Hooks\n */\nexport type CarouselItemState = ComponentState<Required<CarouselItemSlots>> & {\n  visible: boolean;\n} & Pick<CarouselItemProps, 'value'>;\n"],"names":[],"mappings":"AAiBA;;CAEC,GACD,WAEqC"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselItem/Carouseltem.js

@@ -0,0 +1,12 @@
+'use client';
+import * as React from 'react';
+import { useCarouselItem_unstable } from './useCarouselItem';
+import { renderCarouselItem_unstable } from './renderCarouselItem';
+/**
+ * Define a CarouselItem, using the `useCarouselItem_unstable` and 'renderCarouselItem_unstable' hooks.
+ * It has no styling opinions.
+ */ export const CarouselItem = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useCarouselItem_unstable(props, ref);
+    return renderCarouselItem_unstable(state);
+});
+CarouselItem.displayName = 'CarouselItem';

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselItem/Carouseltem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselItem/Carouseltem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\nimport { CarouselItemProps } from './CarouselItem.types';\nimport { useCarouselItem_unstable } from './useCarouselItem';\nimport { renderCarouselItem_unstable } from './renderCarouselItem';\n\n/**\n * Define a CarouselItem, using the `useCarouselItem_unstable` and 'renderCarouselItem_unstable' hooks.\n * It has no styling opinions.\n */\nexport const CarouselItem: ForwardRefComponent<CarouselItemProps> = React.forwardRef((props, ref) => {\n  const state = useCarouselItem_unstable(props, ref);\n\n  return renderCarouselItem_unstable(state);\n});\n\nCarouselItem.displayName = 'CarouselItem';\n"],"names":["React","useCarouselItem_unstable","renderCarouselItem_unstable","CarouselItem","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAI/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AAEnE;;;CAGC,GACD,OAAO,MAAMC,6BAAuDH,MAAMI,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQN,yBAAyBI,OAAOC;IAE9C,OAAOJ,4BAA4BK;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselItem/renderCarouselItem.js

@@ -0,0 +1,8 @@
+  import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-utilities';
+/**
+ * Render the final JSX of TeachingPopoverCarousel
+ */ export const renderCarouselItem_unstable = (state)=>{
+    assertSlots(state);
+    return /*#__PURE__*/ _jsx(state.root, {});
+};

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselItem/renderCarouselItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselItem/renderCarouselItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { CarouselItemState, CarouselItemSlots } from './CarouselItem.types';\n\n/**\n * Render the final JSX of TeachingPopoverCarousel\n */\nexport const renderCarouselItem_unstable = (state: CarouselItemState): JSXElement => {\n  assertSlots<CarouselItemSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderCarouselItem_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CF,YAA+BE;IAE/B,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselItem/useCarouselItem.js

@@ -0,0 +1,29 @@
+'use client';
+import * as React from 'react';
+import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
+import { useCarouselContext_unstable } from '../CarouselContext';
+import { CAROUSEL_ACTIVE_ITEM, CAROUSEL_ITEM } from '../constants';
+export const useCarouselItem_unstable = (props, ref)=>{
+    const { value } = props;
+    const visible = useCarouselContext_unstable((c)=>c.value === value);
+    const state = {
+        value,
+        visible,
+        components: {
+            root: 'div'
+        },
+        root: slot.always(getIntrinsicElementProps('div', {
+            ref,
+            [CAROUSEL_ITEM]: value,
+            [CAROUSEL_ACTIVE_ITEM]: visible,
+            hidden: !visible,
+            ...props
+        }), {
+            elementType: 'div'
+        })
+    };
+    if (!visible) {
+        state.root.children = null;
+    }
+    return state;
+};

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/CarouselItem/useCarouselItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselItem/useCarouselItem.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { CarouselItemProps, CarouselItemState } from './CarouselItem.types';\nimport { useCarouselContext_unstable } from '../CarouselContext';\nimport { CAROUSEL_ACTIVE_ITEM, CAROUSEL_ITEM } from '../constants';\n\nexport const useCarouselItem_unstable = (\n  props: CarouselItemProps,\n  ref: React.Ref<HTMLDivElement>,\n): CarouselItemState => {\n  const { value } = props;\n\n  const visible = useCarouselContext_unstable(c => c.value === value);\n  const state: CarouselItemState = {\n    value,\n    visible,\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        [CAROUSEL_ITEM]: value,\n        [CAROUSEL_ACTIVE_ITEM]: visible,\n        hidden: !visible,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n\n  if (!visible) {\n    state.root.children = null;\n  }\n\n  return state;\n};\n"],"names":["React","getIntrinsicElementProps","slot","useCarouselContext_unstable","CAROUSEL_ACTIVE_ITEM","CAROUSEL_ITEM","useCarouselItem_unstable","props","ref","value","visible","c","state","components","root","always","hidden","elementType","children"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,2BAA2B,QAAQ,qBAAqB;AACjE,SAASC,oBAAoB,EAAEC,aAAa,QAAQ,eAAe;AAEnE,OAAO,MAAMC,2BAA2B,CACtCC,OACAC;IAEA,MAAM,EAAEC,KAAK,EAAE,GAAGF;IAElB,MAAMG,UAAUP,4BAA4BQ,CAAAA,IAAKA,EAAEF,KAAK,KAAKA;IAC7D,MAAMG,QAA2B;QAC/BH;QACAC;QACAG,YAAY;YACVC,MAAM;QACR;QACAA,MAAMZ,KAAKa,MAAM,CACfd,yBAAyB,OAAO;YAC9BO;YACA,CAACH,cAAc,EAAEI;YACjB,CAACL,qBAAqB,EAAEM;YACxBM,QAAQ,CAACN;YACT,GAAGH,KAAK;QACV,IACA;YAAEU,aAAa;QAAM;IAEzB;IAEA,IAAI,CAACP,SAAS;QACZE,MAAME,IAAI,CAACI,QAAQ,GAAG;IACxB;IAEA,OAAON;AACT,EAAE"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/constants.js

@@ -0,0 +1,2 @@
+export const CAROUSEL_ITEM = 'data-carousel-item';
+export const CAROUSEL_ACTIVE_ITEM = 'data-carousel-active-item';

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/constants.ts"],"sourcesContent":["export const CAROUSEL_ITEM = 'data-carousel-item';\nexport const CAROUSEL_ACTIVE_ITEM = 'data-carousel-active-item';\n"],"names":["CAROUSEL_ITEM","CAROUSEL_ACTIVE_ITEM"],"mappings":"AAAA,OAAO,MAAMA,gBAAgB,qBAAqB;AAClD,OAAO,MAAMC,uBAAuB,4BAA4B"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/createCarouselStore.js

@@ -0,0 +1,60 @@
+export const createCarouselStore = ()=>{
+    let values = [];
+    let listeners = [];
+    const carouselStore = {
+        clear () {
+            values = [];
+            emitChange();
+        },
+        addValue (value) {
+            values = [
+                ...values,
+                value
+            ];
+            emitChange();
+        },
+        insertValue (value, prev) {
+            if (!prev) {
+                values = [
+                    value,
+                    ...values
+                ];
+            } else {
+                const pos = values.indexOf(prev);
+                values.splice(pos + 1, 0, value);
+                // Required to be defined as a 'new' array for useSyncExternalStore
+                values = [
+                    ...values
+                ];
+            }
+            emitChange();
+        },
+        removeValue (value) {
+            const pos = values.indexOf(value);
+            values.splice(pos, 1);
+            // Required to be defined as a 'new' array for useSyncExternalStore
+            values = [
+                ...values
+            ];
+            emitChange();
+        },
+        subscribe (listener) {
+            listeners = [
+                ...listeners,
+                listener
+            ];
+            return ()=>{
+                listeners = listeners.filter((l)=>l !== listener);
+            };
+        },
+        getSnapshot () {
+            return values;
+        }
+    };
+    function emitChange() {
+        for (const listener of listeners){
+            listener();
+        }
+    }
+    return carouselStore;
+};

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/createCarouselStore.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/createCarouselStore.ts"],"sourcesContent":["import { type CarouselStore } from './Carousel.types';\n\nexport const createCarouselStore = (): CarouselStore => {\n  let values: string[] = [];\n  let listeners: Array<() => void> = [];\n\n  const carouselStore = {\n    clear() {\n      values = [];\n      emitChange();\n    },\n    addValue(value: string) {\n      values = [...values, value];\n\n      emitChange();\n    },\n    insertValue(value: string, prev: string | null) {\n      if (!prev) {\n        values = [value, ...values];\n      } else {\n        const pos = values.indexOf(prev);\n        values.splice(pos + 1, 0, value);\n        // Required to be defined as a 'new' array for useSyncExternalStore\n        values = [...values];\n      }\n      emitChange();\n    },\n    removeValue(value: string) {\n      const pos = values.indexOf(value);\n      values.splice(pos, 1);\n      // Required to be defined as a 'new' array for useSyncExternalStore\n      values = [...values];\n      emitChange();\n    },\n    subscribe(listener: () => void) {\n      listeners = [...listeners, listener];\n\n      return () => {\n        listeners = listeners.filter(l => l !== listener);\n      };\n    },\n    getSnapshot() {\n      return values;\n    },\n  };\n\n  function emitChange() {\n    for (const listener of listeners) {\n      listener();\n    }\n  }\n\n  return carouselStore;\n};\n"],"names":["createCarouselStore","values","listeners","carouselStore","clear","emitChange","addValue","value","insertValue","prev","pos","indexOf","splice","removeValue","subscribe","listener","filter","l","getSnapshot"],"mappings":"AAEA,OAAO,MAAMA,sBAAsB;IACjC,IAAIC,SAAmB,EAAE;IACzB,IAAIC,YAA+B,EAAE;IAErC,MAAMC,gBAAgB;QACpBC;YACEH,SAAS,EAAE;YACXI;QACF;QACAC,UAASC,KAAa;YACpBN,SAAS;mBAAIA;gBAAQM;aAAM;YAE3BF;QACF;QACAG,aAAYD,KAAa,EAAEE,IAAmB;YAC5C,IAAI,CAACA,MAAM;gBACTR,SAAS;oBAACM;uBAAUN;iBAAO;YAC7B,OAAO;gBACL,MAAMS,MAAMT,OAAOU,OAAO,CAACF;gBAC3BR,OAAOW,MAAM,CAACF,MAAM,GAAG,GAAGH;gBAC1B,mEAAmE;gBACnEN,SAAS;uBAAIA;iBAAO;YACtB;YACAI;QACF;QACAQ,aAAYN,KAAa;YACvB,MAAMG,MAAMT,OAAOU,OAAO,CAACJ;YAC3BN,OAAOW,MAAM,CAACF,KAAK;YACnB,mEAAmE;YACnET,SAAS;mBAAIA;aAAO;YACpBI;QACF;QACAS,WAAUC,QAAoB;YAC5Bb,YAAY;mBAAIA;gBAAWa;aAAS;YAEpC,OAAO;gBACLb,YAAYA,UAAUc,MAAM,CAACC,CAAAA,IAAKA,MAAMF;YAC1C;QACF;QACAG;YACE,OAAOjB;QACT;IACF;IAEA,SAASI;QACP,KAAK,MAAMU,YAAYb,UAAW;YAChCa;QACF;IACF;IAEA,OAAOZ;AACT,EAAE"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/useCarouselValues.js

@@ -0,0 +1,7 @@
+'use client';
+import { useSyncExternalStore } from 'use-sync-external-store/shim';
+import { useCarouselContext_unstable } from './CarouselContext';
+export function useCarouselValues_unstable(getSnapshot) {
+    const store = useCarouselContext_unstable((c)=>c.store);
+    return useSyncExternalStore(store.subscribe, ()=>getSnapshot(store.getSnapshot()));
+}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/useCarouselValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/useCarouselValues.ts"],"sourcesContent":["'use client';\n\nimport { useSyncExternalStore } from 'use-sync-external-store/shim';\n\nimport { useCarouselContext_unstable } from './CarouselContext';\nimport type { CarouselStore } from './Carousel.types';\n\nexport function useCarouselValues_unstable<T>(getSnapshot: (values: ReturnType<CarouselStore['getSnapshot']>) => T): T {\n  const store = useCarouselContext_unstable(c => c.store);\n\n  return useSyncExternalStore(store.subscribe, () => getSnapshot(store.getSnapshot()));\n}\n"],"names":["useSyncExternalStore","useCarouselContext_unstable","useCarouselValues_unstable","getSnapshot","store","c","subscribe"],"mappings":"AAAA;AAEA,SAASA,oBAAoB,QAAQ,+BAA+B;AAEpE,SAASC,2BAA2B,QAAQ,oBAAoB;AAGhE,OAAO,SAASC,2BAA8BC,WAAoE;IAChH,MAAMC,QAAQH,4BAA4BI,CAAAA,IAAKA,EAAED,KAAK;IAEtD,OAAOJ,qBAAqBI,MAAME,SAAS,EAAE,IAAMH,YAAYC,MAAMD,WAAW;AAClF"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/Carousel/useCarouselWalker.js

@@ -0,0 +1,99 @@
+'use client';
+import * as React from 'react';
+import { isHTMLElement } from '@fluentui/react-utilities';
+import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
+import { CAROUSEL_ACTIVE_ITEM, CAROUSEL_ITEM } from './constants';
+export const useCarouselWalker_unstable = ()=>{
+    const { targetDocument } = useFluent();
+    const treeWalkerRef = React.useRef(targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.createTreeWalker(targetDocument.body));
+    const htmlRef = React.useRef(null);
+    const ref = React.useCallback((el)=>{
+        if (!targetDocument) {
+            return;
+        }
+        if (!el) {
+            return;
+        }
+        htmlRef.current = el;
+        treeWalkerRef.current = targetDocument.createTreeWalker(el, NodeFilter.SHOW_ELEMENT, {
+            acceptNode (node) {
+                if (!isHTMLElement(node)) {
+                    return NodeFilter.FILTER_SKIP;
+                }
+                return node.hasAttribute(CAROUSEL_ITEM) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
+            }
+        });
+    }, [
+        targetDocument
+    ]);
+    return {
+        ref,
+        walker: React.useMemo(()=>({
+                active () {
+                    if (!htmlRef.current) {
+                        return null;
+                    }
+                    const activeEl = htmlRef.current.querySelector(`[${CAROUSEL_ACTIVE_ITEM}="true"]`);
+                    if (isHTMLElement(activeEl)) {
+                        return {
+                            el: activeEl,
+                            value: activeEl.getAttribute(CAROUSEL_ITEM)
+                        };
+                    }
+                    return null;
+                },
+                find (value) {
+                    var _treeWalkerRef_current;
+                    if (!((_treeWalkerRef_current = treeWalkerRef.current) === null || _treeWalkerRef_current === void 0 ? void 0 : _treeWalkerRef_current.currentNode) || !htmlRef.current) {
+                        return null;
+                    }
+                    treeWalkerRef.current.currentNode = htmlRef.current;
+                    let nextNode = null;
+                    while(nextNode = treeWalkerRef.current.nextNode()){
+                        if (!isHTMLElement(nextNode)) {
+                            continue;
+                        }
+                        if (nextNode.getAttribute(CAROUSEL_ITEM) === value) {
+                            return {
+                                el: nextNode,
+                                value: nextNode.getAttribute(CAROUSEL_ITEM)
+                            };
+                        }
+                    }
+                    return null;
+                },
+                nextPage (value) {
+                    var _treeWalkerRef_current;
+                    const res = this.find(value);
+                    if (!res || !((_treeWalkerRef_current = treeWalkerRef.current) === null || _treeWalkerRef_current === void 0 ? void 0 : _treeWalkerRef_current.currentNode)) {
+                        return null;
+                    }
+                    treeWalkerRef.current.currentNode = res.el;
+                    const next = treeWalkerRef.current.nextNode();
+                    if (isHTMLElement(next)) {
+                        return {
+                            el: next,
+                            value: next.getAttribute(CAROUSEL_ITEM)
+                        };
+                    }
+                    return null;
+                },
+                prevPage (value) {
+                    var _treeWalkerRef_current;
+                    const res = this.find(value);
+                    if (!res || !((_treeWalkerRef_current = treeWalkerRef.current) === null || _treeWalkerRef_current === void 0 ? void 0 : _treeWalkerRef_current.currentNode)) {
+                        return null;
+                    }
+                    treeWalkerRef.current.currentNode = res.el;
+                    const next = treeWalkerRef.current.previousNode();
+                    if (isHTMLElement(next)) {
+                        return {
+                            el: next,
+                            value: next.getAttribute(CAROUSEL_ITEM)
+                        };
+                    }
+                    return null;
+                }
+            }), [])
+    };
+};

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/TeachingPopoverCarousel.js

@@ -0,0 +1,20 @@
+'use client';
+import * as React from 'react';
+import { useTeachingPopoverCarousel_unstable } from './useTeachingPopoverCarousel';
+import { renderTeachingPopoverCarousel_unstable } from './renderTeachingPopoverCarousel';
+import { useTeachingPopoverCarouselStyles_unstable } from './useTeachingPopoverCarouselStyles.styles';
+import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import { useTeachingPopoverCarouselContextValues_unstable } from './useTeachingPopoverCarouselContextValues';
+/**
+ * Define a styled TeachingPopoverCarousel, using the `useTeachingPopoverCarousel_unstable` and `useTeachingPopoverCarouselStyles_unstable`
+ * hooks.
+ *
+ * TeachingPopoverCarousel injects context providers that are required for TeachingPopoverCarouselCard display and navigation functionality
+ */ export const TeachingPopoverCarousel = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useTeachingPopoverCarousel_unstable(props, ref);
+    useTeachingPopoverCarouselStyles_unstable(state);
+    useCustomStyleHook_unstable('useTeachingPopoverCarouselStyles_unstable')(state);
+    const contextValues = useTeachingPopoverCarouselContextValues_unstable(state);
+    return renderTeachingPopoverCarousel_unstable(state, contextValues);
+});
+TeachingPopoverCarousel.displayName = 'TeachingPopoverCarousel';

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/TeachingPopoverCarousel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/TeachingPopoverCarousel.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\nimport { useTeachingPopoverCarousel_unstable } from './useTeachingPopoverCarousel';\nimport { renderTeachingPopoverCarousel_unstable } from './renderTeachingPopoverCarousel';\nimport { useTeachingPopoverCarouselStyles_unstable } from './useTeachingPopoverCarouselStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport type { TeachingPopoverCarouselProps } from './TeachingPopoverCarousel.types';\nimport { useTeachingPopoverCarouselContextValues_unstable } from './useTeachingPopoverCarouselContextValues';\n\n/**\n * Define a styled TeachingPopoverCarousel, using the `useTeachingPopoverCarousel_unstable` and `useTeachingPopoverCarouselStyles_unstable`\n * hooks.\n *\n * TeachingPopoverCarousel injects context providers that are required for TeachingPopoverCarouselCard display and navigation functionality\n */\nexport const TeachingPopoverCarousel: ForwardRefComponent<TeachingPopoverCarouselProps> = React.forwardRef(\n  (props, ref) => {\n    const state = useTeachingPopoverCarousel_unstable(props, ref);\n\n    useTeachingPopoverCarouselStyles_unstable(state);\n\n    useCustomStyleHook_unstable('useTeachingPopoverCarouselStyles_unstable')(state);\n\n    const contextValues = useTeachingPopoverCarouselContextValues_unstable(state);\n\n    return renderTeachingPopoverCarousel_unstable(state, contextValues);\n  },\n);\n\nTeachingPopoverCarousel.displayName = 'TeachingPopoverCarousel';\n"],"names":["React","useTeachingPopoverCarousel_unstable","renderTeachingPopoverCarousel_unstable","useTeachingPopoverCarouselStyles_unstable","useCustomStyleHook_unstable","useTeachingPopoverCarouselContextValues_unstable","TeachingPopoverCarousel","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,mCAAmC,QAAQ,+BAA+B;AACnF,SAASC,sCAAsC,QAAQ,kCAAkC;AACzF,SAASC,yCAAyC,QAAQ,4CAA4C;AACtG,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,SAASC,gDAAgD,QAAQ,4CAA4C;AAE7G;;;;;CAKC,GACD,OAAO,MAAMC,wCAA6EN,MAAMO,UAAU,CACxG,CAACC,OAAOC;IACN,MAAMC,QAAQT,oCAAoCO,OAAOC;IAEzDN,0CAA0CO;IAE1CN,4BAA4B,6CAA6CM;IAEzE,MAAMC,gBAAgBN,iDAAiDK;IAEvE,OAAOR,uCAAuCQ,OAAOC;AACvD,GACA;AAEFL,wBAAwBM,WAAW,GAAG"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/TeachingPopoverCarousel.types.js

@@ -0,0 +1,3 @@
+/**
+ * Context shared between TeachingPopoverCarousel and its children components
+ */ export { };

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/TeachingPopoverCarousel.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/TeachingPopoverCarousel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { type PopoverContextValue } from '@fluentui/react-popover';\n\nimport { type CarouselContextValue } from './Carousel/CarouselContext';\nimport type { UseCarouselOptions } from './Carousel/Carousel.types';\n\nexport type TeachingPopoverCarouselSlots = {\n  /**\n   * The element wrapping carousel pages and navigation.\n   */\n  root: NonNullable<Slot<'div'>>;\n};\n\n/**\n * TeachingPopoverCarousel Props\n */\nexport type TeachingPopoverCarouselProps = ComponentProps<TeachingPopoverCarouselSlots> & UseCarouselOptions;\n\n/**\n * TeachingPopoverCarousel State and Context Hooks\n */\nexport type TeachingPopoverCarouselState = ComponentState<Required<TeachingPopoverCarouselSlots>> &\n  Partial<Pick<PopoverContextValue, 'appearance'>> &\n  CarouselContextValue;\n\n/**\n * Context shared between TeachingPopoverCarousel and its children components\n */\nexport type TeachingPopoverCarouselContextValues = {\n  carousel: CarouselContextValue;\n};\n"],"names":[],"mappings":"AAyBA;;CAEC,GACD,WAEE"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/index.js

@@ -0,0 +1,5 @@
+export { TeachingPopoverCarousel } from './TeachingPopoverCarousel';
+export { renderTeachingPopoverCarousel_unstable } from './renderTeachingPopoverCarousel';
+export { useTeachingPopoverCarousel_unstable } from './useTeachingPopoverCarousel';
+export { teachingPopoverCarouselClassNames, useTeachingPopoverCarouselStyles_unstable } from './useTeachingPopoverCarouselStyles.styles';
+export { useTeachingPopoverCarouselContextValues_unstable } from './useTeachingPopoverCarouselContextValues';

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/index.ts"],"sourcesContent":["export { TeachingPopoverCarousel } from './TeachingPopoverCarousel';\nexport type {\n  TeachingPopoverCarouselContextValues,\n  TeachingPopoverCarouselProps,\n  TeachingPopoverCarouselSlots,\n  TeachingPopoverCarouselState,\n} from './TeachingPopoverCarousel.types';\nexport { renderTeachingPopoverCarousel_unstable } from './renderTeachingPopoverCarousel';\nexport { useTeachingPopoverCarousel_unstable } from './useTeachingPopoverCarousel';\nexport {\n  teachingPopoverCarouselClassNames,\n  useTeachingPopoverCarouselStyles_unstable,\n} from './useTeachingPopoverCarouselStyles.styles';\nexport { useTeachingPopoverCarouselContextValues_unstable } from './useTeachingPopoverCarouselContextValues';\n"],"names":["TeachingPopoverCarousel","renderTeachingPopoverCarousel_unstable","useTeachingPopoverCarousel_unstable","teachingPopoverCarouselClassNames","useTeachingPopoverCarouselStyles_unstable","useTeachingPopoverCarouselContextValues_unstable"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,4BAA4B;AAOpE,SAASC,sCAAsC,QAAQ,kCAAkC;AACzF,SAASC,mCAAmC,QAAQ,+BAA+B;AACnF,SACEC,iCAAiC,EACjCC,yCAAyC,QACpC,4CAA4C;AACnD,SAASC,gDAAgD,QAAQ,4CAA4C"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/renderTeachingPopoverCarousel.js

@@ -0,0 +1,12 @@
+  import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-utilities';
+import { CarouselProvider } from './Carousel/CarouselContext';
+/**
+ * Render the final JSX of TeachingPopoverCarousel
+ */ export const renderTeachingPopoverCarousel_unstable = (state, contextValues)=>{
+    assertSlots(state);
+    return /*#__PURE__*/ _jsx(CarouselProvider, {
+        value: contextValues.carousel,
+        children: /*#__PURE__*/ _jsx(state.root, {})
+    });
+};

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/renderTeachingPopoverCarousel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/renderTeachingPopoverCarousel.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type {\n  TeachingPopoverCarouselState,\n  TeachingPopoverCarouselSlots,\n  TeachingPopoverCarouselContextValues,\n} from './TeachingPopoverCarousel.types';\nimport { CarouselProvider } from './Carousel/CarouselContext';\n\n/**\n * Render the final JSX of TeachingPopoverCarousel\n */\nexport const renderTeachingPopoverCarousel_unstable = (\n  state: TeachingPopoverCarouselState,\n  contextValues: TeachingPopoverCarouselContextValues,\n): JSXElement => {\n  assertSlots<TeachingPopoverCarouselSlots>(state);\n\n  return (\n    <CarouselProvider value={contextValues.carousel}>\n      <state.root />\n    </CarouselProvider>\n  );\n};\n"],"names":["assertSlots","CarouselProvider","renderTeachingPopoverCarousel_unstable","state","contextValues","value","carousel","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAOxD,SAASC,gBAAgB,QAAQ,6BAA6B;AAE9D;;CAEC,GACD,OAAO,MAAMC,yCAAyC,CACpDC,OACAC;IAEAJ,YAA0CG;IAE1C,qBACE,KAACF;QAAiBI,OAAOD,cAAcE,QAAQ;kBAC7C,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/useTeachingPopoverCarousel.js

@@ -0,0 +1,34 @@
+'use client';
+import * as React from 'react';
+import { getIntrinsicElementProps, slot, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';
+import { usePopoverContext_unstable } from '@fluentui/react-popover';
+import { useCarousel_unstable } from './Carousel/Carousel';
+export const useTeachingPopoverCarousel_unstable = (props, ref)=>{
+    const toggleOpen = usePopoverContext_unstable((c)=>c.toggleOpen);
+    const handleFinish = useEventCallback((event, data)=>{
+        var _props_onFinish;
+        (_props_onFinish = props.onFinish) === null || _props_onFinish === void 0 ? void 0 : _props_onFinish.call(props, event, data);
+        toggleOpen(event);
+    });
+    const { carousel, carouselRef } = useCarousel_unstable({
+        announcement: props.announcement,
+        defaultValue: props.defaultValue,
+        value: props.value,
+        onValueChange: props.onValueChange,
+        onFinish: handleFinish
+    });
+    const appearance = usePopoverContext_unstable((context)=>context.appearance);
+    return {
+        appearance,
+        components: {
+            root: 'div'
+        },
+        root: slot.always(getIntrinsicElementProps('div', {
+            ref: useMergedRefs(ref, carouselRef),
+            ...props
+        }), {
+            elementType: 'div'
+        }),
+        ...carousel
+    };
+};

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/useTeachingPopoverCarousel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/useTeachingPopoverCarousel.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TeachingPopoverCarouselProps, TeachingPopoverCarouselState } from './TeachingPopoverCarousel.types';\nimport { usePopoverContext_unstable } from '@fluentui/react-popover';\nimport { useCarousel_unstable } from './Carousel/Carousel';\n\nexport const useTeachingPopoverCarousel_unstable = (\n  props: TeachingPopoverCarouselProps,\n  ref: React.Ref<HTMLDivElement>,\n): TeachingPopoverCarouselState => {\n  const toggleOpen = usePopoverContext_unstable(c => c.toggleOpen);\n  const handleFinish: TeachingPopoverCarouselProps['onFinish'] = useEventCallback((event, data) => {\n    props.onFinish?.(event, data);\n    toggleOpen(event as React.MouseEvent<HTMLElement>);\n  });\n\n  const { carousel, carouselRef } = useCarousel_unstable({\n    announcement: props.announcement,\n    defaultValue: props.defaultValue,\n    value: props.value,\n    onValueChange: props.onValueChange,\n    onFinish: handleFinish,\n  });\n\n  const appearance = usePopoverContext_unstable(context => context.appearance);\n  return {\n    appearance,\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref: useMergedRefs(ref, carouselRef),\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    ...carousel,\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useEventCallback","useMergedRefs","usePopoverContext_unstable","useCarousel_unstable","useTeachingPopoverCarousel_unstable","props","ref","toggleOpen","c","handleFinish","event","data","onFinish","carousel","carouselRef","announcement","defaultValue","value","onValueChange","appearance","context","components","root","always","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,4BAA4B;AAE5G,SAASC,0BAA0B,QAAQ,0BAA0B;AACrE,SAASC,oBAAoB,QAAQ,sBAAsB;AAE3D,OAAO,MAAMC,sCAAsC,CACjDC,OACAC;IAEA,MAAMC,aAAaL,2BAA2BM,CAAAA,IAAKA,EAAED,UAAU;IAC/D,MAAME,eAAyDT,iBAAiB,CAACU,OAAOC;YACtFN;SAAAA,kBAAAA,MAAMO,QAAQ,cAAdP,sCAAAA,qBAAAA,OAAiBK,OAAOC;QACxBJ,WAAWG;IACb;IAEA,MAAM,EAAEG,QAAQ,EAAEC,WAAW,EAAE,GAAGX,qBAAqB;QACrDY,cAAcV,MAAMU,YAAY;QAChCC,cAAcX,MAAMW,YAAY;QAChCC,OAAOZ,MAAMY,KAAK;QAClBC,eAAeb,MAAMa,aAAa;QAClCN,UAAUH;IACZ;IAEA,MAAMU,aAAajB,2BAA2BkB,CAAAA,UAAWA,QAAQD,UAAU;IAC3E,OAAO;QACLA;QACAE,YAAY;YACVC,MAAM;QACR;QACAA,MAAMvB,KAAKwB,MAAM,CACfzB,yBAAyB,OAAO;YAC9BQ,KAAKL,cAAcK,KAAKQ;YACxB,GAAGT,KAAK;QACV,IACA;YAAEmB,aAAa;QAAM;QAEvB,GAAGX,QAAQ;IACb;AACF,EAAE"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/useTeachingPopoverCarouselContextValues.js

@@ -0,0 +1,12 @@
+export function useTeachingPopoverCarouselContextValues_unstable(state) {
+    const { store, value, selectPageByValue, selectPageByDirection } = state;
+    const carousel = {
+        store,
+        value,
+        selectPageByDirection,
+        selectPageByValue
+    };
+    return {
+        carousel
+    };
+}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/useTeachingPopoverCarouselContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/useTeachingPopoverCarouselContextValues.ts"],"sourcesContent":["import type {\n  TeachingPopoverCarouselContextValues,\n  TeachingPopoverCarouselState,\n} from './TeachingPopoverCarousel.types';\n\nexport function useTeachingPopoverCarouselContextValues_unstable(\n  state: TeachingPopoverCarouselState,\n): TeachingPopoverCarouselContextValues {\n  const { store, value, selectPageByValue, selectPageByDirection } = state;\n\n  const carousel = {\n    store,\n    value,\n    selectPageByDirection,\n    selectPageByValue,\n  };\n\n  return { carousel };\n}\n"],"names":["useTeachingPopoverCarouselContextValues_unstable","state","store","value","selectPageByValue","selectPageByDirection","carousel"],"mappings":"AAKA,OAAO,SAASA,iDACdC,KAAmC;IAEnC,MAAM,EAAEC,KAAK,EAAEC,KAAK,EAAEC,iBAAiB,EAAEC,qBAAqB,EAAE,GAAGJ;IAEnE,MAAMK,WAAW;QACfJ;QACAC;QACAE;QACAD;IACF;IAEA,OAAO;QAAEE;IAAS;AACpB"}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/useTeachingPopoverCarouselStyles.styles.js

@@ -0,0 +1,18 @@
+'use client';
+
+import { __styles, mergeClasses } from '@griffel/react';
+export const teachingPopoverCarouselClassNames = {
+  root: 'fui-TeachingPopoverCarousel'
+};
+// Todo: Page change animation & styles
+const useStyles = /*#__PURE__*/__styles({
+  root: {}
+}, {});
+/** Applies style classnames to slots */
+export const useTeachingPopoverCarouselStyles_unstable = state => {
+  'use no memo';
+
+  const styles = useStyles();
+  state.root.className = mergeClasses(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);
+  return state;
+};

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/useTeachingPopoverCarouselStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__styles","mergeClasses","teachingPopoverCarouselClassNames","root","useStyles","useTeachingPopoverCarouselStyles_unstable","state","styles","className"],"sources":["useTeachingPopoverCarouselStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const teachingPopoverCarouselClassNames = {\n    root: 'fui-TeachingPopoverCarousel'\n};\n// Todo: Page change animation & styles\nconst useStyles = makeStyles({\n    root: {}\n});\n/** Applies style classnames to slots */ export const useTeachingPopoverCarouselStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,iCAAiC,GAAG;EAC7CC,IAAI,EAAE;AACV,CAAC;AACD;AACA,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;AAAA,KAEjB,CAAC;AACF;AAAyC,OAAO,MAAME,yCAAyC,GAAIC,KAAK,IAAG;EACvG,aAAa;;EACb,MAAMC,MAAM,GAAGH,SAAS,CAAC,CAAC;EAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGP,YAAY,CAACC,iCAAiC,CAACC,IAAI,EAAEI,MAAM,CAACJ,IAAI,EAAEG,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAC9G,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/useTeachingPopoverCarouselStyles.styles.raw.js

@@ -0,0 +1,15 @@
+'use client';
+import { makeStyles, mergeClasses } from '@griffel/react';
+export const teachingPopoverCarouselClassNames = {
+    root: 'fui-TeachingPopoverCarousel'
+};
+// Todo: Page change animation & styles
+const useStyles = makeStyles({
+    root: {}
+});
+/** Applies style classnames to slots */ export const useTeachingPopoverCarouselStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = mergeClasses(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);
+    return state;
+};

node_modules/@fluentui/react-teaching-popover/lib/components/TeachingPopoverCarousel/useTeachingPopoverCarouselStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TeachingPopoverCarousel/useTeachingPopoverCarouselStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TeachingPopoverCarouselSlots, TeachingPopoverCarouselState } from './TeachingPopoverCarousel.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const teachingPopoverCarouselClassNames: SlotClassNames<TeachingPopoverCarouselSlots> = {\n  root: 'fui-TeachingPopoverCarousel',\n};\n\n// Todo: Page change animation & styles\nconst useStyles = makeStyles({\n  root: {},\n});\n\n/** Applies style classnames to slots */\nexport const useTeachingPopoverCarouselStyles_unstable = (\n  state: TeachingPopoverCarouselState,\n): TeachingPopoverCarouselState => {\n  'use no memo';\n\n  const styles = useStyles();\n\n  state.root.className = mergeClasses(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","teachingPopoverCarouselClassNames","root","useStyles","useTeachingPopoverCarouselStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAI1D,OAAO,MAAMC,oCAAkF;IAC7FC,MAAM;AACR,EAAE;AAEF,uCAAuC;AACvC,MAAMC,YAAYJ,WAAW;IAC3BG,MAAM,CAAC;AACT;AAEA,sCAAsC,GACtC,OAAO,MAAME,4CAA4C,CACvDC;IAEA;IAEA,MAAMC,SAASH;IAEfE,MAAMH,IAAI,CAACK,SAAS,GAAGP,aAAaC,kCAAkCC,IAAI,EAAEI,OAAOJ,IAAI,EAAEG,MAAMH,IAAI,CAACK,SAAS;IAE7G,OAAOF;AACT,EAAE"}