Private
Public Access
1
0

feat: Fluent UI Outlook Lite + connections mockup

This commit is contained in:
2026-04-14 18:52:25 +00:00
parent 1199eff6c3
commit dfa4010406
34820 changed files with 1003813 additions and 205 deletions

View File

@@ -0,0 +1,143 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarousel_unstable", {
enumerable: true,
get: function() {
return useCarousel_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _constants = require("./constants");
const _useCarouselWalker = require("./useCarouselWalker");
const _createCarouselStore = require("./createCarouselStore");
function useCarousel_unstable(options) {
'use no memo';
const { announcement, onValueChange, onFinish } = options;
const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
const win = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView;
const { ref: carouselRef, walker: carouselWalker } = (0, _useCarouselWalker.useCarouselWalker_unstable)();
const [store] = _react.useState(()=>(0, _createCarouselStore.createCarouselStore)());
const [value, setValue] = (0, _reactutilities.useControllableState)({
defaultState: options.defaultValue,
state: options.value,
initialState: null
});
const rootRef = _react.useRef(null);
const { announce } = (0, _reactsharedcontexts.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(`[${_constants.CAROUSEL_ITEM}]`);
for(let i = 0; i < allItems.length; i++){
store.addValue(allItems.item(i).getAttribute(_constants.CAROUSEL_ITEM));
}
return ()=>{
store.clear();
};
}, [
store
]);
_react.useEffect(()=>{
if (!win) {
return;
}
const config = {
attributes: true,
attributeFilter: [
_constants.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 ((0, _reactutilities.isHTMLElement)(addedNode) && addedNode.hasAttribute(_constants.CAROUSEL_ITEM)) {
const newValue = addedNode.getAttribute(_constants.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 ((0, _reactutilities.isHTMLElement)(removedNode) && (removedNode === null || removedNode === void 0 ? void 0 : removedNode.hasAttribute(_constants.CAROUSEL_ITEM))) {
const removedValue = removedNode.getAttribute(_constants.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 = (0, _reactutilities.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 = (0, _reactutilities.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: (0, _reactutilities.useMergedRefs)(rootRef, carouselRef),
carousel: {
store,
value,
selectPageByDirection,
selectPageByValue: updateSlide
}
};
}

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

View File

@@ -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":";;;;;iEAAuB,QAAQ"}

View File

@@ -0,0 +1,37 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
CarouselProvider: function() {
return CarouselProvider;
},
carouselContextDefaultValue: function() {
return carouselContextDefaultValue;
},
useCarouselContext_unstable: function() {
return useCarouselContext_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _reactcontextselector = require("@fluentui/react-context-selector");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _createCarouselStore = require("./createCarouselStore");
const carouselContextDefaultValue = {
store: (0, _createCarouselStore.createCarouselStore)(),
value: null,
selectPageByDirection: ()=>{
/** noop */ },
selectPageByValue: ()=>{
/** noop */ }
};
const CarouselContext = (0, _reactcontextselector.createContext)(undefined);
const CarouselProvider = CarouselContext.Provider;
const useCarouselContext_unstable = (selector)=>(0, _reactcontextselector.useContextSelector)(CarouselContext, (ctx = carouselContextDefaultValue)=>selector(ctx));

View File

@@ -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;;;;;;;;;;;;oBAiCaW;;;+BAfAP;;;+BAiBAS;;;;;sCAjCoE,mCAAmC;iEAC7F,QAAQ;qCAGK,wBAAwB;AAYrD,MAAMT,8BAAoD;IAC/DC,WAAOF,wCAAAA;IACPG,OAAO;IACPC,uBAAuB;IACrB,SAAS,GACX;IACAC,mBAAmB;IACjB,SAAS,GACX;AACF,EAAE;AAEF,MAAMC,sBAAiDT,mCAAAA,EACrDU;AAGK,MAAMC,mBAAmBF,gBAAgBG,QAAQ,CAAC;AAElD,MAAMC,8BAA8B,CAAIC,eAC7Cb,wCAAAA,EAAmBQ,iBAAiB,CAACM,MAAMX,2BAA2B,GAAKU,SAASC,MAAM"}

View File

@@ -0,0 +1,6 @@
/**
* TeachingPopoverCarousel State and Context Hooks
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -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"}

View File

@@ -0,0 +1,20 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "CarouselItem", {
enumerable: true,
get: function() {
return CarouselItem;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useCarouselItem = require("./useCarouselItem");
const _renderCarouselItem = require("./renderCarouselItem");
const CarouselItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useCarouselItem.useCarouselItem_unstable)(props, ref);
return (0, _renderCarouselItem.renderCarouselItem_unstable)(state);
});
CarouselItem.displayName = 'CarouselItem';

View File

@@ -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;;;;;;;;;;;;iEAEuB,QAAQ;iCAIU,oBAAoB;oCACjB,uBAAuB;AAM5D,MAAMG,eAAAA,WAAAA,GAAuDH,OAAMI,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,YAAQN,yCAAAA,EAAyBI,OAAOC;IAE9C,WAAOJ,+CAAAA,EAA4BK;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

View File

@@ -0,0 +1,16 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderCarouselItem_unstable", {
enumerable: true,
get: function() {
return renderCarouselItem_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const renderCarouselItem_unstable = (state)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {});
};

View File

@@ -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":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAOjD,MAAMC,8BAA8B,CAACC;QAC1CF,2BAAAA,EAA+BE;IAE/B,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}

View File

@@ -0,0 +1,40 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarouselItem_unstable", {
enumerable: true,
get: function() {
return useCarouselItem_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _CarouselContext = require("../CarouselContext");
const _constants = require("../constants");
const useCarouselItem_unstable = (props, ref)=>{
const { value } = props;
const visible = (0, _CarouselContext.useCarouselContext_unstable)((c)=>c.value === value);
const state = {
value,
visible,
components: {
root: 'div'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
ref,
[_constants.CAROUSEL_ITEM]: value,
[_constants.CAROUSEL_ACTIVE_ITEM]: visible,
hidden: !visible,
...props
}), {
elementType: 'div'
})
};
if (!visible) {
state.root.children = null;
}
return state;
};

View File

@@ -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;;;;;+BAQaM;;;;;;;iEANU,QAAQ;gCACgB,4BAA4B;iCAE/B,qBAAqB;2BACb,eAAe;AAE5D,iCAAiC,CACtCC,OACAC;IAEA,MAAM,EAAEC,KAAK,EAAE,GAAGF;IAElB,MAAMG,UAAUP,gDAAAA,EAA4BQ,CAAAA,IAAKA,EAAEF,KAAK,KAAKA;IAC7D,MAAMG,QAA2B;QAC/BH;QACAC;QACAG,YAAY;YACVC,MAAM;QACR;QACAA,MAAMZ,oBAAAA,CAAKa,MAAM,KACfd,wCAAAA,EAAyB,OAAO;YAC9BO;YACA,CAACH,wBAAAA,CAAc,EAAEI;YACjB,CAACL,+BAAAA,CAAqB,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"}

View File

@@ -0,0 +1,20 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
CAROUSEL_ACTIVE_ITEM: function() {
return CAROUSEL_ACTIVE_ITEM;
},
CAROUSEL_ITEM: function() {
return CAROUSEL_ITEM;
}
});
const CAROUSEL_ITEM = 'data-carousel-item';
const CAROUSEL_ACTIVE_ITEM = 'data-carousel-active-item';

View File

@@ -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":";;;;;;;;;;;wBACaC;;;iBADAD;;;;AAAN,MAAMA,gBAAgB,qBAAqB;AAC3C,MAAMC,uBAAuB,4BAA4B"}

View File

@@ -0,0 +1,70 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "createCarouselStore", {
enumerable: true,
get: function() {
return createCarouselStore;
}
});
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;
};

View File

@@ -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":";;;;+BAEaA;;;;;;AAAN,4BAA4B;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"}

View File

@@ -0,0 +1,17 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarouselValues_unstable", {
enumerable: true,
get: function() {
return useCarouselValues_unstable;
}
});
const _shim = require("use-sync-external-store/shim");
const _CarouselContext = require("./CarouselContext");
function useCarouselValues_unstable(getSnapshot) {
const store = (0, _CarouselContext.useCarouselContext_unstable)((c)=>c.store);
return (0, _shim.useSyncExternalStore)(store.subscribe, ()=>getSnapshot(store.getSnapshot()));
}

View File

@@ -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;;;;;;;;;;;sBAEqC,+BAA+B;iCAExB,oBAAoB;AAGzD,SAASE,2BAA8BC,WAAoE;IAChH,MAAMC,YAAQH,4CAAAA,EAA4BI,CAAAA,IAAKA,EAAED,KAAK;IAEtD,WAAOJ,0BAAAA,EAAqBI,MAAME,SAAS,EAAE,IAAMH,YAAYC,MAAMD,WAAW;AAClF"}

View File

@@ -0,0 +1,110 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarouselWalker_unstable", {
enumerable: true,
get: function() {
return useCarouselWalker_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _constants = require("./constants");
const useCarouselWalker_unstable = ()=>{
const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
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 (!(0, _reactutilities.isHTMLElement)(node)) {
return NodeFilter.FILTER_SKIP;
}
return node.hasAttribute(_constants.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(`[${_constants.CAROUSEL_ACTIVE_ITEM}="true"]`);
if ((0, _reactutilities.isHTMLElement)(activeEl)) {
return {
el: activeEl,
value: activeEl.getAttribute(_constants.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 (!(0, _reactutilities.isHTMLElement)(nextNode)) {
continue;
}
if (nextNode.getAttribute(_constants.CAROUSEL_ITEM) === value) {
return {
el: nextNode,
value: nextNode.getAttribute(_constants.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 ((0, _reactutilities.isHTMLElement)(next)) {
return {
el: next,
value: next.getAttribute(_constants.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 ((0, _reactutilities.isHTMLElement)(next)) {
return {
el: next,
value: next.getAttribute(_constants.CAROUSEL_ITEM)
};
}
return null;
}
}), [])
};
};

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,26 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "TeachingPopoverCarousel", {
enumerable: true,
get: function() {
return TeachingPopoverCarousel;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useTeachingPopoverCarousel = require("./useTeachingPopoverCarousel");
const _renderTeachingPopoverCarousel = require("./renderTeachingPopoverCarousel");
const _useTeachingPopoverCarouselStylesstyles = require("./useTeachingPopoverCarouselStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _useTeachingPopoverCarouselContextValues = require("./useTeachingPopoverCarouselContextValues");
const TeachingPopoverCarousel = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useTeachingPopoverCarousel.useTeachingPopoverCarousel_unstable)(props, ref);
(0, _useTeachingPopoverCarouselStylesstyles.useTeachingPopoverCarouselStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useTeachingPopoverCarouselStyles_unstable')(state);
const contextValues = (0, _useTeachingPopoverCarouselContextValues.useTeachingPopoverCarouselContextValues_unstable)(state);
return (0, _renderTeachingPopoverCarousel.renderTeachingPopoverCarousel_unstable)(state, contextValues);
});
TeachingPopoverCarousel.displayName = 'TeachingPopoverCarousel';

View File

@@ -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;;;;;;;;;;;;iEAEuB,QAAQ;4CAGqB,+BAA+B;+CAC5B,kCAAkC;wDAC/B,4CAA4C;qCAC1D,kCAAkC;yDAEb,4CAA4C;AAQtG,MAAMM,0BAAAA,WAAAA,GAA6EN,OAAMO,UAAU,CACxG,CAACC,OAAOC;IACN,MAAMC,YAAQT,+DAAAA,EAAoCO,OAAOC;QAEzDN,iFAAAA,EAA0CO;QAE1CN,gDAAAA,EAA4B,6CAA6CM;IAEzE,MAAMC,oBAAgBN,yFAAAA,EAAiDK;IAEvE,WAAOR,qEAAAA,EAAuCQ,OAAOC;AACvD,GACA;AAEFL,wBAAwBM,WAAW,GAAG"}

View File

@@ -0,0 +1,6 @@
/**
* Context shared between TeachingPopoverCarousel and its children components
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -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"}

View File

@@ -0,0 +1,35 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarousel: function() {
return _TeachingPopoverCarousel.TeachingPopoverCarousel;
},
renderTeachingPopoverCarousel_unstable: function() {
return _renderTeachingPopoverCarousel.renderTeachingPopoverCarousel_unstable;
},
teachingPopoverCarouselClassNames: function() {
return _useTeachingPopoverCarouselStylesstyles.teachingPopoverCarouselClassNames;
},
useTeachingPopoverCarouselContextValues_unstable: function() {
return _useTeachingPopoverCarouselContextValues.useTeachingPopoverCarouselContextValues_unstable;
},
useTeachingPopoverCarouselStyles_unstable: function() {
return _useTeachingPopoverCarouselStylesstyles.useTeachingPopoverCarouselStyles_unstable;
},
useTeachingPopoverCarousel_unstable: function() {
return _useTeachingPopoverCarousel.useTeachingPopoverCarousel_unstable;
}
});
const _TeachingPopoverCarousel = require("./TeachingPopoverCarousel");
const _renderTeachingPopoverCarousel = require("./renderTeachingPopoverCarousel");
const _useTeachingPopoverCarousel = require("./useTeachingPopoverCarousel");
const _useTeachingPopoverCarouselStylesstyles = require("./useTeachingPopoverCarouselStyles.styles");
const _useTeachingPopoverCarouselContextValues = require("./useTeachingPopoverCarouselContextValues");

View File

@@ -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":";;;;;;;;;;;;eAASA,gDAAuB;;;eAOvBC,qEAAsC;;;eAG7CE,yEAAiC;;;eAG1BE,yFAAgD;;;eAFvDD,iFAAyC;;;eAHlCF,+DAAmC;;;yCARJ,4BAA4B;+CAOb,kCAAkC;4CACrC,+BAA+B;wDAI5E,4CAA4C;yDACc,4CAA4C"}

View File

@@ -0,0 +1,20 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderTeachingPopoverCarousel_unstable", {
enumerable: true,
get: function() {
return renderTeachingPopoverCarousel_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const _CarouselContext = require("./Carousel/CarouselContext");
const renderTeachingPopoverCarousel_unstable = (state, contextValues)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_CarouselContext.CarouselProvider, {
value: contextValues.carousel,
children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {})
});
};

View File

@@ -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":";;;;+BAeaE;;;;;;4BAdb,gDAAiD;gCAErB,4BAA4B;iCAOvB,6BAA6B;AAKvD,+CAA+C,CACpDC,OACAC;QAEAJ,2BAAAA,EAA0CG;IAE1C,OAAA,WAAA,OACE,eAAA,EAACF,iCAAAA,EAAAA;QAAiBI,OAAOD,cAAcE,QAAQ;kBAC7C,WAAA,OAAA,eAAA,EAACH,MAAMI,IAAI,EAAA,CAAA;;AAGjB,EAAE"}

View File

@@ -0,0 +1,45 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useTeachingPopoverCarousel_unstable", {
enumerable: true,
get: function() {
return useTeachingPopoverCarousel_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reactpopover = require("@fluentui/react-popover");
const _Carousel = require("./Carousel/Carousel");
const useTeachingPopoverCarousel_unstable = (props, ref)=>{
const toggleOpen = (0, _reactpopover.usePopoverContext_unstable)((c)=>c.toggleOpen);
const handleFinish = (0, _reactutilities.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 } = (0, _Carousel.useCarousel_unstable)({
announcement: props.announcement,
defaultValue: props.defaultValue,
value: props.value,
onValueChange: props.onValueChange,
onFinish: handleFinish
});
const appearance = (0, _reactpopover.usePopoverContext_unstable)((context)=>context.appearance);
return {
appearance,
components: {
root: 'div'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
ref: (0, _reactutilities.useMergedRefs)(ref, carouselRef),
...props
}), {
elementType: 'div'
}),
...carousel
};
};

View File

@@ -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;;;;;+BAQaO;;;;;;;iEANU,QAAQ;gCACiD,4BAA4B;8BAEjE,0BAA0B;0BAChC,sBAAsB;AAEpD,4CAA4C,CACjDC,OACAC;IAEA,MAAMC,iBAAaL,wCAAAA,EAA2BM,CAAAA,IAAKA,EAAED,UAAU;IAC/D,MAAME,eAAyDT,oCAAAA,EAAiB,CAACU,OAAOC;YACtFN;SAAAA,kBAAAA,MAAMO,QAAAA,AAAQ,MAAA,QAAdP,oBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,gBAAAA,IAAAA,CAAAA,OAAiBK,OAAOC;QACxBJ,WAAWG;IACb;IAEA,MAAM,EAAEG,QAAQ,EAAEC,WAAW,EAAE,OAAGX,8BAAAA,EAAqB;QACrDY,cAAcV,MAAMU,YAAY;QAChCC,cAAcX,MAAMW,YAAY;QAChCC,OAAOZ,MAAMY,KAAK;QAClBC,eAAeb,MAAMa,aAAa;QAClCN,UAAUH;IACZ;IAEA,MAAMU,iBAAajB,wCAAAA,EAA2BkB,CAAAA,UAAWA,QAAQD,UAAU;IAC3E,OAAO;QACLA;QACAE,YAAY;YACVC,MAAM;QACR;QACAA,MAAMvB,oBAAAA,CAAKwB,MAAM,KACfzB,wCAAAA,EAAyB,OAAO;YAC9BQ,SAAKL,6BAAAA,EAAcK,KAAKQ;YACxB,GAAGT,KAAK;QACV,IACA;YAAEmB,aAAa;QAAM;QAEvB,GAAGX,QAAQ;IACb;AACF,EAAE"}

View File

@@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useTeachingPopoverCarouselContextValues_unstable", {
enumerable: true,
get: function() {
return useTeachingPopoverCarouselContextValues_unstable;
}
});
function useTeachingPopoverCarouselContextValues_unstable(state) {
const { store, value, selectPageByValue, selectPageByDirection } = state;
const carousel = {
store,
value,
selectPageByDirection,
selectPageByValue
};
return {
carousel
};
}

View File

@@ -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":";;;;;;;;;;AAKO,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"}

View File

@@ -0,0 +1,33 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
teachingPopoverCarouselClassNames: function() {
return teachingPopoverCarouselClassNames;
},
useTeachingPopoverCarouselStyles_unstable: function() {
return useTeachingPopoverCarouselStyles_unstable;
}
});
const _react = require("@griffel/react");
const teachingPopoverCarouselClassNames = {
root: 'fui-TeachingPopoverCarousel'
};
// Todo: Page change animation & styles
const useStyles = /*#__PURE__*/ (0, _react.__styles)({
root: {}
}, {});
const useTeachingPopoverCarouselStyles_unstable = (state)=>{
'use no memo';
const styles = useStyles();
state.root.className = (0, _react.mergeClasses)(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"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"],"names":["__styles","mergeClasses","teachingPopoverCarouselClassNames","root","useStyles","useTeachingPopoverCarouselStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;qCAEkC;;;6CAOiD;;;;uBARtD,gBAAgB;AAClD,MAAME,oCAAoC;IAC7CC,IAAI,EAAE;AACV,CAAC;AACD,uCAAA;AACA,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA,CAAA;AAAA,GAAA,CAAA,CAEjB,CAAC;AAC8C,MAAME,6CAA6CC,KAAK,IAAG;IACvG,aAAa;IACb,MAAMC,MAAM,GAAGH,SAAS,CAAC,CAAC;IAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,OAAGP,mBAAY,EAACC,iCAAiC,CAACC,IAAI,EAAEI,MAAM,CAACJ,IAAI,EAAEG,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;IAC9G,OAAOF,KAAK;AAChB,CAAC"}

View File

@@ -0,0 +1,33 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
teachingPopoverCarouselClassNames: function() {
return teachingPopoverCarouselClassNames;
},
useTeachingPopoverCarouselStyles_unstable: function() {
return useTeachingPopoverCarouselStyles_unstable;
}
});
const _react = require("@griffel/react");
const teachingPopoverCarouselClassNames = {
root: 'fui-TeachingPopoverCarousel'
};
// Todo: Page change animation & styles
const useStyles = (0, _react.makeStyles)({
root: {}
});
const useTeachingPopoverCarouselStyles_unstable = (state)=>{
'use no memo';
const styles = useStyles();
state.root.className = (0, _react.mergeClasses)(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);
return state;
};

View File

@@ -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;;;;;;;;;;;;qCAMaE;;;6CAUAG;;;;uBAd4B,iBAAiB;AAInD,MAAMH,oCAAkF;IAC7FC,MAAM;AACR,EAAE;AAEF,uCAAuC;AACvC,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM,CAAC;AACT;AAGO,MAAME,4CAA4C,CACvDC;IAEA;IAEA,MAAMC,SAASH;IAEfE,MAAMH,IAAI,CAACK,SAAS,OAAGP,mBAAAA,EAAaC,kCAAkCC,IAAI,EAAEI,OAAOJ,IAAI,EAAEG,MAAMH,IAAI,CAACK,SAAS;IAE7G,OAAOF;AACT,EAAE"}