@fluentui/react-nav 9.3.5 → 9.3.7

package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/NavSubItemGroup/useNavSubItemGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { createPresenceComponent, motionTokens, presenceMotionSlot } from '@fluentui/react-motion';\n\nimport type {\n  NavSubItemGroupCollapseMotionParams,\n  NavSubItemGroupProps,\n  NavSubItemGroupState,\n} from './NavSubItemGroup.types';\nimport { useNavCategoryContext_unstable } from '../NavCategoryContext';\nimport { useNavContext_unstable } from '../NavContext';\n\nconst smallSize = 28; // 28px for small density\nconst largeSize = 40; // 40px for large density\n\nconst NavGroupMotion = createPresenceComponent(({ items, density }: NavSubItemGroupCollapseMotionParams) => {\n  const isSmallDensity = density === 'small';\n  const height = items ? (isSmallDensity ? items * smallSize : items * largeSize) : 0;\n  const durationPerItem = isSmallDensity ? 15 : 25; // 15ms per item for small, 25ms for large\n  const keyframes: Keyframe[] = [\n    {\n      opacity: 0,\n      minHeight: 0,\n      height: 0,\n    },\n    {\n      opacity: 1,\n      minHeight: `${height}px`,\n      height: `${height}px`,\n    },\n  ];\n  const baseDuration = motionTokens.durationFast + (items || 0) * durationPerItem;\n  const maxDuration = motionTokens.durationUltraSlow;\n  const duration = baseDuration > maxDuration ? maxDuration : baseDuration;\n\n  return {\n    enter: {\n      keyframes,\n      duration,\n      easing: motionTokens.curveDecelerateMid,\n    },\n    exit: {\n      keyframes: [...keyframes].reverse(),\n      duration,\n      easing: motionTokens.curveAccelerateMin,\n    },\n  };\n});\n\n/**\n * Create the state required to render NavSubItemGroup.\n *\n * The returned state can be modified with hooks such as useNavSubItemGroupStyles_unstable,\n * before being passed to renderNavSubItemGroup_unstable.\n *\n * @param props - props from this instance of NavSubItemGroup\n * @param ref - reference to root HTMLDivElement of NavSubItemGroup\n */\nexport const useNavSubItemGroup_unstable = (\n  props: NavSubItemGroupProps,\n  ref: React.Ref<HTMLDivElement>,\n): NavSubItemGroupState => {\n  const { open } = useNavCategoryContext_unstable();\n  const { density } = useNavContext_unstable();\n\n  return {\n    open,\n    components: {\n      root: 'div',\n      collapseMotion: NavGroupMotion,\n    },\n\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ...props,\n        ref,\n      }),\n      { elementType: 'div' },\n    ),\n\n    collapseMotion: presenceMotionSlot(props.collapseMotion, {\n      elementType: NavGroupMotion,\n      defaultProps: {\n        visible: open,\n        unmountOnExit: true,\n        items: React.Children.count(props.children),\n        density,\n      },\n    }),\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","createPresenceComponent","motionTokens","presenceMotionSlot","useNavCategoryContext_unstable","useNavContext_unstable","smallSize","largeSize","NavGroupMotion","items","density","isSmallDensity","height","durationPerItem","keyframes","opacity","minHeight","baseDuration","durationFast","maxDuration","durationUltraSlow","duration","enter","easing","curveDecelerateMid","exit","reverse","curveAccelerateMin","useNavSubItemGroup_unstable","props","ref","open","components","root","collapseMotion","always","elementType","defaultProps","visible","unmountOnExit","Children","count","children"],"mappings":";;;;;;;eA0Da8B;;;;iEA1DU,QAAQ;gCACgB,4BAA4B;6BACD,yBAAyB;oCAOpD,wBAAwB;4BAChC,gBAAgB;AAEvD,MAAMtB,YAAY,IAAI,yBAAyB;AAC/C,MAAMC,YAAY,IAAI,yBAAyB;AAE/C,MAAMC,qBAAiBP,oCAAAA,EAAwB,CAAC,EAAEQ,KAAK,EAAEC,OAAO,EAAuC;IACrG,MAAMC,iBAAiBD,YAAY;IACnC,MAAME,SAASH,QAASE,iBAAiBF,QAAQH,YAAYG,QAAQF,YAAa;IAClF,MAAMM,kBAAkBF,iBAAiB,KAAK,IAAI,0CAA0C;IAC5F,MAAMG,YAAwB;QAC5B;YACEC,SAAS;YACTC,WAAW;YACXJ,QAAQ;QACV;QACA;YACEG,SAAS;YACTC,WAAW,GAAGJ,OAAO,EAAE,CAAC;YACxBA,QAAQ,GAAGA,OAAO,EAAE,CAAC;QACvB;KACD;IACD,MAAMK,eAAef,yBAAAA,CAAagB,YAAY,GAAIT,CAAAA,UAAS,CAAA,GAAKI;IAChE,MAAMM,cAAcjB,yBAAAA,CAAakB,iBAAiB;IAClD,MAAMC,WAAWJ,eAAeE,cAAcA,cAAcF;IAE5D,OAAO;QACLK,OAAO;YACLR;YACAO;YACAE,QAAQrB,yBAAAA,CAAasB,kBAAkB;QACzC;QACAC,MAAM;YACJX,WAAW;mBAAIA;aAAU,CAACY,OAAO;YACjCL;YACAE,QAAQrB,yBAAAA,CAAayB,kBAAkB;QACzC;IACF;AACF;AAWO,oCAAoC,CACzCE,OACAC;IAEA,MAAM,EAAEC,IAAI,EAAE,OAAG3B,kDAAAA;IACjB,MAAM,EAAEM,OAAO,EAAE,OAAGL,kCAAAA;IAEpB,OAAO;QACL0B;QACAC,YAAY;YACVC,MAAM;YACNC,gBAAgB1B;QAClB;QAEAyB,MAAMjC,oBAAAA,CAAKmC,MAAM,KACfpC,wCAAAA,EAAyB,OAAO;YAC9B,GAAG8B,KAAK;YACRC;QACF,IACA;YAAEM,aAAa;QAAM;QAGvBF,oBAAgB/B,+BAAAA,EAAmB0B,MAAMK,cAAc,EAAE;YACvDE,aAAa5B;YACb6B,cAAc;gBACZC,SAASP;gBACTQ,eAAe;gBACf9B,OAAOX,OAAM0C,QAAQ,CAACC,KAAK,CAACZ,MAAMa,QAAQ;gBAC1ChC;YACF;QACF;IACF;AACF,EAAE"}
+{"version":3,"sources":["../src/components/NavSubItemGroup/useNavSubItemGroup.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { createPresenceComponent, motionTokens, presenceMotionSlot } from '@fluentui/react-motion';\n\nimport type {\n  NavSubItemGroupCollapseMotionParams,\n  NavSubItemGroupProps,\n  NavSubItemGroupState,\n} from './NavSubItemGroup.types';\nimport { useNavCategoryContext_unstable } from '../NavCategoryContext';\nimport { useNavContext_unstable } from '../NavContext';\n\nconst smallSize = 28; // 28px for small density\nconst largeSize = 40; // 40px for large density\n\nconst NavGroupMotion = createPresenceComponent(({ items, density }: NavSubItemGroupCollapseMotionParams) => {\n  const isSmallDensity = density === 'small';\n  const height = items ? (isSmallDensity ? items * smallSize : items * largeSize) : 0;\n  const durationPerItem = isSmallDensity ? 15 : 25; // 15ms per item for small, 25ms for large\n  const keyframes: Keyframe[] = [\n    {\n      opacity: 0,\n      minHeight: 0,\n      height: 0,\n    },\n    {\n      opacity: 1,\n      minHeight: `${height}px`,\n      height: `${height}px`,\n    },\n  ];\n  const baseDuration = motionTokens.durationFast + (items || 0) * durationPerItem;\n  const maxDuration = motionTokens.durationUltraSlow;\n  const duration = baseDuration > maxDuration ? maxDuration : baseDuration;\n\n  return {\n    enter: {\n      keyframes,\n      duration,\n      easing: motionTokens.curveDecelerateMid,\n    },\n    exit: {\n      keyframes: [...keyframes].reverse(),\n      duration,\n      easing: motionTokens.curveAccelerateMin,\n    },\n  };\n});\n\n/**\n * Create the state required to render NavSubItemGroup.\n *\n * The returned state can be modified with hooks such as useNavSubItemGroupStyles_unstable,\n * before being passed to renderNavSubItemGroup_unstable.\n *\n * @param props - props from this instance of NavSubItemGroup\n * @param ref - reference to root HTMLDivElement of NavSubItemGroup\n */\nexport const useNavSubItemGroup_unstable = (\n  props: NavSubItemGroupProps,\n  ref: React.Ref<HTMLDivElement>,\n): NavSubItemGroupState => {\n  const { open } = useNavCategoryContext_unstable();\n  const { density } = useNavContext_unstable();\n\n  return {\n    open,\n    components: {\n      root: 'div',\n      collapseMotion: NavGroupMotion,\n    },\n\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ...props,\n        ref,\n      }),\n      { elementType: 'div' },\n    ),\n\n    collapseMotion: presenceMotionSlot(props.collapseMotion, {\n      elementType: NavGroupMotion,\n      defaultProps: {\n        visible: open,\n        unmountOnExit: true,\n        items: React.Children.count(props.children),\n        density,\n      },\n    }),\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","createPresenceComponent","motionTokens","presenceMotionSlot","useNavCategoryContext_unstable","useNavContext_unstable","smallSize","largeSize","NavGroupMotion","items","density","isSmallDensity","height","durationPerItem","keyframes","opacity","minHeight","baseDuration","durationFast","maxDuration","durationUltraSlow","duration","enter","easing","curveDecelerateMid","exit","reverse","curveAccelerateMin","useNavSubItemGroup_unstable","props","ref","open","components","root","collapseMotion","always","elementType","defaultProps","visible","unmountOnExit","Children","count","children"],"mappings":"AAAA;;;;;+BA4Da8B;;;;;;;iEA1DU,QAAQ;gCACgB,4BAA4B;6BACD,yBAAyB;oCAOpD,wBAAwB;4BAChC,gBAAgB;AAEvD,MAAMtB,YAAY,IAAI,yBAAyB;AAC/C,MAAMC,YAAY,IAAI,yBAAyB;AAE/C,MAAMC,qBAAiBP,oCAAAA,EAAwB,CAAC,EAAEQ,KAAK,EAAEC,OAAO,EAAuC;IACrG,MAAMC,iBAAiBD,YAAY;IACnC,MAAME,SAASH,QAASE,iBAAiBF,QAAQH,YAAYG,QAAQF,YAAa;IAClF,MAAMM,kBAAkBF,iBAAiB,KAAK,IAAI,0CAA0C;IAC5F,MAAMG,YAAwB;QAC5B;YACEC,SAAS;YACTC,WAAW;YACXJ,QAAQ;QACV;QACA;YACEG,SAAS;YACTC,WAAW,GAAGJ,OAAO,EAAE,CAAC;YACxBA,QAAQ,GAAGA,OAAO,EAAE,CAAC;QACvB;KACD;IACD,MAAMK,eAAef,yBAAAA,CAAagB,YAAY,GAAIT,CAAAA,UAAS,CAAA,GAAKI;IAChE,MAAMM,cAAcjB,yBAAAA,CAAakB,iBAAiB;IAClD,MAAMC,WAAWJ,eAAeE,cAAcA,cAAcF;IAE5D,OAAO;QACLK,OAAO;YACLR;YACAO;YACAE,QAAQrB,yBAAAA,CAAasB,kBAAkB;QACzC;QACAC,MAAM;YACJX,WAAW;mBAAIA;aAAU,CAACY,OAAO;YACjCL;YACAE,QAAQrB,yBAAAA,CAAayB,kBAAkB;QACzC;IACF;AACF;AAWO,oCAAoC,CACzCE,OACAC;IAEA,MAAM,EAAEC,IAAI,EAAE,GAAG3B,sDAAAA;IACjB,MAAM,EAAEM,OAAO,EAAE,OAAGL,kCAAAA;IAEpB,OAAO;QACL0B;QACAC,YAAY;YACVC,MAAM;YACNC,gBAAgB1B;QAClB;QAEAyB,MAAMjC,oBAAAA,CAAKmC,MAAM,KACfpC,wCAAAA,EAAyB,OAAO;YAC9B,GAAG8B,KAAK;YACRC;QACF,IACA;YAAEM,aAAa;QAAM;QAGvBF,oBAAgB/B,+BAAAA,EAAmB0B,MAAMK,cAAc,EAAE;YACvDE,aAAa5B;YACb6B,cAAc;gBACZC,SAASP;gBACTQ,eAAe;gBACf9B,OAAOX,OAAM0C,QAAQ,CAACC,KAAK,CAACZ,MAAMa,QAAQ;gBAC1ChC;YACF;QACF;IACF;AACF,EAAE"}

