feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/Listbox.js

@@ -0,0 +1,26 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Listbox", {
+    enumerable: true,
+    get: function() {
+        return Listbox;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _useListbox = require("./useListbox");
+const _renderListbox = require("./renderListbox");
+const _useListboxStylesstyles = require("./useListboxStyles.styles");
+const _useListboxContextValues = require("../../contexts/useListboxContextValues");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const Listbox = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useListbox.useListbox_unstable)(props, ref);
+    const contextValues = (0, _useListboxContextValues.useListboxContextValues)(state);
+    (0, _useListboxStylesstyles.useListboxStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useListboxStyles_unstable')(state);
+    return (0, _renderListbox.renderListbox_unstable)(state, contextValues);
+});
+Listbox.displayName = 'Listbox';

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/Listbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Listbox/Listbox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useListbox_unstable } from './useListbox';\nimport { renderListbox_unstable } from './renderListbox';\nimport { useListboxStyles_unstable } from './useListboxStyles.styles';\nimport type { ListboxProps } from './Listbox.types';\nimport { useListboxContextValues } from '../../contexts/useListboxContextValues';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Listbox component: a standalone selection control, or the popup in a Combobox\n */\nexport const Listbox: ForwardRefComponent<ListboxProps> = React.forwardRef((props, ref) => {\n  const state = useListbox_unstable(props, ref);\n  const contextValues = useListboxContextValues(state);\n\n  useListboxStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useListboxStyles_unstable')(state);\n\n  return renderListbox_unstable(state, contextValues);\n});\n\nListbox.displayName = 'Listbox';\n"],"names":["React","useListbox_unstable","renderListbox_unstable","useListboxStyles_unstable","useListboxContextValues","useCustomStyleHook_unstable","Listbox","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;4BACK,eAAe;+BACZ,kBAAkB;wCACf,4BAA4B;yCAE9B,yCAAyC;qCAErC,kCAAkC;AAKvE,MAAMM,UAAAA,WAAAA,GAA6CN,OAAMO,UAAU,CAAC,CAACC,OAAOC;IACjF,MAAMC,YAAQT,+BAAAA,EAAoBO,OAAOC;IACzC,MAAME,oBAAgBP,gDAAAA,EAAwBM;QAE9CP,iDAAAA,EAA0BO;QAE1BL,gDAAAA,EAA4B,6BAA6BK;IAEzD,WAAOR,qCAAAA,EAAuBQ,OAAOC;AACvC,GAAG;AAEHL,QAAQM,WAAW,GAAG"}

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/Listbox.types.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/Listbox.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Listbox/Listbox.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type {\n  ActiveDescendantChangeEvent,\n  ActiveDescendantContextValue,\n  ActiveDescendantImperativeRef,\n} from '@fluentui/react-aria';\nimport { OptionValue, OptionCollectionState } from '../../utils/OptionCollection.types';\nimport { SelectionEvents, SelectionProps, SelectionState } from '../../utils/Selection.types';\nimport type { ListboxContextValue } from '../../contexts/ListboxContext';\n\nexport type ListboxSlots = {\n  /** The root slot, a `<div>` with `role=\"listbox\"` */\n  root: Slot<'div'>;\n};\n\n/**\n * Listbox Props\n */\nexport type ListboxProps = ComponentProps<ListboxSlots> &\n  SelectionProps & {\n    /**\n     * Disable auto-focusing on the first item when mounting.\n     *\n     * @default false\n     */\n    disableAutoFocus?: boolean;\n  };\n\n/**\n * State used in rendering Listbox\n */\nexport type ListboxState = ComponentState<ListboxSlots> &\n  OptionCollectionState &\n  Pick<SelectionProps, 'multiselect'> &\n  SelectionState & {\n    /**\n     * @deprecated - no longer used internally\n     * @see activeDescendantController.active()\n     */\n    activeOption?: OptionValue;\n\n    /**\n     * @deprecated - no longer used internally\n     */\n    focusVisible: boolean;\n\n    /**\n     * @deprecated - no longer used internally\n     * @see activeDescendantController.focus(id)\n     */\n    setActiveOption(option?: OptionValue): void;\n\n    // Whether the Listbox renders within a Combobox, Dropdown, or picker, or as a standalone widget\n    standalone: boolean;\n\n    selectOption(event: SelectionEvents, option: OptionValue): void;\n\n    activeDescendantController: ActiveDescendantImperativeRef;\n\n    onActiveDescendantChange?: (event: ActiveDescendantChangeEvent) => void;\n  };\n\nexport type ListboxContextValues = {\n  listbox: ListboxContextValue;\n  activeDescendant: ActiveDescendantContextValue;\n};\n"],"names":[],"mappings":""}

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/index.js

@@ -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, {
+    Listbox: function() {
+        return _Listbox.Listbox;
+    },
+    listboxClassNames: function() {
+        return _useListboxStylesstyles.listboxClassNames;
+    },
+    renderListbox_unstable: function() {
+        return _renderListbox.renderListbox_unstable;
+    },
+    useListboxStyles_unstable: function() {
+        return _useListboxStylesstyles.useListboxStyles_unstable;
+    },
+    useListbox_unstable: function() {
+        return _useListbox.useListbox_unstable;
+    }
+});
+const _Listbox = require("./Listbox");
+const _renderListbox = require("./renderListbox");
+const _useListbox = require("./useListbox");
+const _useListboxStylesstyles = require("./useListboxStyles.styles");

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Listbox/index.ts"],"sourcesContent":["export { Listbox } from './Listbox';\nexport type { ListboxContextValues, ListboxProps, ListboxSlots, ListboxState } from './Listbox.types';\nexport { renderListbox_unstable } from './renderListbox';\nexport { useListbox_unstable } from './useListbox';\nexport { listboxClassNames, useListboxStyles_unstable } from './useListboxStyles.styles';\n"],"names":["Listbox","renderListbox_unstable","useListbox_unstable","listboxClassNames","useListboxStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,gBAAO;;;eAIPG,yCAAiB;;;eAFjBF,qCAAsB;;;eAEHG,iDAAyB;;;eAD5CF,+BAAmB;;;yBAHJ,YAAY;+BAEG,kBAAkB;4BACrB,eAAe;wCACU,4BAA4B"}

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/renderListbox.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderListbox_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderListbox_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactutilities = require("@fluentui/react-utilities");
+const _reactaria = require("@fluentui/react-aria");
+const _ListboxContext = require("../../contexts/ListboxContext");
+const renderListbox_unstable = (state, contextValues)=>{
+    (0, _reactutilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactaria.ActiveDescendantContextProvider, {
+        value: contextValues.activeDescendant,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_ListboxContext.ListboxContext.Provider, {
+            value: contextValues.listbox,
+            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {})
+        })
+    });
+};

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/renderListbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Listbox/renderListbox.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 { ActiveDescendantContextProvider } from '@fluentui/react-aria';\nimport type { ListboxContextValues, ListboxState, ListboxSlots } from './Listbox.types';\nimport { ListboxContext } from '../../contexts/ListboxContext';\n\n/**\n * Render the final JSX of Listbox\n */\nexport const renderListbox_unstable = (state: ListboxState, contextValues: ListboxContextValues): JSXElement => {\n  assertSlots<ListboxSlots>(state);\n\n  return (\n    <ActiveDescendantContextProvider value={contextValues.activeDescendant}>\n      <ListboxContext.Provider value={contextValues.listbox}>\n        <state.root />\n      </ListboxContext.Provider>\n    </ActiveDescendantContextProvider>\n  );\n};\n"],"names":["assertSlots","ActiveDescendantContextProvider","ListboxContext","renderListbox_unstable","state","contextValues","value","activeDescendant","Provider","listbox","root"],"mappings":";;;;+BAYaG;;;;;;4BAXb,gDAAiD;gCAErB,4BAA4B;2BAER,uBAAuB;gCAExC,gCAAgC;AAKxD,+BAA+B,CAACC,OAAqBC;QAC1DL,2BAAAA,EAA0BI;IAE1B,OAAA,WAAA,OACE,eAAA,EAACH,0CAAAA,EAAAA;QAAgCK,OAAOD,cAAcE,gBAAgB;kBACpE,WAAA,OAAA,eAAA,EAACL,8BAAAA,CAAeM,QAAQ,EAAA;YAACF,OAAOD,cAAcI,OAAO;sBACnD,WAAA,OAAA,eAAA,EAACL,MAAMM,IAAI,EAAA,CAAA;;;AAInB,EAAE"}

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/useListbox.js

