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,26 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "CarouselViewport", {
enumerable: true,
get: function() {
return CarouselViewport;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useCarouselViewport = require("./useCarouselViewport");
const _renderCarouselViewport = require("./renderCarouselViewport");
const _useCarouselViewportStylesstyles = require("./useCarouselViewportStyles.styles");
const _CarouselSliderContext = require("../CarouselSlider/CarouselSliderContext");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const CarouselViewport = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useCarouselViewport.useCarouselViewport_unstable)(props, ref);
(0, _useCarouselViewportStylesstyles.useCarouselViewportStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useCarouselViewportStyles_unstable')(state);
const context = (0, _CarouselSliderContext.useCarouselSliderContextValues_unstable)(state);
return (0, _renderCarouselViewport.renderCarouselViewport_unstable)(state, context);
});
CarouselViewport.displayName = 'CarouselViewport';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CarouselViewport/CarouselViewport.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCarouselViewport_unstable } from './useCarouselViewport';\nimport { renderCarouselViewport_unstable } from './renderCarouselViewport';\nimport { useCarouselViewportStyles_unstable } from './useCarouselViewportStyles.styles';\nimport type { CarouselViewportProps } from './CarouselViewport.types';\nimport { useCarouselSliderContextValues_unstable } from '../CarouselSlider/CarouselSliderContext';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * CarouselViewport component - TODO: add more docs\n */\nexport const CarouselViewport: ForwardRefComponent<CarouselViewportProps> = React.forwardRef((props, ref) => {\n const state = useCarouselViewport_unstable(props, ref);\n\n useCarouselViewportStyles_unstable(state);\n useCustomStyleHook_unstable('useCarouselViewportStyles_unstable')(state);\n\n const context = useCarouselSliderContextValues_unstable(state);\n\n return renderCarouselViewport_unstable(state, context);\n});\n\nCarouselViewport.displayName = 'CarouselViewport';\n"],"names":["React","useCarouselViewport_unstable","renderCarouselViewport_unstable","useCarouselViewportStyles_unstable","useCarouselSliderContextValues_unstable","useCustomStyleHook_unstable","CarouselViewport","forwardRef","props","ref","state","context","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;qCAEc,wBAAwB;wCACrB,2BAA2B;iDACxB,qCAAqC;uCAEhC,0CAA0C;qCACtD,kCAAkC;AAKvE,MAAMM,mBAAAA,WAAAA,GAA+DN,OAAMO,UAAU,CAAC,CAACC,OAAOC;IACnG,MAAMC,YAAQT,iDAAAA,EAA6BO,OAAOC;QAElDN,mEAAAA,EAAmCO;QACnCL,gDAAAA,EAA4B,sCAAsCK;IAElE,MAAMC,cAAUP,8DAAAA,EAAwCM;IAExD,WAAOR,uDAAAA,EAAgCQ,OAAOC;AAChD,GAAG;AAEHL,iBAAiBM,WAAW,GAAG"}

View File

@@ -0,0 +1,6 @@
/**
* State used in rendering CarouselViewport
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CarouselViewport/CarouselViewport.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { CarouselSliderContextValue } from '../CarouselSlider/CarouselSlider.types';\n\nexport type CarouselViewportSlots = {\n /**\n * The viewport outer container, defining the size of the carousels visible and interactable area\n */\n root: Slot<'div'>;\n};\n\n/**\n * CarouselViewport Props\n */\nexport type CarouselViewportProps = ComponentProps<CarouselViewportSlots>;\n\n/**\n * State used in rendering CarouselViewport\n */\nexport type CarouselViewportState = ComponentState<Required<CarouselViewportSlots>> & CarouselSliderContextValue;\n"],"names":[],"mappings":"AAeA;;CAEC,GACD,WAAiH"}

View File

