feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/NavItem.js

@@ -0,0 +1,24 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "NavItem", {
+    enumerable: true,
+    get: function() {
+        return NavItem;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _useNavItem = require("./useNavItem");
+const _renderNavItem = require("./renderNavItem");
+const _useNavItemStylesstyles = require("./useNavItemStyles.styles");
+const NavItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useNavItem.useNavItem_unstable)(props, ref);
+    (0, _useNavItemStylesstyles.useNavItemStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useNavItemStyles_unstable')(state);
+    return (0, _renderNavItem.renderNavItem_unstable)(state);
+});
+NavItem.displayName = 'NavItem';

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/NavItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavItem/NavItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useNavItem_unstable } from './useNavItem';\nimport { renderNavItem_unstable } from './renderNavItem';\nimport { useNavItemStyles_unstable } from './useNavItemStyles.styles';\nimport type { NavItemProps } from './NavItem.types';\n\n/**\n * NavItem component - a single item in the navigation menu.\n */\nexport const NavItem: ForwardRefComponent<NavItemProps> = React.forwardRef((props, ref) => {\n  const state = useNavItem_unstable(props, ref);\n\n  useNavItemStyles_unstable(state);\n  useCustomStyleHook_unstable('useNavItemStyles_unstable')(state);\n\n  return renderNavItem_unstable(state);\n});\n\nNavItem.displayName = 'NavItem';\n"],"names":["React","useCustomStyleHook_unstable","useNavItem_unstable","renderNavItem_unstable","useNavItemStyles_unstable","NavItem","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;qCAEa,kCAAkC;4BAE1C,eAAe;+BACZ,kBAAkB;wCACf,4BAA4B;AAM/D,MAAMK,UAAAA,WAAAA,GAA6CL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACjF,MAAMC,YAAQP,+BAAAA,EAAoBK,OAAOC;QAEzCJ,iDAAAA,EAA0BK;QAC1BR,gDAAAA,EAA4B,6BAA6BQ;IAEzD,WAAON,qCAAAA,EAAuBM;AAChC,GAAG;AAEHJ,QAAQK,WAAW,GAAG"}

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/NavItem.types.js

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

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/NavItem.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavItem/NavItem.types.ts"],"sourcesContent":["import { NavItemValue } from '../NavContext.types';\nimport { NavDensity } from '../Nav/Nav.types';\nimport type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type NavItemSlots = {\n  /**\n   * The root element of the NavItem.\n   */\n  root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;\n\n  /**\n   * Icon that renders before the content.\n   */\n  icon?: Slot<'span'>;\n};\n\n/**\n * NavItem Props\n */\nexport type NavItemProps = ComponentProps<NavItemSlots> & {\n  /**\n   * Destination where the nav item points to.\n   */\n  href?: string;\n  /**\n   * The value that identifies this navCategoryItem when selected.\n   */\n  value: NavItemValue;\n};\n\n/**\n * State used in rendering NavItem\n */\nexport type NavItemState = ComponentState<NavItemSlots> &\n  Pick<NavItemProps, 'value'> & {\n    /**\n     * If this navCategoryItem is selected\n     */\n    selected: boolean;\n\n    /**\n     * The density of the NavItem\n     *\n     * @default 'medium'\n     */\n    density: NavDensity;\n  };\n"],"names":[],"mappings":"AA+BA;;CAEC,GACD,WAaI"}

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/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, {
+    NavItem: function() {
+        return _NavItem.NavItem;
+    },
+    navItemClassNames: function() {
+        return _useNavItemStylesstyles.navItemClassNames;
+    },
+    renderNavItem_unstable: function() {
+        return _renderNavItem.renderNavItem_unstable;
+    },
+    useNavItemStyles_unstable: function() {
+        return _useNavItemStylesstyles.useNavItemStyles_unstable;
+    },
+    useNavItem_unstable: function() {
+        return _useNavItem.useNavItem_unstable;
+    }
+});
+const _NavItem = require("./NavItem");
+const _renderNavItem = require("./renderNavItem");
+const _useNavItem = require("./useNavItem");
+const _useNavItemStylesstyles = require("./useNavItemStyles.styles");

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavItem/index.ts"],"sourcesContent":["export { NavItem } from './NavItem';\nexport type { NavItemSlots, NavItemProps, NavItemState } from './NavItem.types';\nexport { renderNavItem_unstable } from './renderNavItem';\nexport { useNavItem_unstable } from './useNavItem';\nexport { useNavItemStyles_unstable, navItemClassNames } from './useNavItemStyles.styles';\n"],"names":["NavItem","renderNavItem_unstable","useNavItem_unstable","useNavItemStyles_unstable","navItemClassNames"],"mappings":";;;;;;;;;;;;eAASA,gBAAO;;;eAIoBI,yCAAiB;;;eAF5CH,qCAAsB;;;eAEtBE,iDAAyB;;;eADzBD,+BAAmB;;;yBAHJ,YAAY;+BAEG,kBAAkB;4BACrB,eAAe;wCACU,4BAA4B"}

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/renderNavItem.js

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

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/renderNavItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavItem/renderNavItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\n\nimport type { NavItemState, NavItemSlots } from './NavItem.types';\n\n/**\n * Render the final JSX of NavItem\n */\nexport const renderNavItem_unstable = (state: NavItemState): JSXElement => {\n  assertSlots<NavItemSlots>(state);\n\n  return (\n    <state.root>\n      {state.icon && <state.icon />}\n      {state.root.children}\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderNavItem_unstable","state","root","icon","children"],"mappings":";;;;+BAWaC;;;;;;4BAVb,iCAAiD;gCAErB,4BAA4B;AAQjD,+BAA+B,CAACC;QACrCF,2BAAAA,EAA0BE;IAE1B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAME,IAAI,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,IAAI,EAAA,CAAA;YACzBF,MAAMC,IAAI,CAACE,QAAQ;;;AAG1B,EAAE"}

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/useNavItem.js

@@ -0,0 +1,74 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useNavItem_unstable", {
+    enumerable: true,
+    get: function() {
+        return useNavItem_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 _reactaria = require("@fluentui/react-aria");
+const _NavContext = require("../NavContext");
+const useNavItem_unstable = (props, ref)=>{
+    const { onClick, value, icon, as, href } = props;
+    const { selectedValue, onRegister, onUnregister, onSelect, density = 'medium' } = (0, _NavContext.useNavContext_unstable)();
+    const rootElementType = as || (href ? 'a' : 'button');
+    const selected = selectedValue === value;
+    const innerRef = _react.useRef(null);
+    const onNavItemClick = (0, _reactutilities.useEventCallback)((event)=>{
+        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        if (!event.defaultPrevented && (0, _reactutilities.isHTMLElement)(event.target)) {
+            onSelect(event, {
+                type: 'click',
+                event,
+                value
+            });
+        }
+    });
+    const root = _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(rootElementType, (0, _reactaria.useARIAButtonProps)(rootElementType, {
+        'aria-current': selected ? 'page' : 'false',
+        ...props
+    })), {
+        elementType: rootElementType,
+        defaultProps: {
+            ref: ref,
+            type: rootElementType
+        }
+    });
+    root.onClick = onNavItemClick;
+    _react.useEffect(()=>{
+        onRegister({
+            value,
+            ref: innerRef
+        });
+        return ()=>{
+            onUnregister({
+                value,
+                ref: innerRef
+            });
+        };
+    }, [
+        onRegister,
+        onUnregister,
+        innerRef,
+        value
+    ]);
+    return {
+        components: {
+            root: rootElementType,
+            icon: 'span'
+        },
+        root,
+        icon: _reactutilities.slot.optional(icon, {
+            elementType: 'span'
+        }),
+        selected,
+        value,
+        density
+    };
+};

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/useNavItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavItem/useNavItem.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot, useEventCallback, isHTMLElement } from '@fluentui/react-utilities';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { useNavContext_unstable } from '../NavContext';\n\nimport type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport type { NavItemProps, NavItemState } from './NavItem.types';\n\n/**\n * Create the state required to render NavItem.\n *\n * The returned state can be modified with hooks such as useNavItemStyles_unstable,\n * before being passed to renderNavItem_unstable.\n *\n * @param props - props from this instance of NavItem\n * @param ref - reference to root HTMLAnchorElement of NavItem\n */\nexport const useNavItem_unstable = (\n  props: NavItemProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): NavItemState => {\n  const { onClick, value, icon, as, href } = props;\n\n  const { selectedValue, onRegister, onUnregister, onSelect, density = 'medium' } = useNavContext_unstable();\n\n  const rootElementType = as || (href ? 'a' : 'button');\n\n  const selected = selectedValue === value;\n\n  const innerRef = React.useRef<HTMLElement>(null);\n\n  const onNavItemClick: ARIAButtonSlotProps<'a'>['onClick'] = useEventCallback(event => {\n    onClick?.(event);\n\n    if (!event.defaultPrevented && isHTMLElement(event.target)) {\n      onSelect(event, { type: 'click', event, value });\n    }\n  });\n\n  const root = slot.always<ARIAButtonSlotProps<'a'>>(\n    getIntrinsicElementProps(\n      rootElementType,\n      useARIAButtonProps(rootElementType, {\n        'aria-current': selected ? 'page' : 'false',\n        ...props,\n      }),\n    ),\n    {\n      elementType: rootElementType,\n      defaultProps: {\n        ref: ref as React.Ref<HTMLButtonElement & HTMLAnchorElement>,\n        type: rootElementType,\n      },\n    },\n  );\n\n  root.onClick = onNavItemClick;\n\n  React.useEffect(() => {\n    onRegister({\n      value,\n      ref: innerRef,\n    });\n\n    return () => {\n      onUnregister({ value, ref: innerRef });\n    };\n  }, [onRegister, onUnregister, innerRef, value]);\n\n  return {\n    components: { root: rootElementType, icon: 'span' },\n    root,\n    icon: slot.optional(icon, {\n      elementType: 'span',\n    }),\n    selected,\n    value,\n    density,\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useEventCallback","isHTMLElement","useARIAButtonProps","useNavContext_unstable","useNavItem_unstable","props","ref","onClick","value","icon","as","href","selectedValue","onRegister","onUnregister","onSelect","density","rootElementType","selected","innerRef","useRef","onNavItemClick","event","defaultPrevented","target","type","root","always","elementType","defaultProps","useEffect","components","optional"],"mappings":"AAAA;;;;;+BAmBaO;;;;;;;iEAjBU,QAAQ;gCACiD,4BAA4B;2BACzE,uBAAuB;4BACnB,gBAAgB;AAchD,4BAA4B,CACjCC,OACAC;IAEA,MAAM,EAAEC,OAAO,EAAEC,KAAK,EAAEC,IAAI,EAAEC,EAAE,EAAEC,IAAI,EAAE,GAAGN;IAE3C,MAAM,EAAEO,aAAa,EAAEC,UAAU,EAAEC,YAAY,EAAEC,QAAQ,EAAEC,UAAU,QAAQ,EAAE,OAAGb,kCAAAA;IAElF,MAAMc,kBAAkBP,MAAOC,CAAAA,OAAO,MAAM,QAAA,CAAO;IAEnD,MAAMO,WAAWN,kBAAkBJ;IAEnC,MAAMW,WAAWtB,OAAMuB,MAAM,CAAc;IAE3C,MAAMC,qBAAsDrB,gCAAAA,EAAiBsB,CAAAA;QAC3Ef,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAAUe;QAEV,IAAI,CAACA,MAAMC,gBAAgB,QAAItB,6BAAAA,EAAcqB,MAAME,MAAM,GAAG;YAC1DT,SAASO,OAAO;gBAAEG,MAAM;gBAASH;gBAAOd;YAAM;QAChD;IACF;IAEA,MAAMkB,OAAO3B,oBAAAA,CAAK4B,MAAM,KACtB7B,wCAAAA,EACEmB,qBACAf,6BAAAA,EAAmBe,iBAAiB;QAClC,gBAAgBC,WAAW,SAAS;QACpC,GAAGb,KAAK;IACV,KAEF;QACEuB,aAAaX;QACbY,cAAc;YACZvB,KAAKA;YACLmB,MAAMR;QACR;IACF;IAGFS,KAAKnB,OAAO,GAAGc;IAEfxB,OAAMiC,SAAS,CAAC;QACdjB,WAAW;YACTL;YACAF,KAAKa;QACP;QAEA,OAAO;YACLL,aAAa;gBAAEN;gBAAOF,KAAKa;YAAS;QACtC;IACF,GAAG;QAACN;QAAYC;QAAcK;QAAUX;KAAM;IAE9C,OAAO;QACLuB,YAAY;YAAEL,MAAMT;YAAiBR,MAAM;QAAO;QAClDiB;QACAjB,MAAMV,oBAAAA,CAAKiC,QAAQ,CAACvB,MAAM;YACxBmB,aAAa;QACf;QACAV;QACAV;QACAQ;IACF;AACF,EAAE"}

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/useNavItemStyles.styles.js

@@ -0,0 +1,39 @@
+'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, {
+    navItemClassNames: function() {
+        return navItemClassNames;
+    },
+    useNavItemStyles_unstable: function() {
+        return useNavItemStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _sharedNavStylesstyles = require("../sharedNavStyles.styles");
+const navItemClassNames = {
+    root: 'fui-NavItem',
+    icon: 'fui-NavItem__icon'
+};
+const useNavItemStyles_unstable = (state)=>{
+    'use no memo';
+    const rootDefaultClassName = (0, _sharedNavStylesstyles.useRootDefaultClassName)();
+    const smallStyles = (0, _sharedNavStylesstyles.useSmallStyles)();
+    const contentStyles = (0, _sharedNavStylesstyles.useContentStyles)();
+    const indicatorStyles = (0, _sharedNavStylesstyles.useIndicatorStyles)();
+    const iconStyles = (0, _sharedNavStylesstyles.useIconStyles)();
+    const { selected, density } = state;
+    state.root.className = (0, _react.mergeClasses)(navItemClassNames.root, rootDefaultClassName, density === 'small' && smallStyles.root, selected && indicatorStyles.base, selected && contentStyles.selected, state.root.className);
+    if (state.icon) {
+        state.icon.className = (0, _react.mergeClasses)(navItemClassNames.icon, iconStyles.base, selected && iconStyles.selected, state.icon.className);
+    }
+    return state;
+};

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/useNavItemStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useNavItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useContentStyles, useIconStyles, useIndicatorStyles, useRootDefaultClassName, useSmallStyles } from '../sharedNavStyles.styles';\nexport const navItemClassNames = {\n    root: 'fui-NavItem',\n    icon: 'fui-NavItem__icon'\n};\n/**\n * Apply styling to the NavItem slots based on the state\n */ export const useNavItemStyles_unstable = (state)=>{\n    'use no memo';\n    const rootDefaultClassName = useRootDefaultClassName();\n    const smallStyles = useSmallStyles();\n    const contentStyles = useContentStyles();\n    const indicatorStyles = useIndicatorStyles();\n    const iconStyles = useIconStyles();\n    const { selected, density } = state;\n    state.root.className = mergeClasses(navItemClassNames.root, rootDefaultClassName, density === 'small' && smallStyles.root, selected && indicatorStyles.base, selected && contentStyles.selected, state.root.className);\n    if (state.icon) {\n        state.icon.className = mergeClasses(navItemClassNames.icon, iconStyles.base, selected && iconStyles.selected, state.icon.className);\n    }\n    return state;\n};\n"],"names":["mergeClasses","useContentStyles","useIconStyles","useIndicatorStyles","useRootDefaultClassName","useSmallStyles","navItemClassNames","root","icon","useNavItemStyles_unstable","state","rootDefaultClassName","smallStyles","contentStyles","indicatorStyles","iconStyles","selected","density","className","base"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCM,iBAAiB;;;6BAMY;;;;uBARb,gBAAgB;uCACgE,2BAA2B;AACjI,0BAA0B;IAC7BC,IAAI,EAAE,aAAa;IACnBC,IAAI,EAAE;AACV,CAAC;AAGU,MAAMC,6BAA6BC,KAAK,IAAG;IAClD,aAAa;IACb,MAAMC,oBAAoB,OAAGP,8CAAuB,CAAC,CAAC;IACtD,MAAMQ,WAAW,OAAGP,qCAAc,CAAC,CAAC;IACpC,MAAMQ,aAAa,OAAGZ,uCAAgB,CAAC,CAAC;IACxC,MAAMa,eAAe,OAAGX,yCAAkB,CAAC,CAAC;IAC5C,MAAMY,UAAU,OAAGb,oCAAa,CAAC,CAAC;IAClC,MAAM,EAAEc,QAAQ,EAAEC,OAAAA,EAAS,GAAGP,KAAK;IACnCA,KAAK,CAACH,IAAI,CAACW,SAAS,OAAGlB,mBAAY,EAACM,iBAAiB,CAACC,IAAI,EAAEI,oBAAoB,EAAEM,OAAO,KAAK,OAAO,IAAIL,WAAW,CAACL,IAAI,EAAES,QAAQ,IAAIF,eAAe,CAACK,IAAI,EAAEH,QAAQ,IAAIH,aAAa,CAACG,QAAQ,EAAEN,KAAK,CAACH,IAAI,CAACW,SAAS,CAAC;IACtN,IAAIR,KAAK,CAACF,IAAI,EAAE;QACZE,KAAK,CAACF,IAAI,CAACU,SAAS,OAAGlB,mBAAY,EAACM,iBAAiB,CAACE,IAAI,EAAEO,UAAU,CAACI,IAAI,EAAEH,QAAQ,IAAID,UAAU,CAACC,QAAQ,EAAEN,KAAK,CAACF,IAAI,CAACU,SAAS,CAAC;IACvI;IACA,OAAOR,KAAK;AAChB,CAAC"}

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/useNavItemStyles.styles.raw.js

@@ -0,0 +1,39 @@
+'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, {
+    navItemClassNames: function() {
+        return navItemClassNames;
+    },
+    useNavItemStyles_unstable: function() {
+        return useNavItemStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _sharedNavStylesstyles = require("../sharedNavStyles.styles");
+const navItemClassNames = {
+    root: 'fui-NavItem',
+    icon: 'fui-NavItem__icon'
+};
+const useNavItemStyles_unstable = (state)=>{
+    'use no memo';
+    const rootDefaultClassName = (0, _sharedNavStylesstyles.useRootDefaultClassName)();
+    const smallStyles = (0, _sharedNavStylesstyles.useSmallStyles)();
+    const contentStyles = (0, _sharedNavStylesstyles.useContentStyles)();
+    const indicatorStyles = (0, _sharedNavStylesstyles.useIndicatorStyles)();
+    const iconStyles = (0, _sharedNavStylesstyles.useIconStyles)();
+    const { selected, density } = state;
+    state.root.className = (0, _react.mergeClasses)(navItemClassNames.root, rootDefaultClassName, density === 'small' && smallStyles.root, selected && indicatorStyles.base, selected && contentStyles.selected, state.root.className);
+    if (state.icon) {
+        state.icon.className = (0, _react.mergeClasses)(navItemClassNames.icon, iconStyles.base, selected && iconStyles.selected, state.icon.className);
+    }
+    return state;
+};

node_modules/@fluentui/react-nav/lib-commonjs/components/NavItem/useNavItemStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavItem/useNavItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport {\n  useContentStyles,\n  useIconStyles,\n  useIndicatorStyles,\n  useRootDefaultClassName,\n  useSmallStyles,\n} from '../sharedNavStyles.styles';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavItemSlots, NavItemState } from './NavItem.types';\nexport const navItemClassNames: SlotClassNames<NavItemSlots> = {\n  root: 'fui-NavItem',\n  icon: 'fui-NavItem__icon',\n};\n\n/**\n * Apply styling to the NavItem slots based on the state\n */\nexport const useNavItemStyles_unstable = (state: NavItemState): NavItemState => {\n  'use no memo';\n\n  const rootDefaultClassName = useRootDefaultClassName();\n  const smallStyles = useSmallStyles();\n  const contentStyles = useContentStyles();\n  const indicatorStyles = useIndicatorStyles();\n  const iconStyles = useIconStyles();\n\n  const { selected, density } = state;\n\n  state.root.className = mergeClasses(\n    navItemClassNames.root,\n    rootDefaultClassName,\n    density === 'small' && smallStyles.root,\n    selected && indicatorStyles.base,\n    selected && contentStyles.selected,\n    state.root.className,\n  );\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(\n      navItemClassNames.icon,\n      iconStyles.base,\n      selected && iconStyles.selected,\n      state.icon.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["mergeClasses","useContentStyles","useIconStyles","useIndicatorStyles","useRootDefaultClassName","useSmallStyles","navItemClassNames","root","icon","useNavItemStyles_unstable","state","rootDefaultClassName","smallStyles","contentStyles","indicatorStyles","iconStyles","selected","density","className","base"],"mappings":"AAAA;;;;;;;;;;;;IAaaM,iBAAAA;;;6BAQAG;;;;uBAnBgB,iBAAiB;uCAOvC,4BAA4B;AAI5B,0BAAwD;IAC7DF,MAAM;IACNC,MAAM;AACR,EAAE;AAKK,MAAMC,4BAA4B,CAACC;IACxC;IAEA,MAAMC,2BAAuBP,8CAAAA;IAC7B,MAAMQ,kBAAcP,qCAAAA;IACpB,MAAMQ,oBAAgBZ,uCAAAA;IACtB,MAAMa,sBAAkBX,yCAAAA;IACxB,MAAMY,iBAAab,oCAAAA;IAEnB,MAAM,EAAEc,QAAQ,EAAEC,OAAO,EAAE,GAAGP;IAE9BA,MAAMH,IAAI,CAACW,SAAS,OAAGlB,mBAAAA,EACrBM,kBAAkBC,IAAI,EACtBI,sBACAM,YAAY,WAAWL,YAAYL,IAAI,EACvCS,YAAYF,gBAAgBK,IAAI,EAChCH,YAAYH,cAAcG,QAAQ,EAClCN,MAAMH,IAAI,CAACW,SAAS;IAGtB,IAAIR,MAAMF,IAAI,EAAE;QACdE,MAAMF,IAAI,CAACU,SAAS,OAAGlB,mBAAAA,EACrBM,kBAAkBE,IAAI,EACtBO,WAAWI,IAAI,EACfH,YAAYD,WAAWC,QAAQ,EAC/BN,MAAMF,IAAI,CAACU,SAAS;IAExB;IAEA,OAAOR;AACT,EAAE"}