package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useNavSubItemGroupStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const navSubItemGroupClassNames = {\n    root: 'fui-NavSubItemGroup'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        transform: 'translateZ(0)',\n        overflow: 'hidden'\n    }\n});\n/**\n * Apply styling to the NavSubItemGroup slots based on the state\n */ export const useNavSubItemGroupStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(navSubItemGroupClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"names":["__styles","mergeClasses","navSubItemGroupClassNames","root","useStyles","Bz10aip","B68tc82","Bmxbyg5","Bpg54ce","d","p","useNavSubItemGroupStyles_unstable","state","styles","className"],"mappings":";;;;;;;;;;;IACaE,yBAAyB;;;qCAaY;eAAjCS;;;uBAdwB,gBAAgB;AAClD,kCAAkC;IACrCR,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,GAAGJ,mBAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAKrB,CAAC;AAGS,2CAA2CE,KAAK,IAAG;IAC1D,aAAa;IACb,MAAMC,MAAM,GAAGT,SAAS,CAAC,CAAC;IAC1BQ,KAAK,CAACT,IAAI,CAACW,SAAS,OAAGb,mBAAY,EAACC,yBAAyB,CAACC,IAAI,EAAEU,MAAM,CAACV,IAAI,EAAES,KAAK,CAACT,IAAI,CAACW,SAAS,CAAC;IACtG,OAAOF,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useNavSubItemGroupStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const navSubItemGroupClassNames = {\n    root: 'fui-NavSubItemGroup'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        transform: 'translateZ(0)',\n        overflow: 'hidden'\n    }\n});\n/**\n * Apply styling to the NavSubItemGroup slots based on the state\n */ export const useNavSubItemGroupStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(navSubItemGroupClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"names":["__styles","mergeClasses","navSubItemGroupClassNames","root","useStyles","Bz10aip","B68tc82","Bmxbyg5","Bpg54ce","d","p","useNavSubItemGroupStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,yBAAyB;;;qCAaY;eAAjCS;;;uBAdwB,gBAAgB;AAClD,kCAAkC;IACrCR,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAKrB,CAAC;AAGS,2CAA2CE,KAAK,IAAG;IAC1D,aAAa;IACb,MAAMC,MAAM,GAAGT,SAAS,CAAC,CAAC;IAC1BQ,KAAK,CAACT,IAAI,CAACW,SAAS,OAAGb,mBAAY,EAACC,yBAAyB,CAACC,IAAI,EAAEU,MAAM,CAACV,IAAI,EAAES,KAAK,CAACT,IAAI,CAACW,SAAS,CAAC;IACtG,OAAOF,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.raw.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavSubItemGroupSlots, NavSubItemGroupState } from './NavSubItemGroup.types';\n\nexport const navSubItemGroupClassNames: SlotClassNames<Omit<NavSubItemGroupSlots, 'collapseMotion'>> = {\n  root: 'fui-NavSubItemGroup',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    transform: 'translateZ(0)',\n    overflow: 'hidden',\n  },\n});\n\n/**\n * Apply styling to the NavSubItemGroup slots based on the state\n */\nexport const useNavSubItemGroupStyles_unstable = (state: NavSubItemGroupState): NavSubItemGroupState => {\n  'use no memo';\n\n  const styles = useStyles();\n\n  state.root.className = mergeClasses(navSubItemGroupClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","navSubItemGroupClassNames","root","useStyles","transform","overflow","useNavSubItemGroupStyles_unstable","state","styles","className"],"mappings":";;;;;;;;;;;IAIaE,yBAAAA;;;qCAiBAK;eAAAA;;;uBArB4B,iBAAiB;AAInD,kCAAgG;IACrGJ,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM;QACJE,WAAW;QACXC,UAAU;IACZ;AACF;AAKO,0CAA0C,CAACE;IAChD;IAEA,MAAMC,SAASL;IAEfI,MAAML,IAAI,CAACO,SAAS,OAAGT,mBAAAA,EAAaC,0BAA0BC,IAAI,EAAEM,OAAON,IAAI,EAAEK,MAAML,IAAI,CAACO,SAAS;IAErG,OAAOF;AACT,EAAE"}
+{"version":3,"sources":["../src/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavSubItemGroupSlots, NavSubItemGroupState } from './NavSubItemGroup.types';\n\nexport const navSubItemGroupClassNames: SlotClassNames<Omit<NavSubItemGroupSlots, 'collapseMotion'>> = {\n  root: 'fui-NavSubItemGroup',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    transform: 'translateZ(0)',\n    overflow: 'hidden',\n  },\n});\n\n/**\n * Apply styling to the NavSubItemGroup slots based on the state\n */\nexport const useNavSubItemGroupStyles_unstable = (state: NavSubItemGroupState): NavSubItemGroupState => {\n  'use no memo';\n\n  const styles = useStyles();\n\n  state.root.className = mergeClasses(navSubItemGroupClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","navSubItemGroupClassNames","root","useStyles","transform","overflow","useNavSubItemGroupStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;6BAMaE;;;qCAiBAK;;;;uBArB4B,iBAAiB;AAInD,MAAML,4BAA0F;IACrGC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM;QACJE,WAAW;QACXC,UAAU;IACZ;AACF;AAKO,MAAMC,oCAAoC,CAACC;IAChD;IAEA,MAAMC,SAASL;IAEfI,MAAML,IAAI,CAACO,SAAS,OAAGT,mBAAAA,EAAaC,0BAA0BC,IAAI,EAAEM,OAAON,IAAI,EAAEK,MAAML,IAAI,CAACO,SAAS;IAErG,OAAOF;AACT,EAAE"}

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

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/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"],"mappings":";;;;+BAYaK;;;;;;;iEAZU,QAAQ;qCAEa,kCAAkC;iCAErC,oBAAoB;oCACjB,uBAAuB;6CACpB,iCAAiC;AAMzE,qBAAMA,WAAAA,GAAuDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,6CAAAA,EAAyBK,OAAOC;QAE9CJ,2DAAAA,EAA+BK;QAC/BR,gDAAAA,EAA4B,kCAAkCQ;IAE9D,WAAON,+CAAAA,EAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/SplitNavItem/SplitNavItem.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 { 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"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;qCAEa,kCAAkC;iCAErC,oBAAoB;oCACjB,uBAAuB;6CACpB,iCAAiC;AAMzE,MAAMK,eAAAA,WAAAA,GAAuDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,YAAQP,yCAAAA,EAAyBK,OAAOC;QAE9CJ,2DAAAA,EAA+BK;QAC/BR,gDAAAA,EAA4B,kCAAkCQ;IAE9D,WAAON,+CAAAA,EAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

package/lib-commonjs/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"],"mappings":";;;;+BAgCaK;;;;;;;4BA/Bb,iCAAiD;iEAE1B,QAAQ;gCACH,4BAA4B;AAIxD;;;;CAIC,GACD,MAAMH,mBAAmB,CAACC,QAA4BC;IACpD,IAAI,CAACD,QAAQ;QACX,OAAO;IACT;IAEA,IAAIC,eAAe;QACjB,OAAA,WAAA,OACE,eAAA,EAACA,eAAAA;sBACC,WAAA,OAAA,eAAA,EAACD,QAAAA,CAAAA;;IAGP;IAEA,OAAA,WAAA,OAAO,eAAA,EAACA,QAAAA,CAAAA;AACV;AAKO,oCAAoC,CAACG;IAC1CL,+BAAAA,EAA+BK;IAE/B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAME,OAAO,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,OAAO,EAAA,CAAA;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 * as React from 'react';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } 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): JSXElement => {\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"],"mappings":";;;;+BAiCaK;;;;;;;4BAhCb,iCAAiD;iEAE1B,QAAQ;gCACH,4BAA4B;AAKxD;;;;CAIC,GACD,MAAMH,mBAAmB,CAACC,QAA4BC;IACpD,IAAI,CAACD,QAAQ;QACX,OAAO;IACT;IAEA,IAAIC,eAAe;QACjB,OAAA,WAAA,OACE,eAAA,EAACA,eAAAA;sBACC,WAAA,OAAA,eAAA,EAACD,QAAAA,CAAAA;;IAGP;IAEA,OAAA,WAAA,OAAO,eAAA,EAACA,QAAAA,CAAAA;AACV;AAKO,oCAAoC,CAACG;IAC1CL,+BAAAA,EAA+BK;IAE/B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAME,OAAO,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,OAAO,EAAA,CAAA;YAC/BN,iBAAiBI,MAAMG,YAAY,EAAEH,MAAMI,mBAAmB;YAC9DR,iBAAiBI,MAAMK,UAAU,EAAEL,MAAMM,iBAAiB;YAC1DV,iBAAiBI,MAAMO,YAAY,EAAEP,MAAMQ,mBAAmB;;;AAGrE,EAAE"}

package/lib-commonjs/components/SplitNavItem/useSplitNavItem.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/SplitNavItem/useSplitNavItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SplitNavItem/useSplitNavItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { Tooltip } from '@fluentui/react-tooltip';\nimport type { SplitNavItemProps, SplitNavItemState } from './SplitNavItem.types';\nimport { useNavContext_unstable } from '../NavContext';\nimport { Button, MenuButton, ToggleButton } from '@fluentui/react-button';\nimport { MoreHorizontalFilled, Pin20Regular } from '@fluentui/react-icons';\nimport { NavItem } from '../NavItem/index';\nimport { NavSubItem } from '../NavSubItem/NavSubItem';\nimport { useNavCategoryContext_unstable } from '../NavCategoryContext';\n\n/**\n * Create the state required to render SplitNavItem.\n *\n * The returned state can be modified with hooks such as useSplitNavItemStyles_unstable,\n * before being passed to renderSplitNavItem_unstable.\n *\n * @param props - props from this instance of SplitNavItem\n * @param ref - reference to root HTMLDivElement of SplitNavItem\n */\nexport const useSplitNavItem_unstable = (\n  props: SplitNavItemProps,\n  ref: React.Ref<HTMLDivElement>,\n): SplitNavItemState => {\n  const {\n    navItem,\n    actionButton,\n    toggleButton,\n    menuButton,\n    actionButtonTooltip,\n    toggleButtonTooltip,\n    menuButtonTooltip,\n    children,\n  } = props;\n\n  const { density = 'medium' } = useNavContext_unstable();\n\n  const { value: potentialParenValue } = useNavCategoryContext_unstable();\n\n  const isSubNav = potentialParenValue.length > 0 ? true : false;\n\n  const navItemShorthand = slot.always(navItem, {\n    defaultProps: {\n      children,\n    },\n    elementType: isSubNav ? NavSubItem : NavItem,\n  });\n\n  const actionButtonShorthand = slot.optional(actionButton, {\n    defaultProps: {\n      icon: <Pin20Regular />,\n      size: 'small',\n      appearance: 'transparent',\n    },\n    elementType: Button,\n  });\n\n  const toggleButtonShorthand = slot.optional(toggleButton, {\n    defaultProps: {\n      icon: <Pin20Regular />,\n      size: 'small',\n      appearance: 'transparent',\n    },\n    elementType: ToggleButton,\n  });\n\n  const menuButtonShorthand = slot.optional(menuButton, {\n    defaultProps: {\n      icon: <MoreHorizontalFilled />,\n      size: 'small',\n      appearance: 'transparent',\n    },\n    elementType: MenuButton,\n  });\n\n  const actionButtonTooltipShorthand = slot.optional(actionButtonTooltip, {\n    defaultProps: { relationship: 'label' },\n    elementType: Tooltip,\n  });\n\n  const toggleButtonTooltipShorthand = slot.optional(toggleButtonTooltip, {\n    defaultProps: { relationship: 'label' },\n    elementType: Tooltip,\n  });\n\n  const menuButtonTooltipShorthand = slot.optional(menuButtonTooltip, {\n    defaultProps: { relationship: 'label' },\n    elementType: Tooltip,\n  });\n\n  return {\n    components: {\n      root: 'div',\n      navItem: isSubNav ? NavSubItem : NavItem,\n      actionButton: Button,\n      toggleButton: ToggleButton,\n      menuButton: MenuButton,\n      actionButtonTooltip: Tooltip,\n      toggleButtonTooltip: Tooltip,\n      menuButtonTooltip: Tooltip,\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        ...props,\n        // because we're passing in children to the NavItem,\n        // We can be explicit about the children prop here\n        children: null,\n      }),\n      { elementType: 'div' },\n    ),\n    navItem: navItemShorthand,\n    actionButton: actionButtonShorthand,\n    toggleButton: toggleButtonShorthand,\n    menuButton: menuButtonShorthand,\n    actionButtonTooltip: actionButtonTooltipShorthand,\n    toggleButtonTooltip: toggleButtonTooltipShorthand,\n    menuButtonTooltip: menuButtonTooltipShorthand,\n    density,\n    isSubNav,\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","Tooltip","useNavContext_unstable","Button","MenuButton","ToggleButton","MoreHorizontalFilled","Pin20Regular","NavItem","NavSubItem","useNavCategoryContext_unstable","useSplitNavItem_unstable","props","ref","navItem","actionButton","toggleButton","menuButton","actionButtonTooltip","toggleButtonTooltip","menuButtonTooltip","children","density","value","potentialParenValue","isSubNav","length","navItemShorthand","always","defaultProps","elementType","actionButtonShorthand","optional","icon","size","appearance","toggleButtonShorthand","menuButtonShorthand","actionButtonTooltipShorthand","relationship","toggleButtonTooltipShorthand","menuButtonTooltipShorthand","components","root"],"mappings":";;;;+BAoBaa;;;;;;;iEApBU,QAAQ;gCACgB,4BAA4B;8BACnD,0BAA0B;4BAEX,gBAAgB;6BACN,yBAAyB;4BACvB,wBAAwB;uBACnD,mBAAmB;4BAChB,2BAA2B;oCACP,wBAAwB;AAWhE,iCAAiC,CACtCC,OACAC;IAEA,MAAM,EACJC,OAAO,EACPC,YAAY,EACZC,YAAY,EACZC,UAAU,EACVC,mBAAmB,EACnBC,mBAAmB,EACnBC,iBAAiB,EACjBC,QAAQ,EACT,GAAGT;IAEJ,MAAM,EAAEU,UAAU,QAAQ,EAAE,OAAGpB,kCAAAA;IAE/B,MAAM,EAAEqB,OAAOC,mBAAmB,EAAE,OAAGd,kDAAAA;IAEvC,MAAMe,WAAWD,oBAAoBE,MAAM,GAAG,IAAI,OAAO;IAEzD,MAAMC,mBAAmB3B,oBAAAA,CAAK4B,MAAM,CAACd,SAAS;QAC5Ce,cAAc;YACZR;QACF;QACAS,aAAaL,WAAWhB,sBAAAA,GAAaD,cAAAA;IACvC;IAEA,MAAMuB,wBAAwB/B,oBAAAA,CAAKgC,QAAQ,CAACjB,cAAc;QACxDc,cAAc;YACZI,MAAAA,WAAAA,GAAM,OAAA,aAAA,CAAC1B,wBAAAA,EAAAA;YACP2B,MAAM;YACNC,YAAY;QACd;QACAL,aAAa3B,mBAAAA;IACf;IAEA,MAAMiC,wBAAwBpC,oBAAAA,CAAKgC,QAAQ,CAAChB,cAAc;QACxDa,cAAc;YACZI,MAAAA,WAAAA,GAAM,OAAA,aAAA,CAAC1B,wBAAAA,EAAAA;YACP2B,MAAM;YACNC,YAAY;QACd;QACAL,aAAazB,yBAAAA;IACf;IAEA,MAAMgC,sBAAsBrC,oBAAAA,CAAKgC,QAAQ,CAACf,YAAY;QACpDY,cAAc;YACZI,MAAAA,WAAAA,GAAM,OAAA,aAAA,CAAC3B,gCAAAA,EAAAA;YACP4B,MAAM;YACNC,YAAY;QACd;QACAL,aAAa1B,uBAAAA;IACf;IAEA,MAAMkC,+BAA+BtC,oBAAAA,CAAKgC,QAAQ,CAACd,qBAAqB;QACtEW,cAAc;YAAEU,cAAc;QAAQ;QACtCT,aAAa7B,qBAAAA;IACf;IAEA,MAAMuC,+BAA+BxC,oBAAAA,CAAKgC,QAAQ,CAACb,qBAAqB;QACtEU,cAAc;YAAEU,cAAc;QAAQ;QACtCT,aAAa7B,qBAAAA;IACf;IAEA,MAAMwC,6BAA6BzC,oBAAAA,CAAKgC,QAAQ,CAACZ,mBAAmB;QAClES,cAAc;YAAEU,cAAc;QAAQ;QACtCT,aAAa7B,qBAAAA;IACf;IAEA,OAAO;QACLyC,YAAY;YACVC,MAAM;YACN7B,SAASW,WAAWhB,sBAAAA,GAAaD,cAAAA;YACjCO,cAAcZ,mBAAAA;YACda,cAAcX,yBAAAA;YACdY,YAAYb,uBAAAA;YACZc,qBAAqBjB,qBAAAA;YACrBkB,qBAAqBlB,qBAAAA;YACrBmB,mBAAmBnB,qBAAAA;QACrB;QACA0C,MAAM3C,oBAAAA,CAAK4B,MAAM,KACf7B,wCAAAA,EAAyB,OAAO;YAC9Bc;YACA,GAAGD,KAAK;YACR,oDAAoD;YACpD,kDAAkD;YAClDS,UAAU;QACZ,IACA;YAAES,aAAa;QAAM;QAEvBhB,SAASa;QACTZ,cAAcgB;QACdf,cAAcoB;QACdnB,YAAYoB;QACZnB,qBAAqBoB;QACrBnB,qBAAqBqB;QACrBpB,mBAAmBqB;QACnBnB;QACAG;IACF;AACF,EAAE"}
+{"version":3,"sources":["../src/components/SplitNavItem/useSplitNavItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { Tooltip } from '@fluentui/react-tooltip';\nimport type { SplitNavItemProps, SplitNavItemState } from './SplitNavItem.types';\nimport { useNavContext_unstable } from '../NavContext';\nimport { Button, MenuButton, ToggleButton } from '@fluentui/react-button';\nimport { MoreHorizontalFilled, Pin20Regular } from '@fluentui/react-icons';\nimport { NavItem } from '../NavItem/index';\nimport { NavSubItem } from '../NavSubItem/NavSubItem';\nimport { useNavCategoryContext_unstable } from '../NavCategoryContext';\n\n/**\n * Create the state required to render SplitNavItem.\n *\n * The returned state can be modified with hooks such as useSplitNavItemStyles_unstable,\n * before being passed to renderSplitNavItem_unstable.\n *\n * @param props - props from this instance of SplitNavItem\n * @param ref - reference to root HTMLDivElement of SplitNavItem\n */\nexport const useSplitNavItem_unstable = (\n  props: SplitNavItemProps,\n  ref: React.Ref<HTMLDivElement>,\n): SplitNavItemState => {\n  const {\n    navItem,\n    actionButton,\n    toggleButton,\n    menuButton,\n    actionButtonTooltip,\n    toggleButtonTooltip,\n    menuButtonTooltip,\n    children,\n  } = props;\n\n  const { density = 'medium' } = useNavContext_unstable();\n\n  const { value: potentialParenValue } = useNavCategoryContext_unstable();\n\n  const isSubNav = potentialParenValue.length > 0 ? true : false;\n\n  const navItemShorthand = slot.always(navItem, {\n    defaultProps: {\n      children,\n    },\n    elementType: isSubNav ? NavSubItem : NavItem,\n  });\n\n  const actionButtonShorthand = slot.optional(actionButton, {\n    defaultProps: {\n      icon: <Pin20Regular />,\n      size: 'small',\n      appearance: 'transparent',\n    },\n    elementType: Button,\n  });\n\n  const toggleButtonShorthand = slot.optional(toggleButton, {\n    defaultProps: {\n      icon: <Pin20Regular />,\n      size: 'small',\n      appearance: 'transparent',\n    },\n    elementType: ToggleButton,\n  });\n\n  const menuButtonShorthand = slot.optional(menuButton, {\n    defaultProps: {\n      icon: <MoreHorizontalFilled />,\n      size: 'small',\n      appearance: 'transparent',\n    },\n    elementType: MenuButton,\n  });\n\n  const actionButtonTooltipShorthand = slot.optional(actionButtonTooltip, {\n    defaultProps: { relationship: 'label' },\n    elementType: Tooltip,\n  });\n\n  const toggleButtonTooltipShorthand = slot.optional(toggleButtonTooltip, {\n    defaultProps: { relationship: 'label' },\n    elementType: Tooltip,\n  });\n\n  const menuButtonTooltipShorthand = slot.optional(menuButtonTooltip, {\n    defaultProps: { relationship: 'label' },\n    elementType: Tooltip,\n  });\n\n  return {\n    components: {\n      root: 'div',\n      navItem: isSubNav ? NavSubItem : NavItem,\n      actionButton: Button,\n      toggleButton: ToggleButton,\n      menuButton: MenuButton,\n      actionButtonTooltip: Tooltip,\n      toggleButtonTooltip: Tooltip,\n      menuButtonTooltip: Tooltip,\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        ...props,\n        // because we're passing in children to the NavItem,\n        // We can be explicit about the children prop here\n        children: null,\n      }),\n      { elementType: 'div' },\n    ),\n    navItem: navItemShorthand,\n    actionButton: actionButtonShorthand,\n    toggleButton: toggleButtonShorthand,\n    menuButton: menuButtonShorthand,\n    actionButtonTooltip: actionButtonTooltipShorthand,\n    toggleButtonTooltip: toggleButtonTooltipShorthand,\n    menuButtonTooltip: menuButtonTooltipShorthand,\n    density,\n    isSubNav,\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","Tooltip","useNavContext_unstable","Button","MenuButton","ToggleButton","MoreHorizontalFilled","Pin20Regular","NavItem","NavSubItem","useNavCategoryContext_unstable","useSplitNavItem_unstable","props","ref","navItem","actionButton","toggleButton","menuButton","actionButtonTooltip","toggleButtonTooltip","menuButtonTooltip","children","density","value","potentialParenValue","isSubNav","length","navItemShorthand","always","defaultProps","elementType","actionButtonShorthand","optional","icon","size","appearance","toggleButtonShorthand","menuButtonShorthand","actionButtonTooltipShorthand","relationship","toggleButtonTooltipShorthand","menuButtonTooltipShorthand","components","root"],"mappings":"AAAA;;;;;+BAsBaa;;;;;;;iEApBU,QAAQ;gCACgB,4BAA4B;8BACnD,0BAA0B;4BAEX,gBAAgB;6BACN,yBAAyB;4BACvB,wBAAwB;uBACnD,mBAAmB;4BAChB,2BAA2B;oCACP,wBAAwB;AAWhE,iCAAiC,CACtCC,OACAC;IAEA,MAAM,EACJC,OAAO,EACPC,YAAY,EACZC,YAAY,EACZC,UAAU,EACVC,mBAAmB,EACnBC,mBAAmB,EACnBC,iBAAiB,EACjBC,QAAQ,EACT,GAAGT;IAEJ,MAAM,EAAEU,UAAU,QAAQ,EAAE,OAAGpB,kCAAAA;IAE/B,MAAM,EAAEqB,OAAOC,mBAAmB,EAAE,GAAGd,sDAAAA;IAEvC,MAAMe,WAAWD,oBAAoBE,MAAM,GAAG,IAAI,OAAO;IAEzD,MAAMC,mBAAmB3B,oBAAAA,CAAK4B,MAAM,CAACd,SAAS;QAC5Ce,cAAc;YACZR;QACF;QACAS,aAAaL,WAAWhB,sBAAAA,GAAaD,cAAAA;IACvC;IAEA,MAAMuB,wBAAwB/B,oBAAAA,CAAKgC,QAAQ,CAACjB,cAAc;QACxDc,cAAc;YACZI,MAAAA,WAAAA,GAAM,OAAA,aAAA,CAAC1B,wBAAAA,EAAAA;YACP2B,MAAM;YACNC,YAAY;QACd;QACAL,aAAa3B,mBAAAA;IACf;IAEA,MAAMiC,wBAAwBpC,oBAAAA,CAAKgC,QAAQ,CAAChB,cAAc;QACxDa,cAAc;YACZI,MAAAA,WAAAA,GAAM,OAAA,aAAA,CAAC1B,wBAAAA,EAAAA;YACP2B,MAAM;YACNC,YAAY;QACd;QACAL,aAAazB,yBAAAA;IACf;IAEA,MAAMgC,sBAAsBrC,oBAAAA,CAAKgC,QAAQ,CAACf,YAAY;QACpDY,cAAc;YACZI,MAAAA,WAAAA,GAAM,OAAA,aAAA,CAAC3B,gCAAAA,EAAAA;YACP4B,MAAM;YACNC,YAAY;QACd;QACAL,aAAa1B,uBAAAA;IACf;IAEA,MAAMkC,+BAA+BtC,oBAAAA,CAAKgC,QAAQ,CAACd,qBAAqB;QACtEW,cAAc;YAAEU,cAAc;QAAQ;QACtCT,aAAa7B,qBAAAA;IACf;IAEA,MAAMuC,+BAA+BxC,oBAAAA,CAAKgC,QAAQ,CAACb,qBAAqB;QACtEU,cAAc;YAAEU,cAAc;QAAQ;QACtCT,aAAa7B,qBAAAA;IACf;IAEA,MAAMwC,6BAA6BzC,oBAAAA,CAAKgC,QAAQ,CAACZ,mBAAmB;QAClES,cAAc;YAAEU,cAAc;QAAQ;QACtCT,aAAa7B,qBAAAA;IACf;IAEA,OAAO;QACLyC,YAAY;YACVC,MAAM;YACN7B,SAASW,WAAWhB,sBAAAA,GAAaD,cAAAA;YACjCO,cAAcZ,mBAAAA;YACda,cAAcX,yBAAAA;YACdY,YAAYb,uBAAAA;YACZc,qBAAqBjB,qBAAAA;YACrBkB,qBAAqBlB,qBAAAA;YACrBmB,mBAAmBnB,qBAAAA;QACrB;QACA0C,MAAM3C,oBAAAA,CAAK4B,MAAM,KACf7B,wCAAAA,EAAyB,OAAO;YAC9Bc;YACA,GAAGD,KAAK;YACR,oDAAoD;YACpD,kDAAkD;YAClDS,UAAU;QACZ,IACA;YAAES,aAAa;QAAM;QAEvBhB,SAASa;QACTZ,cAAcgB;QACdf,cAAcoB;QACdnB,YAAYoB;QACZnB,qBAAqBoB;QACrBnB,qBAAqBqB;QACrBpB,mBAAmBqB;QACnBnB;QACAG;IACF;AACF,EAAE"}

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

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

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

@@ -1 +1 @@
-{"version":3,"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"],"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"],"mappings":"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"}
+{"version":3,"sources":["useSplitNavItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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"],"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"],"mappings":"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"}

package/lib-commonjs/components/SplitNavItem/useSplitNavItemStyles.styles.raw.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/SplitNavItem/useSplitNavItemStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SplitNavItem/useSplitNavItemStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { motionTokens } from '@fluentui/react-motion';\n\nimport type { SplitNavItemSlots, SplitNavItemState } from './SplitNavItem.types';\nimport { navItemTokens, useRootDefaultClassName } from '../sharedNavStyles.styles';\n\nexport const splitNavItemClassNames: SlotClassNames<SplitNavItemSlots> = {\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   */\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\nconst { actionButton, toggleButton, menuButton } = splitNavItemClassNames;\nconst buttonHoverStyles = {\n  [`& .${actionButton}, & .${toggleButton}, & .${menuButton}`]: {\n    opacity: 1,\n    pointerEvents: 'auto',\n  },\n};\n\n/**\n * Styles for the root slot\n */\nconst 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\n    ':hover': {\n      backgroundColor: navItemTokens.backgroundColorHover,\n      ...buttonHoverStyles,\n    },\n\n    ':focus-within': buttonHoverStyles,\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  baseLarge: {\n    paddingBlockStart: '12px',\n  },\n\n  hoverAction: {\n    opacity: 0,\n    pointerEvents: 'none',\n    transition: `opacity ${motionTokens.durationFast}ms ${motionTokens.curveEasyEase}`,\n    willChange: 'opacity',\n  },\n});\n\n/**\n * Apply styling to the SplitNavItem slots based on the state\n */\nexport const useSplitNavItemStyles_unstable = (state: SplitNavItemState): SplitNavItemState => {\n  'use no memo';\n\n  const splitNavItemStyles = useSplitNaveItemStyles();\n  const sharedRootClassNames = useRootDefaultClassName();\n\n  state.root.className = mergeClasses(\n    splitNavItemClassNames.root,\n    sharedRootClassNames,\n    splitNavItemStyles.baseRoot,\n    state.root.className,\n  );\n\n  if (state.navItem) {\n    state.navItem.className = mergeClasses(\n      splitNavItemClassNames.navItem,\n      splitNavItemStyles.baseNavItem,\n      state.navItem.className,\n    );\n  }\n\n  if (state.actionButton) {\n    state.actionButton.className = mergeClasses(\n      splitNavItemClassNames.actionButton,\n      splitNavItemStyles.baseSecondary,\n      splitNavItemStyles.hoverAction,\n      state.density === 'medium' && splitNavItemStyles.baseMedium,\n      state.actionButton.className,\n    );\n  }\n\n  if (state.toggleButton) {\n    state.toggleButton.className = mergeClasses(\n      splitNavItemClassNames.toggleButton,\n      splitNavItemStyles.baseSecondary,\n      splitNavItemStyles.hoverAction,\n      state.density === 'medium' && splitNavItemStyles.baseMedium,\n      state.toggleButton.className,\n    );\n  }\n\n  if (state.menuButton) {\n    state.menuButton.className = mergeClasses(\n      splitNavItemClassNames.menuButton,\n      splitNavItemStyles.baseSecondary,\n      splitNavItemStyles.hoverAction,\n      state.density === 'medium' && splitNavItemStyles.baseMedium,\n      state.menuButton.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","motionTokens","navItemTokens","useRootDefaultClassName","splitNavItemClassNames","root","navItem","actionButton","toggleButton","menuButton","actionButtonTooltip","toggleButtonTooltip","menuButtonTooltip","buttonHoverStyles","opacity","pointerEvents","useSplitNaveItemStyles","baseRoot","display","gap","alignItems","padding","textAlign","backgroundColor","transitionTokens","backgroundColorHover","backgroundColorPressed","baseNavItem","textTransform","alignSelf","position","justifyContent","spacingVerticalL","baseSecondary","minWidth","paddingInlineEnd","paddingInlineStart","paddingBlockStart","baseMedium","baseLarge","hoverAction","transition","durationFast","curveEasyEase","willChange","useSplitNavItemStyles_unstable","state","splitNavItemStyles","sharedRootClassNames","className","density"],"mappings":";;;;;;;;;;;IAQaM,sBAAAA;;;IAsFAyC,8BAAAA;;;;uBA9F4B,iBAAiB;4BAEnC,wBAAwB;6BAClB,yBAAyB;uCAGC,4BAA4B;AAE5E,+BAAkE;IACvExC,MAAM;IACNC,SAAS;IACTC,cAAc;IACdC,cAAc;IACdC,YAAY;IACZ;;GAEC,GACDC,qBAAqB;IACrBC,qBAAqB;IACrBC,mBAAmB;AACrB,EAAE;AACF,6EAA6E;AAC7E,8EAA8E;AAC9E,kEAAkE;AAElE,MAAM,EAAEL,YAAY,EAAEC,YAAY,EAAEC,UAAU,EAAE,GAAGL;AACnD,MAAMS,oBAAoB;IACxB,CAAC,CAAC,GAAG,EAAEN,aAAa,KAAK,EAAEC,aAAa,KAAK,EAAEC,YAAY,CAAC,EAAE;QAC5DK,SAAS;QACTC,eAAe;IACjB;AACF;AAEA;;CAEC,GACD,MAAMC,6BAAyBlB,iBAAAA,EAAW;IACxCmB,UAAU;QACRC,SAAS;QACTC,KAAK;QACLC,YAAY;QACZC,SAAS;QACTC,WAAW;QACXC,iBAAiBrB,oCAAAA,CAAcqB,eAAe;QAC9C,GAAGrB,oCAAAA,CAAcsB,gBAAgB;QAEjC,UAAU;YACRD,iBAAiBrB,oCAAAA,CAAcuB,oBAAoB;YACnD,GAAGZ,iBAAiB;QACtB;QAEA,iBAAiBA;QAEjB,WAAW;YACTU,iBAAiBrB,oCAAAA,CAAcwB,sBAAsB;QACvD;IACF;IACAC,aAAa;QACX,sDAAsD;QACtDT,SAAS;QACTU,eAAe;QACfC,WAAW;QACXP,WAAW;QACXQ,UAAU;QACVC,gBAAgB;QAChBZ,KAAKnB,kBAAAA,CAAOgC,gBAAgB;QAC5BT,iBAAiB;IACnB;IACAU,eAAe;QACbC,UAAU;QACVC,kBAAkB;QAClBC,oBAAoB;QACpBC,mBAAmB;QACnBjB,YAAY;IACd;IACAkB,YAAY;QACVD,mBAAmB;IACrB;IAEAE,WAAW;QACTF,mBAAmB;IACrB;IAEAG,aAAa;QACX1B,SAAS;QACTC,eAAe;QACf0B,YAAY,CAAC,QAAQ,EAAExC,yBAAAA,CAAayC,YAAY,CAAC,GAAG,EAAEzC,yBAAAA,CAAa0C,aAAa,EAAE;QAClFC,YAAY;IACd;AACF;AAKO,uCAAuC,CAACE;IAC7C;IAEA,MAAMC,qBAAqB/B;IAC3B,MAAMgC,2BAAuB7C,8CAAAA;IAE7B2C,MAAMzC,IAAI,CAAC4C,SAAS,OAAGlD,mBAAAA,EACrBK,uBAAuBC,IAAI,EAC3B2C,sBACAD,mBAAmB9B,QAAQ,EAC3B6B,MAAMzC,IAAI,CAAC4C,SAAS;IAGtB,IAAIH,MAAMxC,OAAO,EAAE;QACjBwC,MAAMxC,OAAO,CAAC2C,SAAS,OAAGlD,mBAAAA,EACxBK,uBAAuBE,OAAO,EAC9ByC,mBAAmBpB,WAAW,EAC9BmB,MAAMxC,OAAO,CAAC2C,SAAS;IAE3B;IAEA,IAAIH,MAAMvC,YAAY,EAAE;QACtBuC,MAAMvC,YAAY,CAAC0C,SAAS,OAAGlD,mBAAAA,EAC7BK,uBAAuBG,YAAY,EACnCwC,mBAAmBd,aAAa,EAChCc,mBAAmBP,WAAW,EAC9BM,MAAMI,OAAO,KAAK,YAAYH,mBAAmBT,UAAU,EAC3DQ,MAAMvC,YAAY,CAAC0C,SAAS;IAEhC;IAEA,IAAIH,MAAMtC,YAAY,EAAE;QACtBsC,MAAMtC,YAAY,CAACyC,SAAS,OAAGlD,mBAAAA,EAC7BK,uBAAuBI,YAAY,EACnCuC,mBAAmBd,aAAa,EAChCc,mBAAmBP,WAAW,EAC9BM,MAAMI,OAAO,KAAK,YAAYH,mBAAmBT,UAAU,EAC3DQ,MAAMtC,YAAY,CAACyC,SAAS;IAEhC;IAEA,IAAIH,MAAMrC,UAAU,EAAE;QACpBqC,MAAMrC,UAAU,CAACwC,SAAS,OAAGlD,mBAAAA,EAC3BK,uBAAuBK,UAAU,EACjCsC,mBAAmBd,aAAa,EAChCc,mBAAmBP,WAAW,EAC9BM,MAAMI,OAAO,KAAK,YAAYH,mBAAmBT,UAAU,EAC3DQ,MAAMrC,UAAU,CAACwC,SAAS;IAE9B;IAEA,OAAOH;AACT,EAAE"}
+{"version":3,"sources":["../src/components/SplitNavItem/useSplitNavItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { motionTokens } from '@fluentui/react-motion';\n\nimport type { SplitNavItemSlots, SplitNavItemState } from './SplitNavItem.types';\nimport { navItemTokens, useRootDefaultClassName } from '../sharedNavStyles.styles';\n\nexport const splitNavItemClassNames: SlotClassNames<SplitNavItemSlots> = {\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   */\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\nconst { actionButton, toggleButton, menuButton } = splitNavItemClassNames;\nconst buttonHoverStyles = {\n  [`& .${actionButton}, & .${toggleButton}, & .${menuButton}`]: {\n    opacity: 1,\n    pointerEvents: 'auto',\n  },\n};\n\n/**\n * Styles for the root slot\n */\nconst 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\n    ':hover': {\n      backgroundColor: navItemTokens.backgroundColorHover,\n      ...buttonHoverStyles,\n    },\n\n    ':focus-within': buttonHoverStyles,\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  baseLarge: {\n    paddingBlockStart: '12px',\n  },\n\n  hoverAction: {\n    opacity: 0,\n    pointerEvents: 'none',\n    transition: `opacity ${motionTokens.durationFast}ms ${motionTokens.curveEasyEase}`,\n    willChange: 'opacity',\n  },\n});\n\n/**\n * Apply styling to the SplitNavItem slots based on the state\n */\nexport const useSplitNavItemStyles_unstable = (state: SplitNavItemState): SplitNavItemState => {\n  'use no memo';\n\n  const splitNavItemStyles = useSplitNaveItemStyles();\n  const sharedRootClassNames = useRootDefaultClassName();\n\n  state.root.className = mergeClasses(\n    splitNavItemClassNames.root,\n    sharedRootClassNames,\n    splitNavItemStyles.baseRoot,\n    state.root.className,\n  );\n\n  if (state.navItem) {\n    state.navItem.className = mergeClasses(\n      splitNavItemClassNames.navItem,\n      splitNavItemStyles.baseNavItem,\n      state.navItem.className,\n    );\n  }\n\n  if (state.actionButton) {\n    state.actionButton.className = mergeClasses(\n      splitNavItemClassNames.actionButton,\n      splitNavItemStyles.baseSecondary,\n      splitNavItemStyles.hoverAction,\n      state.density === 'medium' && splitNavItemStyles.baseMedium,\n      state.actionButton.className,\n    );\n  }\n\n  if (state.toggleButton) {\n    state.toggleButton.className = mergeClasses(\n      splitNavItemClassNames.toggleButton,\n      splitNavItemStyles.baseSecondary,\n      splitNavItemStyles.hoverAction,\n      state.density === 'medium' && splitNavItemStyles.baseMedium,\n      state.toggleButton.className,\n    );\n  }\n\n  if (state.menuButton) {\n    state.menuButton.className = mergeClasses(\n      splitNavItemClassNames.menuButton,\n      splitNavItemStyles.baseSecondary,\n      splitNavItemStyles.hoverAction,\n      state.density === 'medium' && splitNavItemStyles.baseMedium,\n      state.menuButton.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","motionTokens","navItemTokens","useRootDefaultClassName","splitNavItemClassNames","root","navItem","actionButton","toggleButton","menuButton","actionButtonTooltip","toggleButtonTooltip","menuButtonTooltip","buttonHoverStyles","opacity","pointerEvents","useSplitNaveItemStyles","baseRoot","display","gap","alignItems","padding","textAlign","backgroundColor","transitionTokens","backgroundColorHover","backgroundColorPressed","baseNavItem","textTransform","alignSelf","position","justifyContent","spacingVerticalL","baseSecondary","minWidth","paddingInlineEnd","paddingInlineStart","paddingBlockStart","baseMedium","baseLarge","hoverAction","transition","durationFast","curveEasyEase","willChange","useSplitNavItemStyles_unstable","state","splitNavItemStyles","sharedRootClassNames","className","density"],"mappings":"AAAA;;;;;;;;;;;;IAUaM,sBAAAA;;;kCAsFAyC;eAAAA;;;uBA9F4B,iBAAiB;4BAEnC,wBAAwB;6BAClB,yBAAyB;uCAGC,4BAA4B;AAE5E,+BAAkE;IACvExC,MAAM;IACNC,SAAS;IACTC,cAAc;IACdC,cAAc;IACdC,YAAY;IACZ;;GAEC,GACDC,qBAAqB;IACrBC,qBAAqB;IACrBC,mBAAmB;AACrB,EAAE;AACF,6EAA6E;AAC7E,8EAA8E;AAC9E,kEAAkE;AAElE,MAAM,EAAEL,YAAY,EAAEC,YAAY,EAAEC,UAAU,EAAE,GAAGL;AACnD,MAAMS,oBAAoB;IACxB,CAAC,CAAC,GAAG,EAAEN,aAAa,KAAK,EAAEC,aAAa,KAAK,EAAEC,YAAY,CAAC,EAAE;QAC5DK,SAAS;QACTC,eAAe;IACjB;AACF;AAEA;;CAEC,GACD,MAAMC,6BAAyBlB,iBAAAA,EAAW;IACxCmB,UAAU;QACRC,SAAS;QACTC,KAAK;QACLC,YAAY;QACZC,SAAS;QACTC,WAAW;QACXC,iBAAiBrB,oCAAAA,CAAcqB,eAAe;QAC9C,GAAGrB,oCAAAA,CAAcsB,gBAAgB;QAEjC,UAAU;YACRD,iBAAiBrB,oCAAAA,CAAcuB,oBAAoB;YACnD,GAAGZ,iBAAiB;QACtB;QAEA,iBAAiBA;QAEjB,WAAW;YACTU,iBAAiBrB,oCAAAA,CAAcwB,sBAAsB;QACvD;IACF;IACAC,aAAa;QACX,sDAAsD;QACtDT,SAAS;QACTU,eAAe;QACfC,WAAW;QACXP,WAAW;QACXQ,UAAU;QACVC,gBAAgB;QAChBZ,KAAKnB,kBAAAA,CAAOgC,gBAAgB;QAC5BT,iBAAiB;IACnB;IACAU,eAAe;QACbC,UAAU;QACVC,kBAAkB;QAClBC,oBAAoB;QACpBC,mBAAmB;QACnBjB,YAAY;IACd;IACAkB,YAAY;QACVD,mBAAmB;IACrB;IAEAE,WAAW;QACTF,mBAAmB;IACrB;IAEAG,aAAa;QACX1B,SAAS;QACTC,eAAe;QACf0B,YAAY,CAAC,QAAQ,EAAExC,yBAAAA,CAAayC,YAAY,CAAC,GAAG,EAAEzC,yBAAAA,CAAa0C,aAAa,EAAE;QAClFC,YAAY;IACd;AACF;AAKO,uCAAuC,CAACE;IAC7C;IAEA,MAAMC,qBAAqB/B;IAC3B,MAAMgC,2BAAuB7C,8CAAAA;IAE7B2C,MAAMzC,IAAI,CAAC4C,SAAS,OAAGlD,mBAAAA,EACrBK,uBAAuBC,IAAI,EAC3B2C,sBACAD,mBAAmB9B,QAAQ,EAC3B6B,MAAMzC,IAAI,CAAC4C,SAAS;IAGtB,IAAIH,MAAMxC,OAAO,EAAE;QACjBwC,MAAMxC,OAAO,CAAC2C,SAAS,OAAGlD,mBAAAA,EACxBK,uBAAuBE,OAAO,EAC9ByC,mBAAmBpB,WAAW,EAC9BmB,MAAMxC,OAAO,CAAC2C,SAAS;IAE3B;IAEA,IAAIH,MAAMvC,YAAY,EAAE;QACtBuC,MAAMvC,YAAY,CAAC0C,SAAS,OAAGlD,mBAAAA,EAC7BK,uBAAuBG,YAAY,EACnCwC,mBAAmBd,aAAa,EAChCc,mBAAmBP,WAAW,EAC9BM,MAAMI,OAAO,KAAK,YAAYH,mBAAmBT,UAAU,EAC3DQ,MAAMvC,YAAY,CAAC0C,SAAS;IAEhC;IAEA,IAAIH,MAAMtC,YAAY,EAAE;QACtBsC,MAAMtC,YAAY,CAACyC,SAAS,OAAGlD,mBAAAA,EAC7BK,uBAAuBI,YAAY,EACnCuC,mBAAmBd,aAAa,EAChCc,mBAAmBP,WAAW,EAC9BM,MAAMI,OAAO,KAAK,YAAYH,mBAAmBT,UAAU,EAC3DQ,MAAMtC,YAAY,CAACyC,SAAS;IAEhC;IAEA,IAAIH,MAAMrC,UAAU,EAAE;QACpBqC,MAAMrC,UAAU,CAACwC,SAAS,OAAGlD,mBAAAA,EAC3BK,uBAAuBK,UAAU,EACjCsC,mBAAmBd,aAAa,EAChCc,mBAAmBP,WAAW,EAC9BM,MAAMI,OAAO,KAAK,YAAYH,mBAAmBT,UAAU,EAC3DQ,MAAMrC,UAAU,CAACwC,SAAS;IAE9B;IAEA,OAAOH;AACT,EAAE"}

package/lib-commonjs/components/useNavCategoryContextValues_unstable.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/useNavCategoryContextValues_unstable.ts"],"sourcesContent":["import * as React from 'react';\nimport { NavCategoryState } from '../NavCategory';\nimport { NavCategoryContextValue, NavCategoryContextValues } from './NavCategoryContext';\n\nexport function useNavCategoryContextValues_unstable(state: NavCategoryState): NavCategoryContextValues {\n  const { open, value } = state;\n  const navCategory = React.useMemo<NavCategoryContextValue>(() => ({ open, value }), [open, value]);\n\n  return { categoryValue: navCategory };\n}\n"],"names":["React","useNavCategoryContextValues_unstable","state","open","value","navCategory","useMemo","categoryValue"],"mappings":";;;;+BAIgBC;;;;;;;iEAJO,QAAQ;AAIxB,8CAA8CC,KAAuB;IAC1E,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGF;IACxB,MAAMG,cAAcL,OAAMM,OAAO,CAA0B,IAAO,CAAA;YAAEH;YAAMC;SAAM,CAAA,EAAI;QAACD;QAAMC;KAAM;IAEjG,OAAO;QAAEG,eAAeF;IAAY;AACtC"}
+{"version":3,"sources":["../src/components/useNavCategoryContextValues_unstable.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { NavCategoryState } from '../NavCategory';\nimport { NavCategoryContextValue, NavCategoryContextValues } from './NavCategoryContext';\n\nexport function useNavCategoryContextValues_unstable(state: NavCategoryState): NavCategoryContextValues {\n  const { open, value } = state;\n  const navCategory = React.useMemo<NavCategoryContextValue>(() => ({ open, value }), [open, value]);\n\n  return { categoryValue: navCategory };\n}\n"],"names":["React","useNavCategoryContextValues_unstable","state","open","value","navCategory","useMemo","categoryValue"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;AAIxB,SAASC,qCAAqCC,KAAuB;IAC1E,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGF;IACxB,MAAMG,cAAcL,OAAMM,OAAO,CAA0B,IAAO,CAAA;YAAEH;YAAMC;SAAM,CAAA,EAAI;QAACD;QAAMC;KAAM;IAEjG,OAAO;QAAEG,eAAeF;IAAY;AACtC"}

package/lib-commonjs/components/useNavCategoryItemContextValues_unstable.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/useNavCategoryItemContextValues_unstable.ts"],"sourcesContent":["import * as React from 'react';\nimport { NavCategoryItemContextValue } from './NavCategoryItemContext';\nimport { NavCategoryItemContextValues, NavCategoryItemState } from './NavCategoryItem/NavCategoryItem.types';\n\nexport function useNavCategoryItemContextValues_unstable(state: NavCategoryItemState): NavCategoryItemContextValues {\n  const { open, value } = state;\n  const navCategoryItem = React.useMemo<NavCategoryItemContextValue>(() => ({ open, value }), [open, value]);\n\n  return { navCategoryItem };\n}\n"],"names":["React","useNavCategoryItemContextValues_unstable","state","open","value","navCategoryItem","useMemo"],"mappings":";;;;+BAIgBC;;;;;;;iEAJO,QAAQ;AAIxB,kDAAkDC,KAA2B;IAClF,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGF;IACxB,MAAMG,kBAAkBL,OAAMM,OAAO,CAA8B,IAAO,CAAA;YAAEH;YAAMC;SAAM,CAAA,EAAI;QAACD;QAAMC;KAAM;IAEzG,OAAO;QAAEC;IAAgB;AAC3B"}
+{"version":3,"sources":["../src/components/useNavCategoryItemContextValues_unstable.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { NavCategoryItemContextValue } from './NavCategoryItemContext';\nimport { NavCategoryItemContextValues, NavCategoryItemState } from './NavCategoryItem/NavCategoryItem.types';\n\nexport function useNavCategoryItemContextValues_unstable(state: NavCategoryItemState): NavCategoryItemContextValues {\n  const { open, value } = state;\n  const navCategoryItem = React.useMemo<NavCategoryItemContextValue>(() => ({ open, value }), [open, value]);\n\n  return { navCategoryItem };\n}\n"],"names":["React","useNavCategoryItemContextValues_unstable","state","open","value","navCategoryItem","useMemo"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;AAIxB,SAASC,yCAAyCC,KAA2B;IAClF,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGF;IACxB,MAAMG,kBAAkBL,OAAMM,OAAO,CAA8B,IAAO,CAAA;YAAEH;YAAMC;SAAM,CAAA,EAAI;QAACD;QAAMC;KAAM;IAEzG,OAAO;QAAEC;IAAgB;AAC3B"}

package/lib-commonjs/components/useNavContextValues.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -11,7 +12,7 @@ Object.defineProperty(exports, "useNavContextValues_unstable", {
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 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, onNavItemSelect, tabbable } = state;
     const navContext = _react.useMemo(()=>({
             selectedValue,
             selectedCategoryValue,
@@ -23,7 +24,8 @@ function useNavContextValues_unstable(state) {
             openCategories,
             multiple,
             density,
-            onNavItemSelect
+            onNavItemSelect,
+            tabbable
         }), [
         selectedValue,
         selectedCategoryValue,
@@ -35,7 +37,8 @@ function useNavContextValues_unstable(state) {
         openCategories,
         multiple,
         density,
-        onNavItemSelect
+        onNavItemSelect,
+        tabbable
     ]);
     return {
         nav: navContext

package/lib-commonjs/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"],"mappings":";;;;+BAGgBC;;;;;;;iEAHO,QAAQ;AAGxB,sCAAsCC,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,OAAMe,OAAO,CAC9B,IAAO;YACLZ;YACAC;YACAG;YACAF;YACAC;YACAE;YACAC;YACAC;YACAC;YACAC;YACAC;SACF,CAAA,EACA;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":["'use client';\n\nimport * 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    tabbable,\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      tabbable,\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      tabbable,\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","tabbable","navContext","useMemo","nav"],"mappings":"AAAA;;;;;+BAKgBC;;;;;;;iEAHO,QAAQ;AAGxB,sCAAsCC,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,EACfC,QAAQ,EACT,GAAGZ;IAEJ,MAAMa,aAAaf,OAAMgB,OAAO,CAC9B,IAAO,CAAA;YACLb;YACAC;YACAG;YACAF;YACAC;YACAE;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QACEX;QACAC;QACAG;QACAF;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;KACD;IAGH,OAAO;QAAEG,KAAKF;IAAW;AAC3B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-nav",
-  "version": "9.3.5",
+  "version": "9.3.7",
   "description": "New fluentui react package",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -18,27 +18,27 @@
     "@fluentui/scripts-api-extractor": "*"
   },
   "dependencies": {
-    "@fluentui/react-aria": "^9.16.4",
-    "@fluentui/react-button": "^9.6.5",
-    "@fluentui/react-context-selector": "^9.2.6",
-    "@fluentui/react-divider": "^9.4.4",
-    "@fluentui/react-drawer": "^9.10.0",
+    "@fluentui/react-aria": "^9.17.1",
+    "@fluentui/react-button": "^9.6.7",
+    "@fluentui/react-context-selector": "^9.2.8",
+    "@fluentui/react-divider": "^9.4.6",
+    "@fluentui/react-drawer": "^9.10.2",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-jsx-runtime": "^9.1.6",
-    "@fluentui/react-motion": "^9.10.3",
-    "@fluentui/react-shared-contexts": "^9.25.0",
-    "@fluentui/react-tabster": "^9.26.4",
+    "@fluentui/react-jsx-runtime": "^9.2.1",
+    "@fluentui/react-motion": "^9.11.0",
+    "@fluentui/react-shared-contexts": "^9.25.2",
+    "@fluentui/react-tabster": "^9.26.6",
     "@fluentui/react-theme": "^9.2.0",
-    "@fluentui/react-tooltip": "^9.8.4",
-    "@fluentui/react-utilities": "^9.24.0",
+    "@fluentui/react-tooltip": "^9.8.6",
+    "@fluentui/react-utilities": "^9.25.0",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1"
   },
   "peerDependencies": {
-    "@types/react": ">=16.14.0 <19.0.0",
-    "@types/react-dom": ">=16.9.0 <19.0.0",
-    "react": ">=16.14.0 <19.0.0",
-    "react-dom": ">=16.14.0 <19.0.0"
+    "@types/react": ">=16.14.0 <20.0.0",
+    "@types/react-dom": ">=16.9.0 <20.0.0",
+    "react": ">=16.14.0 <20.0.0",
+    "react-dom": ">=16.14.0 <20.0.0"
   },
   "exports": {
     ".": {