@fluentui/react-nav 0.0.0-nightly-20250703-1103.1 → 9.0.0

package/lib/components/SplitNavItem/SplitNavItem.js

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
 import { useSplitNavItem_unstable } from './useSplitNavItem';
 import { renderSplitNavItem_unstable } from './renderSplitNavItem';
 import { useSplitNavItemStyles_unstable } from './useSplitNavItemStyles.styles';
@@ -8,7 +7,14 @@ import { useSplitNavItemStyles_unstable } from './useSplitNavItemStyles.styles';
  */ export const SplitNavItem = /*#__PURE__*/ React.forwardRef((props, ref)=>{
     const state = useSplitNavItem_unstable(props, ref);
     useSplitNavItemStyles_unstable(state);
-    useCustomStyleHook_unstable('useSplitNavItemStyles_unstable')(state);
+    /**
+   * @see https://github.com/microsoft/fluentui/blob/master/docs/react-v9/contributing/rfcs/react-components/convergence/custom-styling.md
+   *
+   * TODO: 💡 once package will become stable (PR which will be part of promoting PREVIEW package to STABLE),
+   *      - uncomment this line
+   *      - update types {@link file://./../../../../../../../packages/react-components/react-shared-contexts/library/src/CustomStyleHooksContext/CustomStyleHooksContext.ts#CustomStyleHooksContextValue}
+   *      - verify that custom global style override works for your component
+   */ // useCustomStyleHook_unstable('useSplitNavItemStyles_unstable')(state);
     return renderSplitNavItem_unstable(state);
 });
 SplitNavItem.displayName = 'SplitNavItem';