@@ -0,0 +1,31 @@
"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, {
CarouselViewport: function() {
return _CarouselViewport.CarouselViewport;
},
carouselViewportClassNames: function() {
return _useCarouselViewportStylesstyles.carouselViewportClassNames;
},
renderCarouselViewport_unstable: function() {
return _renderCarouselViewport.renderCarouselViewport_unstable;
},
useCarouselViewportStyles_unstable: function() {
return _useCarouselViewportStylesstyles.useCarouselViewportStyles_unstable;
},
useCarouselViewport_unstable: function() {
return _useCarouselViewport.useCarouselViewport_unstable;
}
});
const _CarouselViewport = require("./CarouselViewport");
const _renderCarouselViewport = require("./renderCarouselViewport");
const _useCarouselViewport = require("./useCarouselViewport");
const _useCarouselViewportStylesstyles = require("./useCarouselViewportStyles.styles");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CarouselViewport/index.ts"],"sourcesContent":["export { CarouselViewport } from './CarouselViewport';\nexport type { CarouselViewportProps, CarouselViewportSlots, CarouselViewportState } from './CarouselViewport.types';\nexport { renderCarouselViewport_unstable } from './renderCarouselViewport';\nexport { useCarouselViewport_unstable } from './useCarouselViewport';\nexport { carouselViewportClassNames, useCarouselViewportStyles_unstable } from './useCarouselViewportStyles.styles';\n"],"names":["CarouselViewport","renderCarouselViewport_unstable","useCarouselViewport_unstable","carouselViewportClassNames","useCarouselViewportStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,kCAAgB;;;eAIhBG,2DAA0B;;;eAF1BF,uDAA+B;;;eAEHG,mEAAkC;;;eAD9DF,iDAA4B;;;kCAHJ,qBAAqB;wCAEN,2BAA2B;qCAC9B,wBAAwB;iDACU,qCAAqC"}

View File

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

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CarouselViewport/renderCarouselViewport.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 { CarouselViewportState, CarouselViewportSlots } from './CarouselViewport.types';\nimport { CarouselSliderContextValues, CarouselSliderContextProvider } from '../CarouselSlider/CarouselSliderContext';\n\n/**\n * Render the final JSX of CarouselViewport\n */\nexport const renderCarouselViewport_unstable = (\n state: CarouselViewportState,\n contextValues: CarouselSliderContextValues,\n): JSXElement => {\n assertSlots<CarouselViewportSlots>(state);\n\n return (\n <CarouselSliderContextProvider value={contextValues.carouselSlider}>\n <state.root />\n </CarouselSliderContextProvider>\n );\n};\n"],"names":["assertSlots","CarouselSliderContextProvider","renderCarouselViewport_unstable","state","contextValues","value","carouselSlider","root"],"mappings":";;;;+BAWaE;;;;;;4BAVb,gDAAiD;gCAErB,4BAA4B;uCAGmB,0CAA0C;AAK9G,wCAAwC,CAC7CC,OACAC;QAEAJ,2BAAAA,EAAmCG;IAEnC,OAAA,WAAA,OACE,eAAA,EAACF,oDAAAA,EAAAA;QAA8BI,OAAOD,cAAcE,cAAc;kBAChE,WAAA,OAAA,eAAA,EAACH,MAAMI,IAAI,EAAA,CAAA;;AAGjB,EAAE"}

View File

