@fluentui/react-nav 9.4.0 → 9.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +31 -2
- package/lib/components/AppItem/useAppItemStyles.styles.js +0 -2
- package/lib/components/AppItem/useAppItemStyles.styles.js.map +1 -1
- package/lib/components/AppItem/useAppItemStyles.styles.raw.js +0 -1
- package/lib/components/AppItem/useAppItemStyles.styles.raw.js.map +1 -1
- package/lib/components/AppItemStatic/useAppItemStaticStyles.styles.js +0 -2
- package/lib/components/AppItemStatic/useAppItemStaticStyles.styles.js.map +1 -1
- package/lib/components/AppItemStatic/useAppItemStaticStyles.styles.raw.js +0 -1
- package/lib/components/AppItemStatic/useAppItemStaticStyles.styles.raw.js.map +1 -1
- package/lib/components/Hamburger/useHamburgerStyles.styles.js +0 -2
- package/lib/components/Hamburger/useHamburgerStyles.styles.js.map +1 -1
- package/lib/components/Hamburger/useHamburgerStyles.styles.raw.js +0 -1
- package/lib/components/Hamburger/useHamburgerStyles.styles.raw.js.map +1 -1
- package/lib/components/Nav/useNavStyles.styles.js +0 -2
- package/lib/components/Nav/useNavStyles.styles.js.map +1 -1
- package/lib/components/Nav/useNavStyles.styles.raw.js +0 -1
- package/lib/components/Nav/useNavStyles.styles.raw.js.map +1 -1
- package/lib/components/NavCategoryItem/useNavCategoryItem.styles.js +0 -2
- package/lib/components/NavCategoryItem/useNavCategoryItem.styles.js.map +1 -1
- package/lib/components/NavCategoryItem/useNavCategoryItem.styles.raw.js +0 -1
- package/lib/components/NavCategoryItem/useNavCategoryItem.styles.raw.js.map +1 -1
- package/lib/components/NavDivider/useNavDividerStyles.styles.js +0 -2
- package/lib/components/NavDivider/useNavDividerStyles.styles.js.map +1 -1
- package/lib/components/NavDivider/useNavDividerStyles.styles.raw.js +0 -1
- package/lib/components/NavDivider/useNavDividerStyles.styles.raw.js.map +1 -1
- package/lib/components/NavDrawer/useNavDrawerStyles.styles.js +0 -2
- package/lib/components/NavDrawer/useNavDrawerStyles.styles.js.map +1 -1
- package/lib/components/NavDrawer/useNavDrawerStyles.styles.raw.js +0 -1
- package/lib/components/NavDrawer/useNavDrawerStyles.styles.raw.js.map +1 -1
- package/lib/components/NavDrawerBody/useNavDrawerBodyStyles.styles.js +0 -2
- package/lib/components/NavDrawerBody/useNavDrawerBodyStyles.styles.js.map +1 -1
- package/lib/components/NavDrawerBody/useNavDrawerBodyStyles.styles.raw.js +0 -1
- package/lib/components/NavDrawerBody/useNavDrawerBodyStyles.styles.raw.js.map +1 -1
- package/lib/components/NavDrawerFooter/useNavDrawerFooterStyles.styles.js +0 -2
- package/lib/components/NavDrawerFooter/useNavDrawerFooterStyles.styles.js.map +1 -1
- package/lib/components/NavDrawerFooter/useNavDrawerFooterStyles.styles.raw.js +0 -1
- package/lib/components/NavDrawerFooter/useNavDrawerFooterStyles.styles.raw.js.map +1 -1
- package/lib/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.js +0 -2
- package/lib/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.js.map +1 -1
- package/lib/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.raw.js +0 -1
- package/lib/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.raw.js.map +1 -1
- package/lib/components/NavItem/useNavItemStyles.styles.js +0 -2
- package/lib/components/NavItem/useNavItemStyles.styles.js.map +1 -1
- package/lib/components/NavItem/useNavItemStyles.styles.raw.js +0 -1
- package/lib/components/NavItem/useNavItemStyles.styles.raw.js.map +1 -1
- package/lib/components/NavSectionHeader/useNavSectionHeaderStyles.styles.js +0 -2
- package/lib/components/NavSectionHeader/useNavSectionHeaderStyles.styles.js.map +1 -1
- package/lib/components/NavSectionHeader/useNavSectionHeaderStyles.styles.raw.js +0 -1
- package/lib/components/NavSectionHeader/useNavSectionHeaderStyles.styles.raw.js.map +1 -1
- package/lib/components/NavSubItem/useNavSubItemStyles.styles.js +0 -2
- package/lib/components/NavSubItem/useNavSubItemStyles.styles.js.map +1 -1
- package/lib/components/NavSubItem/useNavSubItemStyles.styles.raw.js +0 -1
- package/lib/components/NavSubItem/useNavSubItemStyles.styles.raw.js.map +1 -1
- package/lib/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.js +0 -2
- package/lib/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.js.map +1 -1
- package/lib/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.raw.js +0 -1
- package/lib/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.raw.js.map +1 -1
- package/lib/components/SplitNavItem/useSplitNavItemStyles.styles.js +0 -2
- package/lib/components/SplitNavItem/useSplitNavItemStyles.styles.js.map +1 -1
- package/lib/components/SplitNavItem/useSplitNavItemStyles.styles.raw.js +0 -1
- package/lib/components/SplitNavItem/useSplitNavItemStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/AppItem/useAppItemStyles.styles.js +0 -1
- package/lib-commonjs/components/AppItem/useAppItemStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AppItem/useAppItemStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/AppItem/useAppItemStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/AppItemStatic/useAppItemStaticStyles.styles.js +0 -1
- package/lib-commonjs/components/AppItemStatic/useAppItemStaticStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AppItemStatic/useAppItemStaticStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/AppItemStatic/useAppItemStaticStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/Hamburger/useHamburgerStyles.styles.js +0 -1
- package/lib-commonjs/components/Hamburger/useHamburgerStyles.styles.js.map +1 -1
- package/lib-commonjs/components/Hamburger/useHamburgerStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/Hamburger/useHamburgerStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/Nav/useNavStyles.styles.js +0 -1
- package/lib-commonjs/components/Nav/useNavStyles.styles.js.map +1 -1
- package/lib-commonjs/components/Nav/useNavStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/Nav/useNavStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavCategoryItem/useNavCategoryItem.styles.js +0 -1
- package/lib-commonjs/components/NavCategoryItem/useNavCategoryItem.styles.js.map +1 -1
- package/lib-commonjs/components/NavCategoryItem/useNavCategoryItem.styles.raw.js +0 -1
- package/lib-commonjs/components/NavCategoryItem/useNavCategoryItem.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavDivider/useNavDividerStyles.styles.js +0 -1
- package/lib-commonjs/components/NavDivider/useNavDividerStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavDivider/useNavDividerStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavDivider/useNavDividerStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavDrawer/useNavDrawerStyles.styles.js +0 -1
- package/lib-commonjs/components/NavDrawer/useNavDrawerStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavDrawer/useNavDrawerStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavDrawer/useNavDrawerStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavDrawerBody/useNavDrawerBodyStyles.styles.js +0 -1
- package/lib-commonjs/components/NavDrawerBody/useNavDrawerBodyStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavDrawerBody/useNavDrawerBodyStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavDrawerBody/useNavDrawerBodyStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavDrawerFooter/useNavDrawerFooterStyles.styles.js +0 -1
- package/lib-commonjs/components/NavDrawerFooter/useNavDrawerFooterStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavDrawerFooter/useNavDrawerFooterStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavDrawerFooter/useNavDrawerFooterStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.js +0 -1
- package/lib-commonjs/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavItem/useNavItemStyles.styles.js +0 -1
- package/lib-commonjs/components/NavItem/useNavItemStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavItem/useNavItemStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavItem/useNavItemStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavSectionHeader/useNavSectionHeaderStyles.styles.js +0 -1
- package/lib-commonjs/components/NavSectionHeader/useNavSectionHeaderStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavSectionHeader/useNavSectionHeaderStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavSectionHeader/useNavSectionHeaderStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavSubItem/useNavSubItemStyles.styles.js +0 -1
- package/lib-commonjs/components/NavSubItem/useNavSubItemStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavSubItem/useNavSubItemStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavSubItem/useNavSubItemStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.js +0 -1
- package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.js.map +1 -1
- package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/NavSubItemGroup/useNavSubItemGroupStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/SplitNavItem/useSplitNavItemStyles.styles.js +0 -1
- package/lib-commonjs/components/SplitNavItem/useSplitNavItemStyles.styles.js.map +1 -1
- package/lib-commonjs/components/SplitNavItem/useSplitNavItemStyles.styles.raw.js +0 -1
- package/lib-commonjs/components/SplitNavItem/useSplitNavItemStyles.styles.raw.js.map +1 -1
- package/package.json +12 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useDrawerHeaderStyles_unstable } from '@fluentui/react-drawer';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavDrawerHeaderSlots, NavDrawerHeaderState } from './NavDrawerHeader.types';\n\nexport const navDrawerHeaderClassNames: SlotClassNames<NavDrawerHeaderSlots> = {\n root: 'fui-NavDrawerHeader',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n margin: 'unset',\n paddingInlineStart: '14px',\n paddingBlock: '5px',\n },\n});\n\n/**\n * Apply styling to the NavDrawerHeader slots based on the state\n */\nexport const useNavDrawerHeaderStyles_unstable = (state: NavDrawerHeaderState): NavDrawerHeaderState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useDrawerHeaderStyles_unstable } from '@fluentui/react-drawer';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavDrawerHeaderSlots, NavDrawerHeaderState } from './NavDrawerHeader.types';\n\nexport const navDrawerHeaderClassNames: SlotClassNames<NavDrawerHeaderSlots> = {\n root: 'fui-NavDrawerHeader',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n margin: 'unset',\n paddingInlineStart: '14px',\n paddingBlock: '5px',\n },\n});\n\n/**\n * Apply styling to the NavDrawerHeader slots based on the state\n */\nexport const useNavDrawerHeaderStyles_unstable = (state: NavDrawerHeaderState): NavDrawerHeaderState => {\n useDrawerHeaderStyles_unstable(state);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navDrawerHeaderClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useDrawerHeaderStyles_unstable","navDrawerHeaderClassNames","root","useStyles","margin","paddingInlineStart","paddingBlock","useNavDrawerHeaderStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,8BAA8B,QAAQ,yBAAyB;AAKxE,OAAO,MAAMC,4BAAkE;IAC7EC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYL,WAAW;IAC3BI,MAAM;QACJE,QAAQ;QACRC,oBAAoB;QACpBC,cAAc;IAChB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,oCAAoC,CAACC;IAChDR,+BAA+BQ;IAC/B,MAAMC,SAASN;IACf,oDAAoD;IACpDK,MAAMN,IAAI,CAACQ,SAAS,GAAGX,aAAaE,0BAA0BC,IAAI,EAAEO,OAAOP,IAAI,EAAEM,MAAMN,IAAI,CAACQ,SAAS;IAErG,OAAOF;AACT,EAAE"}
|
|
@@ -10,8 +10,6 @@ export const navItemClassNames = {
|
|
|
10
10
|
* Apply styling to the NavItem slots based on the state
|
|
11
11
|
*/
|
|
12
12
|
export const useNavItemStyles_unstable = state => {
|
|
13
|
-
'use no memo';
|
|
14
|
-
|
|
15
13
|
const rootDefaultClassName = useRootDefaultClassName();
|
|
16
14
|
const smallStyles = useSmallStyles();
|
|
17
15
|
const contentStyles = useContentStyles();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeClasses","useContentStyles","useIconStyles","useIndicatorStyles","useRootDefaultClassName","useSmallStyles","navItemClassNames","root","icon","useNavItemStyles_unstable","state","rootDefaultClassName","smallStyles","contentStyles","indicatorStyles","iconStyles","selected","density","className","base"],"sources":["useNavItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useContentStyles, useIconStyles, useIndicatorStyles, useRootDefaultClassName, useSmallStyles } from '../sharedNavStyles.styles';\nexport const navItemClassNames = {\n root: 'fui-NavItem',\n icon: 'fui-NavItem__icon'\n};\n/**\n * Apply styling to the NavItem slots based on the state\n */ export const useNavItemStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"names":["mergeClasses","useContentStyles","useIconStyles","useIndicatorStyles","useRootDefaultClassName","useSmallStyles","navItemClassNames","root","icon","useNavItemStyles_unstable","state","rootDefaultClassName","smallStyles","contentStyles","indicatorStyles","iconStyles","selected","density","className","base"],"sources":["useNavItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useContentStyles, useIconStyles, useIndicatorStyles, useRootDefaultClassName, useSmallStyles } from '../sharedNavStyles.styles';\nexport const navItemClassNames = {\n root: 'fui-NavItem',\n icon: 'fui-NavItem__icon'\n};\n/**\n * Apply styling to the NavItem slots based on the state\n */ export const useNavItemStyles_unstable = (state)=>{\n const rootDefaultClassName = useRootDefaultClassName();\n const smallStyles = useSmallStyles();\n const contentStyles = useContentStyles();\n const indicatorStyles = useIndicatorStyles();\n const iconStyles = useIconStyles();\n const { selected, density } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navItemClassNames.root, rootDefaultClassName, density === 'small' && smallStyles.root, selected && indicatorStyles.base, selected && contentStyles.selected, state.root.className);\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(navItemClassNames.icon, iconStyles.base, selected && iconStyles.selected, state.icon.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,gBAAgB,EAAEC,aAAa,EAAEC,kBAAkB,EAAEC,uBAAuB,EAAEC,cAAc,QAAQ,2BAA2B;AACxI,OAAO,MAAMC,iBAAiB,GAAG;EAC7BC,IAAI,EAAE,aAAa;EACnBC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,OAAO,MAAMC,yBAAyB,GAAIC,KAAK,IAAG;EAClD,MAAMC,oBAAoB,GAAGP,uBAAuB,CAAC,CAAC;EACtD,MAAMQ,WAAW,GAAGP,cAAc,CAAC,CAAC;EACpC,MAAMQ,aAAa,GAAGZ,gBAAgB,CAAC,CAAC;EACxC,MAAMa,eAAe,GAAGX,kBAAkB,CAAC,CAAC;EAC5C,MAAMY,UAAU,GAAGb,aAAa,CAAC,CAAC;EAClC,MAAM;IAAEc,QAAQ;IAAEC;EAAQ,CAAC,GAAGP,KAAK;EACnC;EACAA,KAAK,CAACH,IAAI,CAACW,SAAS,GAAGlB,YAAY,CAACM,iBAAiB,CAACC,IAAI,EAAEI,oBAAoB,EAAEM,OAAO,KAAK,OAAO,IAAIL,WAAW,CAACL,IAAI,EAAES,QAAQ,IAAIF,eAAe,CAACK,IAAI,EAAEH,QAAQ,IAAIH,aAAa,CAACG,QAAQ,EAAEN,KAAK,CAACH,IAAI,CAACW,SAAS,CAAC;EACtN,IAAIR,KAAK,CAACF,IAAI,EAAE;IACZ;IACAE,KAAK,CAACF,IAAI,CAACU,SAAS,GAAGlB,YAAY,CAACM,iBAAiB,CAACE,IAAI,EAAEO,UAAU,CAACI,IAAI,EAAEH,QAAQ,IAAID,UAAU,CAACC,QAAQ,EAAEN,KAAK,CAACF,IAAI,CAACU,SAAS,CAAC;EACvI;EACA,OAAOR,KAAK;AAChB,CAAC","ignoreList":[]}
|
|
@@ -8,7 +8,6 @@ export const navItemClassNames = {
|
|
|
8
8
|
/**
|
|
9
9
|
* Apply styling to the NavItem slots based on the state
|
|
10
10
|
*/ export const useNavItemStyles_unstable = (state)=>{
|
|
11
|
-
'use no memo';
|
|
12
11
|
const rootDefaultClassName = useRootDefaultClassName();
|
|
13
12
|
const smallStyles = useSmallStyles();
|
|
14
13
|
const contentStyles = useContentStyles();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/NavItem/useNavItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport {\n useContentStyles,\n useIconStyles,\n useIndicatorStyles,\n useRootDefaultClassName,\n useSmallStyles,\n} from '../sharedNavStyles.styles';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavItemSlots, NavItemState } from './NavItem.types';\nexport const navItemClassNames: SlotClassNames<NavItemSlots> = {\n root: 'fui-NavItem',\n icon: 'fui-NavItem__icon',\n};\n\n/**\n * Apply styling to the NavItem slots based on the state\n */\nexport const useNavItemStyles_unstable = (state: NavItemState): NavItemState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/NavItem/useNavItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport {\n useContentStyles,\n useIconStyles,\n useIndicatorStyles,\n useRootDefaultClassName,\n useSmallStyles,\n} from '../sharedNavStyles.styles';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavItemSlots, NavItemState } from './NavItem.types';\nexport const navItemClassNames: SlotClassNames<NavItemSlots> = {\n root: 'fui-NavItem',\n icon: 'fui-NavItem__icon',\n};\n\n/**\n * Apply styling to the NavItem slots based on the state\n */\nexport const useNavItemStyles_unstable = (state: NavItemState): NavItemState => {\n const rootDefaultClassName = useRootDefaultClassName();\n const smallStyles = useSmallStyles();\n const contentStyles = useContentStyles();\n const indicatorStyles = useIndicatorStyles();\n const iconStyles = useIconStyles();\n\n const { selected, density } = state;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n navItemClassNames.root,\n rootDefaultClassName,\n density === 'small' && smallStyles.root,\n selected && indicatorStyles.base,\n selected && contentStyles.selected,\n state.root.className,\n );\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(\n navItemClassNames.icon,\n iconStyles.base,\n selected && iconStyles.selected,\n state.icon.className,\n );\n }\n\n return state;\n};\n"],"names":["mergeClasses","useContentStyles","useIconStyles","useIndicatorStyles","useRootDefaultClassName","useSmallStyles","navItemClassNames","root","icon","useNavItemStyles_unstable","state","rootDefaultClassName","smallStyles","contentStyles","indicatorStyles","iconStyles","selected","density","className","base"],"mappings":"AAAA;AAEA,SAASA,YAAY,QAAQ,iBAAiB;AAC9C,SACEC,gBAAgB,EAChBC,aAAa,EACbC,kBAAkB,EAClBC,uBAAuB,EACvBC,cAAc,QACT,4BAA4B;AAInC,OAAO,MAAMC,oBAAkD;IAC7DC,MAAM;IACNC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC;IACxC,MAAMC,uBAAuBP;IAC7B,MAAMQ,cAAcP;IACpB,MAAMQ,gBAAgBZ;IACtB,MAAMa,kBAAkBX;IACxB,MAAMY,aAAab;IAEnB,MAAM,EAAEc,QAAQ,EAAEC,OAAO,EAAE,GAAGP;IAE9B,oDAAoD;IACpDA,MAAMH,IAAI,CAACW,SAAS,GAAGlB,aACrBM,kBAAkBC,IAAI,EACtBI,sBACAM,YAAY,WAAWL,YAAYL,IAAI,EACvCS,YAAYF,gBAAgBK,IAAI,EAChCH,YAAYH,cAAcG,QAAQ,EAClCN,MAAMH,IAAI,CAACW,SAAS;IAGtB,IAAIR,MAAMF,IAAI,EAAE;QACd,oDAAoD;QACpDE,MAAMF,IAAI,CAACU,SAAS,GAAGlB,aACrBM,kBAAkBE,IAAI,EACtBO,WAAWI,IAAI,EACfH,YAAYD,WAAWC,QAAQ,EAC/BN,MAAMF,IAAI,CAACU,SAAS;IAExB;IAEA,OAAOR;AACT,EAAE"}
|
|
@@ -28,8 +28,6 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
28
28
|
* Apply styling to the NavSectionHeader slots based on the state
|
|
29
29
|
*/
|
|
30
30
|
export const useNavSectionHeaderStyles_unstable = state => {
|
|
31
|
-
'use no memo';
|
|
32
|
-
|
|
33
31
|
const styles = useStyles();
|
|
34
32
|
// eslint-disable-next-line react-hooks/immutability
|
|
35
33
|
state.root.className = mergeClasses(navSectionHeaderClassNames.root, styles.root, state.root.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__styles","mergeClasses","typographyStyles","navSectionHeaderClassNames","root","useStyles","Jyy4pa","Bo78w4l","Cgygva","yil37a","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","d","p","useNavSectionHeaderStyles_unstable","state","styles","className"],"sources":["useNavSectionHeaderStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const navSectionHeaderClassNames = {\n root: 'fui-NavSectionHeader'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n marginInlineStart: `10px`,\n marginBlock: '8px',\n ...typographyStyles.caption1Strong\n }\n});\n/**\n * Apply styling to the NavSectionHeader slots based on the state\n */ export const useNavSectionHeaderStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"names":["__styles","mergeClasses","typographyStyles","navSectionHeaderClassNames","root","useStyles","Jyy4pa","Bo78w4l","Cgygva","yil37a","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","d","p","useNavSectionHeaderStyles_unstable","state","styles","className"],"sources":["useNavSectionHeaderStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const navSectionHeaderClassNames = {\n root: 'fui-NavSectionHeader'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n marginInlineStart: `10px`,\n marginBlock: '8px',\n ...typographyStyles.caption1Strong\n }\n});\n/**\n * Apply styling to the NavSectionHeader slots based on the state\n */ export const useNavSectionHeaderStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navSectionHeaderClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,gBAAgB,QAAQ,uBAAuB;AACxD,OAAO,MAAMC,0BAA0B,GAAG;EACtCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGL,QAAA;EAAAI,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAMrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,kCAAkC,GAAIC,KAAK,IAAG;EAC3D,MAAMC,MAAM,GAAGb,SAAS,CAAC,CAAC;EAC1B;EACAY,KAAK,CAACb,IAAI,CAACe,SAAS,GAAGlB,YAAY,CAACE,0BAA0B,CAACC,IAAI,EAAEc,MAAM,CAACd,IAAI,EAAEa,KAAK,CAACb,IAAI,CAACe,SAAS,CAAC;EACvG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
|
|
@@ -16,7 +16,6 @@ export const navSectionHeaderClassNames = {
|
|
|
16
16
|
/**
|
|
17
17
|
* Apply styling to the NavSectionHeader slots based on the state
|
|
18
18
|
*/ export const useNavSectionHeaderStyles_unstable = (state)=>{
|
|
19
|
-
'use no memo';
|
|
20
19
|
const styles = useStyles();
|
|
21
20
|
// eslint-disable-next-line react-hooks/immutability
|
|
22
21
|
state.root.className = mergeClasses(navSectionHeaderClassNames.root, styles.root, state.root.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/NavSectionHeader/useNavSectionHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavSectionHeaderSlots, NavSectionHeaderState } from './NavSectionHeader.types';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const navSectionHeaderClassNames: SlotClassNames<NavSectionHeaderSlots> = {\n root: 'fui-NavSectionHeader',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n marginInlineStart: `10px`,\n marginBlock: '8px',\n ...typographyStyles.caption1Strong,\n },\n});\n\n/**\n * Apply styling to the NavSectionHeader slots based on the state\n */\nexport const useNavSectionHeaderStyles_unstable = (state: NavSectionHeaderState): NavSectionHeaderState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/NavSectionHeader/useNavSectionHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavSectionHeaderSlots, NavSectionHeaderState } from './NavSectionHeader.types';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const navSectionHeaderClassNames: SlotClassNames<NavSectionHeaderSlots> = {\n root: 'fui-NavSectionHeader',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n marginInlineStart: `10px`,\n marginBlock: '8px',\n ...typographyStyles.caption1Strong,\n },\n});\n\n/**\n * Apply styling to the NavSectionHeader slots based on the state\n */\nexport const useNavSectionHeaderStyles_unstable = (state: NavSectionHeaderState): NavSectionHeaderState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navSectionHeaderClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","typographyStyles","navSectionHeaderClassNames","root","useStyles","marginInlineStart","marginBlock","caption1Strong","useNavSectionHeaderStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,SAASC,gBAAgB,QAAQ,wBAAwB;AAEzD,OAAO,MAAMC,6BAAoE;IAC/EC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYL,WAAW;IAC3BI,MAAM;QACJE,mBAAmB,CAAC,IAAI,CAAC;QACzBC,aAAa;QACb,GAAGL,iBAAiBM,cAAc;IACpC;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,qCAAqC,CAACC;IACjD,MAAMC,SAASN;IACf,oDAAoD;IACpDK,MAAMN,IAAI,CAACQ,SAAS,GAAGX,aAAaE,2BAA2BC,IAAI,EAAEO,OAAOP,IAAI,EAAEM,MAAMN,IAAI,CAACQ,SAAS;IAEtG,OAAOF;AACT,EAAE"}
|
|
@@ -25,8 +25,6 @@ const useNavSubItemSpecificStyles = /*#__PURE__*/__styles({
|
|
|
25
25
|
* Apply styling to the NavSubItem slots based on the state
|
|
26
26
|
*/
|
|
27
27
|
export const useNavSubItemStyles_unstable = state => {
|
|
28
|
-
'use no memo';
|
|
29
|
-
|
|
30
28
|
const rootDefaultClassName = useRootDefaultClassName();
|
|
31
29
|
const smallStyles = useSmallStyles();
|
|
32
30
|
const contentStyles = useContentStyles();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__styles","mergeClasses","navItemTokens","useContentStyles","useIndicatorStyles","useRootDefaultClassName","useSmallStyles","navSubItemClassNames","root","useNavSubItemSpecificStyles","base","B1hrpyx","smallBase","selectedIndicator","rjyhj6","d","useNavSubItemStyles_unstable","state","rootDefaultClassName","smallStyles","contentStyles","indicatorStyles","navSubItemSpecificStyles","selected","density","isSmallDensity","className"],"sources":["useNavSubItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { navItemTokens, useContentStyles, useIndicatorStyles, useRootDefaultClassName, useSmallStyles } from '../sharedNavStyles.styles';\nexport const navSubItemClassNames = {\n root: 'fui-NavSubItem'\n};\n/**\n * Styles for the content slot (children)\n */ const useNavSubItemSpecificStyles = makeStyles({\n base: {\n paddingInlineStart: '46px'\n },\n smallBase: {\n paddingInlineStart: '40px'\n },\n selectedIndicator: {\n '::after': {\n marginInlineStart: `-${navItemTokens.indicatorOffset + 36}px`\n }\n }\n});\n/**\n * Apply styling to the NavSubItem slots based on the state\n */ export const useNavSubItemStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"names":["__styles","mergeClasses","navItemTokens","useContentStyles","useIndicatorStyles","useRootDefaultClassName","useSmallStyles","navSubItemClassNames","root","useNavSubItemSpecificStyles","base","B1hrpyx","smallBase","selectedIndicator","rjyhj6","d","useNavSubItemStyles_unstable","state","rootDefaultClassName","smallStyles","contentStyles","indicatorStyles","navSubItemSpecificStyles","selected","density","isSmallDensity","className"],"sources":["useNavSubItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { navItemTokens, useContentStyles, useIndicatorStyles, useRootDefaultClassName, useSmallStyles } from '../sharedNavStyles.styles';\nexport const navSubItemClassNames = {\n root: 'fui-NavSubItem'\n};\n/**\n * Styles for the content slot (children)\n */ const useNavSubItemSpecificStyles = makeStyles({\n base: {\n paddingInlineStart: '46px'\n },\n smallBase: {\n paddingInlineStart: '40px'\n },\n selectedIndicator: {\n '::after': {\n marginInlineStart: `-${navItemTokens.indicatorOffset + 36}px`\n }\n }\n});\n/**\n * Apply styling to the NavSubItem slots based on the state\n */ export const useNavSubItemStyles_unstable = (state)=>{\n const rootDefaultClassName = useRootDefaultClassName();\n const smallStyles = useSmallStyles();\n const contentStyles = useContentStyles();\n const indicatorStyles = useIndicatorStyles();\n const navSubItemSpecificStyles = useNavSubItemSpecificStyles();\n const { selected, density } = state;\n const isSmallDensity = density === 'small';\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navSubItemClassNames.root, rootDefaultClassName, isSmallDensity && smallStyles.root, isSmallDensity && navSubItemSpecificStyles.smallBase, navSubItemSpecificStyles.base, selected && indicatorStyles.base, selected && contentStyles.selected, selected && navSubItemSpecificStyles.selectedIndicator, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,aAAa,EAAEC,gBAAgB,EAAEC,kBAAkB,EAAEC,uBAAuB,EAAEC,cAAc,QAAQ,2BAA2B;AACxI,OAAO,MAAMC,oBAAoB,GAAG;EAChCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,2BAA2B,gBAAGT,QAAA;EAAAU,IAAA;IAAAC,OAAA;EAAA;EAAAC,SAAA;IAAAD,OAAA;EAAA;EAAAE,iBAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAYvC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,4BAA4B,GAAIC,KAAK,IAAG;EACrD,MAAMC,oBAAoB,GAAGb,uBAAuB,CAAC,CAAC;EACtD,MAAMc,WAAW,GAAGb,cAAc,CAAC,CAAC;EACpC,MAAMc,aAAa,GAAGjB,gBAAgB,CAAC,CAAC;EACxC,MAAMkB,eAAe,GAAGjB,kBAAkB,CAAC,CAAC;EAC5C,MAAMkB,wBAAwB,GAAGb,2BAA2B,CAAC,CAAC;EAC9D,MAAM;IAAEc,QAAQ;IAAEC;EAAQ,CAAC,GAAGP,KAAK;EACnC,MAAMQ,cAAc,GAAGD,OAAO,KAAK,OAAO;EAC1C;EACAP,KAAK,CAACT,IAAI,CAACkB,SAAS,GAAGzB,YAAY,CAACM,oBAAoB,CAACC,IAAI,EAAEU,oBAAoB,EAAEO,cAAc,IAAIN,WAAW,CAACX,IAAI,EAAEiB,cAAc,IAAIH,wBAAwB,CAACV,SAAS,EAAEU,wBAAwB,CAACZ,IAAI,EAAEa,QAAQ,IAAIF,eAAe,CAACX,IAAI,EAAEa,QAAQ,IAAIH,aAAa,CAACG,QAAQ,EAAEA,QAAQ,IAAID,wBAAwB,CAACT,iBAAiB,EAAEI,KAAK,CAACT,IAAI,CAACkB,SAAS,CAAC;EACjW,OAAOT,KAAK;AAChB,CAAC","ignoreList":[]}
|
|
@@ -22,7 +22,6 @@ export const navSubItemClassNames = {
|
|
|
22
22
|
/**
|
|
23
23
|
* Apply styling to the NavSubItem slots based on the state
|
|
24
24
|
*/ export const useNavSubItemStyles_unstable = (state)=>{
|
|
25
|
-
'use no memo';
|
|
26
25
|
const rootDefaultClassName = useRootDefaultClassName();
|
|
27
26
|
const smallStyles = useSmallStyles();
|
|
28
27
|
const contentStyles = useContentStyles();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/NavSubItem/useNavSubItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport {\n navItemTokens,\n useContentStyles,\n useIndicatorStyles,\n useRootDefaultClassName,\n useSmallStyles,\n} from '../sharedNavStyles.styles';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavSubItemSlots, NavSubItemState } from './NavSubItem.types';\n\nexport const navSubItemClassNames: SlotClassNames<NavSubItemSlots> = {\n root: 'fui-NavSubItem',\n};\n/**\n * Styles for the content slot (children)\n */\nconst useNavSubItemSpecificStyles = makeStyles({\n base: {\n paddingInlineStart: '46px',\n },\n smallBase: {\n paddingInlineStart: '40px',\n },\n selectedIndicator: {\n '::after': {\n marginInlineStart: `-${navItemTokens.indicatorOffset + 36}px`,\n },\n },\n});\n\n/**\n * Apply styling to the NavSubItem slots based on the state\n */\nexport const useNavSubItemStyles_unstable = (state: NavSubItemState): NavSubItemState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/NavSubItem/useNavSubItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport {\n navItemTokens,\n useContentStyles,\n useIndicatorStyles,\n useRootDefaultClassName,\n useSmallStyles,\n} from '../sharedNavStyles.styles';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavSubItemSlots, NavSubItemState } from './NavSubItem.types';\n\nexport const navSubItemClassNames: SlotClassNames<NavSubItemSlots> = {\n root: 'fui-NavSubItem',\n};\n/**\n * Styles for the content slot (children)\n */\nconst useNavSubItemSpecificStyles = makeStyles({\n base: {\n paddingInlineStart: '46px',\n },\n smallBase: {\n paddingInlineStart: '40px',\n },\n selectedIndicator: {\n '::after': {\n marginInlineStart: `-${navItemTokens.indicatorOffset + 36}px`,\n },\n },\n});\n\n/**\n * Apply styling to the NavSubItem slots based on the state\n */\nexport const useNavSubItemStyles_unstable = (state: NavSubItemState): NavSubItemState => {\n const rootDefaultClassName = useRootDefaultClassName();\n const smallStyles = useSmallStyles();\n const contentStyles = useContentStyles();\n const indicatorStyles = useIndicatorStyles();\n const navSubItemSpecificStyles = useNavSubItemSpecificStyles();\n\n const { selected, density } = state;\n const isSmallDensity = density === 'small';\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n navSubItemClassNames.root,\n rootDefaultClassName,\n isSmallDensity && smallStyles.root,\n isSmallDensity && navSubItemSpecificStyles.smallBase,\n navSubItemSpecificStyles.base,\n selected && indicatorStyles.base,\n selected && contentStyles.selected,\n selected && navSubItemSpecificStyles.selectedIndicator,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","navItemTokens","useContentStyles","useIndicatorStyles","useRootDefaultClassName","useSmallStyles","navSubItemClassNames","root","useNavSubItemSpecificStyles","base","paddingInlineStart","smallBase","selectedIndicator","marginInlineStart","indicatorOffset","useNavSubItemStyles_unstable","state","rootDefaultClassName","smallStyles","contentStyles","indicatorStyles","navSubItemSpecificStyles","selected","density","isSmallDensity","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SACEC,aAAa,EACbC,gBAAgB,EAChBC,kBAAkB,EAClBC,uBAAuB,EACvBC,cAAc,QACT,4BAA4B;AAKnC,OAAO,MAAMC,uBAAwD;IACnEC,MAAM;AACR,EAAE;AACF;;CAEC,GACD,MAAMC,8BAA8BT,WAAW;IAC7CU,MAAM;QACJC,oBAAoB;IACtB;IACAC,WAAW;QACTD,oBAAoB;IACtB;IACAE,mBAAmB;QACjB,WAAW;YACTC,mBAAmB,CAAC,CAAC,EAAEZ,cAAca,eAAe,GAAG,GAAG,EAAE,CAAC;QAC/D;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,+BAA+B,CAACC;IAC3C,MAAMC,uBAAuBb;IAC7B,MAAMc,cAAcb;IACpB,MAAMc,gBAAgBjB;IACtB,MAAMkB,kBAAkBjB;IACxB,MAAMkB,2BAA2Bb;IAEjC,MAAM,EAAEc,QAAQ,EAAEC,OAAO,EAAE,GAAGP;IAC9B,MAAMQ,iBAAiBD,YAAY;IAEnC,oDAAoD;IACpDP,MAAMT,IAAI,CAACkB,SAAS,GAAGzB,aACrBM,qBAAqBC,IAAI,EACzBU,sBACAO,kBAAkBN,YAAYX,IAAI,EAClCiB,kBAAkBH,yBAAyBV,SAAS,EACpDU,yBAAyBZ,IAAI,EAC7Ba,YAAYF,gBAAgBX,IAAI,EAChCa,YAAYH,cAAcG,QAAQ,EAClCA,YAAYD,yBAAyBT,iBAAiB,EACtDI,MAAMT,IAAI,CAACkB,SAAS;IAGtB,OAAOT;AACT,EAAE"}
|
|
@@ -24,8 +24,6 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
24
24
|
* Apply styling to the NavSubItemGroup slots based on the state
|
|
25
25
|
*/
|
|
26
26
|
export const useNavSubItemGroupStyles_unstable = state => {
|
|
27
|
-
'use no memo';
|
|
28
|
-
|
|
29
27
|
const styles = useStyles();
|
|
30
28
|
// eslint-disable-next-line react-hooks/immutability
|
|
31
29
|
state.root.className = mergeClasses(navSubItemGroupClassNames.root, styles.root, state.root.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__styles","mergeClasses","navSubItemGroupClassNames","root","useStyles","Bnnss6s","Bz10aip","B68tc82","Bmxbyg5","Bpg54ce","d","p","useNavSubItemGroupStyles_unstable","state","styles","className"],"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 flexShrink: 0,\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
|
|
1
|
+
{"version":3,"names":["__styles","mergeClasses","navSubItemGroupClassNames","root","useStyles","Bnnss6s","Bz10aip","B68tc82","Bmxbyg5","Bpg54ce","d","p","useNavSubItemGroupStyles_unstable","state","styles","className"],"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 flexShrink: 0,\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 const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navSubItemGroupClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,yBAAyB,GAAG;EACrCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAMrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,iCAAiC,GAAIC,KAAK,IAAG;EAC1D,MAAMC,MAAM,GAAGV,SAAS,CAAC,CAAC;EAC1B;EACAS,KAAK,CAACV,IAAI,CAACY,SAAS,GAAGd,YAAY,CAACC,yBAAyB,CAACC,IAAI,EAAEW,MAAM,CAACX,IAAI,EAAEU,KAAK,CAACV,IAAI,CAACY,SAAS,CAAC;EACtG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
|
|
@@ -15,7 +15,6 @@ export const navSubItemGroupClassNames = {
|
|
|
15
15
|
/**
|
|
16
16
|
* Apply styling to the NavSubItemGroup slots based on the state
|
|
17
17
|
*/ export const useNavSubItemGroupStyles_unstable = (state)=>{
|
|
18
|
-
'use no memo';
|
|
19
18
|
const styles = useStyles();
|
|
20
19
|
// eslint-disable-next-line react-hooks/immutability
|
|
21
20
|
state.root.className = mergeClasses(navSubItemGroupClassNames.root, styles.root, state.root.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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 flexShrink: 0,\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
|
|
1
|
+
{"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 flexShrink: 0,\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 const styles = useStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navSubItemGroupClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","navSubItemGroupClassNames","root","useStyles","flexShrink","transform","overflow","useNavSubItemGroupStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAI1D,OAAO,MAAMC,4BAA0F;IACrGC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYJ,WAAW;IAC3BG,MAAM;QACJE,YAAY;QACZC,WAAW;QACXC,UAAU;IACZ;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,oCAAoC,CAACC;IAChD,MAAMC,SAASN;IAEf,oDAAoD;IACpDK,MAAMN,IAAI,CAACQ,SAAS,GAAGV,aAAaC,0BAA0BC,IAAI,EAAEO,OAAOP,IAAI,EAAEM,MAAMN,IAAI,CAACQ,SAAS;IAErG,OAAOF;AACT,EAAE"}
|
|
@@ -114,8 +114,6 @@ const useSplitNaveItemStyles = /*#__PURE__*/__styles({
|
|
|
114
114
|
* Apply styling to the SplitNavItem slots based on the state
|
|
115
115
|
*/
|
|
116
116
|
export const useSplitNavItemStyles_unstable = state => {
|
|
117
|
-
'use no memo';
|
|
118
|
-
|
|
119
117
|
const splitNavItemStyles = useSplitNaveItemStyles();
|
|
120
118
|
const sharedRootClassNames = useRootDefaultClassName();
|
|
121
119
|
// eslint-disable-next-line react-hooks/immutability
|
|
@@ -1 +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":["'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
|
|
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":["'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 const splitNavItemStyles = useSplitNaveItemStyles();\n const sharedRootClassNames = useRootDefaultClassName();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(splitNavItemClassNames.root, sharedRootClassNames, splitNavItemStyles.baseRoot, state.root.className);\n if (state.navItem) {\n // eslint-disable-next-line react-hooks/immutability\n state.navItem.className = mergeClasses(splitNavItemClassNames.navItem, splitNavItemStyles.baseNavItem, state.navItem.className);\n }\n if (state.actionButton) {\n // eslint-disable-next-line react-hooks/immutability\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 // eslint-disable-next-line react-hooks/immutability\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 // eslint-disable-next-line react-hooks/immutability\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":[]}
|
|
@@ -79,7 +79,6 @@ const buttonHoverStyles = {
|
|
|
79
79
|
/**
|
|
80
80
|
* Apply styling to the SplitNavItem slots based on the state
|
|
81
81
|
*/ export const useSplitNavItemStyles_unstable = (state)=>{
|
|
82
|
-
'use no memo';
|
|
83
82
|
const splitNavItemStyles = useSplitNaveItemStyles();
|
|
84
83
|
const sharedRootClassNames = useRootDefaultClassName();
|
|
85
84
|
// eslint-disable-next-line react-hooks/immutability
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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
|
|
1
|
+
{"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 const splitNavItemStyles = useSplitNaveItemStyles();\n const sharedRootClassNames = useRootDefaultClassName();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n splitNavItemClassNames.root,\n sharedRootClassNames,\n splitNavItemStyles.baseRoot,\n state.root.className,\n );\n\n if (state.navItem) {\n // eslint-disable-next-line react-hooks/immutability\n state.navItem.className = mergeClasses(\n splitNavItemClassNames.navItem,\n splitNavItemStyles.baseNavItem,\n state.navItem.className,\n );\n }\n\n if (state.actionButton) {\n // eslint-disable-next-line react-hooks/immutability\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 // eslint-disable-next-line react-hooks/immutability\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 // eslint-disable-next-line react-hooks/immutability\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":"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"}
|
|
@@ -121,7 +121,6 @@ const useAppItemStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
|
121
121
|
]
|
|
122
122
|
});
|
|
123
123
|
const useAppItemStyles_unstable = (state)=>{
|
|
124
|
-
'use no memo';
|
|
125
124
|
const rootDefaultClassName = (0, _sharedNavStylesstyles.useRootDefaultClassName)();
|
|
126
125
|
const iconStyles = (0, _sharedNavStylesstyles.useIconStyles)();
|
|
127
126
|
const appItemSpecificStyles = useAppItemStyles();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useAppItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useIconStyles, useRootDefaultClassName } from '../sharedNavStyles.styles';\nexport const appItemClassNames = {\n root: 'fui-AppItem',\n icon: 'fui-AppItem__icon'\n};\n/**\n * Styles for the root slot\n */ export const useAppItemStyles = makeStyles({\n root: {\n marginInline: '4px',\n width: 'revert',\n alignItems: 'center',\n gap: '10px',\n marginInlineStart: '-6px',\n marginInlineEnd: '0px',\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalS} ${tokens.spacingHorizontalMNudge}`,\n ...typographyStyles.subtitle2\n },\n small: {\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalS} 14px`,\n gap: '14px'\n },\n absentIconRootAdjustment: {\n paddingInlineStart: '16px'\n }\n});\n/**\n * Apply styling to the AppItem slots based on the state\n */ export const useAppItemStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"sources":["useAppItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useIconStyles, useRootDefaultClassName } from '../sharedNavStyles.styles';\nexport const appItemClassNames = {\n root: 'fui-AppItem',\n icon: 'fui-AppItem__icon'\n};\n/**\n * Styles for the root slot\n */ export const useAppItemStyles = makeStyles({\n root: {\n marginInline: '4px',\n width: 'revert',\n alignItems: 'center',\n gap: '10px',\n marginInlineStart: '-6px',\n marginInlineEnd: '0px',\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalS} ${tokens.spacingHorizontalMNudge}`,\n ...typographyStyles.subtitle2\n },\n small: {\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalS} 14px`,\n gap: '14px'\n },\n absentIconRootAdjustment: {\n paddingInlineStart: '16px'\n }\n});\n/**\n * Apply styling to the AppItem slots based on the state\n */ export const useAppItemStyles_unstable = (state)=>{\n const rootDefaultClassName = useRootDefaultClassName();\n const iconStyles = useIconStyles();\n const appItemSpecificStyles = useAppItemStyles();\n const { density, icon } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(rootDefaultClassName, appItemClassNames.root, appItemSpecificStyles.root, density === 'small' && appItemSpecificStyles.small, !icon && appItemSpecificStyles.absentIconRootAdjustment, state.root.className);\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(appItemClassNames.icon, iconStyles.base, state.icon.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","typographyStyles","useIconStyles","useRootDefaultClassName","appItemClassNames","root","icon","useAppItemStyles","Bokbzmb","Jyy4pa","B1u1w3b","a9b677","Bt984gj","i8kkvl","Belr9w4","rmohyg","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","absentIconRootAdjustment","B1hrpyx","d","p","useAppItemStyles_unstable","state","rootDefaultClassName","iconStyles","appItemSpecificStyles","density","className","base"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICM,iBAAiB;;;oBAMG;;;6BAqBS;;;;uBA9BD,gBAAgB;uCAEF,2BAA2B;AAC3E,0BAA0B;IAC7BC,IAAI,EAAE,aAAa;IACnBC,IAAI,EAAE;AACV,CAAC;AAGU,MAAMC,mBAAgB,WAAA,OAAGT,eAAA,EAAA;IAAAO,IAAA,EAAA;QAAAG,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,KAAA,EAAA;QAAAT,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAP,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAW,wBAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;KAAA;AAAA,CAkBnC,CAAC;AAGS,MAAMC,6BAA6BC,KAAK,IAAG;IAClD,MAAMC,oBAAoB,OAAG7B,8CAAuB,CAAC,CAAC;IACtD,MAAM8B,UAAU,OAAG/B,oCAAa,CAAC,CAAC;IAClC,MAAMgC,qBAAqB,GAAG3B,gBAAgB,CAAC,CAAC;IAChD,MAAM,EAAE4B,OAAO,EAAE7B,IAAAA,EAAM,GAAGyB,KAAK;IAC/B,oDAAA;IACAA,KAAK,CAAC1B,IAAI,CAAC+B,SAAS,OAAGrC,mBAAY,EAACiC,oBAAoB,EAAE5B,iBAAiB,CAACC,IAAI,EAAE6B,qBAAqB,CAAC7B,IAAI,EAAE8B,OAAO,KAAK,OAAO,IAAID,qBAAqB,CAACT,KAAK,EAAE,CAACnB,IAAI,IAAI4B,qBAAqB,CAACR,wBAAwB,EAAEK,KAAK,CAAC1B,IAAI,CAAC+B,SAAS,CAAC;IAChP,IAAIL,KAAK,CAACzB,IAAI,EAAE;QACZ,oDAAA;QACAyB,KAAK,CAACzB,IAAI,CAAC8B,SAAS,OAAGrC,mBAAY,EAACK,iBAAiB,CAACE,IAAI,EAAE2B,UAAU,CAACI,IAAI,EAAEN,KAAK,CAACzB,IAAI,CAAC8B,SAAS,CAAC;IACtG;IACA,OAAOL,KAAK;AAChB,CAAC"}
|
|
@@ -47,7 +47,6 @@ const useAppItemStyles = (0, _react.makeStyles)({
|
|
|
47
47
|
}
|
|
48
48
|
});
|
|
49
49
|
const useAppItemStyles_unstable = (state)=>{
|
|
50
|
-
'use no memo';
|
|
51
50
|
const rootDefaultClassName = (0, _sharedNavStylesstyles.useRootDefaultClassName)();
|
|
52
51
|
const iconStyles = (0, _sharedNavStylesstyles.useIconStyles)();
|
|
53
52
|
const appItemSpecificStyles = useAppItemStyles();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/AppItem/useAppItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { AppItemSlots, AppItemState } from './AppItem.types';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useIconStyles, useRootDefaultClassName } from '../sharedNavStyles.styles';\n\nexport const appItemClassNames: SlotClassNames<AppItemSlots> = {\n root: 'fui-AppItem',\n icon: 'fui-AppItem__icon',\n};\n\n/**\n * Styles for the root slot\n */\nexport const useAppItemStyles = makeStyles({\n root: {\n marginInline: '4px',\n width: 'revert',\n alignItems: 'center',\n gap: '10px',\n marginInlineStart: '-6px',\n marginInlineEnd: '0px',\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalS} ${tokens.spacingHorizontalMNudge}`,\n ...typographyStyles.subtitle2,\n },\n small: {\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalS} 14px`,\n gap: '14px',\n },\n absentIconRootAdjustment: {\n paddingInlineStart: '16px',\n },\n});\n\n/**\n * Apply styling to the AppItem slots based on the state\n */\nexport const useAppItemStyles_unstable = (state: AppItemState): AppItemState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/AppItem/useAppItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { AppItemSlots, AppItemState } from './AppItem.types';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useIconStyles, useRootDefaultClassName } from '../sharedNavStyles.styles';\n\nexport const appItemClassNames: SlotClassNames<AppItemSlots> = {\n root: 'fui-AppItem',\n icon: 'fui-AppItem__icon',\n};\n\n/**\n * Styles for the root slot\n */\nexport const useAppItemStyles = makeStyles({\n root: {\n marginInline: '4px',\n width: 'revert',\n alignItems: 'center',\n gap: '10px',\n marginInlineStart: '-6px',\n marginInlineEnd: '0px',\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalS} ${tokens.spacingHorizontalMNudge}`,\n ...typographyStyles.subtitle2,\n },\n small: {\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalS} 14px`,\n gap: '14px',\n },\n absentIconRootAdjustment: {\n paddingInlineStart: '16px',\n },\n});\n\n/**\n * Apply styling to the AppItem slots based on the state\n */\nexport const useAppItemStyles_unstable = (state: AppItemState): AppItemState => {\n const rootDefaultClassName = useRootDefaultClassName();\n const iconStyles = useIconStyles();\n const appItemSpecificStyles = useAppItemStyles();\n\n const { density, icon } = state;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n rootDefaultClassName,\n appItemClassNames.root,\n appItemSpecificStyles.root,\n density === 'small' && appItemSpecificStyles.small,\n !icon && appItemSpecificStyles.absentIconRootAdjustment,\n state.root.className,\n );\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(appItemClassNames.icon, iconStyles.base, state.icon.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","typographyStyles","useIconStyles","useRootDefaultClassName","appItemClassNames","root","icon","useAppItemStyles","marginInline","width","alignItems","gap","marginInlineStart","marginInlineEnd","padding","spacingVerticalS","spacingHorizontalS","spacingHorizontalMNudge","subtitle2","small","absentIconRootAdjustment","paddingInlineStart","useAppItemStyles_unstable","state","rootDefaultClassName","iconStyles","appItemSpecificStyles","density","className","base"],"mappings":"AAAA;;;;;;;;;;;;IAQaM,iBAAAA;;;oBAQAG;;;6BAuBAe;eAAAA;;;uBArC4B,iBAAiB;4BAGjB,wBAAwB;uCACV,4BAA4B;AAE5E,0BAAwD;IAC7DjB,MAAM;IACNC,MAAM;AACR,EAAE;AAKK,MAAMC,uBAAmBT,iBAAAA,EAAW;IACzCO,MAAM;QACJG,cAAc;QACdC,OAAO;QACPC,YAAY;QACZC,KAAK;QACLC,mBAAmB;QACnBC,iBAAiB;QACjBC,SAAS,GAAGd,kBAAAA,CAAOe,gBAAgB,CAAC,CAAC,EAAEf,kBAAAA,CAAOgB,kBAAkB,CAAC,CAAC,EAAEhB,kBAAAA,CAAOe,gBAAgB,CAAC,CAAC,EAAEf,kBAAAA,CAAOiB,uBAAuB,EAAE;QAC/H,GAAGhB,4BAAAA,CAAiBiB,SAAS;IAC/B;IACAC,OAAO;QACLL,SAAS,GAAGd,kBAAAA,CAAOe,gBAAgB,CAAC,CAAC,EAAEf,kBAAAA,CAAOgB,kBAAkB,CAAC,CAAC,EAAEhB,kBAAAA,CAAOe,gBAAgB,CAAC,KAAK,CAAC;QAClGJ,KAAK;IACP;IACAS,0BAA0B;QACxBC,oBAAoB;IACtB;AACF,GAAG;AAKI,kCAAkC,CAACE;IACxC,MAAMC,2BAAuBrB,8CAAAA;IAC7B,MAAMsB,iBAAavB,oCAAAA;IACnB,MAAMwB,wBAAwBnB;IAE9B,MAAM,EAAEoB,OAAO,EAAErB,IAAI,EAAE,GAAGiB;IAE1B,oDAAoD;IACpDA,MAAMlB,IAAI,CAACuB,SAAS,OAAG7B,mBAAAA,EACrByB,sBACApB,kBAAkBC,IAAI,EACtBqB,sBAAsBrB,IAAI,EAC1BsB,YAAY,WAAWD,sBAAsBP,KAAK,EAClD,CAACb,QAAQoB,sBAAsBN,wBAAwB,EACvDG,MAAMlB,IAAI,CAACuB,SAAS;IAGtB,IAAIL,MAAMjB,IAAI,EAAE;QACd,oDAAoD;QACpDiB,MAAMjB,IAAI,CAACsB,SAAS,OAAG7B,mBAAAA,EAAaK,kBAAkBE,IAAI,EAAEmB,WAAWI,IAAI,EAAEN,MAAMjB,IAAI,CAACsB,SAAS;IACnG;IAEA,OAAOL;AACT,EAAE"}
|
|
@@ -42,7 +42,6 @@ const useAppItemStaticStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
|
42
42
|
]
|
|
43
43
|
});
|
|
44
44
|
const useAppItemStaticStyles_unstable = (state)=>{
|
|
45
|
-
'use no memo';
|
|
46
45
|
const rootDefaultClassName = (0, _sharedNavStylesstyles.useRootDefaultClassName)();
|
|
47
46
|
const iconStyles = (0, _sharedNavStylesstyles.useIconStyles)();
|
|
48
47
|
const appItemSpecificStyles = (0, _useAppItemStylesstyles.useAppItemStyles)();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useAppItemStaticStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useAppItemStyles } from '../AppItem/useAppItemStyles.styles';\nimport { useIconStyles, useRootDefaultClassName } from '../sharedNavStyles.styles';\nexport const appItemStaticClassNames = {\n root: 'fui-AppItemStatic',\n icon: 'fui-AppItemStatic__icon'\n};\nconst useAppItemStaticStyles = makeStyles({\n root: {\n cursor: 'default',\n ':hover': {\n backgroundColor: 'unset'\n },\n ':active': {\n backgroundColor: 'unset'\n }\n }\n});\n/**\n * Apply styling to the AppItemStatic slots based on the state\n */ export const useAppItemStaticStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"sources":["useAppItemStaticStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useAppItemStyles } from '../AppItem/useAppItemStyles.styles';\nimport { useIconStyles, useRootDefaultClassName } from '../sharedNavStyles.styles';\nexport const appItemStaticClassNames = {\n root: 'fui-AppItemStatic',\n icon: 'fui-AppItemStatic__icon'\n};\nconst useAppItemStaticStyles = makeStyles({\n root: {\n cursor: 'default',\n ':hover': {\n backgroundColor: 'unset'\n },\n ':active': {\n backgroundColor: 'unset'\n }\n }\n});\n/**\n * Apply styling to the AppItemStatic slots based on the state\n */ export const useAppItemStaticStyles_unstable = (state)=>{\n const rootDefaultClassName = useRootDefaultClassName();\n const iconStyles = useIconStyles();\n const appItemSpecificStyles = useAppItemStyles();\n const appItemStaticStyles = useAppItemStaticStyles();\n const { density, icon } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(rootDefaultClassName, appItemStaticClassNames.root, appItemSpecificStyles.root, appItemStaticStyles.root, density === 'small' && appItemSpecificStyles.small, !icon && appItemSpecificStyles.absentIconRootAdjustment, state.root.className);\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(appItemStaticClassNames.icon, iconStyles.base, state.icon.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","useAppItemStyles","useIconStyles","useRootDefaultClassName","appItemStaticClassNames","root","icon","useAppItemStaticStyles","Bceei9c","Jwef8y","ecr2s2","d","h","a","useAppItemStaticStyles_unstable","state","rootDefaultClassName","iconStyles","appItemSpecificStyles","appItemStaticStyles","density","className","small","absentIconRootAdjustment","base"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,uBAAuB;;;IAiBnBU,+BAA+B;;;;uBApBP,gBAAgB;wCACxB,oCAAoC;uCACd,2BAA2B;AAC3E,gCAAgC;IACnCT,IAAI,EAAE,mBAAmB;IACzBC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,sBAAsB,GAAA,WAAA,OAAGR,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAG,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAU9B,CAAC;AAGS,yCAAyCE,KAAK,IAAG;IACxD,MAAMC,oBAAoB,OAAGb,8CAAuB,CAAC,CAAC;IACtD,MAAMc,UAAU,GAAGf,wCAAa,CAAC,CAAC;IAClC,MAAMgB,qBAAqB,OAAGjB,wCAAgB,CAAC,CAAC;IAChD,MAAMkB,mBAAmB,GAAGZ,sBAAsB,CAAC,CAAC;IACpD,MAAM,EAAEa,OAAO,EAAEd,IAAAA,EAAM,GAAGS,KAAK;IAC/B,oDAAA;IACAA,KAAK,CAACV,IAAI,CAACgB,SAAS,OAAGrB,mBAAY,EAACgB,oBAAoB,EAAEZ,uBAAuB,CAACC,IAAI,EAAEa,qBAAqB,CAACb,IAAI,EAAEc,mBAAmB,CAACd,IAAI,EAAEe,OAAO,KAAK,OAAO,IAAIF,qBAAqB,CAACI,KAAK,EAAE,CAAChB,IAAI,IAAIY,qBAAqB,CAACK,wBAAwB,EAAER,KAAK,CAACV,IAAI,CAACgB,SAAS,CAAC;IAChR,IAAIN,KAAK,CAACT,IAAI,EAAE;QACZ,oDAAA;QACAS,KAAK,CAACT,IAAI,CAACe,SAAS,OAAGrB,mBAAY,EAACI,uBAAuB,CAACE,IAAI,EAAEW,UAAU,CAACO,IAAI,EAAET,KAAK,CAACT,IAAI,CAACe,SAAS,CAAC;IAC5G;IACA,OAAON,KAAK;AAChB,CAAC"}
|
|
@@ -36,7 +36,6 @@ const useAppItemStaticStyles = (0, _react.makeStyles)({
|
|
|
36
36
|
}
|
|
37
37
|
});
|
|
38
38
|
const useAppItemStaticStyles_unstable = (state)=>{
|
|
39
|
-
'use no memo';
|
|
40
39
|
const rootDefaultClassName = (0, _sharedNavStylesstyles.useRootDefaultClassName)();
|
|
41
40
|
const iconStyles = (0, _sharedNavStylesstyles.useIconStyles)();
|
|
42
41
|
const appItemSpecificStyles = (0, _useAppItemStylesstyles.useAppItemStyles)();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/AppItemStatic/useAppItemStaticStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { AppItemStaticSlots, AppItemStaticState } from './AppItemStatic.types';\nimport { useAppItemStyles } from '../AppItem/useAppItemStyles.styles';\nimport { useIconStyles, useRootDefaultClassName } from '../sharedNavStyles.styles';\n\nexport const appItemStaticClassNames: SlotClassNames<AppItemStaticSlots> = {\n root: 'fui-AppItemStatic',\n icon: 'fui-AppItemStatic__icon',\n};\n\nconst useAppItemStaticStyles = makeStyles({\n root: {\n cursor: 'default',\n ':hover': {\n backgroundColor: 'unset',\n },\n ':active': {\n backgroundColor: 'unset',\n },\n },\n});\n\n/**\n * Apply styling to the AppItemStatic slots based on the state\n */\nexport const useAppItemStaticStyles_unstable = (state: AppItemStaticState): AppItemStaticState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/AppItemStatic/useAppItemStaticStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { AppItemStaticSlots, AppItemStaticState } from './AppItemStatic.types';\nimport { useAppItemStyles } from '../AppItem/useAppItemStyles.styles';\nimport { useIconStyles, useRootDefaultClassName } from '../sharedNavStyles.styles';\n\nexport const appItemStaticClassNames: SlotClassNames<AppItemStaticSlots> = {\n root: 'fui-AppItemStatic',\n icon: 'fui-AppItemStatic__icon',\n};\n\nconst useAppItemStaticStyles = makeStyles({\n root: {\n cursor: 'default',\n ':hover': {\n backgroundColor: 'unset',\n },\n ':active': {\n backgroundColor: 'unset',\n },\n },\n});\n\n/**\n * Apply styling to the AppItemStatic slots based on the state\n */\nexport const useAppItemStaticStyles_unstable = (state: AppItemStaticState): AppItemStaticState => {\n const rootDefaultClassName = useRootDefaultClassName();\n const iconStyles = useIconStyles();\n const appItemSpecificStyles = useAppItemStyles();\n const appItemStaticStyles = useAppItemStaticStyles();\n\n const { density, icon } = state;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n rootDefaultClassName,\n appItemStaticClassNames.root,\n appItemSpecificStyles.root,\n appItemStaticStyles.root,\n density === 'small' && appItemSpecificStyles.small,\n !icon && appItemSpecificStyles.absentIconRootAdjustment,\n state.root.className,\n );\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(appItemStaticClassNames.icon, iconStyles.base, state.icon.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useAppItemStyles","useIconStyles","useRootDefaultClassName","appItemStaticClassNames","root","icon","useAppItemStaticStyles","cursor","backgroundColor","useAppItemStaticStyles_unstable","state","rootDefaultClassName","iconStyles","appItemSpecificStyles","appItemStaticStyles","density","className","small","absentIconRootAdjustment","base"],"mappings":"AAAA;;;;;;;;;;;;IAQaK,uBAAAA;;;mCAoBAM;eAAAA;;;uBA1B4B,iBAAiB;wCAGzB,qCAAqC;uCACf,4BAA4B;AAE5E,gCAAoE;IACzEL,MAAM;IACNC,MAAM;AACR,EAAE;AAEF,MAAMC,yBAAyBR,qBAAAA,EAAW;IACxCM,MAAM;QACJG,QAAQ;QACR,UAAU;YACRC,iBAAiB;QACnB;QACA,WAAW;YACTA,iBAAiB;QACnB;IACF;AACF;AAKO,wCAAwC,CAACE;IAC9C,MAAMC,2BAAuBT,8CAAAA;IAC7B,MAAMU,iBAAaX,oCAAAA;IACnB,MAAMY,4BAAwBb,wCAAAA;IAC9B,MAAMc,sBAAsBR;IAE5B,MAAM,EAAES,OAAO,EAAEV,IAAI,EAAE,GAAGK;IAE1B,oDAAoD;IACpDA,MAAMN,IAAI,CAACY,SAAS,OAAGjB,mBAAAA,EACrBY,sBACAR,wBAAwBC,IAAI,EAC5BS,sBAAsBT,IAAI,EAC1BU,oBAAoBV,IAAI,EACxBW,YAAY,WAAWF,sBAAsBI,KAAK,EAClD,CAACZ,QAAQQ,sBAAsBK,wBAAwB,EACvDR,MAAMN,IAAI,CAACY,SAAS;IAGtB,IAAIN,MAAML,IAAI,EAAE;QACd,oDAAoD;QACpDK,MAAML,IAAI,CAACW,SAAS,GAAGjB,uBAAAA,EAAaI,wBAAwBE,IAAI,EAAEO,WAAWO,IAAI,EAAET,MAAML,IAAI,CAACW,SAAS;IACzG;IAEA,OAAON;AACT,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useHamburgerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport { navItemTokens } from '../sharedNavStyles.styles';\nexport const hamburgerClassNames = {\n root: 'fui-Hamburger',\n icon: 'fui-Hamburger__icon'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n textDecorationLine: 'none',\n backgroundColor: navItemTokens.backgroundColor,\n border: 'none',\n ':hover': {\n backgroundColor: navItemTokens.backgroundColorHover\n },\n ':active': {\n backgroundColor: navItemTokens.backgroundColorPressed\n }\n }\n});\n/**\n * Apply styling to the Hamburger slots based on the state\n */ export const useHamburgerStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"sources":["useHamburgerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport { navItemTokens } from '../sharedNavStyles.styles';\nexport const hamburgerClassNames = {\n root: 'fui-Hamburger',\n icon: 'fui-Hamburger__icon'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n textDecorationLine: 'none',\n backgroundColor: navItemTokens.backgroundColor,\n border: 'none',\n ':hover': {\n backgroundColor: navItemTokens.backgroundColorHover\n },\n ':active': {\n backgroundColor: navItemTokens.backgroundColorPressed\n }\n }\n});\n/**\n * Apply styling to the Hamburger slots based on the state\n */ export const useHamburgerStyles_unstable = (state)=>{\n useButtonStyles_unstable(state);\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(hamburgerClassNames.root, styles.root, state.root.className);\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(hamburgerClassNames.icon, state.icon.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","useButtonStyles_unstable","navItemTokens","hamburgerClassNames","root","icon","useStyles","w71qe1","De3pzq","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Jwef8y","ecr2s2","d","p","h","a","useHamburgerStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICI,mBAAmB;;;IAqBf6B,2BAA2B;;;;uBAxBH,gBAAgB;6BAChB,wBAAwB;AAE1D,4BAA4B;IAC/B5B,IAAI,EAAE,eAAe;IACrBC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAK,IAAA,EAAA;QAAAG,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAYrB,CAAC;AAGS,qCAAqCE,KAAK,IAAG;QACpDhC,qCAAwB,EAACgC,KAAK,CAAC;IAC/B,MAAMC,MAAM,GAAG5B,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACA2B,KAAK,CAAC7B,IAAI,CAAC+B,SAAS,OAAGnC,mBAAY,EAACG,mBAAmB,CAACC,IAAI,EAAE8B,MAAM,CAAC9B,IAAI,EAAE6B,KAAK,CAAC7B,IAAI,CAAC+B,SAAS,CAAC;IAChG,IAAIF,KAAK,CAAC5B,IAAI,EAAE;QACZ,oDAAA;QACA4B,KAAK,CAAC5B,IAAI,CAAC8B,SAAS,OAAGnC,mBAAY,EAACG,mBAAmB,CAACE,IAAI,EAAE4B,KAAK,CAAC5B,IAAI,CAAC8B,SAAS,CAAC;IACvF;IACA,OAAOF,KAAK;AAChB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Hamburger/useHamburgerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { ButtonSlots } from '@fluentui/react-button';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { HamburgerState } from './Hamburger.types';\nimport { navItemTokens } from '../sharedNavStyles.styles';\n\nexport const hamburgerClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fui-Hamburger',\n icon: 'fui-Hamburger__icon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n textDecorationLine: 'none',\n backgroundColor: navItemTokens.backgroundColor,\n border: 'none',\n ':hover': {\n backgroundColor: navItemTokens.backgroundColorHover,\n },\n ':active': {\n backgroundColor: navItemTokens.backgroundColorPressed,\n },\n },\n});\n\n/**\n * Apply styling to the Hamburger slots based on the state\n */\nexport const useHamburgerStyles_unstable = (state: HamburgerState): HamburgerState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/Hamburger/useHamburgerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { ButtonSlots } from '@fluentui/react-button';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { HamburgerState } from './Hamburger.types';\nimport { navItemTokens } from '../sharedNavStyles.styles';\n\nexport const hamburgerClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fui-Hamburger',\n icon: 'fui-Hamburger__icon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n textDecorationLine: 'none',\n backgroundColor: navItemTokens.backgroundColor,\n border: 'none',\n ':hover': {\n backgroundColor: navItemTokens.backgroundColorHover,\n },\n ':active': {\n backgroundColor: navItemTokens.backgroundColorPressed,\n },\n },\n});\n\n/**\n * Apply styling to the Hamburger slots based on the state\n */\nexport const useHamburgerStyles_unstable = (state: HamburgerState): HamburgerState => {\n useButtonStyles_unstable(state);\n const styles = useStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(hamburgerClassNames.root, styles.root, state.root.className);\n\n if (state.icon) {\n // eslint-disable-next-line react-hooks/immutability\n state.icon.className = mergeClasses(hamburgerClassNames.icon, state.icon.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useButtonStyles_unstable","navItemTokens","hamburgerClassNames","root","icon","useStyles","textDecorationLine","backgroundColor","border","backgroundColorHover","backgroundColorPressed","useHamburgerStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IASaI,mBAAAA;;;+BAyBAS;eAAAA;;;uBAhC4B,iBAAiB;6BAEjB,yBAAyB;uCAGpC,4BAA4B;AAEnD,4BAAyD;IAC9DR,MAAM;IACNC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYP,iBAAAA,EAAW;IAC3BK,MAAM;QACJG,oBAAoB;QACpBC,iBAAiBN,oCAAAA,CAAcM,eAAe;QAC9CC,QAAQ;QACR,UAAU;YACRD,iBAAiBN,oCAAAA,CAAcQ,oBAAoB;QACrD;QACA,WAAW;YACTF,iBAAiBN,oCAAAA,CAAcS,sBAAsB;QACvD;IACF;AACF;AAKO,oCAAoC,CAACE;IAC1CZ,yCAAAA,EAAyBY;IACzB,MAAMC,SAASR;IAEf,oDAAoD;IACpDO,MAAMT,IAAI,CAACW,SAAS,OAAGf,mBAAAA,EAAaG,oBAAoBC,IAAI,EAAEU,OAAOV,IAAI,EAAES,MAAMT,IAAI,CAACW,SAAS;IAE/F,IAAIF,MAAMR,IAAI,EAAE;QACd,oDAAoD;QACpDQ,MAAMR,IAAI,CAACU,SAAS,OAAGf,mBAAAA,EAAaG,oBAAoBE,IAAI,EAAEQ,MAAMR,IAAI,CAACU,SAAS;IACpF;IAEA,OAAOF;AACT,EAAE"}
|
|
@@ -35,7 +35,6 @@ const navClassNames = {
|
|
|
35
35
|
]
|
|
36
36
|
});
|
|
37
37
|
const useNavStyles_unstable = (state)=>{
|
|
38
|
-
'use no memo';
|
|
39
38
|
const styles = useStyles();
|
|
40
39
|
// eslint-disable-next-line react-hooks/immutability
|
|
41
40
|
state.root.className = (0, _react.mergeClasses)(navClassNames.root, styles.root, state.root.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useNavStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const navClassNames = {\n root: 'fui-Nav'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column'\n }\n});\n/**\n * Apply styling to the Nav slots based on the state\n */ export const useNavStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"sources":["useNavStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const navClassNames = {\n root: 'fui-Nav'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column'\n }\n});\n/**\n * Apply styling to the Nav slots based on the state\n */ export const useNavStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navClassNames.root, styles.root, state.root.className);\n // TODO Add class names to slots, for example:\n // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","navClassNames","root","useStyles","mc9l5x","Beiy3e4","d","useNavStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,aAAa;;;IAaTM,qBAAqB;;;;uBAdG,gBAAgB;AAClD,sBAAsB;IACzBL,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;KAAA;AAAA,CAKrB,CAAC;AAGS,+BAA+BE,KAAK,IAAG;IAC9C,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAK,KAAK,CAACN,IAAI,CAACQ,SAAS,GAAGV,uBAAY,EAACC,aAAa,CAACC,IAAI,EAAEO,MAAM,CAACP,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACQ,SAAS,CAAC;IAC1F,8CAAA;IACA,gFAAA;IACA,OAAOF,KAAK;AAChB,CAAC"}
|
|
@@ -30,7 +30,6 @@ const navClassNames = {
|
|
|
30
30
|
}
|
|
31
31
|
});
|
|
32
32
|
const useNavStyles_unstable = (state)=>{
|
|
33
|
-
'use no memo';
|
|
34
33
|
const styles = useStyles();
|
|
35
34
|
// eslint-disable-next-line react-hooks/immutability
|
|
36
35
|
state.root.className = (0, _react.mergeClasses)(navClassNames.root, styles.root, state.root.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Nav/useNavStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavSlots, NavState } from './Nav.types';\n\nexport const navClassNames: SlotClassNames<NavSlots> = {\n root: 'fui-Nav',\n // TODO: add class names for all slots on NavSlots.\n // Should be of the form `<slotName>: 'fui-Nav__<slotName>`\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n },\n\n // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the Nav slots based on the state\n */\nexport const useNavStyles_unstable = (state: NavState): NavState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/Nav/useNavStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavSlots, NavState } from './Nav.types';\n\nexport const navClassNames: SlotClassNames<NavSlots> = {\n root: 'fui-Nav',\n // TODO: add class names for all slots on NavSlots.\n // Should be of the form `<slotName>: 'fui-Nav__<slotName>`\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n },\n\n // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the Nav slots based on the state\n */\nexport const useNavStyles_unstable = (state: NavState): NavState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(navClassNames.root, styles.root, state.root.className);\n\n // TODO Add class names to slots, for example:\n // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","navClassNames","root","useStyles","display","flexDirection","useNavStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAMaE,aAAAA;;;yBAqBAK;eAAAA;;;uBAzB4B,iBAAiB;AAInD,sBAAgD;IACrDJ,MAAM;AAGR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM;QACJE,SAAS;QACTC,eAAe;IACjB;AAGF;AAKO,8BAA8B,CAACE;IACpC,MAAMC,SAASL;IACf,oDAAoD;IACpDI,MAAML,IAAI,CAACO,SAAS,OAAGT,mBAAAA,EAAaC,cAAcC,IAAI,EAAEM,OAAON,IAAI,EAAEK,MAAML,IAAI,CAACO,SAAS;IAEzF,8CAA8C;IAC9C,gFAAgF;IAEhF,OAAOF;AACT,EAAE"}
|
|
@@ -59,7 +59,6 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
|
59
59
|
]
|
|
60
60
|
});
|
|
61
61
|
const useNavCategoryItemStyles_unstable = (state)=>{
|
|
62
|
-
'use no memo';
|
|
63
62
|
const rootStyles = useRootStyles();
|
|
64
63
|
const smallStyles = (0, _sharedNavStylesstyles.useSmallStyles)();
|
|
65
64
|
const defaultRootClassName = (0, _sharedNavStylesstyles.useRootDefaultClassName)();
|