package/lib/components/SplitNavItem/SplitNavItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SplitNavItem/SplitNavItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useSplitNavItem_unstable } from './useSplitNavItem';\nimport { renderSplitNavItem_unstable } from './renderSplitNavItem';\nimport { useSplitNavItemStyles_unstable } from './useSplitNavItemStyles.styles';\nimport type { SplitNavItemProps } from './SplitNavItem.types';\n\n/**\n * SplitNavItem component - TODO: add more docs\n */\nexport const SplitNavItem: ForwardRefComponent<SplitNavItemProps> = React.forwardRef((props, ref) => {\n  const state = useSplitNavItem_unstable(props, ref);\n\n  useSplitNavItemStyles_unstable(state);\n  useCustomStyleHook_unstable('useSplitNavItemStyles_unstable')(state);\n\n  return renderSplitNavItem_unstable(state);\n});\n\nSplitNavItem.displayName = 'SplitNavItem';\n"],"names":["React","useCustomStyleHook_unstable","useSplitNavItem_unstable","renderSplitNavItem_unstable","useSplitNavItemStyles_unstable","SplitNavItem","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAC/BR,4BAA4B,kCAAkCQ;IAE9D,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/SplitNavItem/SplitNavItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useSplitNavItem_unstable } from './useSplitNavItem';\nimport { renderSplitNavItem_unstable } from './renderSplitNavItem';\nimport { useSplitNavItemStyles_unstable } from './useSplitNavItemStyles.styles';\nimport type { SplitNavItemProps } from './SplitNavItem.types';\n\n/**\n * SplitNavItem component - TODO: add more docs\n */\nexport const SplitNavItem: ForwardRefComponent<SplitNavItemProps> = React.forwardRef((props, ref) => {\n  const state = useSplitNavItem_unstable(props, ref);\n\n  useSplitNavItemStyles_unstable(state);\n\n  /**\n   * @see https://github.com/microsoft/fluentui/blob/master/docs/react-v9/contributing/rfcs/react-components/convergence/custom-styling.md\n   *\n   * TODO: 💡 once package will become stable (PR which will be part of promoting PREVIEW package to STABLE),\n   *      - uncomment this line\n   *      - update types {@link file://./../../../../../../../packages/react-components/react-shared-contexts/library/src/CustomStyleHooksContext/CustomStyleHooksContext.ts#CustomStyleHooksContextValue}\n   *      - verify that custom global style override works for your component\n   */\n  // useCustomStyleHook_unstable('useSplitNavItemStyles_unstable')(state);\n\n  return renderSplitNavItem_unstable(state);\n});\n\nSplitNavItem.displayName = 'SplitNavItem';\n"],"names":["React","useSplitNavItem_unstable","renderSplitNavItem_unstable","useSplitNavItemStyles_unstable","SplitNavItem","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF;;CAEC,GACD,OAAO,MAAMC,6BAAuDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAE/B;;;;;;;GAOC,GACD,wEAAwE;IAExE,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

package/lib/components/SplitNavItem/renderSplitNavItem.js

@@ -1,21 +1,5 @@
   import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import * as React from 'react';
 import { assertSlots } from '@fluentui/react-utilities';
-/**
- * @internal
- *
- * Helper function to render button slots
- */ const renderButtonSlot = (Button, ButtonTooltip)=>{
-    if (!Button) {
-        return null;
-    }
-    if (ButtonTooltip) {
-        return /*#__PURE__*/ _jsx(ButtonTooltip, {
-            children: /*#__PURE__*/ _jsx(Button, {})
-        });
-    }
-    return /*#__PURE__*/ _jsx(Button, {});
-};
 /**
  * Render the final JSX of SplitNavItem
  */ export const renderSplitNavItem_unstable = (state)=>{
@@ -23,9 +7,18 @@ import { assertSlots } from '@fluentui/react-utilities';
     return /*#__PURE__*/ _jsxs(state.root, {
         children: [
             state.navItem && /*#__PURE__*/ _jsx(state.navItem, {}),
-            renderButtonSlot(state.actionButton, state.actionButtonTooltip),
-            renderButtonSlot(state.menuButton, state.menuButtonTooltip),
-            renderButtonSlot(state.toggleButton, state.toggleButtonTooltip)
+            state.actionButton && state.actionButtonTooltip && /*#__PURE__*/ _jsx(state.actionButtonTooltip, {
+                children: /*#__PURE__*/ _jsx(state.actionButton, {})
+            }),
+            state.actionButton && !state.actionButtonTooltip && /*#__PURE__*/ _jsx(state.actionButton, {}),
+            state.toggleButton && state.toggleButtonTooltip && /*#__PURE__*/ _jsx(state.toggleButtonTooltip, {
+                children: /*#__PURE__*/ _jsx(state.toggleButton, {})
+            }),
+            state.toggleButton && !state.toggleButtonTooltip && /*#__PURE__*/ _jsx(state.toggleButton, {}),
+            state.menuButton && state.menuButtonTooltip && /*#__PURE__*/ _jsx(state.menuButtonTooltip, {
+                children: /*#__PURE__*/ _jsx(state.menuButton, {})
+            }),
+            state.menuButton && !state.menuButtonTooltip && /*#__PURE__*/ _jsx(state.menuButton, {})
         ]
     });
 };

package/lib/components/SplitNavItem/renderSplitNavItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SplitNavItem/renderSplitNavItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport { assertSlots } from '@fluentui/react-utilities';\n\nimport type { SplitNavItemState, SplitNavItemSlots } from './SplitNavItem.types';\n\n/**\n * @internal\n *\n * Helper function to render button slots\n */\nconst renderButtonSlot = (Button?: React.ElementType, ButtonTooltip?: React.ElementType) => {\n  if (!Button) {\n    return null;\n  }\n\n  if (ButtonTooltip) {\n    return (\n      <ButtonTooltip>\n        <Button />\n      </ButtonTooltip>\n    );\n  }\n\n  return <Button />;\n};\n\n/**\n * Render the final JSX of SplitNavItem\n */\nexport const renderSplitNavItem_unstable = (state: SplitNavItemState) => {\n  assertSlots<SplitNavItemSlots>(state);\n\n  return (\n    <state.root>\n      {state.navItem && <state.navItem />}\n      {renderButtonSlot(state.actionButton, state.actionButtonTooltip)}\n      {renderButtonSlot(state.menuButton, state.menuButtonTooltip)}\n      {renderButtonSlot(state.toggleButton, state.toggleButtonTooltip)}\n    </state.root>\n  );\n};\n"],"names":["React","assertSlots","renderButtonSlot","Button","ButtonTooltip","renderSplitNavItem_unstable","state","root","navItem","actionButton","actionButtonTooltip","menuButton","menuButtonTooltip","toggleButton","toggleButtonTooltip"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,YAAYA,WAAW,QAAQ;AAC/B,SAASC,WAAW,QAAQ,4BAA4B;AAIxD;;;;CAIC,GACD,MAAMC,mBAAmB,CAACC,QAA4BC;IACpD,IAAI,CAACD,QAAQ;QACX,OAAO;IACT;IAEA,IAAIC,eAAe;QACjB,qBACE,KAACA;sBACC,cAAA,KAACD;;IAGP;IAEA,qBAAO,KAACA;AACV;AAEA;;CAEC,GACD,OAAO,MAAME,8BAA8B,CAACC;IAC1CL,YAA+BK;IAE/B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,OAAO,kBAAI,KAACF,MAAME,OAAO;YAC/BN,iBAAiBI,MAAMG,YAAY,EAAEH,MAAMI,mBAAmB;YAC9DR,iBAAiBI,MAAMK,UAAU,EAAEL,MAAMM,iBAAiB;YAC1DV,iBAAiBI,MAAMO,YAAY,EAAEP,MAAMQ,mBAAmB;;;AAGrE,EAAE"}
+{"version":3,"sources":["../src/components/SplitNavItem/renderSplitNavItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SplitNavItemState, SplitNavItemSlots } from './SplitNavItem.types';\n\n/**\n * Render the final JSX of SplitNavItem\n */\nexport const renderSplitNavItem_unstable = (state: SplitNavItemState) => {\n  assertSlots<SplitNavItemSlots>(state);\n\n  return (\n    <state.root>\n      {state.navItem && <state.navItem />}\n      {state.actionButton && state.actionButtonTooltip && (\n        <state.actionButtonTooltip>\n          <state.actionButton />\n        </state.actionButtonTooltip>\n      )}\n      {state.actionButton && !state.actionButtonTooltip && <state.actionButton />}\n\n      {state.toggleButton && state.toggleButtonTooltip && (\n        <state.toggleButtonTooltip>\n          <state.toggleButton />\n        </state.toggleButtonTooltip>\n      )}\n      {state.toggleButton && !state.toggleButtonTooltip && <state.toggleButton />}\n\n      {state.menuButton && state.menuButtonTooltip && (\n        <state.menuButtonTooltip>\n          <state.menuButton />\n        </state.menuButtonTooltip>\n      )}\n      {state.menuButton && !state.menuButtonTooltip && <state.menuButton />}\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderSplitNavItem_unstable","state","root","navItem","actionButton","actionButtonTooltip","toggleButton","toggleButtonTooltip","menuButton","menuButtonTooltip"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CF,YAA+BE;IAE/B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,OAAO,kBAAI,KAACF,MAAME,OAAO;YAC/BF,MAAMG,YAAY,IAAIH,MAAMI,mBAAmB,kBAC9C,KAACJ,MAAMI,mBAAmB;0BACxB,cAAA,KAACJ,MAAMG,YAAY;;YAGtBH,MAAMG,YAAY,IAAI,CAACH,MAAMI,mBAAmB,kBAAI,KAACJ,MAAMG,YAAY;YAEvEH,MAAMK,YAAY,IAAIL,MAAMM,mBAAmB,kBAC9C,KAACN,MAAMM,mBAAmB;0BACxB,cAAA,KAACN,MAAMK,YAAY;;YAGtBL,MAAMK,YAAY,IAAI,CAACL,MAAMM,mBAAmB,kBAAI,KAACN,MAAMK,YAAY;YAEvEL,MAAMO,UAAU,IAAIP,MAAMQ,iBAAiB,kBAC1C,KAACR,MAAMQ,iBAAiB;0BACtB,cAAA,KAACR,MAAMO,UAAU;;YAGpBP,MAAMO,UAAU,IAAI,CAACP,MAAMQ,iBAAiB,kBAAI,KAACR,MAAMO,UAAU;;;AAGxE,EAAE"}

package/lib/components/SplitNavItem/useSplitNavItemStyles.styles.js

@@ -1,7 +1,6 @@
 import { __styles, mergeClasses } from '@griffel/react';
-import { tokens } from '@fluentui/react-theme';
-import { motionTokens } from '@fluentui/react-motion';
 import { navItemTokens, useRootDefaultClassName } from '../sharedNavStyles.styles';
+import { tokens } from '@fluentui/react-theme';
 export const splitNavItemClassNames = {
   root: 'fui-SplitNavItem',
   navItem: 'fui-SplitNavItem__navItem',
@@ -18,17 +17,6 @@ export const splitNavItemClassNames = {
 // Don't use makeResetStyles here because the sub components call it once and
 // This links says that makeResetStyles should only be called once per element
 // https://griffel.js.org/react/api/make-reset-styles/#limitations
-const {
-  actionButton,
-  toggleButton,
-  menuButton
-} = splitNavItemClassNames;
-const buttonHoverStyles = {
-  [`& .${actionButton}, & .${toggleButton}, & .${menuButton}`]: {
-    opacity: 1,
-    pointerEvents: 'auto'
-  }
-};
 /**
  * Styles for the root slot
  */
@@ -50,10 +38,6 @@ const useSplitNaveItemStyles = /*#__PURE__*/__styles({
     Bkqvd7p: "f1e9ux7i",
     Bmy1vo4: "f1xfaukr",
     Jwef8y: "f11oyicx",
-    xwko9w: "f8z0t4e",
-    mcc9px: "f9ueil3",
-    B02v5zz: "f1g2hb8n",
-    i4x37a: "fpq6je",
     ecr2s2: "f9fof1w"
   },
   baseNavItem: {
@@ -77,20 +61,6 @@ const useSplitNaveItemStyles = /*#__PURE__*/__styles({
   },
   baseMedium: {
     rjzwhg: "fjtod8q"
-  },
-  baseLarge: {
-    rjzwhg: "f16gijt3"
-  },
-  hoverAction: {
-    abs64n: "fk73vx1",
-    Bkecrkj: "f1aehjj5",
-    Bn62ygk: 0,
-    Cwk7ip: 0,
-    B3o57yi: 0,
-    Bmy1vo4: 0,
-    Bkqvd7p: 0,
-    Bi2q7bf: ["fr12795", "fcl876f"],
-    Es3by: "f1gqqdtu"
   }
 }, {
   d: [".f22iagw{display:flex;}", [".fx80lhs{gap:unset;}", {
@@ -99,13 +69,8 @@ const useSplitNaveItemStyles = /*#__PURE__*/__styles({
     p: -1
   }], ".fgusgyc{text-align:unset;}", ".f1ctqxl6{background-color:var(--colorNeutralBackground4);}", ".fnsygzv{transition-duration:var(--durationFaster);}", ".f1e9ux7i{transition-timing-function:var(--curveLinear);}", ".f1xfaukr{transition-property:background;}", ".f1cxpek8{text-transform:none;}", ".f1ub7u0d{align-self:stretch;}", ".f1o700av{text-align:left;}", ".fes3tcz{text-align:right;}", ".f10pi13n{position:relative;}", ".f1s9ku6b{justify-content:start;}", [".f1u2hskj{gap:var(--spacingVerticalL);}", {
     p: -1
-  }], ".f3rmtva{background-color:transparent;}", ".f107v6xj{min-width:28px;}", ".f1y335lp{-webkit-padding-end:12px;padding-inline-end:12px;}", ".f12pses1{-webkit-padding-start:5px;padding-inline-start:5px;}", ".fibmr9j{padding-block-start:5px;}", ".f1s2louj{align-items:start;}", ".fjtod8q{padding-block-start:9px;}", ".f16gijt3{padding-block-start:12px;}", ".fk73vx1{opacity:0;}", ".f1aehjj5{pointer-events:none;}", [".fr12795{transition:opacity 150ms cubic-bezier(0.33,0,0.67,1);}", {
-    p: -1
-  }], [".fcl876f{transition:opacity 150ms cubic-bezier(0.33, 0, 0.67, 1);}", {
-    p: -1
-  }], ".f1gqqdtu{will-change:opacity;}"],
-  h: [".f11oyicx:hover{background-color:var(--colorNeutralBackground4Hover);}", ".f8z0t4e:hover .fui-SplitNavItem__actionButton,.f8z0t4e:hover .fui-SplitNavItem__toggleButton,.f8z0t4e:hover .fui-SplitNavItem__menuButton{opacity:1;}", ".f9ueil3:hover .fui-SplitNavItem__actionButton,.f9ueil3:hover .fui-SplitNavItem__toggleButton,.f9ueil3:hover .fui-SplitNavItem__menuButton{pointer-events:auto;}"],
-  w: [".f1g2hb8n:focus-within .fui-SplitNavItem__actionButton,.f1g2hb8n:focus-within .fui-SplitNavItem__toggleButton,.f1g2hb8n:focus-within .fui-SplitNavItem__menuButton{opacity:1;}", ".fpq6je:focus-within .fui-SplitNavItem__actionButton,.fpq6je:focus-within .fui-SplitNavItem__toggleButton,.fpq6je:focus-within .fui-SplitNavItem__menuButton{pointer-events:auto;}"],
+  }], ".f3rmtva{background-color:transparent;}", ".f107v6xj{min-width:28px;}", ".f1y335lp{-webkit-padding-end:12px;padding-inline-end:12px;}", ".f12pses1{-webkit-padding-start:5px;padding-inline-start:5px;}", ".fibmr9j{padding-block-start:5px;}", ".f1s2louj{align-items:start;}", ".fjtod8q{padding-block-start:9px;}"],
+  h: [".f11oyicx:hover{background-color:var(--colorNeutralBackground4Hover);}"],
   a: [".f9fof1w:active{background-color:var(--colorNeutralBackground4Pressed);}"]
 });
 /**
@@ -121,13 +86,13 @@ export const useSplitNavItemStyles_unstable = state => {
     state.navItem.className = mergeClasses(splitNavItemClassNames.navItem, splitNavItemStyles.baseNavItem, state.navItem.className);
   }
   if (state.actionButton) {
-    state.actionButton.className = mergeClasses(splitNavItemClassNames.actionButton, splitNavItemStyles.baseSecondary, splitNavItemStyles.hoverAction, state.density === 'medium' && splitNavItemStyles.baseMedium, state.actionButton.className);
+    state.actionButton.className = mergeClasses(splitNavItemClassNames.actionButton, splitNavItemStyles.baseSecondary, state.density === 'medium' && splitNavItemStyles.baseMedium, state.actionButton.className);
   }
   if (state.toggleButton) {
-    state.toggleButton.className = mergeClasses(splitNavItemClassNames.toggleButton, splitNavItemStyles.baseSecondary, splitNavItemStyles.hoverAction, state.density === 'medium' && splitNavItemStyles.baseMedium, state.toggleButton.className);
+    state.toggleButton.className = mergeClasses(splitNavItemClassNames.toggleButton, splitNavItemStyles.baseSecondary, state.density === 'medium' && splitNavItemStyles.baseMedium, state.toggleButton.className);
   }
   if (state.menuButton) {
-    state.menuButton.className = mergeClasses(splitNavItemClassNames.menuButton, splitNavItemStyles.baseSecondary, splitNavItemStyles.hoverAction, state.density === 'medium' && splitNavItemStyles.baseMedium, state.menuButton.className);
+    state.menuButton.className = mergeClasses(splitNavItemClassNames.menuButton, splitNavItemStyles.baseSecondary, state.density === 'medium' && splitNavItemStyles.baseMedium, state.menuButton.className);
   }
   return state;
 };

package/lib/components/SplitNavItem/useSplitNavItemStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","tokens","motionTokens","navItemTokens","useRootDefaultClassName","splitNavItemClassNames","root","navItem","actionButton","toggleButton","menuButton","actionButtonTooltip","toggleButtonTooltip","menuButtonTooltip","buttonHoverStyles","opacity","pointerEvents","useSplitNaveItemStyles","baseRoot","mc9l5x","i8kkvl","Belr9w4","rmohyg","Bt984gj","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","fsow6f","De3pzq","B3o57yi","Bkqvd7p","Bmy1vo4","Jwef8y","xwko9w","mcc9px","B02v5zz","i4x37a","ecr2s2","baseNavItem","B9bfxx9","qb2dma","qhf8xq","Brf1p80","baseSecondary","Bf4jedk","Bnt446c","B1hrpyx","rjzwhg","baseMedium","baseLarge","hoverAction","abs64n","Bkecrkj","Bn62ygk","Cwk7ip","Bi2q7bf","Es3by","d","p","h","w","a","useSplitNavItemStyles_unstable","state","splitNavItemStyles","sharedRootClassNames","className","density"],"sources":["useSplitNavItemStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { motionTokens } from '@fluentui/react-motion';\nimport { navItemTokens, useRootDefaultClassName } from '../sharedNavStyles.styles';\nexport const splitNavItemClassNames = {\n    root: 'fui-SplitNavItem',\n    navItem: 'fui-SplitNavItem__navItem',\n    actionButton: 'fui-SplitNavItem__actionButton',\n    toggleButton: 'fui-SplitNavItem__toggleButton',\n    menuButton: 'fui-SplitNavItem__menuButton',\n    /**\n   * Tooltips don't have a class name prop, so this is just to satisfy the linter.\n   */ actionButtonTooltip: 'fui-SplitNavItem__actionButtonTooltip',\n    toggleButtonTooltip: 'fui-SplitNavItem__toggleButtonTooltip',\n    menuButtonTooltip: 'fui-SplitNavItem__menuButtonTooltip'\n};\n// Don't use makeResetStyles here because the sub components call it once and\n// This links says that makeResetStyles should only be called once per element\n// https://griffel.js.org/react/api/make-reset-styles/#limitations\nconst { actionButton, toggleButton, menuButton } = splitNavItemClassNames;\nconst buttonHoverStyles = {\n    [`& .${actionButton}, & .${toggleButton}, & .${menuButton}`]: {\n        opacity: 1,\n        pointerEvents: 'auto'\n    }\n};\n/**\n * Styles for the root slot\n */ const useSplitNaveItemStyles = makeStyles({\n    baseRoot: {\n        display: 'flex',\n        gap: 'unset',\n        alignItems: 'stretch',\n        padding: 'unset',\n        textAlign: 'unset',\n        backgroundColor: navItemTokens.backgroundColor,\n        ...navItemTokens.transitionTokens,\n        ':hover': {\n            backgroundColor: navItemTokens.backgroundColorHover,\n            ...buttonHoverStyles\n        },\n        ':focus-within': buttonHoverStyles,\n        ':active': {\n            backgroundColor: navItemTokens.backgroundColorPressed\n        }\n    },\n    baseNavItem: {\n        // styles that we want to disagree with the default on\n        display: 'flex',\n        textTransform: 'none',\n        alignSelf: 'stretch',\n        textAlign: 'left',\n        position: 'relative',\n        justifyContent: 'start',\n        gap: tokens.spacingVerticalL,\n        backgroundColor: 'transparent'\n    },\n    baseSecondary: {\n        minWidth: '28px',\n        paddingInlineEnd: '12px',\n        paddingInlineStart: '5px',\n        paddingBlockStart: '5px',\n        alignItems: 'start'\n    },\n    baseMedium: {\n        paddingBlockStart: '9px'\n    },\n    baseLarge: {\n        paddingBlockStart: '12px'\n    },\n    hoverAction: {\n        opacity: 0,\n        pointerEvents: 'none',\n        transition: `opacity ${motionTokens.durationFast}ms ${motionTokens.curveEasyEase}`,\n        willChange: 'opacity'\n    }\n});\n/**\n * Apply styling to the SplitNavItem slots based on the state\n */ export const useSplitNavItemStyles_unstable = (state)=>{\n    'use no memo';\n    const splitNavItemStyles = useSplitNaveItemStyles();\n    const sharedRootClassNames = useRootDefaultClassName();\n    state.root.className = mergeClasses(splitNavItemClassNames.root, sharedRootClassNames, splitNavItemStyles.baseRoot, state.root.className);\n    if (state.navItem) {\n        state.navItem.className = mergeClasses(splitNavItemClassNames.navItem, splitNavItemStyles.baseNavItem, state.navItem.className);\n    }\n    if (state.actionButton) {\n        state.actionButton.className = mergeClasses(splitNavItemClassNames.actionButton, splitNavItemStyles.baseSecondary, splitNavItemStyles.hoverAction, state.density === 'medium' && splitNavItemStyles.baseMedium, state.actionButton.className);\n    }\n    if (state.toggleButton) {\n        state.toggleButton.className = mergeClasses(splitNavItemClassNames.toggleButton, splitNavItemStyles.baseSecondary, splitNavItemStyles.hoverAction, state.density === 'medium' && splitNavItemStyles.baseMedium, state.toggleButton.className);\n    }\n    if (state.menuButton) {\n        state.menuButton.className = mergeClasses(splitNavItemClassNames.menuButton, splitNavItemStyles.baseSecondary, splitNavItemStyles.hoverAction, state.density === 'medium' && splitNavItemStyles.baseMedium, state.menuButton.className);\n    }\n    return state;\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__styles","mergeClasses","navItemTokens","useRootDefaultClassName","tokens","splitNavItemClassNames","root","navItem","actionButton","toggleButton","menuButton","actionButtonTooltip","toggleButtonTooltip","menuButtonTooltip","useSplitNaveItemStyles","baseRoot","mc9l5x","i8kkvl","Belr9w4","rmohyg","Bt984gj","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","fsow6f","De3pzq","B3o57yi","Bkqvd7p","Bmy1vo4","Jwef8y","ecr2s2","baseNavItem","B9bfxx9","qb2dma","qhf8xq","Brf1p80","baseSecondary","Bf4jedk","Bnt446c","B1hrpyx","rjzwhg","baseMedium","d","p","h","a","useSplitNavItemStyles_unstable","state","splitNavItemStyles","sharedRootClassNames","className","density"],"sources":["useSplitNavItemStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { navItemTokens, useRootDefaultClassName } from '../sharedNavStyles.styles';\nimport { tokens } from '@fluentui/react-theme';\nexport const splitNavItemClassNames = {\n    root: 'fui-SplitNavItem',\n    navItem: 'fui-SplitNavItem__navItem',\n    actionButton: 'fui-SplitNavItem__actionButton',\n    toggleButton: 'fui-SplitNavItem__toggleButton',\n    menuButton: 'fui-SplitNavItem__menuButton',\n    /**\n   * Tooltips don't have a class name prop, so this is just to satisfy the linter.\n   */ actionButtonTooltip: 'fui-SplitNavItem__actionButtonTooltip',\n    toggleButtonTooltip: 'fui-SplitNavItem__toggleButtonTooltip',\n    menuButtonTooltip: 'fui-SplitNavItem__menuButtonTooltip'\n};\n// Don't use makeResetStyles here because the sub components call it once and\n// This links says that makeResetStyles should only be called once per element\n// https://griffel.js.org/react/api/make-reset-styles/#limitations\n/**\n * Styles for the root slot\n */ const useSplitNaveItemStyles = makeStyles({\n    baseRoot: {\n        display: 'flex',\n        gap: 'unset',\n        alignItems: 'stretch',\n        padding: 'unset',\n        textAlign: 'unset',\n        backgroundColor: navItemTokens.backgroundColor,\n        ...navItemTokens.transitionTokens,\n        ':hover': {\n            backgroundColor: navItemTokens.backgroundColorHover\n        },\n        ':active': {\n            backgroundColor: navItemTokens.backgroundColorPressed\n        }\n    },\n    baseNavItem: {\n        // styles that we want to disagree with the default on\n        display: 'flex',\n        textTransform: 'none',\n        alignSelf: 'stretch',\n        textAlign: 'left',\n        position: 'relative',\n        justifyContent: 'start',\n        gap: tokens.spacingVerticalL,\n        backgroundColor: 'transparent'\n    },\n    baseSecondary: {\n        minWidth: '28px',\n        paddingInlineEnd: '12px',\n        paddingInlineStart: '5px',\n        paddingBlockStart: '5px',\n        alignItems: 'start'\n    },\n    baseMedium: {\n        paddingBlockStart: '9px'\n    }\n});\n/**\n * Apply styling to the SplitNavItem slots based on the state\n */ export const useSplitNavItemStyles_unstable = (state)=>{\n    'use no memo';\n    const splitNavItemStyles = useSplitNaveItemStyles();\n    const sharedRootClassNames = useRootDefaultClassName();\n    state.root.className = mergeClasses(splitNavItemClassNames.root, sharedRootClassNames, splitNavItemStyles.baseRoot, state.root.className);\n    if (state.navItem) {\n        state.navItem.className = mergeClasses(splitNavItemClassNames.navItem, splitNavItemStyles.baseNavItem, state.navItem.className);\n    }\n    if (state.actionButton) {\n        state.actionButton.className = mergeClasses(splitNavItemClassNames.actionButton, splitNavItemStyles.baseSecondary, state.density === 'medium' && splitNavItemStyles.baseMedium, state.actionButton.className);\n    }\n    if (state.toggleButton) {\n        state.toggleButton.className = mergeClasses(splitNavItemClassNames.toggleButton, splitNavItemStyles.baseSecondary, state.density === 'medium' && splitNavItemStyles.baseMedium, state.toggleButton.className);\n    }\n    if (state.menuButton) {\n        state.menuButton.className = mergeClasses(splitNavItemClassNames.menuButton, splitNavItemStyles.baseSecondary, state.density === 'medium' && splitNavItemStyles.baseMedium, state.menuButton.className);\n    }\n    return state;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/components/useNavContextValues.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 export function useNavContextValues_unstable(state) {
-    const { selectedValue, selectedCategoryValue, onRegister, onUnregister, onSelect, getRegisteredNavItems, onRequestNavCategoryItemToggle, openCategories, multiple, density, onNavItemSelect } = state;
+    const { selectedValue, selectedCategoryValue, onRegister, onUnregister, onSelect, getRegisteredNavItems, onRequestNavCategoryItemToggle, openCategories, multiple, density } = state;
     const navContext = React.useMemo(()=>({
             selectedValue,
             selectedCategoryValue,
@@ -11,8 +11,7 @@ export function useNavContextValues_unstable(state) {
             onRequestNavCategoryItemToggle,
             openCategories,
             multiple,
-            density,
-            onNavItemSelect
+            density
         }), [
         selectedValue,
         selectedCategoryValue,
@@ -23,8 +22,7 @@ export function useNavContextValues_unstable(state) {
         onRequestNavCategoryItemToggle,
         openCategories,
         multiple,
-        density,
-        onNavItemSelect
+        density
     ]);
     return {
         nav: navContext

package/lib/components/useNavContextValues.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/useNavContextValues.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavContextValue, NavContextValues, NavState } from '../Nav';\n\nexport function useNavContextValues_unstable(state: NavState): NavContextValues {\n  const {\n    selectedValue,\n    selectedCategoryValue,\n    onRegister,\n    onUnregister,\n    onSelect,\n    getRegisteredNavItems,\n    onRequestNavCategoryItemToggle,\n    openCategories,\n    multiple,\n    density,\n    onNavItemSelect,\n  } = state;\n\n  const navContext = React.useMemo<NavContextValue>(\n    () => ({\n      selectedValue,\n      selectedCategoryValue,\n      onSelect,\n      onRegister,\n      onUnregister,\n      getRegisteredNavItems,\n      onRequestNavCategoryItemToggle,\n      openCategories,\n      multiple,\n      density,\n      onNavItemSelect,\n    }),\n    [\n      selectedValue,\n      selectedCategoryValue,\n      onSelect,\n      onRegister,\n      onUnregister,\n      getRegisteredNavItems,\n      onRequestNavCategoryItemToggle,\n      openCategories,\n      multiple,\n      density,\n      onNavItemSelect,\n    ],\n  );\n\n  return { nav: navContext };\n}\n"],"names":["React","useNavContextValues_unstable","state","selectedValue","selectedCategoryValue","onRegister","onUnregister","onSelect","getRegisteredNavItems","onRequestNavCategoryItemToggle","openCategories","multiple","density","onNavItemSelect","navContext","useMemo","nav"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,6BAA6BC,KAAe;IAC1D,MAAM,EACJC,aAAa,EACbC,qBAAqB,EACrBC,UAAU,EACVC,YAAY,EACZC,QAAQ,EACRC,qBAAqB,EACrBC,8BAA8B,EAC9BC,cAAc,EACdC,QAAQ,EACRC,OAAO,EACPC,eAAe,EAChB,GAAGX;IAEJ,MAAMY,aAAad,MAAMe,OAAO,CAC9B,IAAO,CAAA;YACLZ;YACAC;YACAG;YACAF;YACAC;YACAE;YACAC;YACAC;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QACEV;QACAC;QACAG;QACAF;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;KACD;IAGH,OAAO;QAAEG,KAAKF;IAAW;AAC3B"}
+{"version":3,"sources":["../src/components/useNavContextValues.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavContextValue, NavContextValues, NavState } from '../Nav';\n\nexport function useNavContextValues_unstable(state: NavState): NavContextValues {\n  const {\n    selectedValue,\n    selectedCategoryValue,\n    onRegister,\n    onUnregister,\n    onSelect,\n    getRegisteredNavItems,\n    onRequestNavCategoryItemToggle,\n    openCategories,\n    multiple,\n    density,\n  } = state;\n\n  const navContext = React.useMemo<NavContextValue>(\n    () => ({\n      selectedValue,\n      selectedCategoryValue,\n      onSelect,\n      onRegister,\n      onUnregister,\n      getRegisteredNavItems,\n      onRequestNavCategoryItemToggle,\n      openCategories,\n      multiple,\n      density,\n    }),\n    [\n      selectedValue,\n      selectedCategoryValue,\n      onSelect,\n      onRegister,\n      onUnregister,\n      getRegisteredNavItems,\n      onRequestNavCategoryItemToggle,\n      openCategories,\n      multiple,\n      density,\n    ],\n  );\n\n  return { nav: navContext };\n}\n"],"names":["React","useNavContextValues_unstable","state","selectedValue","selectedCategoryValue","onRegister","onUnregister","onSelect","getRegisteredNavItems","onRequestNavCategoryItemToggle","openCategories","multiple","density","navContext","useMemo","nav"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,6BAA6BC,KAAe;IAC1D,MAAM,EACJC,aAAa,EACbC,qBAAqB,EACrBC,UAAU,EACVC,YAAY,EACZC,QAAQ,EACRC,qBAAqB,EACrBC,8BAA8B,EAC9BC,cAAc,EACdC,QAAQ,EACRC,OAAO,EACR,GAAGV;IAEJ,MAAMW,aAAab,MAAMc,OAAO,CAC9B,IAAO,CAAA;YACLX;YACAC;YACAG;YACAF;YACAC;YACAE;YACAC;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QACET;QACAC;QACAG;QACAF;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;KACD;IAGH,OAAO;QAAEG,KAAKF;IAAW;AAC3B"}

package/lib-commonjs/components/AppItem/AppItem.js

@@ -10,14 +10,20 @@ Object.defineProperty(exports, "AppItem", {
 });
 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 _useAppItem = require("./useAppItem");
 const _renderAppItem = require("./renderAppItem");
 const _useAppItemStylesstyles = require("./useAppItemStyles.styles");
 const AppItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useAppItem.useAppItem_unstable)(props, ref);
     (0, _useAppItemStylesstyles.useAppItemStyles_unstable)(state);
-    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useAppItemStyles_unstable')(state);
+    /**
+   * @see https://github.com/microsoft/fluentui/blob/master/docs/react-v9/contributing/rfcs/react-components/convergence/custom-styling.md
+   *
+   * TODO: 💡 once package will become stable (PR which will be part of promoting PREVIEW package to STABLE),
+   *      - uncomment this line
+   *      - update types {@link file://./../../../../../../../packages/react-components/react-shared-contexts/library/src/CustomStyleHooksContext/CustomStyleHooksContext.ts#CustomStyleHooksContextValue}
+   *      - verify that custom global style override works for your component
+   */ // useCustomStyleHook_unstable('useAppItemStyles_unstable')(state);
     return (0, _renderAppItem.renderAppItem_unstable)(state);
 });
 AppItem.displayName = 'AppItem';

package/lib-commonjs/components/AppItem/AppItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/AppItem/AppItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useAppItem_unstable } from './useAppItem';\nimport { renderAppItem_unstable } from './renderAppItem';\nimport { useAppItemStyles_unstable } from './useAppItemStyles.styles';\nimport type { AppItemProps } from './AppItem.types';\n\n/**\n * AppItem component - Application item in the navigation menu.\n */\nexport const AppItem: ForwardRefComponent<AppItemProps> = React.forwardRef((props, ref) => {\n  const state = useAppItem_unstable(props, ref);\n\n  useAppItemStyles_unstable(state);\n  useCustomStyleHook_unstable('useAppItemStyles_unstable')(state);\n\n  return renderAppItem_unstable(state);\n});\n\nAppItem.displayName = 'AppItem';\n"],"names":["AppItem","React","forwardRef","props","ref","state","useAppItem_unstable","useAppItemStyles_unstable","useCustomStyleHook_unstable","renderAppItem_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;qCAEqB;4BAER;+BACG;wCACG;AAMnC,MAAMA,UAAAA,WAAAA,GAA6CC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACjF,MAAMC,QAAQC,IAAAA,+BAAAA,EAAoBH,OAAOC;IAEzCG,IAAAA,iDAAAA,EAA0BF;IAC1BG,IAAAA,gDAAAA,EAA4B,6BAA6BH;IAEzD,OAAOI,IAAAA,qCAAAA,EAAuBJ;AAChC;AAEAL,QAAQU,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/AppItem/AppItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useAppItem_unstable } from './useAppItem';\nimport { renderAppItem_unstable } from './renderAppItem';\nimport { useAppItemStyles_unstable } from './useAppItemStyles.styles';\nimport type { AppItemProps } from './AppItem.types';\n\n/**\n * AppItem component - TODO: add more docs\n */\nexport const AppItem: ForwardRefComponent<AppItemProps> = React.forwardRef((props, ref) => {\n  const state = useAppItem_unstable(props, ref);\n\n  useAppItemStyles_unstable(state);\n\n  /**\n   * @see https://github.com/microsoft/fluentui/blob/master/docs/react-v9/contributing/rfcs/react-components/convergence/custom-styling.md\n   *\n   * TODO: 💡 once package will become stable (PR which will be part of promoting PREVIEW package to STABLE),\n   *      - uncomment this line\n   *      - update types {@link file://./../../../../../../../packages/react-components/react-shared-contexts/library/src/CustomStyleHooksContext/CustomStyleHooksContext.ts#CustomStyleHooksContextValue}\n   *      - verify that custom global style override works for your component\n   */\n  // useCustomStyleHook_unstable('useAppItemStyles_unstable')(state);\n\n  return renderAppItem_unstable(state);\n});\n\nAppItem.displayName = 'AppItem';\n"],"names":["AppItem","React","forwardRef","props","ref","state","useAppItem_unstable","useAppItemStyles_unstable","renderAppItem_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUaA;;;eAAAA;;;;iEAVU;4BAEa;+BACG;wCACG;AAMnC,MAAMA,UAAAA,WAAAA,GAA6CC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACjF,MAAMC,QAAQC,IAAAA,+BAAAA,EAAoBH,OAAOC;IAEzCG,IAAAA,iDAAAA,EAA0BF;IAE1B;;;;;;;GAOC,GACD,mEAAmE;IAEnE,OAAOG,IAAAA,qCAAAA,EAAuBH;AAChC;AAEAL,QAAQS,WAAW,GAAG"}

package/lib-commonjs/components/AppItemStatic/AppItemStatic.js

@@ -10,14 +10,20 @@ Object.defineProperty(exports, "AppItemStatic", {
 });
 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 _useAppItemStatic = require("./useAppItemStatic");
 const _renderAppItemStatic = require("./renderAppItemStatic");
 const _useAppItemStaticStylesstyles = require("./useAppItemStaticStyles.styles");
 const AppItemStatic = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useAppItemStatic.useAppItemStatic_unstable)(props, ref);
     (0, _useAppItemStaticStylesstyles.useAppItemStaticStyles_unstable)(state);
-    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useAppItemStaticStyles_unstable')(state);
+    /**
+   * @see https://github.com/microsoft/fluentui/blob/master/docs/react-v9/contributing/rfcs/react-components/convergence/custom-styling.md
+   *
+   * TODO: 💡 once package will become stable (PR which will be part of promoting PREVIEW package to STABLE),
+   *      - uncomment this line
+   *      - update types {@link file://./../../../../../../../packages/react-components/react-shared-contexts/library/src/CustomStyleHooksContext/CustomStyleHooksContext.ts#CustomStyleHooksContextValue}
+   *      - verify that custom global style override works for your component
+   */ // useCustomStyleHook_unstable('useAppItemStaticStyles_unstable')(state);
     return (0, _renderAppItemStatic.renderAppItemStatic_unstable)(state);
 });
 AppItemStatic.displayName = 'AppItemStatic';

package/lib-commonjs/components/AppItemStatic/AppItemStatic.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/AppItemStatic/AppItemStatic.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useAppItemStatic_unstable } from './useAppItemStatic';\nimport { renderAppItemStatic_unstable } from './renderAppItemStatic';\nimport { useAppItemStaticStyles_unstable } from './useAppItemStaticStyles.styles';\nimport type { AppItemStaticProps } from './AppItemStatic.types';\n\n/**\n * AppItemStatic component - Static application item in the navigation menu.\n */\nexport const AppItemStatic: ForwardRefComponent<AppItemStaticProps> = React.forwardRef((props, ref) => {\n  const state = useAppItemStatic_unstable(props, ref);\n\n  useAppItemStaticStyles_unstable(state);\n  useCustomStyleHook_unstable('useAppItemStaticStyles_unstable')(state);\n\n  return renderAppItemStatic_unstable(state);\n});\n\nAppItemStatic.displayName = 'AppItemStatic';\n"],"names":["AppItemStatic","React","forwardRef","props","ref","state","useAppItemStatic_unstable","useAppItemStaticStyles_unstable","useCustomStyleHook_unstable","renderAppItemStatic_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;qCAEqB;kCAEF;qCACG;8CACG;AAMzC,MAAMA,gBAAAA,WAAAA,GAAyDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQC,IAAAA,2CAAAA,EAA0BH,OAAOC;IAE/CG,IAAAA,6DAAAA,EAAgCF;IAChCG,IAAAA,gDAAAA,EAA4B,mCAAmCH;IAE/D,OAAOI,IAAAA,iDAAAA,EAA6BJ;AACtC;AAEAL,cAAcU,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/AppItemStatic/AppItemStatic.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useAppItemStatic_unstable } from './useAppItemStatic';\nimport { renderAppItemStatic_unstable } from './renderAppItemStatic';\nimport { useAppItemStaticStyles_unstable } from './useAppItemStaticStyles.styles';\nimport type { AppItemStaticProps } from './AppItemStatic.types';\n\n/**\n * AppItemStatic component - TODO: add more docs\n */\nexport const AppItemStatic: ForwardRefComponent<AppItemStaticProps> = React.forwardRef((props, ref) => {\n  const state = useAppItemStatic_unstable(props, ref);\n\n  useAppItemStaticStyles_unstable(state);\n\n  /**\n   * @see https://github.com/microsoft/fluentui/blob/master/docs/react-v9/contributing/rfcs/react-components/convergence/custom-styling.md\n   *\n   * TODO: 💡 once package will become stable (PR which will be part of promoting PREVIEW package to STABLE),\n   *      - uncomment this line\n   *      - update types {@link file://./../../../../../../../packages/react-components/react-shared-contexts/library/src/CustomStyleHooksContext/CustomStyleHooksContext.ts#CustomStyleHooksContextValue}\n   *      - verify that custom global style override works for your component\n   */\n  // useCustomStyleHook_unstable('useAppItemStaticStyles_unstable')(state);\n\n  return renderAppItemStatic_unstable(state);\n});\n\nAppItemStatic.displayName = 'AppItemStatic';\n"],"names":["AppItemStatic","React","forwardRef","props","ref","state","useAppItemStatic_unstable","useAppItemStaticStyles_unstable","renderAppItemStatic_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUaA;;;eAAAA;;;;iEAVU;kCAEmB;qCACG;8CACG;AAMzC,MAAMA,gBAAAA,WAAAA,GAAyDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQC,IAAAA,2CAAAA,EAA0BH,OAAOC;IAE/CG,IAAAA,6DAAAA,EAAgCF;IAEhC;;;;;;;GAOC,GACD,yEAAyE;IAEzE,OAAOG,IAAAA,iDAAAA,EAA6BH;AACtC;AAEAL,cAAcS,WAAW,GAAG"}

package/lib-commonjs/components/Hamburger/Hamburger.js

@@ -10,14 +10,15 @@ Object.defineProperty(exports, "Hamburger", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-const _reactbutton = require("@fluentui/react-button");
-const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const _useHamburger = require("./useHamburger");
+const _reactbutton = require("@fluentui/react-button");
 const _useHamburgerStylesstyles = require("./useHamburgerStyles.styles");
 const Hamburger = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useHamburger.useHamburger_unstable)(props, ref);
     (0, _useHamburgerStylesstyles.useHamburgerStyles_unstable)(state);
-    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useHamburgerStyles_unstable')(state);
+    // TODO update types in packages/react-components/react-shared-contexts/src/CustomStyleHooksContext/CustomStyleHooksContext.ts
+    // https://github.com/microsoft/fluentui/blob/master/rfcs/react-components/convergence/custom-styling.md
+    // useCustomStyleHook_unstable('useHamburgerStyles_unstable')(state);
     return (0, _reactbutton.renderButton_unstable)(state);
 });
 Hamburger.displayName = 'Hamburger';