@@ -0,0 +1,199 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useListbox_unstable", {
+    enumerable: true,
+    get: function() {
+        return useListbox_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 _reactcontextselector = require("@fluentui/react-context-selector");
+const _reactaria = require("@fluentui/react-aria");
+const _dropdownKeyActions = require("../../utils/dropdownKeyActions");
+const _useOptionCollection = require("../../utils/useOptionCollection");
+const _useSelection = require("../../utils/useSelection");
+const _useOptionStylesstyles = require("../Option/useOptionStyles.styles");
+const _ListboxContext = require("../../contexts/ListboxContext");
+const _reacttabster = require("@fluentui/react-tabster");
+// eslint-disable-next-line @typescript-eslint/naming-convention
+const UNSAFE_noLongerUsed = {
+    activeOption: undefined,
+    focusVisible: false,
+    setActiveOption: ()=>null
+};
+const useListbox_unstable = (props, ref)=>{
+    'use no memo';
+    const { multiselect, disableAutoFocus = false } = props;
+    const optionCollection = (0, _useOptionCollection.useOptionCollection)();
+    const { listboxRef: activeDescendantListboxRef, activeParentRef, controller } = (0, _reactaria.useActiveDescendant)({
+        matchOption: (el)=>el.classList.contains(_useOptionStylesstyles.optionClassNames.root)
+    });
+    const hasListboxContext = (0, _reactcontextselector.useHasParentContext)(_ListboxContext.ListboxContext);
+    const onActiveDescendantChange = (0, _ListboxContext.useListboxContext_unstable)((ctx)=>ctx.onActiveDescendantChange);
+    const contextGetOptionById = (0, _ListboxContext.useListboxContext_unstable)((ctx)=>ctx.getOptionById);
+    const contextGetOptionsMatchingValue = (0, _ListboxContext.useListboxContext_unstable)((ctx)=>ctx.getOptionsMatchingValue);
+    const getOptionById = hasListboxContext ? contextGetOptionById : optionCollection.getOptionById;
+    const getOptionsMatchingValue = hasListboxContext ? contextGetOptionsMatchingValue : optionCollection.getOptionsMatchingValue;
+    const listenerRef = _react.useMemo(()=>{
+        let element = null;
+        const listener = (untypedEvent)=>{
+            // Typescript doesn't support custom event types on handler
+            const event = untypedEvent;
+            onActiveDescendantChange === null || onActiveDescendantChange === void 0 ? void 0 : onActiveDescendantChange(event);
+        };
+        return (el)=>{
+            if (!el) {
+                element === null || element === void 0 ? void 0 : element.removeEventListener('activedescendantchange', listener);
+                return;
+            }
+            element = el;
+            element.addEventListener('activedescendantchange', listener);
+        };
+    }, [
+        onActiveDescendantChange
+    ]);
+    const [isNavigatingWithKeyboard, setIsNavigatingWithKeyboard] = _react.useState(false);
+    (0, _reacttabster.useOnKeyboardNavigationChange)(setIsNavigatingWithKeyboard);
+    const activeDescendantContext = (0, _reactaria.useActiveDescendantContext)();
+    const hasParentActiveDescendantContext = (0, _reactaria.useHasParentActiveDescendantContext)();
+    const activeDescendantController = hasParentActiveDescendantContext ? activeDescendantContext.controller : controller;
+    const { clearSelection, selectedOptions, selectOption } = (0, _useSelection.useSelection)(props);
+    const onKeyDown = (event)=>{
+        const action = (0, _dropdownKeyActions.getDropdownActionFromKey)(event, {
+            open: true
+        });
+        const activeOptionId = activeDescendantController.active();
+        const activeOption = activeOptionId ? getOptionById(activeOptionId) : null;
+        switch(action){
+            case 'First':
+            case 'Last':
+            case 'Next':
+            case 'Previous':
+            case 'PageDown':
+            case 'PageUp':
+            case 'CloseSelect':
+            case 'Select':
+                event.preventDefault();
+                break;
+        }
+        switch(action){
+            case 'Next':
+                if (activeOption) {
+                    activeDescendantController.next();
+                } else {
+                    activeDescendantController.first();
+                }
+                break;
+            case 'Previous':
+                if (activeOption) {
+                    activeDescendantController.prev();
+                } else {
+                    activeDescendantController.first();
+                }
+                break;
+            case 'PageUp':
+            case 'First':
+                activeDescendantController.first();
+                break;
+            case 'PageDown':
+            case 'Last':
+                activeDescendantController.last();
+                break;
+            case 'Select':
+            case 'CloseSelect':
+                activeOption && selectOption(event, activeOption);
+                break;
+        }
+    };
+    // get state from parent combobox, if it exists
+    const contextSelectedOptions = (0, _ListboxContext.useListboxContext_unstable)((ctx)=>ctx.selectedOptions);
+    const contextSelectOption = (0, _ListboxContext.useListboxContext_unstable)((ctx)=>ctx.selectOption);
+    // without a parent combobox context, provide values directly from Listbox
+    const optionContextValues = hasListboxContext ? {
+        selectedOptions: contextSelectedOptions,
+        selectOption: contextSelectOption,
+        ...UNSAFE_noLongerUsed
+    } : {
+        selectedOptions,
+        selectOption,
+        ...UNSAFE_noLongerUsed
+    };
+    _react.useEffect(()=>{
+        // if the listbox has a parent context, that parent context should handle the activedescendant
+        if (hasParentActiveDescendantContext) {
+            return;
+        }
+        // disable focus-visible attributes until focus is received
+        activeDescendantController.hideFocusVisibleAttributes();
+        if (!disableAutoFocus) {
+            // if it is single-select and there is a selected option, start at the selected option
+            if (!multiselect && optionContextValues.selectedOptions.length > 0) {
+                const selectedOption = getOptionsMatchingValue((v)=>v === optionContextValues.selectedOptions[0]).pop();
+                if (selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.id) {
+                    activeDescendantController.focus(selectedOption.id);
+                }
+            } else {
+                activeDescendantController.first();
+            }
+        }
+        return ()=>{
+            activeDescendantController.blur();
+        };
+    // this should only be run once in the lifecycle of the Listbox
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    const onFocus = _react.useCallback(()=>{
+        if (hasParentActiveDescendantContext) {
+            return;
+        }
+        activeDescendantController.showFocusVisibleAttributes();
+        if (isNavigatingWithKeyboard) {
+            activeDescendantController.scrollActiveIntoView();
+        }
+    }, [
+        activeDescendantController,
+        hasParentActiveDescendantContext,
+        isNavigatingWithKeyboard
+    ]);
+    const onBlur = _react.useCallback(()=>{
+        if (hasParentActiveDescendantContext) {
+            return;
+        }
+        activeDescendantController.hideFocusVisibleAttributes();
+    }, [
+        activeDescendantController,
+        hasParentActiveDescendantContext
+    ]);
+    const state = {
+        components: {
+            root: 'div'
+        },
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+            ref: (0, _reactutilities.useMergedRefs)(ref, activeParentRef, activeDescendantListboxRef, listenerRef),
+            role: multiselect ? 'menu' : 'listbox',
+            tabIndex: 0,
+            ...props
+        }), {
+            elementType: 'div'
+        }),
+        standalone: !hasListboxContext,
+        multiselect,
+        clearSelection,
+        activeDescendantController,
+        onActiveDescendantChange,
+        ...optionCollection,
+        ...optionContextValues
+    };
+    state.root.onKeyDown = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(state.root.onKeyDown, onKeyDown));
+    state.root.onFocus = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(state.root.onFocus, onFocus));
+    state.root.onBlur = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(state.root.onBlur, onBlur));
+    return state;
+};

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/useListboxStyles.styles.js