@@ -0,0 +1,75 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarouselViewport_unstable", {
enumerable: true,
get: function() {
return useCarouselViewport_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 useCarouselViewport_unstable = (props, ref)=>{
const hasFocus = _react.useRef(false);
const hasMouse = _react.useRef(false);
const viewportRef = (0, _CarouselContext.useCarouselContext_unstable)((ctx)=>ctx.viewportRef);
const enableAutoplay = (0, _CarouselContext.useCarouselContext_unstable)((ctx)=>ctx.enableAutoplay);
const handleFocusCapture = _react.useCallback(()=>{
hasFocus.current = true;
// Will pause autoplay when focus is captured within viewport (if autoplay is initialized)
enableAutoplay(false, true);
}, [
enableAutoplay
]);
const handleBlurCapture = _react.useCallback((e)=>{
// Will enable autoplay (if initialized) when focus exits viewport
if (!e.currentTarget.contains(e.relatedTarget)) {
hasFocus.current = false;
if (!hasMouse.current) {
enableAutoplay(true, true);
}
}
}, [
enableAutoplay
]);
const handleMouseEnter = _react.useCallback(()=>{
hasMouse.current = true;
enableAutoplay(false, true);
}, [
enableAutoplay
]);
const handleMouseLeave = _react.useCallback(()=>{
hasMouse.current = false;
if (!hasFocus.current) {
enableAutoplay(true, true);
}
}, [
enableAutoplay
]);
const onFocusCapture = (0, _reactutilities.mergeCallbacks)(props.onFocusCapture, handleFocusCapture);
const onBlurCapture = (0, _reactutilities.mergeCallbacks)(props.onBlurCapture, handleBlurCapture);
const onMouseEnter = (0, _reactutilities.mergeCallbacks)(props.onMouseEnter, handleMouseEnter);
const onMouseLeave = (0, _reactutilities.mergeCallbacks)(props.onMouseLeave, handleMouseLeave);
return {
components: {
root: 'div'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
ref: (0, _reactutilities.useMergedRefs)(ref, viewportRef),
role: 'presentation',
// Draggable ensures dragging is supported (even if not enabled)
draggable: true,
...props,
onFocusCapture,
onBlurCapture,
onMouseEnter,
onMouseLeave
}), {
elementType: 'div'
})
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CarouselViewport/useCarouselViewport.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, mergeCallbacks, slot, useMergedRefs } from '@fluentui/react-utilities';\nimport type { CarouselViewportProps, CarouselViewportState } from './CarouselViewport.types';\nimport { useCarouselContext_unstable as useCarouselContext } from '../CarouselContext';\n\n/**\n * Create the state required to render CarouselViewport.\n *\n * The returned state can be modified with hooks such as useCarouselViewportStyles_unstable,\n * before being passed to renderCarouselViewport_unstable.\n *\n * @param props - props from this instance of CarouselViewport\n * @param ref - reference to root HTMLDivElement of CarouselViewport\n */\nexport const useCarouselViewport_unstable = (\n props: CarouselViewportProps,\n ref: React.Ref<HTMLDivElement>,\n): CarouselViewportState => {\n const hasFocus = React.useRef(false);\n const hasMouse = React.useRef(false);\n const viewportRef = useCarouselContext(ctx => ctx.viewportRef);\n const enableAutoplay = useCarouselContext(ctx => ctx.enableAutoplay);\n\n const handleFocusCapture = React.useCallback(() => {\n hasFocus.current = true;\n // Will pause autoplay when focus is captured within viewport (if autoplay is initialized)\n enableAutoplay(false, true);\n }, [enableAutoplay]);\n\n const handleBlurCapture = React.useCallback(\n (e: React.FocusEvent) => {\n // Will enable autoplay (if initialized) when focus exits viewport\n if (!e.currentTarget.contains(e.relatedTarget)) {\n hasFocus.current = false;\n if (!hasMouse.current) {\n enableAutoplay(true, true);\n }\n }\n },\n [enableAutoplay],\n );\n\n const handleMouseEnter = React.useCallback(() => {\n hasMouse.current = true;\n enableAutoplay(false, true);\n }, [enableAutoplay]);\n const handleMouseLeave = React.useCallback(() => {\n hasMouse.current = false;\n if (!hasFocus.current) {\n enableAutoplay(true, true);\n }\n }, [enableAutoplay]);\n\n const onFocusCapture = mergeCallbacks(props.onFocusCapture, handleFocusCapture);\n const onBlurCapture = mergeCallbacks(props.onBlurCapture, handleBlurCapture);\n const onMouseEnter = mergeCallbacks(props.onMouseEnter, handleMouseEnter);\n const onMouseLeave = mergeCallbacks(props.onMouseLeave, handleMouseLeave);\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: useMergedRefs(ref, viewportRef),\n role: 'presentation',\n // Draggable ensures dragging is supported (even if not enabled)\n draggable: true,\n ...props,\n onFocusCapture,\n onBlurCapture,\n onMouseEnter,\n onMouseLeave,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","mergeCallbacks","slot","useMergedRefs","useCarouselContext_unstable","useCarouselContext","useCarouselViewport_unstable","props","ref","hasFocus","useRef","hasMouse","viewportRef","ctx","enableAutoplay","handleFocusCapture","useCallback","current","handleBlurCapture","e","currentTarget","contains","relatedTarget","handleMouseEnter","handleMouseLeave","onFocusCapture","onBlurCapture","onMouseEnter","onMouseLeave","components","root","always","role","draggable","elementType"],"mappings":"AAAA;;;;;+BAgBaO;;;;;;;iEAdU,QAAQ;gCAC+C,4BAA4B;iCAExC,qBAAqB;AAWhF,qCAAqC,CAC1CC,OACAC;IAEA,MAAMC,WAAWV,OAAMW,MAAM,CAAC;IAC9B,MAAMC,WAAWZ,OAAMW,MAAM,CAAC;IAC9B,MAAME,kBAAcP,4CAAAA,EAAmBQ,CAAAA,MAAOA,IAAID,WAAW;IAC7D,MAAME,qBAAiBT,4CAAAA,EAAmBQ,CAAAA,MAAOA,IAAIC,cAAc;IAEnE,MAAMC,qBAAqBhB,OAAMiB,WAAW,CAAC;QAC3CP,SAASQ,OAAO,GAAG;QACnB,0FAA0F;QAC1FH,eAAe,OAAO;IACxB,GAAG;QAACA;KAAe;IAEnB,MAAMI,oBAAoBnB,OAAMiB,WAAW,CACzC,CAACG;QACC,kEAAkE;QAClE,IAAI,CAACA,EAAEC,aAAa,CAACC,QAAQ,CAACF,EAAEG,aAAa,GAAG;YAC9Cb,SAASQ,OAAO,GAAG;YACnB,IAAI,CAACN,SAASM,OAAO,EAAE;gBACrBH,eAAe,MAAM;YACvB;QACF;IACF,GACA;QAACA;KAAe;IAGlB,MAAMS,mBAAmBxB,OAAMiB,WAAW,CAAC;QACzCL,SAASM,OAAO,GAAG;QACnBH,eAAe,OAAO;IACxB,GAAG;QAACA;KAAe;IACnB,MAAMU,mBAAmBzB,OAAMiB,WAAW,CAAC;QACzCL,SAASM,OAAO,GAAG;QACnB,IAAI,CAACR,SAASQ,OAAO,EAAE;YACrBH,eAAe,MAAM;QACvB;IACF,GAAG;QAACA;KAAe;IAEnB,MAAMW,qBAAiBxB,8BAAAA,EAAeM,MAAMkB,cAAc,EAAEV;IAC5D,MAAMW,oBAAgBzB,8BAAAA,EAAeM,MAAMmB,aAAa,EAAER;IAC1D,MAAMS,mBAAe1B,8BAAAA,EAAeM,MAAMoB,YAAY,EAAEJ;IACxD,MAAMK,mBAAe3B,8BAAAA,EAAeM,MAAMqB,YAAY,EAAEJ;IAExD,OAAO;QACLK,YAAY;YACVC,MAAM;QACR;QACAA,MAAM5B,oBAAAA,CAAK6B,MAAM,KACf/B,wCAAAA,EAAyB,OAAO;YAC9BQ,SAAKL,6BAAAA,EAAcK,KAAKI;YACxBoB,MAAM;YACN,gEAAgE;YAChEC,WAAW;YACX,GAAG1B,KAAK;YACRkB;YACAC;YACAC;YACAC;QACF,IACA;YAAEM,aAAa;QAAM;IAEzB;AACF,EAAE"}

View File

@@ -0,0 +1,42 @@
'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, {
carouselViewportClassNames: function() {
return carouselViewportClassNames;
},
useCarouselViewportStyles_unstable: function() {
return useCarouselViewportStyles_unstable;
}
});
const _react = require("@griffel/react");
const carouselViewportClassNames = {
root: 'fui-CarouselViewport'
};
/**
* Styles for the root slot
*/ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
root: {
B2u0y6b: "f6dzj5z",
a9b677: "f14z66ap"
}
}, {
d: [
".f6dzj5z{max-width:100%;}",
".f14z66ap{width:auto;}"
]
});
const useCarouselViewportStyles_unstable = (state)=>{
'use no memo';
const styles = useStyles();
state.root.className = (0, _react.mergeClasses)(carouselViewportClassNames.root, styles.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["useCarouselViewportStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const carouselViewportClassNames = {\n root: 'fui-CarouselViewport'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n maxWidth: '100%',\n width: 'auto'\n }\n});\n/**\n * Apply styling to the CarouselViewport slots based on the state\n */ export const useCarouselViewportStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(carouselViewportClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","carouselViewportClassNames","root","useStyles","B2u0y6b","a9b677","d","useCarouselViewportStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,0BAA0B;;;IAatBM,kCAAkC;;;;uBAdV,gBAAgB;AAClD,mCAAmC;IACtCL,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;KAAA;AAAA,CAKrB,CAAC;AAGS,4CAA4CE,KAAK,IAAG;IAC3D,aAAa;IACb,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;IAC1BK,KAAK,CAACN,IAAI,CAACQ,SAAS,OAAGV,mBAAY,EAACC,0BAA0B,CAACC,IAAI,EAAEO,MAAM,CAACP,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACQ,SAAS,CAAC;IACvG,OAAOF,KAAK;AAChB,CAAC"}

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, {
carouselViewportClassNames: function() {
return carouselViewportClassNames;
},
useCarouselViewportStyles_unstable: function() {
return useCarouselViewportStyles_unstable;
}
});
const _react = require("@griffel/react");
const carouselViewportClassNames = {
root: 'fui-CarouselViewport'
};
/**
* Styles for the root slot
*/ const useStyles = (0, _react.makeStyles)({
root: {
maxWidth: '100%',
width: 'auto'
}
});
const useCarouselViewportStyles_unstable = (state)=>{
'use no memo';
const styles = useStyles();
state.root.className = (0, _react.mergeClasses)(carouselViewportClassNames.root, styles.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CarouselViewport/useCarouselViewportStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CarouselViewportSlots, CarouselViewportState } from './CarouselViewport.types';\n\nexport const carouselViewportClassNames: SlotClassNames<CarouselViewportSlots> = {\n root: 'fui-CarouselViewport',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n maxWidth: '100%',\n width: 'auto',\n },\n});\n\n/**\n * Apply styling to the CarouselViewport slots based on the state\n */\nexport const useCarouselViewportStyles_unstable = (state: CarouselViewportState): CarouselViewportState => {\n 'use no memo';\n\n const styles = useStyles();\n state.root.className = mergeClasses(carouselViewportClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","carouselViewportClassNames","root","useStyles","maxWidth","width","useCarouselViewportStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;8BAMaE;;;sCAiBAK;;;;uBArB4B,iBAAiB;AAInD,MAAML,6BAAoE;IAC/EC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM;QACJE,UAAU;QACVC,OAAO;IACT;AACF;AAKO,MAAMC,qCAAqC,CAACC;IACjD;IAEA,MAAMC,SAASL;IACfI,MAAML,IAAI,CAACO,SAAS,OAAGT,mBAAAA,EAAaC,2BAA2BC,IAAI,EAAEM,OAAON,IAAI,EAAEK,MAAML,IAAI,CAACO,SAAS;IAEtG,OAAOF;AACT,EAAE"}