package/lib-commonjs/components/Hamburger/Hamburger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Hamburger/Hamburger.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderButton_unstable } from '@fluentui/react-button';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useHamburger_unstable } from './useHamburger';\nimport { useHamburgerStyles_unstable } from './useHamburgerStyles.styles';\nimport type { HamburgerProps } from './Hamburger.types';\n\n/**\n * Hamburger component - a button that toggles a menu or navigation drawer.\n */\nexport const Hamburger: ForwardRefComponent<HamburgerProps> = React.forwardRef((props, ref) => {\n  const state = useHamburger_unstable(props, ref);\n\n  useHamburgerStyles_unstable(state);\n  useCustomStyleHook_unstable('useHamburgerStyles_unstable')(state);\n\n  return renderButton_unstable(state);\n}) as ForwardRefComponent<HamburgerProps>;\n\nHamburger.displayName = 'Hamburger';\n"],"names":["Hamburger","React","forwardRef","props","ref","state","useHamburger_unstable","useHamburgerStyles_unstable","useCustomStyleHook_unstable","renderButton_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;6BAEe;qCACM;8BAEN;0CACM;AAMrC,MAAMA,YAAAA,WAAAA,GAAiDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACrF,MAAMC,QAAQC,IAAAA,mCAAAA,EAAsBH,OAAOC;IAE3CG,IAAAA,qDAAAA,EAA4BF;IAC5BG,IAAAA,gDAAAA,EAA4B,+BAA+BH;IAE3D,OAAOI,IAAAA,kCAAAA,EAAsBJ;AAC/B;AAEAL,UAAUU,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/Hamburger/Hamburger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useHamburger_unstable } from './useHamburger';\nimport { renderButton_unstable } from '@fluentui/react-button';\nimport { useHamburgerStyles_unstable } from './useHamburgerStyles.styles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { HamburgerProps } from './Hamburger.types';\n\n/**\n * Hamburger component - TODO: add more docs\n */\nexport const Hamburger: ForwardRefComponent<HamburgerProps> = React.forwardRef((props, ref) => {\n  const state = useHamburger_unstable(props, ref);\n\n  useHamburgerStyles_unstable(state);\n  // TODO update types in packages/react-components/react-shared-contexts/src/CustomStyleHooksContext/CustomStyleHooksContext.ts\n  // https://github.com/microsoft/fluentui/blob/master/rfcs/react-components/convergence/custom-styling.md\n  // useCustomStyleHook_unstable('useHamburgerStyles_unstable')(state);\n  return renderButton_unstable(state);\n}) as ForwardRefComponent<HamburgerProps>;\n\nHamburger.displayName = 'Hamburger';\n"],"names":["Hamburger","React","forwardRef","props","ref","state","useHamburger_unstable","useHamburgerStyles_unstable","renderButton_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUaA;;;eAAAA;;;;iEAVU;8BACe;6BACA;0CACM;AAOrC,MAAMA,YAAAA,WAAAA,GAAiDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACrF,MAAMC,QAAQC,IAAAA,mCAAAA,EAAsBH,OAAOC;IAE3CG,IAAAA,qDAAAA,EAA4BF;IAC5B,8HAA8H;IAC9H,wGAAwG;IACxG,qEAAqE;IACrE,OAAOG,IAAAA,kCAAAA,EAAsBH;AAC/B;AAEAL,UAAUS,WAAW,GAAG"}