@@ -0,0 +1,73 @@
+'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, {
+    listboxClassNames: function() {
+        return listboxClassNames;
+    },
+    useListboxStyles_unstable: function() {
+        return useListboxStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const listboxClassNames = {
+    root: 'fui-Listbox'
+};
+/**
+ * Styles for the root slot
+ */ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
+    root: {
+        De3pzq: "fxugw4r",
+        B7ck84d: "f1ewtqcl",
+        mc9l5x: "f22iagw",
+        Beiy3e4: "f1vx9l62",
+        Bf4jedk: "f3hsy1e",
+        Bmxbyg5: "f5zp4f",
+        Bw0xxkn: 0,
+        oeaueh: 0,
+        Bpd4iqm: 0,
+        Befb4lg: "f1iepc6i",
+        Byoj8tv: 0,
+        uwmqm3: 0,
+        z189sj: 0,
+        z8tnut: 0,
+        B0ocmuz: "f1t35pdg",
+        Belr9w4: "fiut8dr"
+    }
+}, {
+    d: [
+        ".fxugw4r{background-color:var(--colorNeutralBackground1);}",
+        ".f1ewtqcl{box-sizing:border-box;}",
+        ".f22iagw{display:flex;}",
+        ".f1vx9l62{flex-direction:column;}",
+        ".f3hsy1e{min-width:160px;}",
+        ".f5zp4f{overflow-y:auto;}",
+        [
+            ".f1iepc6i{outline:1px solid var(--colorTransparentStroke);}",
+            {
+                p: -1
+            }
+        ],
+        [
+            ".f1t35pdg{padding:var(--spacingHorizontalXS);}",
+            {
+                p: -1
+            }
+        ],
+        ".fiut8dr{row-gap:var(--spacingHorizontalXXS);}"
+    ]
+});
+const useListboxStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _react.mergeClasses)(listboxClassNames.root, styles.root, state.root.className);
+    return state;
+};

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/useListboxStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useListboxStyles.styles.js"],"sourcesContent":["'use client';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const listboxClassNames = {\n    root: 'fui-Listbox'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        backgroundColor: tokens.colorNeutralBackground1,\n        boxSizing: 'border-box',\n        display: 'flex',\n        flexDirection: 'column',\n        minWidth: '160px',\n        overflowY: 'auto',\n        outline: `1px solid ${tokens.colorTransparentStroke}`,\n        padding: tokens.spacingHorizontalXS,\n        rowGap: tokens.spacingHorizontalXXS\n    }\n});\n/**\n * Apply styling to the Listbox slots based on the state\n */ export const useListboxStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(listboxClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"names":["tokens","__styles","mergeClasses","listboxClassNames","root","useStyles","De3pzq","B7ck84d","mc9l5x","Beiy3e4","Bf4jedk","Bmxbyg5","Bw0xxkn","oeaueh","Bpd4iqm","Befb4lg","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Belr9w4","d","p","useListboxStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,iBAAiB;;;6BAoBY;;;;uBArBD,gBAAgB;AAClD,0BAA0B;IAC7BC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;KAAA;AAAA,CAYrB,CAAC;AAGS,MAAMC,6BAA6BC,KAAK,IAAG;IAClD,aAAa;IACb,MAAMC,MAAM,GAAGrB,SAAS,CAAC,CAAC;IAC1BoB,KAAK,CAACrB,IAAI,CAACuB,SAAS,OAAGzB,mBAAY,EAACC,iBAAiB,CAACC,IAAI,EAAEsB,MAAM,CAACtB,IAAI,EAAEqB,KAAK,CAACrB,IAAI,CAACuB,SAAS,CAAC;IAC9F,OAAOF,KAAK;AAChB,CAAC"}

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/useListboxStyles.styles.raw.js

@@ -0,0 +1,45 @@
+'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, {
+    listboxClassNames: function() {
+        return listboxClassNames;
+    },
+    useListboxStyles_unstable: function() {
+        return useListboxStyles_unstable;
+    }
+});
+const _reacttheme = require("@fluentui/react-theme");
+const _react = require("@griffel/react");
+const listboxClassNames = {
+    root: 'fui-Listbox'
+};
+/**
+ * Styles for the root slot
+ */ const useStyles = (0, _react.makeStyles)({
+    root: {
+        backgroundColor: _reacttheme.tokens.colorNeutralBackground1,
+        boxSizing: 'border-box',
+        display: 'flex',
+        flexDirection: 'column',
+        minWidth: '160px',
+        overflowY: 'auto',
+        outline: `1px solid ${_reacttheme.tokens.colorTransparentStroke}`,
+        padding: _reacttheme.tokens.spacingHorizontalXS,
+        rowGap: _reacttheme.tokens.spacingHorizontalXXS
+    }
+});
+const useListboxStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _react.mergeClasses)(listboxClassNames.root, styles.root, state.root.className);
+    return state;
+};