package/lib-commonjs/components/Nav/Nav.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, "Nav", {
 });
 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 _useNav = require("./useNav");
 const _renderNav = require("./renderNav");
 const _useNavStylesstyles = require("./useNavStyles.styles");
@@ -19,7 +18,6 @@ const Nav = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useNav.useNav_unstable)(props, ref);
     const contextValues = (0, _useNavContextValues.useNavContextValues_unstable)(state);
     (0, _useNavStylesstyles.useNavStyles_unstable)(state);
-    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useHamburgerStyles_unstable')(state);
     return (0, _renderNav.renderNav_unstable)(state, contextValues);
 });
 Nav.displayName = 'Nav';

package/lib-commonjs/components/Nav/Nav.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Nav/Nav.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useNav_unstable } from './useNav';\nimport { renderNav_unstable } from './renderNav';\nimport { useNavStyles_unstable } from './useNavStyles.styles';\nimport { useNavContextValues_unstable } from '../useNavContextValues';\nimport type { NavProps } from './Nav.types';\n\n/**\n * Nav - A component that provides up to two levels of nesting for navigation.\n */\nexport const Nav: ForwardRefComponent<NavProps> = React.forwardRef((props, ref) => {\n  const state = useNav_unstable(props, ref);\n\n  const contextValues = useNavContextValues_unstable(state);\n\n  useNavStyles_unstable(state);\n  useCustomStyleHook_unstable('useHamburgerStyles_unstable')(state);\n\n  return renderNav_unstable(state, contextValues);\n});\n\nNav.displayName = 'Nav';\n"],"names":["Nav","React","forwardRef","props","ref","state","useNav_unstable","contextValues","useNavContextValues_unstable","useNavStyles_unstable","useCustomStyleHook_unstable","renderNav_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAaaA;;;eAAAA;;;;iEAbU;qCAEqB;wBAEZ;2BACG;oCACG;qCACO;AAMtC,MAAMA,MAAAA,WAAAA,GAAqCC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACzE,MAAMC,QAAQC,IAAAA,uBAAAA,EAAgBH,OAAOC;IAErC,MAAMG,gBAAgBC,IAAAA,iDAAAA,EAA6BH;IAEnDI,IAAAA,yCAAAA,EAAsBJ;IACtBK,IAAAA,gDAAAA,EAA4B,+BAA+BL;IAE3D,OAAOM,IAAAA,6BAAAA,EAAmBN,OAAOE;AACnC;AAEAP,IAAIY,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/Nav/Nav.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useNav_unstable } from './useNav';\nimport { renderNav_unstable } from './renderNav';\nimport { useNavStyles_unstable } from './useNavStyles.styles';\nimport { useNavContextValues_unstable } from '../useNavContextValues';\nimport type { NavProps } from './Nav.types';\n\n/**\n * Nav - A component that provides up to two levels of nesting for navigation.\n */\nexport const Nav: ForwardRefComponent<NavProps> = React.forwardRef((props, ref) => {\n  const state = useNav_unstable(props, ref);\n\n  const contextValues = useNavContextValues_unstable(state);\n\n  useNavStyles_unstable(state);\n  return renderNav_unstable(state, contextValues);\n});\n\nNav.displayName = 'Nav';\n"],"names":["Nav","React","forwardRef","props","ref","state","useNav_unstable","contextValues","useNavContextValues_unstable","useNavStyles_unstable","renderNav_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;wBAES;2BACG;oCACG;qCACO;AAMtC,MAAMA,MAAAA,WAAAA,GAAqCC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACzE,MAAMC,QAAQC,IAAAA,uBAAAA,EAAgBH,OAAOC;IAErC,MAAMG,gBAAgBC,IAAAA,iDAAAA,EAA6BH;IAEnDI,IAAAA,yCAAAA,EAAsBJ;IACtB,OAAOK,IAAAA,6BAAAA,EAAmBL,OAAOE;AACnC;AAEAP,IAAIW,WAAW,GAAG"}

package/lib-commonjs/components/NavCategory/NavCategory.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/NavCategory/NavCategory.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { NavCategoryProps } from './NavCategory.types';\n\nimport { useNavCategory_unstable } from './useNavCategory';\nimport { renderNavCategory_unstable } from './renderNavCategory';\nimport { useNavCategoryContextValues_unstable } from '../useNavCategoryContextValues_unstable';\n\n/**\n * NavCategory component - a category in the navigation menu that can contain multiple items.\n */\nexport const NavCategory: ForwardRefComponent<NavCategoryProps> = React.forwardRef((props, ref) => {\n  const state = useNavCategory_unstable(props, ref);\n  const contextValues = useNavCategoryContextValues_unstable(state);\n\n  return renderNavCategory_unstable(state, contextValues);\n});\n\nNavCategory.displayName = 'NavCategory';\n"],"names":["NavCategory","React","forwardRef","props","ref","state","useNavCategory_unstable","contextValues","useNavCategoryContextValues_unstable","renderNavCategory_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;gCAKiB;mCACG;sDACU;AAK9C,MAAMA,cAAAA,WAAAA,GAAqDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQC,IAAAA,uCAAAA,EAAwBH,OAAOC;IAC7C,MAAMG,gBAAgBC,IAAAA,0EAAAA,EAAqCH;IAE3D,OAAOI,IAAAA,6CAAAA,EAA2BJ,OAAOE;AAC3C;AAEAP,YAAYU,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/NavCategory/NavCategory.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { NavCategoryProps } from './NavCategory.types';\n\nimport { useNavCategory_unstable } from './useNavCategory';\nimport { renderNavCategory_unstable } from './renderNavCategory';\nimport { useNavCategoryContextValues_unstable } from '../useNavCategoryContextValues_unstable';\n\n/**\n * NavCategory component - TODO: add more docs\n */\nexport const NavCategory: ForwardRefComponent<NavCategoryProps> = React.forwardRef((props, ref) => {\n  const state = useNavCategory_unstable(props, ref);\n  const contextValues = useNavCategoryContextValues_unstable(state);\n\n  return renderNavCategory_unstable(state, contextValues);\n});\n\nNavCategory.displayName = 'NavCategory';\n"],"names":["NavCategory","React","forwardRef","props","ref","state","useNavCategory_unstable","contextValues","useNavCategoryContextValues_unstable","renderNavCategory_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;gCAKiB;mCACG;sDACU;AAK9C,MAAMA,cAAAA,WAAAA,GAAqDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQC,IAAAA,uCAAAA,EAAwBH,OAAOC;IAC7C,MAAMG,gBAAgBC,IAAAA,0EAAAA,EAAqCH;IAE3D,OAAOI,IAAAA,6CAAAA,EAA2BJ,OAAOE;AAC3C;AAEAP,YAAYU,WAAW,GAAG"}