node_modules/@fluentui/react-combobox/lib-commonjs/components/Listbox/useListboxStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Listbox/useListboxStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { tokens } from '@fluentui/react-theme';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { ListboxSlots, ListboxState } from './Listbox.types';\n\nexport const listboxClassNames: SlotClassNames<ListboxSlots> = {\n  root: 'fui-Listbox',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    backgroundColor: tokens.colorNeutralBackground1,\n    boxSizing: 'border-box',\n    display: 'flex',\n    flexDirection: 'column',\n    minWidth: '160px',\n    overflowY: 'auto',\n    outline: `1px solid ${tokens.colorTransparentStroke}`,\n    padding: tokens.spacingHorizontalXS,\n    rowGap: tokens.spacingHorizontalXXS,\n  },\n});\n\n/**\n * Apply styling to the Listbox slots based on the state\n */\nexport const useListboxStyles_unstable = (state: ListboxState): ListboxState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(listboxClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"],"names":["tokens","makeStyles","mergeClasses","listboxClassNames","root","useStyles","backgroundColor","colorNeutralBackground1","boxSizing","display","flexDirection","minWidth","overflowY","outline","colorTransparentStroke","padding","spacingHorizontalXS","rowGap","spacingHorizontalXXS","useListboxStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAOaG,iBAAAA;;;IAwBAgB,yBAAAA;;;;4BA7BU,wBAAwB;uBAEN,iBAAiB;AAGnD,0BAAwD;IAC7Df,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM;QACJE,iBAAiBN,kBAAAA,CAAOO,uBAAuB;QAC/CC,WAAW;QACXC,SAAS;QACTC,eAAe;QACfC,UAAU;QACVC,WAAW;QACXC,SAAS,CAAC,UAAU,EAAEb,kBAAAA,CAAOc,sBAAsB,EAAE;QACrDC,SAASf,kBAAAA,CAAOgB,mBAAmB;QACnCC,QAAQjB,kBAAAA,CAAOkB,oBAAoB;IACrC;AACF;AAKO,kCAAkC,CAACE;IACxC;IAEA,MAAMC,SAAShB;IACfe,MAAMhB,IAAI,CAACkB,SAAS,OAAGpB,mBAAAA,EAAaC,kBAAkBC,IAAI,EAAEiB,OAAOjB,IAAI,EAAEgB,MAAMhB,IAAI,CAACkB,SAAS;IAE7F,OAAOF;AACT,EAAE"}