package/lib-commonjs/components/NavCategory/renderNavCategory.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/NavCategory/renderNavCategory.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavCategoryContextValues, NavCategoryProvider } from '../NavCategoryContext';\n\nimport type { NavCategoryState } from './NavCategory.types';\n\n/**\n * Render the final JSX of NavCategory\n */\nexport const renderNavCategory_unstable = (\n  state: NavCategoryState,\n  contextValues: NavCategoryContextValues,\n): // eslint-disable-next-line @typescript-eslint/no-deprecated\nJSX.Element => {\n  return <NavCategoryProvider value={contextValues.categoryValue}>{state.children}</NavCategoryProvider>;\n};\n"],"names":["renderNavCategory_unstable","state","contextValues","React","createElement","NavCategoryProvider","value","categoryValue","children"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;oCACuC;AAOvD,MAAMA,6BAA6B,CACxCC,OACAC;IAGA,OAAA,WAAA,GAAOC,OAAAC,aAAA,CAACC,uCAAAA,EAAAA;QAAoBC,OAAOJ,cAAcK,aAAa;OAAGN,MAAMO,QAAQ;AACjF"}
+{"version":3,"sources":["../src/components/NavCategory/renderNavCategory.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavCategoryContextValues, NavCategoryProvider } from '../NavCategoryContext';\n\nimport type { NavCategoryState } from './NavCategory.types';\n\n/**\n * Render the final JSX of NavCategory\n */\nexport const renderNavCategory_unstable = (state: NavCategoryState, contextValues: NavCategoryContextValues) => {\n  return <NavCategoryProvider value={contextValues.categoryValue}>{state.children}</NavCategoryProvider>;\n};\n"],"names":["renderNavCategory_unstable","state","contextValues","React","createElement","NavCategoryProvider","value","categoryValue","children"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;oCACuC;AAOvD,MAAMA,6BAA6B,CAACC,OAAyBC;IAClE,OAAA,WAAA,GAAOC,OAAAC,aAAA,CAACC,uCAAAA,EAAAA;QAAoBC,OAAOJ,cAAcK,aAAa;OAAGN,MAAMO,QAAQ;AACjF"}

package/lib-commonjs/components/NavCategoryItem/NavCategoryItem.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, "NavCategoryItem", {
 });
 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 _useNavCategoryItem = require("./useNavCategoryItem");
 const _renderNavCategoryItem = require("./renderNavCategoryItem");
 const _useNavCategoryItemstyles = require("./useNavCategoryItem.styles");
@@ -19,7 +18,8 @@ const NavCategoryItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useNavCategoryItem.useNavCategoryItem_unstable)(props, ref);
     const contextValues = (0, _useNavCategoryItemContextValues_unstable.useNavCategoryItemContextValues_unstable)(state);
     (0, _useNavCategoryItemstyles.useNavCategoryItemStyles_unstable)(state);
-    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useNavCategoryItemStyles')(state);
+    // todo: add custom style hook
+    // useCustomStyleHook_unstable('useNavCategoryItemStyles')(state);
     return (0, _renderNavCategoryItem.renderNavCategoryItem_unstable)(state, contextValues);
 });
 NavCategoryItem.displayName = 'NavCategoryItem';

package/lib-commonjs/components/NavCategoryItem/NavCategoryItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/NavCategoryItem/NavCategoryItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useNavCategoryItem_unstable } from './useNavCategoryItem';\nimport { renderNavCategoryItem_unstable } from './renderNavCategoryItem';\nimport type { NavCategoryItemProps } from './NavCategoryItem.types';\nimport { useNavCategoryItemStyles_unstable } from './useNavCategoryItem.styles';\nimport { useNavCategoryItemContextValues_unstable } from '../useNavCategoryItemContextValues_unstable';\n\n/**\n * A Nav Category Item provides provides a clickable accordion like header that exposes\n * a list of NavSubItems to take users to a new destination.\n */\nexport const NavCategoryItem: ForwardRefComponent<NavCategoryItemProps> = React.forwardRef((props, ref) => {\n  const state = useNavCategoryItem_unstable(props, ref);\n  const contextValues = useNavCategoryItemContextValues_unstable(state);\n\n  useNavCategoryItemStyles_unstable(state);\n  useCustomStyleHook_unstable('useNavCategoryItemStyles')(state);\n\n  return renderNavCategoryItem_unstable(state, contextValues);\n});\n\nNavCategoryItem.displayName = 'NavCategoryItem';\n"],"names":["NavCategoryItem","React","forwardRef","props","ref","state","useNavCategoryItem_unstable","contextValues","useNavCategoryItemContextValues_unstable","useNavCategoryItemStyles_unstable","useCustomStyleHook_unstable","renderNavCategoryItem_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAcaA;;;eAAAA;;;;iEAdU;qCAEqB;oCAEA;uCACG;0CAEG;0DACO;AAMlD,MAAMA,kBAAAA,WAAAA,GAA6DC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,QAAQC,IAAAA,+CAAAA,EAA4BH,OAAOC;IACjD,MAAMG,gBAAgBC,IAAAA,kFAAAA,EAAyCH;IAE/DI,IAAAA,2DAAAA,EAAkCJ;IAClCK,IAAAA,gDAAAA,EAA4B,4BAA4BL;IAExD,OAAOM,IAAAA,qDAAAA,EAA+BN,OAAOE;AAC/C;AAEAP,gBAAgBY,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/NavCategoryItem/NavCategoryItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useNavCategoryItem_unstable } from './useNavCategoryItem';\nimport { renderNavCategoryItem_unstable } from './renderNavCategoryItem';\nimport type { NavCategoryItemProps } from './NavCategoryItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useNavCategoryItemStyles_unstable } from './useNavCategoryItem.styles';\nimport { useNavCategoryItemContextValues_unstable } from '../useNavCategoryItemContextValues_unstable';\n// import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * A Nav Category Item provides provides a clickable accordion like header that exposes\n * a list of NavSubItems to take users to a new destination.\n */\nexport const NavCategoryItem: ForwardRefComponent<NavCategoryItemProps> = React.forwardRef((props, ref) => {\n  const state = useNavCategoryItem_unstable(props, ref);\n  const contextValues = useNavCategoryItemContextValues_unstable(state);\n\n  useNavCategoryItemStyles_unstable(state);\n\n  // todo: add custom style hook\n  // useCustomStyleHook_unstable('useNavCategoryItemStyles')(state);\n\n  return renderNavCategoryItem_unstable(state, contextValues);\n});\n\nNavCategoryItem.displayName = 'NavCategoryItem';\n"],"names":["NavCategoryItem","React","forwardRef","props","ref","state","useNavCategoryItem_unstable","contextValues","useNavCategoryItemContextValues_unstable","useNavCategoryItemStyles_unstable","renderNavCategoryItem_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAaaA;;;eAAAA;;;;iEAbU;oCACqB;uCACG;0CAGG;0DACO;AAOlD,MAAMA,kBAAAA,WAAAA,GAA6DC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,QAAQC,IAAAA,+CAAAA,EAA4BH,OAAOC;IACjD,MAAMG,gBAAgBC,IAAAA,kFAAAA,EAAyCH;IAE/DI,IAAAA,2DAAAA,EAAkCJ;IAElC,8BAA8B;IAC9B,kEAAkE;IAElE,OAAOK,IAAAA,qDAAAA,EAA+BL,OAAOE;AAC/C;AAEAP,gBAAgBW,WAAW,GAAG"}

package/lib-commonjs/components/NavCategoryItem/NavCategoryItem.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/NavCategoryItem/NavCategoryItem.types.ts"],"sourcesContent":["import type { PresenceMotionSlotProps } from '@fluentui/react-motion';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { NavDensity } from '../Nav/Nav.types';\nimport type { NavCategoryItemContextValue } from '../NavCategoryItemContext';\n\nexport type NavCategoryItemContextValues = {\n  navCategoryItem: NavCategoryItemContextValue;\n};\n\nexport type NavCategoryItemSlots = {\n  /**\n   * The root element\n   */\n  root: NonNullable<Slot<'button'>>;\n\n  /**\n   * Icon that renders before the content.\n   * Should be specific to each Category\n   */\n  icon?: Slot<'span'>;\n\n  /**\n   * Expand icon slot rendered after the content to indicate an open and closed state.\n   */\n  expandIcon: NonNullable<Slot<'span'>>;\n\n  /**\n   * Expand icon motion slot.\n   */\n  expandIconMotion?: Slot<PresenceMotionSlotProps>;\n};\n\n/**\n * navCategoryItem Props\n */\nexport type NavCategoryItemProps = ComponentProps<Partial<NavCategoryItemSlots>>;\n\n/**\n * State used in rendering NavCategoryItem\n */\nexport type NavCategoryItemState = ComponentState<NavCategoryItemSlots> &\n  NavCategoryItemContextValue & {\n    /**\n     * If this navCategoryItem is selected\n     */\n    selected: boolean;\n    /**\n     * The density of the NavItem\n     *\n     * @default 'medium'\n     */\n    density: NavDensity;\n  };\n"],"names":[],"rangeMappings":";;","mappings":"AAqCA;;CAEC"}
+{"version":3,"sources":["../src/components/NavCategoryItem/NavCategoryItem.types.ts"],"sourcesContent":["import { NavDensity } from '../Nav/Nav.types';\nimport { NavCategoryItemContextValue } from '../NavCategoryItemContext';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type NavCategoryItemContextValues = {\n  navCategoryItem: NavCategoryItemContextValue;\n};\n\nexport type NavCategoryItemSlots = {\n  /**\n   * The root element\n   */\n  root: NonNullable<Slot<'button'>>;\n\n  /**\n   * Icon that renders before the content.\n   * Should be specific to each Category\n   */\n  icon?: Slot<'span'>;\n\n  /**\n   * Expand icon slot rendered after the content to indicate an open and closed state.\n   */\n  expandIcon: NonNullable<Slot<'span'>>;\n};\n\n/**\n * navCategoryItem Props\n */\nexport type NavCategoryItemProps = ComponentProps<Partial<NavCategoryItemSlots>>;\n\n/**\n * State used in rendering NavCategoryItem\n */\nexport type NavCategoryItemState = ComponentState<NavCategoryItemSlots> &\n  NavCategoryItemContextValue & {\n    /**\n     * If this navCategoryItem is selected\n     */\n    selected: boolean;\n    /**\n     * The density of the NavItem\n     *\n     * @default 'medium'\n     */\n    density: NavDensity;\n  };\n"],"names":[],"rangeMappings":";;","mappings":"AA+BA;;CAEC"}

package/lib-commonjs/components/NavCategoryItem/renderNavCategoryItem.js

@@ -11,18 +11,6 @@ Object.defineProperty(exports, "renderNavCategoryItem_unstable", {
 const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
 const _reactutilities = require("@fluentui/react-utilities");
 const _NavCategoryItemContext = require("../NavCategoryItemContext");
-const getExpandIcon = (state)=>{
-    (0, _reactutilities.assertSlots)(state);
-    if (!state.expandIcon) {
-        return null;
-    }
-    if (!state.expandIconMotion) {
-        return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.expandIcon, {});
-    }
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.expandIconMotion, {
-        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.expandIcon, {})
-    });
-};
 const renderNavCategoryItem_unstable = (state, contextValues)=>{
     (0, _reactutilities.assertSlots)(state);
     return /*#__PURE__*/ (0, _jsxruntime.jsx)(_NavCategoryItemContext.NavCategoryItemProvider, {
@@ -31,7 +19,7 @@ const renderNavCategoryItem_unstable = (state, contextValues)=>{
             children: [
                 state.icon && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.icon, {}),
                 state.root.children,
-                getExpandIcon(state)
+                state.expandIcon && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.expandIcon, {})
             ]
         })
     });

package/lib-commonjs/components/NavCategoryItem/renderNavCategoryItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/NavCategoryItem/renderNavCategoryItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { NavCategoryItemState, NavCategoryItemSlots, NavCategoryItemContextValues } from './NavCategoryItem.types';\nimport { NavCategoryItemProvider } from '../NavCategoryItemContext';\n\nconst getExpandIcon = (state: NavCategoryItemState) => {\n  assertSlots<NavCategoryItemSlots>(state);\n\n  if (!state.expandIcon) {\n    return null;\n  }\n\n  if (!state.expandIconMotion) {\n    return <state.expandIcon />;\n  }\n\n  return (\n    <state.expandIconMotion>\n      <state.expandIcon />\n    </state.expandIconMotion>\n  );\n};\n\n/**\n * Render the final JSX of NavCategoryItem\n */\nexport const renderNavCategoryItem_unstable = (\n  state: NavCategoryItemState,\n  contextValues: NavCategoryItemContextValues,\n) => {\n  assertSlots<NavCategoryItemSlots>(state);\n\n  return (\n    <NavCategoryItemProvider value={contextValues.navCategoryItem}>\n      <state.root>\n        {state.icon && <state.icon />}\n        {state.root.children}\n        {getExpandIcon(state)}\n      </state.root>\n    </NavCategoryItemProvider>\n  );\n};\n"],"names":["renderNavCategoryItem_unstable","getExpandIcon","state","assertSlots","expandIcon","expandIconMotion","_jsx","contextValues","NavCategoryItemProvider","value","navCategoryItem","_jsxs","root","icon","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BA4BaA;;;eAAAA;;;4BA3Bb;gCAE4B;wCAEY;AAExC,MAAMC,gBAAgB,CAACC;IACrBC,IAAAA,2BAAAA,EAAkCD;IAElC,IAAI,CAACA,MAAME,UAAU,EAAE;QACrB,OAAO;IACT;IAEA,IAAI,CAACF,MAAMG,gBAAgB,EAAE;QAC3B,OAAA,WAAA,GAAOC,IAAAA,eAAA,EAACJ,MAAME,UAAU,EAAA,CAAA;IAC1B;IAEA,OAAA,WAAA,GACEE,IAAAA,eAAA,EAACJ,MAAMG,gBAAgB,EAAA;kBACrB,WAAA,GAAAC,IAAAA,eAAA,EAACJ,MAAME,UAAU,EAAA,CAAA;;AAGvB;AAKO,MAAMJ,iCAAiC,CAC5CE,OACAK;IAEAJ,IAAAA,2BAAAA,EAAkCD;IAElC,OAAA,WAAA,GACEI,IAAAA,eAAA,EAACE,+CAAAA,EAAAA;QAAwBC,OAAOF,cAAcG,eAAe;kBAC3D,WAAA,GAAAC,IAAAA,gBAAA,EAACT,MAAMU,IAAI,EAAA;;gBACRV,MAAMW,IAAI,IAAA,WAAA,GAAIP,IAAAA,eAAA,EAACJ,MAAMW,IAAI,EAAA,CAAA;gBACzBX,MAAMU,IAAI,CAACE,QAAQ;gBACnBb,cAAcC;;;;AAIvB"}
+{"version":3,"sources":["../src/components/NavCategoryItem/renderNavCategoryItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { NavCategoryItemState, NavCategoryItemSlots, NavCategoryItemContextValues } from './NavCategoryItem.types';\nimport { NavCategoryItemProvider } from '../NavCategoryItemContext';\n\n/**\n * Render the final JSX of NavCategoryItem\n */\nexport const renderNavCategoryItem_unstable = (\n  state: NavCategoryItemState,\n  contextValues: NavCategoryItemContextValues,\n) => {\n  assertSlots<NavCategoryItemSlots>(state);\n\n  return (\n    <NavCategoryItemProvider value={contextValues.navCategoryItem}>\n      <state.root>\n        {state.icon && <state.icon />}\n        {state.root.children}\n        {state.expandIcon && <state.expandIcon />}\n      </state.root>\n    </NavCategoryItemProvider>\n  );\n};\n"],"names":["renderNavCategoryItem_unstable","state","contextValues","assertSlots","_jsx","NavCategoryItemProvider","value","navCategoryItem","_jsxs","root","icon","children","expandIcon"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUaA;;;eAAAA;;;4BATb;gCAE4B;wCAEY;AAKjC,MAAMA,iCAAiC,CAC5CC,OACAC;IAEAC,IAAAA,2BAAAA,EAAkCF;IAElC,OAAA,WAAA,GACEG,IAAAA,eAAA,EAACC,+CAAAA,EAAAA;QAAwBC,OAAOJ,cAAcK,eAAe;kBAC3D,WAAA,GAAAC,IAAAA,gBAAA,EAACP,MAAMQ,IAAI,EAAA;;gBACRR,MAAMS,IAAI,IAAA,WAAA,GAAIN,IAAAA,eAAA,EAACH,MAAMS,IAAI,EAAA,CAAA;gBACzBT,MAAMQ,IAAI,CAACE,QAAQ;gBACnBV,MAAMW,UAAU,IAAA,WAAA,GAAIR,IAAAA,eAAA,EAACH,MAAMW,UAAU,EAAA,CAAA;;;;AAI9C"}

package/lib-commonjs/components/NavCategoryItem/useNavCategoryItem.js

@@ -12,35 +12,8 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _reactutilities = require("@fluentui/react-utilities");
 const _reacticons = require("@fluentui/react-icons");
-const _reactmotion = require("@fluentui/react-motion");
 const _NavCategoryContext = require("../NavCategoryContext");
 const _NavContext = require("../NavContext");
-const ExpandIconMotion = (0, _reactmotion.createPresenceComponent)(()=>{
-    const keyframes = [
-        {
-            transform: 'rotate(0deg) translate3D(0, 0, 0)'
-        },
-        {
-            transform: 'rotate(180deg) translate3D(0, 0, 0)'
-        }
-    ];
-    const duration = _reactmotion.motionTokens.durationFast;
-    const easing = _reactmotion.motionTokens.curveEasyEase;
-    return {
-        enter: {
-            keyframes,
-            duration,
-            easing
-        },
-        exit: {
-            keyframes: [
-                ...keyframes
-            ].reverse(),
-            duration,
-            easing
-        }
-    };
-});
 const useNavCategoryItem_unstable = (props, ref)=>{
     const { onClick, expandIcon, icon } = props;
     const { open, value } = (0, _NavCategoryContext.useNavCategoryContext_unstable)();
@@ -62,8 +35,7 @@ const useNavCategoryItem_unstable = (props, ref)=>{
         components: {
             root: 'button',
             icon: 'span',
-            expandIcon: 'span',
-            expandIconMotion: ExpandIconMotion
+            expandIcon: 'span'
         },
         root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('button', {
             ref,
@@ -76,17 +48,11 @@ const useNavCategoryItem_unstable = (props, ref)=>{
         }),
         expandIcon: _reactutilities.slot.always(expandIcon, {
             defaultProps: {
-                children: /*#__PURE__*/ _react.createElement(_reacticons.ChevronDown20Regular, null),
+                children: /*#__PURE__*/ _react.createElement(_reacticons.ChevronRight20Regular, null),
                 'aria-hidden': true
             },
             elementType: 'span'
         }),
-        expandIconMotion: (0, _reactmotion.presenceMotionSlot)(props.expandIconMotion, {
-            elementType: ExpandIconMotion,
-            defaultProps: {
-                visible: open
-            }
-        }),
         icon: _reactutilities.slot.optional(icon, {
             elementType: 'span'
         }),