@fluentui/react-tabs 9.5.1 → 9.6.0
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 +26 -2
- package/dist/index.d.ts +6 -3
- package/lib/components/Tab/Tab.types.js.map +1 -1
- package/lib/components/Tab/useTabStyles.styles.js +292 -34
- package/lib/components/Tab/useTabStyles.styles.js.map +1 -1
- package/lib/components/TabList/TabList.types.js.map +1 -1
- package/lib/components/TabList/useTabListStyles.styles.js +21 -3
- package/lib/components/TabList/useTabListStyles.styles.js.map +1 -1
- package/lib-commonjs/components/Tab/Tab.types.js.map +1 -1
- package/lib-commonjs/components/Tab/useTabStyles.styles.js +382 -50
- package/lib-commonjs/components/Tab/useTabStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TabList/TabList.types.js.map +1 -1
- package/lib-commonjs/components/TabList/useTabListStyles.styles.js +26 -3
- package/lib-commonjs/components/TabList/useTabListStyles.styles.js.map +1 -1
- package/package.json +7 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTabStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useTabAnimatedIndicatorStyles_unstable } from './useTabAnimatedIndicator.styles';\nexport const tabClassNames = {\n root: 'fui-Tab',\n icon: 'fui-Tab__icon',\n content: 'fui-Tab__content'\n};\nconst reservedSpaceClassNames = {\n content: 'fui-Tab__content--reserved-space'\n};\n// These should match the constants defined in @fluentui/react-icons\n// This package avoids taking a dependency on the icons package for only the constants.\nconst iconClassNames = {\n filled: 'fui-Icon-filled',\n regular: 'fui-Icon-regular'\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n root: {\n alignItems: 'center',\n display: 'grid',\n flexShrink: 0,\n gridAutoFlow: 'column',\n gridTemplateColumns: 'auto',\n gridTemplateRows: 'auto',\n outlineStyle: 'none',\n position: 'relative'\n },\n button: {\n alignItems: 'center',\n border: 'none',\n borderRadius: tokens.borderRadiusMedium,\n cursor: 'pointer',\n display: 'grid',\n flexShrink: 0,\n gridAutoFlow: 'column',\n gridTemplateColumns: 'auto',\n gridTemplateRows: 'auto',\n fontFamily: tokens.fontFamilyBase,\n lineHeight: tokens.lineHeightBase300,\n outlineStyle: 'none',\n position: 'relative',\n overflow: 'hidden',\n textTransform: 'none'\n },\n horizontal: {\n justifyContent: 'center'\n },\n vertical: {\n justifyContent: 'start'\n },\n smallHorizontal: {\n columnGap: tokens.spacingHorizontalXXS,\n padding: `${tokens.spacingVerticalSNudge} ${tokens.spacingHorizontalSNudge}`\n },\n smallVertical: {\n // horizontal spacing is deliberate. This is the gap between icon and content.\n columnGap: tokens.spacingHorizontalXXS,\n padding: `${tokens.spacingVerticalXXS} ${tokens.spacingHorizontalSNudge}`\n },\n mediumHorizontal: {\n columnGap: tokens.spacingHorizontalSNudge,\n padding: `${tokens.spacingVerticalM} ${tokens.spacingHorizontalMNudge}`\n },\n mediumVertical: {\n // horizontal spacing is deliberate. This is the gap between icon and content.\n columnGap: tokens.spacingHorizontalSNudge,\n padding: `${tokens.spacingVerticalSNudge} ${tokens.spacingHorizontalMNudge}`\n },\n largeHorizontal: {\n columnGap: tokens.spacingHorizontalSNudge,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalMNudge}`\n },\n largeVertical: {\n // horizontal spacing is deliberate. This is the gap between icon and content.\n columnGap: tokens.spacingHorizontalSNudge,\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalMNudge}`\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed\n },\n '& .fui-Tab__icon': {\n color: tokens.colorNeutralForeground2\n },\n ':hover .fui-Tab__icon': {\n color: tokens.colorNeutralForeground2Hover\n },\n ':active .fui-Tab__icon': {\n color: tokens.colorNeutralForeground2Pressed\n },\n '& .fui-Tab__content': {\n color: tokens.colorNeutralForeground2\n },\n ':hover .fui-Tab__content': {\n color: tokens.colorNeutralForeground2Hover\n },\n ':active .fui-Tab__content': {\n color: tokens.colorNeutralForeground2Pressed\n }\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed\n },\n '& .fui-Tab__icon': {\n color: tokens.colorNeutralForeground2\n },\n ':hover .fui-Tab__icon': {\n color: tokens.colorNeutralForeground2Hover\n },\n ':active .fui-Tab__icon': {\n color: tokens.colorNeutralForeground2Pressed\n },\n '& .fui-Tab__content': {\n color: tokens.colorNeutralForeground2\n },\n ':hover .fui-Tab__content': {\n color: tokens.colorNeutralForeground2Hover\n },\n ':active .fui-Tab__content': {\n color: tokens.colorNeutralForeground2Pressed\n }\n },\n disabled: {\n backgroundColor: tokens.colorTransparentBackground,\n '& .fui-Tab__icon': {\n color: tokens.colorNeutralForegroundDisabled\n },\n '& .fui-Tab__content': {\n color: tokens.colorNeutralForegroundDisabled\n },\n cursor: 'not-allowed'\n },\n selected: {\n '& .fui-Tab__icon': {\n color: tokens.colorCompoundBrandForeground1\n },\n ':hover .fui-Tab__icon': {\n color: tokens.colorCompoundBrandForeground1Hover\n },\n ':active .fui-Tab__icon': {\n color: tokens.colorCompoundBrandForeground1Pressed\n },\n '& .fui-Tab__content': {\n color: tokens.colorNeutralForeground1\n },\n ':hover .fui-Tab__content': {\n color: tokens.colorNeutralForeground1Hover\n },\n ':active .fui-Tab__content': {\n color: tokens.colorNeutralForeground1Pressed\n }\n }\n});\n/**\n * Focus styles for the root slot\n */ const useFocusStyles = makeStyles({\n // Tab creates a custom focus indicator because the default focus indicator\n // is applied using an ::after pseudo-element on the root. Since the selection\n // indicator uses an ::after pseudo-element on the root, there is a conflict.\n base: createCustomFocusIndicatorStyle({\n ...shorthands.borderColor('transparent'),\n outlineWidth: tokens.strokeWidthThick,\n outlineColor: 'transparent',\n outlineStyle: 'solid',\n boxShadow: `\n ${tokens.shadow4},\n 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}\n `,\n zIndex: 1\n }, {\n enableOutline: true\n })\n});\n/** Indicator styles for when pending selection */ const usePendingIndicatorStyles = makeStyles({\n base: {\n ':hover::before': {\n backgroundColor: tokens.colorNeutralStroke1Hover,\n borderRadius: tokens.borderRadiusCircular,\n content: '\"\"',\n position: 'absolute'\n },\n ':active::before': {\n backgroundColor: tokens.colorNeutralStroke1Pressed,\n borderRadius: tokens.borderRadiusCircular,\n content: '\"\"',\n position: 'absolute'\n },\n '@media (forced-colors: active)': {\n ':hover::before': {\n backgroundColor: 'Highlight'\n },\n ':active::before': {\n backgroundColor: 'Highlight'\n }\n }\n },\n disabled: {\n ':hover::before': {\n backgroundColor: tokens.colorTransparentStroke\n },\n ':active::before': {\n backgroundColor: tokens.colorTransparentStroke\n }\n },\n smallHorizontal: {\n '::before': {\n bottom: 0,\n height: tokens.strokeWidthThick,\n left: tokens.spacingHorizontalSNudge,\n right: tokens.spacingHorizontalSNudge\n }\n },\n smallVertical: {\n '::before': {\n bottom: tokens.spacingVerticalXS,\n left: 0,\n top: tokens.spacingVerticalXS,\n width: tokens.strokeWidthThicker\n }\n },\n mediumHorizontal: {\n '::before': {\n bottom: 0,\n height: tokens.strokeWidthThicker,\n left: tokens.spacingHorizontalM,\n right: tokens.spacingHorizontalM\n }\n },\n mediumVertical: {\n '::before': {\n bottom: tokens.spacingVerticalS,\n left: 0,\n top: tokens.spacingVerticalS,\n width: tokens.strokeWidthThicker\n }\n },\n largeHorizontal: {\n '::before': {\n bottom: 0,\n height: tokens.strokeWidthThicker,\n left: tokens.spacingHorizontalM,\n right: tokens.spacingHorizontalM\n }\n },\n largeVertical: {\n '::before': {\n bottom: tokens.spacingVerticalMNudge,\n left: 0,\n top: tokens.spacingVerticalMNudge,\n width: tokens.strokeWidthThicker\n }\n }\n});\nconst useActiveIndicatorStyles = makeStyles({\n base: {\n '::after': {\n backgroundColor: tokens.colorTransparentStroke,\n borderRadius: tokens.borderRadiusCircular,\n content: '\"\"',\n position: 'absolute'\n }\n },\n selected: {\n '::after': {\n backgroundColor: tokens.colorCompoundBrandStroke\n },\n ':hover::after': {\n backgroundColor: tokens.colorCompoundBrandStrokeHover\n },\n ':active::after': {\n backgroundColor: tokens.colorCompoundBrandStrokePressed\n },\n '@media (forced-colors: active)': {\n '::after': {\n backgroundColor: 'ButtonText'\n },\n ':hover::after': {\n backgroundColor: 'ButtonText'\n },\n ':active::after': {\n backgroundColor: 'ButtonText'\n }\n }\n },\n disabled: {\n '::after': {\n backgroundColor: tokens.colorNeutralForegroundDisabled\n }\n },\n smallHorizontal: {\n '::after': {\n bottom: 0,\n height: tokens.strokeWidthThick,\n left: tokens.spacingHorizontalSNudge,\n right: tokens.spacingHorizontalSNudge\n }\n },\n smallVertical: {\n '::after': {\n bottom: tokens.spacingVerticalXS,\n left: '0',\n top: tokens.spacingVerticalXS,\n width: tokens.strokeWidthThicker\n }\n },\n mediumHorizontal: {\n '::after': {\n bottom: '0',\n height: tokens.strokeWidthThicker,\n left: tokens.spacingHorizontalM,\n right: tokens.spacingHorizontalM\n }\n },\n mediumVertical: {\n '::after': {\n bottom: tokens.spacingVerticalS,\n left: 0,\n top: tokens.spacingVerticalS,\n width: tokens.strokeWidthThicker\n }\n },\n largeHorizontal: {\n '::after': {\n bottom: 0,\n height: tokens.strokeWidthThicker,\n left: tokens.spacingHorizontalM,\n right: tokens.spacingHorizontalM\n }\n },\n largeVertical: {\n '::after': {\n bottom: tokens.spacingVerticalMNudge,\n left: 0,\n top: tokens.spacingVerticalMNudge,\n width: tokens.strokeWidthThicker\n }\n }\n});\n/**\n * Styles for the icon slot.\n */ const useIconStyles = makeStyles({\n base: {\n gridColumnStart: 1,\n gridRowStart: 1,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n overflow: 'hidden',\n [`& .${iconClassNames.filled}`]: {\n display: 'none'\n },\n [`& .${iconClassNames.regular}`]: {\n display: 'inline'\n }\n },\n // per design, the small and medium font sizes are the same.\n // the size prop only affects spacing.\n small: {\n fontSize: '20px',\n height: '20px',\n width: '20px'\n },\n medium: {\n fontSize: '20px',\n height: '20px',\n width: '20px'\n },\n large: {\n fontSize: '24px',\n height: '24px',\n width: '24px'\n },\n selected: {\n [`& .${iconClassNames.filled}`]: {\n display: 'inline'\n },\n [`& .${iconClassNames.regular}`]: {\n display: 'none'\n }\n }\n});\n/**\n * Styles for the content slot (children)\n */ const useContentStyles = makeStyles({\n base: {\n ...typographyStyles.body1,\n overflow: 'hidden',\n // content padding is the same for medium & small, horizontal & vertical\n padding: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalXXS}`\n },\n selected: {\n ...typographyStyles.body1Strong\n },\n large: {\n ...typographyStyles.body2\n },\n largeSelected: {\n ...typographyStyles.subtitle2\n },\n noIconBefore: {\n gridColumnStart: 1,\n gridRowStart: 1\n },\n iconBefore: {\n gridColumnStart: 2,\n gridRowStart: 1\n },\n placeholder: {\n visibility: 'hidden'\n }\n});\n/**\n * Apply styling to the Tab slots based on the state\n */ export const useTabStyles_unstable = (state)=>{\n 'use no memo';\n useTabIndicatorStyles_unstable(state);\n useTabButtonStyles_unstable(state, state.root);\n useTabContentStyles_unstable(state);\n return state;\n};\n/**\n * Applies styles for the Tab indicator based on its current state.\n *\n * This hook is typically used internally by `useTabStyles_unstable`. You should\n * only use it directly if you're creating a custom `Tab` component.\n *\n * @param state - The `Tab` component's current state\n * @returns The state object with updated button styles\n */ export const useTabIndicatorStyles_unstable = (state)=>{\n 'use no memo';\n const rootStyles = useRootStyles();\n const pendingIndicatorStyles = usePendingIndicatorStyles();\n const activeIndicatorStyles = useActiveIndicatorStyles();\n const { disabled, selected, size, vertical } = state;\n state.root.className = mergeClasses(tabClassNames.root, rootStyles.root, // pending indicator (before pseudo element)\n pendingIndicatorStyles.base, size === 'small' && (vertical ? pendingIndicatorStyles.smallVertical : pendingIndicatorStyles.smallHorizontal), size === 'medium' && (vertical ? pendingIndicatorStyles.mediumVertical : pendingIndicatorStyles.mediumHorizontal), size === 'large' && (vertical ? pendingIndicatorStyles.largeVertical : pendingIndicatorStyles.largeHorizontal), disabled && pendingIndicatorStyles.disabled, // active indicator (after pseudo element)\n selected && activeIndicatorStyles.base, selected && !disabled && activeIndicatorStyles.selected, selected && size === 'small' && (vertical ? activeIndicatorStyles.smallVertical : activeIndicatorStyles.smallHorizontal), selected && size === 'medium' && (vertical ? activeIndicatorStyles.mediumVertical : activeIndicatorStyles.mediumHorizontal), selected && size === 'large' && (vertical ? activeIndicatorStyles.largeVertical : activeIndicatorStyles.largeHorizontal), selected && disabled && activeIndicatorStyles.disabled, state.root.className);\n useTabAnimatedIndicatorStyles_unstable(state);\n return state;\n};\n/**\n * Applies styles to the Tab button slot based on its current state.\n *\n * This hook is typically used internally by `useTabStyles_unstable`. You should\n * only use it directly if you're creating a custom `Tab` component.\n *\n * @param state - The Tab component's current state\n * @param slot - The button slot of the Tab component\n * @returns The state object with updated button styles\n */ export const useTabButtonStyles_unstable = (state, slot)=>{\n 'use no memo';\n const rootStyles = useRootStyles();\n const focusStyles = useFocusStyles();\n const { appearance, disabled, selected, size, vertical } = state;\n slot.className = mergeClasses(rootStyles.button, vertical ? rootStyles.vertical : rootStyles.horizontal, size === 'small' && (vertical ? rootStyles.smallVertical : rootStyles.smallHorizontal), size === 'medium' && (vertical ? rootStyles.mediumVertical : rootStyles.mediumHorizontal), size === 'large' && (vertical ? rootStyles.largeVertical : rootStyles.largeHorizontal), focusStyles.base, !disabled && appearance === 'subtle' && rootStyles.subtle, !disabled && appearance === 'transparent' && rootStyles.transparent, !disabled && selected && rootStyles.selected, disabled && rootStyles.disabled, slot.className);\n return state;\n};\n/**\n * Applies styles to the Tab content slot based on its current state.\n *\n * This hook is typically used internally by `useTabStyles_unstable`. You should\n * only use it directly if you're creating a custom `Tab` component.\n *\n * @param state - The Tab component's current state\n * @returns The state object with updated content styles\n */ export const useTabContentStyles_unstable = (state)=>{\n 'use no memo';\n const iconStyles = useIconStyles();\n const contentStyles = useContentStyles();\n const { selected, size } = state;\n if (state.icon) {\n state.icon.className = mergeClasses(tabClassNames.icon, iconStyles.base, iconStyles[size], selected && iconStyles.selected, state.icon.className);\n }\n // This needs to be before state.content.className is updated\n if (state.contentReservedSpace) {\n state.contentReservedSpace.className = mergeClasses(reservedSpaceClassNames.content, contentStyles.base, size === 'large' ? contentStyles.largeSelected : contentStyles.selected, state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore, contentStyles.placeholder, state.content.className);\n // FIXME: this is a deprecated API\n // should be removed in the next major version\n // eslint-disable-next-line deprecation/deprecation\n state.contentReservedSpaceClassName = state.contentReservedSpace.className;\n }\n state.content.className = mergeClasses(tabClassNames.content, contentStyles.base, size === 'large' && contentStyles.large, selected && (size === 'large' ? contentStyles.largeSelected : contentStyles.selected), state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore, state.content.className);\n return state;\n};\n"],"names":["tabClassNames","useTabButtonStyles_unstable","useTabContentStyles_unstable","useTabIndicatorStyles_unstable","useTabStyles_unstable","root","icon","content","reservedSpaceClassNames","iconClassNames","filled","regular","useRootStyles","__styles","Bt984gj","mc9l5x","Bnnss6s","Bxotwcr","Budl1dq","wkccdc","oeaueh","qhf8xq","button","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bceei9c","Bahqtrf","Bg96gwp","B68tc82","Bmxbyg5","Bpg54ce","B9bfxx9","horizontal","Brf1p80","vertical","smallHorizontal","i8kkvl","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","smallVertical","mediumHorizontal","mediumVertical","largeHorizontal","largeVertical","transparent","De3pzq","Jwef8y","ecr2s2","Bptxc3x","B076xvk","q9r9w5","cl4aha","Bk452zc","a4hkcw","subtle","disabled","selected","d","p","h","a","useFocusStyles","base","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bn4voq9","Bfpq7zp","g9k6zt","j6ew2k","Bhxq17a","usePendingIndicatorStyles","az7l2e","vqofr","Bv4n3vi","Bgqb9hq","B0uxbk8","Bf3jju6","amg5m6","zkfqfm","Bkydozb","Bka2azo","vzq8l0","csmgbd","Br4ovkg","aelrif","y36c18","B1ctymy","Bgvrrv0","ddr6p5","lawp4y","Baz25je","Fbdkly","mdwyqc","Bciustq","Ccq8qp","m","useActiveIndicatorStyles","Bjyk6c5","d9w3h3","B3778ie","B4j8arr","Bl18szs","Blrzh8d","Bsft5z2","E3zdtr","Glksuk","Blzl0y7","f7digc","Biqphg1","Bntoloa","By385i5","Dlnsje","Eqx8gd","B1piin3","bn5sak","a2br6o","useIconStyles","Br312pm","Ijaq50","D0sxk3","t6yez3","small","Be2twd7","Bqenvij","a9b677","medium","large","useContentStyles","Bhrd7zp","largeSelected","noIconBefore","iconBefore","placeholder","Bcdw1i0","state","rootStyles","pendingIndicatorStyles","activeIndicatorStyles","size","className","mergeClasses","useTabAnimatedIndicatorStyles_unstable","slot","focusStyles","appearance","iconStyles","contentStyles","contentReservedSpace","contentReservedSpaceClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["useTabStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useTabAnimatedIndicatorStyles_unstable } from './useTabAnimatedIndicator.styles';\nexport const tabClassNames = {\n root: 'fui-Tab',\n icon: 'fui-Tab__icon',\n content: 'fui-Tab__content'\n};\nconst reservedSpaceClassNames = {\n content: 'fui-Tab__content--reserved-space'\n};\n// These should match the constants defined in @fluentui/react-icons\n// This package avoids taking a dependency on the icons package for only the constants.\nconst iconClassNames = {\n filled: 'fui-Icon-filled',\n regular: 'fui-Icon-regular'\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n root: {\n alignItems: 'center',\n display: 'grid',\n flexShrink: 0,\n gridAutoFlow: 'column',\n gridTemplateColumns: 'auto',\n gridTemplateRows: 'auto',\n outlineStyle: 'none',\n position: 'relative'\n },\n button: {\n alignItems: 'center',\n border: 'none',\n borderRadius: tokens.borderRadiusMedium,\n cursor: 'pointer',\n display: 'grid',\n flexShrink: 0,\n gridAutoFlow: 'column',\n gridTemplateColumns: 'auto',\n gridTemplateRows: 'auto',\n fontFamily: tokens.fontFamilyBase,\n lineHeight: tokens.lineHeightBase300,\n outlineStyle: 'none',\n position: 'relative',\n overflow: 'hidden',\n textTransform: 'none'\n },\n horizontal: {\n justifyContent: 'center'\n },\n vertical: {\n justifyContent: 'start'\n },\n smallHorizontal: {\n columnGap: tokens.spacingHorizontalXXS,\n padding: `${tokens.spacingVerticalSNudge} ${tokens.spacingHorizontalSNudge}`\n },\n smallVertical: {\n // horizontal spacing is deliberate. This is the gap between icon and content.\n columnGap: tokens.spacingHorizontalXXS,\n padding: `${tokens.spacingVerticalXXS} ${tokens.spacingHorizontalSNudge}`\n },\n mediumHorizontal: {\n columnGap: tokens.spacingHorizontalSNudge,\n padding: `${tokens.spacingVerticalM} ${tokens.spacingHorizontalMNudge}`\n },\n mediumVertical: {\n // horizontal spacing is deliberate. This is the gap between icon and content.\n columnGap: tokens.spacingHorizontalSNudge,\n padding: `${tokens.spacingVerticalSNudge} ${tokens.spacingHorizontalMNudge}`\n },\n largeHorizontal: {\n columnGap: tokens.spacingHorizontalSNudge,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalMNudge}`\n },\n largeVertical: {\n // horizontal spacing is deliberate. This is the gap between icon and content.\n columnGap: tokens.spacingHorizontalSNudge,\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalMNudge}`\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ':enabled:hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover\n },\n ':enabled:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed\n },\n [`& .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2\n },\n [`:enabled:hover .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2Hover\n },\n [`:enabled:active .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2Pressed\n },\n [`& .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground2\n },\n [`:enabled:hover .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground2Hover\n },\n [`:enabled:active .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground2Pressed\n }\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n ':enabled:hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover\n },\n ':enabled:active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed\n },\n [`& .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2\n },\n [`:enabled:hover .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2Hover\n },\n [`:enabled:active .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2Pressed\n },\n [`& .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground2\n },\n [`:enabled:hover .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground2Hover\n },\n [`:enabled:active .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground2Pressed\n }\n },\n disabled: {\n backgroundColor: tokens.colorTransparentBackground,\n [`& .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled\n },\n [`& .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForegroundDisabled\n },\n cursor: 'not-allowed'\n },\n selected: {\n [`& .${tabClassNames.icon}`]: {\n color: tokens.colorCompoundBrandForeground1\n },\n [`:enabled:hover .${tabClassNames.icon}`]: {\n color: tokens.colorCompoundBrandForeground1Hover\n },\n [`:enabled:active .${tabClassNames.icon}`]: {\n color: tokens.colorCompoundBrandForeground1Pressed\n },\n [`& .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground1\n },\n [`:enabled:hover .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground1Hover\n },\n [`:enabled:active .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForeground1Pressed\n }\n },\n circular: {\n borderRadius: tokens.borderRadiusCircular,\n [`& .${tabClassNames.icon}`]: {\n color: 'inherit'\n },\n [`& .${tabClassNames.content}`]: {\n color: 'inherit'\n }\n },\n subtleCircular: {\n backgroundColor: tokens.colorTransparentBackground,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorTransparentStroke}`,\n color: tokens.colorNeutralForeground2,\n ':enabled:hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStroke1Hover}`,\n color: tokens.colorNeutralForeground2Hover\n },\n ':enabled:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStroke1Pressed}`,\n color: tokens.colorNeutralForeground2Pressed\n }\n },\n subtleCircularSelected: {\n backgroundColor: tokens.colorBrandBackground2,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorCompoundBrandStroke}`,\n color: tokens.colorBrandForeground2,\n ':enabled:hover': {\n backgroundColor: tokens.colorBrandBackground2Hover,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorCompoundBrandStrokeHover}`,\n color: tokens.colorBrandForeground2Hover\n },\n ':enabled:active': {\n backgroundColor: tokens.colorBrandBackground2Pressed,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorCompoundBrandStrokePressed}`,\n color: tokens.colorBrandForeground2Pressed\n }\n },\n subtleCircularDisabled: {\n backgroundColor: tokens.colorTransparentBackground,\n color: tokens.colorNeutralForegroundDisabled,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorTransparentStroke}`\n },\n subtleCircularDisabledSelected: {\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStrokeDisabled}`\n },\n filledCircular: {\n backgroundColor: tokens.colorNeutralBackground3,\n color: tokens.colorNeutralForeground2,\n ':enabled:hover': {\n backgroundColor: tokens.colorNeutralBackground3Hover,\n color: tokens.colorNeutralForeground2Hover\n },\n ':enabled:active': {\n backgroundColor: tokens.colorNeutralBackground3Pressed,\n color: tokens.colorNeutralForeground2Pressed\n }\n },\n filledCircularSelected: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand,\n ':enabled:hover': {\n backgroundColor: tokens.colorBrandBackgroundHover,\n color: tokens.colorNeutralForegroundOnBrand\n },\n ':enabled:active': {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n color: tokens.colorNeutralForegroundOnBrand\n }\n },\n filledCircularDisabled: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorTransparentStroke}`,\n color: tokens.colorNeutralForegroundDisabled\n },\n filledCircularDisabledSelected: {\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStrokeDisabled}`\n }\n});\n/**\n * Focus styles for the root slot\n */ const useFocusStyles = makeStyles({\n // Tab creates a custom focus indicator because the default focus indicator\n // is applied using an ::after pseudo-element on the root. Since the selection\n // indicator uses an ::after pseudo-element on the root, there is a conflict.\n base: createCustomFocusIndicatorStyle({\n ...shorthands.borderColor('transparent'),\n outlineWidth: tokens.strokeWidthThick,\n outlineColor: 'transparent',\n outlineStyle: 'solid',\n boxShadow: `\n ${tokens.shadow4},\n 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}\n `,\n zIndex: 1\n }, {\n enableOutline: true\n })\n});\n/** Indicator styles for when pending selection */ const usePendingIndicatorStyles = makeStyles({\n base: {\n ':hover::before': {\n backgroundColor: tokens.colorNeutralStroke1Hover,\n borderRadius: tokens.borderRadiusCircular,\n content: '\"\"',\n position: 'absolute'\n },\n ':active::before': {\n backgroundColor: tokens.colorNeutralStroke1Pressed,\n borderRadius: tokens.borderRadiusCircular,\n content: '\"\"',\n position: 'absolute'\n },\n '@media (forced-colors: active)': {\n ':hover::before': {\n backgroundColor: 'Highlight'\n },\n ':active::before': {\n backgroundColor: 'Highlight'\n }\n }\n },\n disabled: {\n ':hover::before': {\n backgroundColor: tokens.colorTransparentStroke\n },\n ':active::before': {\n backgroundColor: tokens.colorTransparentStroke\n }\n },\n smallHorizontal: {\n '::before': {\n bottom: 0,\n height: tokens.strokeWidthThick,\n left: tokens.spacingHorizontalSNudge,\n right: tokens.spacingHorizontalSNudge\n }\n },\n smallVertical: {\n '::before': {\n bottom: tokens.spacingVerticalXS,\n left: 0,\n top: tokens.spacingVerticalXS,\n width: tokens.strokeWidthThicker\n }\n },\n mediumHorizontal: {\n '::before': {\n bottom: 0,\n height: tokens.strokeWidthThicker,\n left: tokens.spacingHorizontalM,\n right: tokens.spacingHorizontalM\n }\n },\n mediumVertical: {\n '::before': {\n bottom: tokens.spacingVerticalS,\n left: 0,\n top: tokens.spacingVerticalS,\n width: tokens.strokeWidthThicker\n }\n },\n largeHorizontal: {\n '::before': {\n bottom: 0,\n height: tokens.strokeWidthThicker,\n left: tokens.spacingHorizontalM,\n right: tokens.spacingHorizontalM\n }\n },\n largeVertical: {\n '::before': {\n bottom: tokens.spacingVerticalMNudge,\n left: 0,\n top: tokens.spacingVerticalMNudge,\n width: tokens.strokeWidthThicker\n }\n }\n});\nconst useActiveIndicatorStyles = makeStyles({\n base: {\n '::after': {\n backgroundColor: tokens.colorTransparentStroke,\n borderRadius: tokens.borderRadiusCircular,\n content: '\"\"',\n position: 'absolute'\n }\n },\n selected: {\n '::after': {\n backgroundColor: tokens.colorCompoundBrandStroke\n },\n ':enabled:hover::after': {\n backgroundColor: tokens.colorCompoundBrandStrokeHover\n },\n ':enabled:active::after': {\n backgroundColor: tokens.colorCompoundBrandStrokePressed\n },\n '@media (forced-colors: active)': {\n '::after': {\n backgroundColor: 'ButtonText'\n },\n ':enabled:hover::after': {\n backgroundColor: 'ButtonText'\n },\n ':enabled:active::after': {\n backgroundColor: 'ButtonText'\n }\n }\n },\n disabled: {\n '::after': {\n backgroundColor: tokens.colorNeutralForegroundDisabled\n }\n },\n smallHorizontal: {\n '::after': {\n bottom: 0,\n height: tokens.strokeWidthThick,\n left: tokens.spacingHorizontalSNudge,\n right: tokens.spacingHorizontalSNudge\n }\n },\n smallVertical: {\n '::after': {\n bottom: tokens.spacingVerticalXS,\n left: '0',\n top: tokens.spacingVerticalXS,\n width: tokens.strokeWidthThicker\n }\n },\n mediumHorizontal: {\n '::after': {\n bottom: '0',\n height: tokens.strokeWidthThicker,\n left: tokens.spacingHorizontalM,\n right: tokens.spacingHorizontalM\n }\n },\n mediumVertical: {\n '::after': {\n bottom: tokens.spacingVerticalS,\n left: 0,\n top: tokens.spacingVerticalS,\n width: tokens.strokeWidthThicker\n }\n },\n largeHorizontal: {\n '::after': {\n bottom: 0,\n height: tokens.strokeWidthThicker,\n left: tokens.spacingHorizontalM,\n right: tokens.spacingHorizontalM\n }\n },\n largeVertical: {\n '::after': {\n bottom: tokens.spacingVerticalMNudge,\n left: 0,\n top: tokens.spacingVerticalMNudge,\n width: tokens.strokeWidthThicker\n }\n }\n});\n/**\n * Styles for the icon slot.\n */ const useIconStyles = makeStyles({\n base: {\n gridColumnStart: 1,\n gridRowStart: 1,\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n overflow: 'hidden',\n [`& .${iconClassNames.filled}`]: {\n display: 'none'\n },\n [`& .${iconClassNames.regular}`]: {\n display: 'inline'\n }\n },\n // per design, the small and medium font sizes are the same.\n // the size prop only affects spacing.\n small: {\n fontSize: '20px',\n height: '20px',\n width: '20px'\n },\n medium: {\n fontSize: '20px',\n height: '20px',\n width: '20px'\n },\n large: {\n fontSize: '24px',\n height: '24px',\n width: '24px'\n },\n selected: {\n [`& .${iconClassNames.filled}`]: {\n display: 'inline'\n },\n [`& .${iconClassNames.regular}`]: {\n display: 'none'\n }\n }\n});\n/**\n * Styles for the content slot (children)\n */ const useContentStyles = makeStyles({\n base: {\n ...typographyStyles.body1,\n overflow: 'hidden',\n // content padding is the same for medium & small, horizontal & vertical\n padding: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalXXS}`\n },\n selected: {\n ...typographyStyles.body1Strong\n },\n large: {\n ...typographyStyles.body2\n },\n largeSelected: {\n ...typographyStyles.subtitle2\n },\n noIconBefore: {\n gridColumnStart: 1,\n gridRowStart: 1\n },\n iconBefore: {\n gridColumnStart: 2,\n gridRowStart: 1\n },\n placeholder: {\n visibility: 'hidden'\n }\n});\n/**\n * Apply styling to the Tab slots based on the state\n */ export const useTabStyles_unstable = (state)=>{\n 'use no memo';\n useTabIndicatorStyles_unstable(state);\n useTabButtonStyles_unstable(state, state.root);\n useTabContentStyles_unstable(state);\n return state;\n};\n/**\n * Applies styles for the Tab indicator based on its current state.\n *\n * This hook is typically used internally by `useTabStyles_unstable`. You should\n * only use it directly if you're creating a custom `Tab` component.\n *\n * @param state - The `Tab` component's current state\n * @returns The state object with updated button styles\n */ export const useTabIndicatorStyles_unstable = (state)=>{\n 'use no memo';\n const rootStyles = useRootStyles();\n const pendingIndicatorStyles = usePendingIndicatorStyles();\n const activeIndicatorStyles = useActiveIndicatorStyles();\n const { appearance, disabled, selected, size, vertical } = state;\n const classes = [\n tabClassNames.root,\n rootStyles.root\n ];\n if (appearance !== 'subtle-circular' && appearance !== 'filled-circular') {\n classes.push(// pending indicator (before pseudo element)\n pendingIndicatorStyles.base, size === 'small' && (vertical ? pendingIndicatorStyles.smallVertical : pendingIndicatorStyles.smallHorizontal), size === 'medium' && (vertical ? pendingIndicatorStyles.mediumVertical : pendingIndicatorStyles.mediumHorizontal), size === 'large' && (vertical ? pendingIndicatorStyles.largeVertical : pendingIndicatorStyles.largeHorizontal), disabled && pendingIndicatorStyles.disabled, // active indicator (after pseudo element)\n selected && activeIndicatorStyles.base, selected && !disabled && activeIndicatorStyles.selected, selected && size === 'small' && (vertical ? activeIndicatorStyles.smallVertical : activeIndicatorStyles.smallHorizontal), selected && size === 'medium' && (vertical ? activeIndicatorStyles.mediumVertical : activeIndicatorStyles.mediumHorizontal), selected && size === 'large' && (vertical ? activeIndicatorStyles.largeVertical : activeIndicatorStyles.largeHorizontal), selected && disabled && activeIndicatorStyles.disabled);\n }\n state.root.className = mergeClasses(...classes, state.root.className);\n useTabAnimatedIndicatorStyles_unstable(state);\n return state;\n};\n/**\n * Applies styles to the Tab button slot based on its current state.\n *\n * This hook is typically used internally by `useTabStyles_unstable`. You should\n * only use it directly if you're creating a custom `Tab` component.\n *\n * @param state - The Tab component's current state\n * @param slot - The button slot of the Tab component\n * @returns The state object with updated button styles\n */ export const useTabButtonStyles_unstable = (state, slot)=>{\n 'use no memo';\n const rootStyles = useRootStyles();\n const focusStyles = useFocusStyles();\n const { appearance, disabled, selected, size, vertical } = state;\n const isSubtleCircular = appearance === 'subtle-circular';\n const isFilledCircular = appearance === 'filled-circular';\n const isCircular = isSubtleCircular || isFilledCircular;\n const circularAppearance = [\n rootStyles.circular,\n // subtle-circular appearance\n isSubtleCircular && rootStyles.subtleCircular,\n selected && isSubtleCircular && rootStyles.subtleCircularSelected,\n disabled && isSubtleCircular && rootStyles.subtleCircularDisabled,\n selected && disabled && isSubtleCircular && rootStyles.subtleCircularDisabledSelected,\n // filled-circular appearance\n isFilledCircular && rootStyles.filledCircular,\n selected && isFilledCircular && rootStyles.filledCircularSelected,\n disabled && isFilledCircular && rootStyles.filledCircularDisabled,\n selected && disabled && isFilledCircular && rootStyles.filledCircularDisabledSelected\n ];\n slot.className = mergeClasses(rootStyles.button, // orientation\n vertical ? rootStyles.vertical : rootStyles.horizontal, // size\n size === 'small' && (vertical ? rootStyles.smallVertical : rootStyles.smallHorizontal), size === 'medium' && (vertical ? rootStyles.mediumVertical : rootStyles.mediumHorizontal), size === 'large' && (vertical ? rootStyles.largeVertical : rootStyles.largeHorizontal), focusStyles.base, !disabled && appearance === 'subtle' && rootStyles.subtle, !disabled && appearance === 'transparent' && rootStyles.transparent, ...isCircular ? circularAppearance : [\n !disabled && selected && rootStyles.selected\n ], disabled && rootStyles.disabled, slot.className);\n return state;\n};\n/**\n * Applies styles to the Tab content slot based on its current state.\n *\n * This hook is typically used internally by `useTabStyles_unstable`. You should\n * only use it directly if you're creating a custom `Tab` component.\n *\n * @param state - The Tab component's current state\n * @returns The state object with updated content styles\n */ export const useTabContentStyles_unstable = (state)=>{\n 'use no memo';\n const iconStyles = useIconStyles();\n const contentStyles = useContentStyles();\n const { selected, size } = state;\n if (state.icon) {\n state.icon.className = mergeClasses(tabClassNames.icon, iconStyles.base, iconStyles[size], selected && iconStyles.selected, state.icon.className);\n }\n // This needs to be before state.content.className is updated\n if (state.contentReservedSpace) {\n state.contentReservedSpace.className = mergeClasses(reservedSpaceClassNames.content, contentStyles.base, size === 'large' ? contentStyles.largeSelected : contentStyles.selected, state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore, contentStyles.placeholder, state.content.className);\n // FIXME: this is a deprecated API\n // should be removed in the next major version\n // eslint-disable-next-line deprecation/deprecation\n state.contentReservedSpaceClassName = state.contentReservedSpace.className;\n }\n state.content.className = mergeClasses(tabClassNames.content, contentStyles.base, size === 'large' && contentStyles.large, selected && (size === 'large' ? contentStyles.largeSelected : contentStyles.selected), state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore, state.content.className);\n return state;\n};\n"],"names":["tabClassNames","useTabButtonStyles_unstable","useTabContentStyles_unstable","useTabIndicatorStyles_unstable","useTabStyles_unstable","root","icon","content","reservedSpaceClassNames","iconClassNames","filled","regular","useRootStyles","__styles","Bt984gj","mc9l5x","Bnnss6s","Bxotwcr","Budl1dq","wkccdc","oeaueh","qhf8xq","button","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bceei9c","Bahqtrf","Bg96gwp","B68tc82","Bmxbyg5","Bpg54ce","B9bfxx9","horizontal","Brf1p80","vertical","smallHorizontal","i8kkvl","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","smallVertical","mediumHorizontal","mediumVertical","largeHorizontal","largeVertical","transparent","De3pzq","B95qlz1","B7xitij","Bptxc3x","Bwqhzpy","iyk698","cl4aha","B0q3jbp","Be9ayug","subtle","disabled","selected","circular","subtleCircular","sj55zd","Eo63ln","r9osk6","Itrz8y","zeg6vx","l65xgk","Bw4olcx","Folb0i","I2h8y4","Bgxgoyi","Bvlkotb","Fwyncl","Byh5edv","Becqvjq","uumbiq","B73q3dg","Bblwbaf","B0ezav","r4wkhp","d3wsvi","Hdqn7s","zu5y1p","owqphb","g9c53k","Btmu08z","Bthxvy6","gluvuq","tb88gp","wns6jk","kdfdk4","Bbw008l","Bayi1ib","B1kkfu3","J1oqyp","kem6az","goa3yj","p743kt","subtleCircularSelected","subtleCircularDisabled","subtleCircularDisabledSelected","filledCircular","filledCircularSelected","filledCircularDisabled","filledCircularDisabledSelected","d","p","useFocusStyles","base","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bn4voq9","Bfpq7zp","g9k6zt","j6ew2k","Bhxq17a","usePendingIndicatorStyles","az7l2e","vqofr","Bv4n3vi","Bgqb9hq","B0uxbk8","Bf3jju6","amg5m6","zkfqfm","Bkydozb","Bka2azo","vzq8l0","csmgbd","Br4ovkg","aelrif","y36c18","B1ctymy","Bgvrrv0","ddr6p5","lawp4y","Baz25je","Fbdkly","mdwyqc","Bciustq","Ccq8qp","h","a","m","useActiveIndicatorStyles","Bjyk6c5","d9w3h3","B3778ie","B4j8arr","Bl18szs","Blrzh8d","Bsft5z2","E3zdtr","Bej4dhw","B7wqxwa","f7digc","Bvuzv5k","k4sdgo","By385i5","Dlnsje","Eqx8gd","B1piin3","bn5sak","a2br6o","useIconStyles","Br312pm","Ijaq50","D0sxk3","t6yez3","small","Be2twd7","Bqenvij","a9b677","medium","large","useContentStyles","Bhrd7zp","largeSelected","noIconBefore","iconBefore","placeholder","Bcdw1i0","state","rootStyles","pendingIndicatorStyles","activeIndicatorStyles","appearance","size","classes","push","className","mergeClasses","useTabAnimatedIndicatorStyles_unstable","slot","focusStyles","isSubtleCircular","isFilledCircular","isCircular","circularAppearance","iconStyles","contentStyles","contentReservedSpace","contentReservedSpaceClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["TabList.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TabValue } from '../Tab/Tab.types';\n\nexport type TabRegisterData = {\n /**\n * The value of the tab.\n */\n value: TabValue;\n\n /**\n * The reference to the tab HTML element.\n */\n ref: React.RefObject<HTMLElement>;\n};\n\nexport type RegisterTabEventHandler = (data: TabRegisterData) => void;\n\nexport type SelectTabData = {\n /**\n * The value of the selected tab.\n */\n value: TabValue;\n};\n\nexport type SelectTabEvent<E = HTMLElement> = React.MouseEvent<E> | React.KeyboardEvent<E> | React.FocusEvent<E>;\n\nexport type SelectTabEventHandler = (event: SelectTabEvent, data: SelectTabData) => void;\n\nexport type TabListSlots = {\n /**\n * The slot associated with the root element of this tab list.\n */\n root: Slot<'div'>;\n};\n\n/**\n * TabList Props\n */\nexport type TabListProps = ComponentProps<TabListSlots> & {\n /**\n * A tab list can supports 'transparent' and 'subtle' appearance.\n *- 'subtle': Minimizes emphasis to blend into the background until hovered or focused.\n *- 'transparent': No background and border styling\n * The appearance affects each of the contained tabs.\n * @default 'transparent'\n */\n appearance?: 'transparent' | 'subtle';\n\n /**\n * Tab size may change between unselected and selected states.\n * The default scenario is a selected tab has bold text.\n *\n * When true, this property requests tabs be the same size whether unselected or selected.\n * @default true\n */\n reserveSelectedTabSpace?: boolean;\n\n /**\n * The value of the tab to be selected by default.\n * Typically useful when the selectedValue is uncontrolled.\n */\n defaultSelectedValue?: TabValue;\n\n /**\n * A tab list can be set to disable interaction.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * Raised when a tab is selected.\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onTabSelect?: SelectTabEventHandler;\n\n /**\n * When true, focusing a tab will select it.\n * @default false\n */\n selectTabOnFocus?: boolean;\n\n /**\n * The value of the currently selected tab.\n */\n selectedValue?: TabValue;\n\n /**\n * A tab list can be either 'small', 'medium', or 'large' size.\n * The size affects each of the contained tabs.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * A tab list can arrange its tabs vertically.\n * @default false\n */\n vertical?: boolean;\n};\n\nexport type TabListContextValue = Pick<\n TabListProps,\n 'onTabSelect' | 'selectTabOnFocus' | 'selectedValue' | 'reserveSelectedTabSpace'\n> &\n Required<Pick<TabListProps, 'appearance' | 'disabled' | 'size' | 'vertical'>> & {\n /** A callback to allow a tab to register itself with the tab list. */\n onRegister: RegisterTabEventHandler;\n\n /** A callback to allow a tab to unregister itself with the tab list. */\n onUnregister: RegisterTabEventHandler;\n /**\n * A callback to allow a tab to select itself when pressed.\n */\n onSelect: SelectTabEventHandler;\n /**\n * Gets the registered tab data along with current and previous selected values.\n */\n getRegisteredTabs: () => {\n selectedValue?: TabValue;\n previousSelectedValue?: TabValue;\n registeredTabs: Record<string, TabRegisterData>;\n };\n };\n\n/**\n * Context values used in rendering TabList.\n */\nexport type TabListContextValues = {\n /**\n * The context of the tab list available to each tab.\n */\n tabList: TabListContextValue;\n};\n\n/**\n * State used in rendering TabList.\n */\nexport type TabListState = ComponentState<Required<TabListSlots>> & TabListContextValue;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
|
|
1
|
+
{"version":3,"sources":["TabList.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TabValue } from '../Tab/Tab.types';\n\nexport type TabRegisterData = {\n /**\n * The value of the tab.\n */\n value: TabValue;\n\n /**\n * The reference to the tab HTML element.\n */\n ref: React.RefObject<HTMLElement>;\n};\n\nexport type RegisterTabEventHandler = (data: TabRegisterData) => void;\n\nexport type SelectTabData = {\n /**\n * The value of the selected tab.\n */\n value: TabValue;\n};\n\nexport type SelectTabEvent<E = HTMLElement> = React.MouseEvent<E> | React.KeyboardEvent<E> | React.FocusEvent<E>;\n\nexport type SelectTabEventHandler = (event: SelectTabEvent, data: SelectTabData) => void;\n\nexport type TabListSlots = {\n /**\n * The slot associated with the root element of this tab list.\n */\n root: Slot<'div'>;\n};\n\n/**\n * TabList Props\n */\nexport type TabListProps = ComponentProps<TabListSlots> & {\n /**\n * A tab list can supports 'transparent' and 'subtle' appearance.\n *- 'subtle': Minimizes emphasis to blend into the background until hovered or focused.\n *- 'transparent': No background and border styling\n *- 'subtle-circular': Adds background and border styling\n *- 'filled-circular': Adds background styling\n *\n * The appearance affects each of the contained tabs.\n * @default 'transparent'\n */\n appearance?: 'transparent' | 'subtle' | 'subtle-circular' | 'filled-circular';\n\n /**\n * Tab size may change between unselected and selected states.\n * The default scenario is a selected tab has bold text.\n *\n * When true, this property requests tabs be the same size whether unselected or selected.\n * @default true\n */\n reserveSelectedTabSpace?: boolean;\n\n /**\n * The value of the tab to be selected by default.\n * Typically useful when the selectedValue is uncontrolled.\n */\n defaultSelectedValue?: TabValue;\n\n /**\n * A tab list can be set to disable interaction.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * Raised when a tab is selected.\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onTabSelect?: SelectTabEventHandler;\n\n /**\n * When true, focusing a tab will select it.\n * @default false\n */\n selectTabOnFocus?: boolean;\n\n /**\n * The value of the currently selected tab.\n */\n selectedValue?: TabValue;\n\n /**\n * A tab list can be either 'small', 'medium', or 'large' size.\n * The size affects each of the contained tabs.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * A tab list can arrange its tabs vertically.\n * @default false\n */\n vertical?: boolean;\n};\n\nexport type TabListContextValue = Pick<\n TabListProps,\n 'onTabSelect' | 'selectTabOnFocus' | 'selectedValue' | 'reserveSelectedTabSpace'\n> &\n Required<Pick<TabListProps, 'appearance' | 'disabled' | 'size' | 'vertical'>> & {\n /** A callback to allow a tab to register itself with the tab list. */\n onRegister: RegisterTabEventHandler;\n\n /** A callback to allow a tab to unregister itself with the tab list. */\n onUnregister: RegisterTabEventHandler;\n /**\n * A callback to allow a tab to select itself when pressed.\n */\n onSelect: SelectTabEventHandler;\n /**\n * Gets the registered tab data along with current and previous selected values.\n */\n getRegisteredTabs: () => {\n selectedValue?: TabValue;\n previousSelectedValue?: TabValue;\n registeredTabs: Record<string, TabRegisterData>;\n };\n };\n\n/**\n * Context values used in rendering TabList.\n */\nexport type TabListContextValues = {\n /**\n * The context of the tab list available to each tab.\n */\n tabList: TabListContextValue;\n};\n\n/**\n * State used in rendering TabList.\n */\nexport type TabListState = ComponentState<Required<TabListSlots>> & TabListContextValue;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
|
|
@@ -37,6 +37,16 @@ const tabListClassNames = {
|
|
|
37
37
|
vertical: {
|
|
38
38
|
Bt984gj: "f1q9h2pe",
|
|
39
39
|
Beiy3e4: "f1vx9l62"
|
|
40
|
+
},
|
|
41
|
+
roundedSmall: {
|
|
42
|
+
i8kkvl: 0,
|
|
43
|
+
Belr9w4: 0,
|
|
44
|
+
rmohyg: "f1eyhf9v"
|
|
45
|
+
},
|
|
46
|
+
rounded: {
|
|
47
|
+
i8kkvl: 0,
|
|
48
|
+
Belr9w4: 0,
|
|
49
|
+
rmohyg: "faqewft"
|
|
40
50
|
}
|
|
41
51
|
}, {
|
|
42
52
|
d: [
|
|
@@ -46,13 +56,26 @@ const tabListClassNames = {
|
|
|
46
56
|
".flvyvdh{flex-wrap:nowrap;}",
|
|
47
57
|
".f10pi13n{position:relative;}",
|
|
48
58
|
".f1q9h2pe{align-items:stretch;}",
|
|
49
|
-
".f1vx9l62{flex-direction:column;}"
|
|
59
|
+
".f1vx9l62{flex-direction:column;}",
|
|
60
|
+
[
|
|
61
|
+
".f1eyhf9v{gap:var(--spacingHorizontalSNudge);}",
|
|
62
|
+
{
|
|
63
|
+
p: -1
|
|
64
|
+
}
|
|
65
|
+
],
|
|
66
|
+
[
|
|
67
|
+
".faqewft{gap:var(--spacingHorizontalS);}",
|
|
68
|
+
{
|
|
69
|
+
p: -1
|
|
70
|
+
}
|
|
71
|
+
]
|
|
50
72
|
]
|
|
51
73
|
});
|
|
52
74
|
const useTabListStyles_unstable = (state)=>{
|
|
53
75
|
'use no memo';
|
|
54
|
-
const { vertical } = state;
|
|
76
|
+
const { appearance, vertical, size } = state;
|
|
55
77
|
const styles = useStyles();
|
|
56
|
-
|
|
78
|
+
const isRounded = appearance === 'subtle-circular' || appearance === 'filled-circular';
|
|
79
|
+
state.root.className = (0, _react.mergeClasses)(tabListClassNames.root, styles.root, vertical ? styles.vertical : styles.horizontal, isRounded && (size === 'small' ? styles.roundedSmall : styles.rounded), state.root.className);
|
|
57
80
|
return state;
|
|
58
81
|
}; //# sourceMappingURL=useTabListStyles.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTabListStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const tabListClassNames = {\n root: 'fui-TabList'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n flexShrink: 0,\n flexWrap: 'nowrap',\n position: 'relative'\n },\n horizontal: {\n alignItems: 'stretch',\n flexDirection: 'row'\n },\n vertical: {\n alignItems: 'stretch',\n flexDirection: 'column'\n }\n});\n/**\n * Apply styling to the TabList slots based on the state\n */ export const useTabListStyles_unstable = (state)=>{\n 'use no memo';\n const { vertical } = state;\n const styles = useStyles();\n state.root.className = mergeClasses(tabListClassNames.root, styles.root, vertical ? styles.vertical : styles.horizontal, state.root.className);\n return state;\n};\n"],"names":["tabListClassNames","useTabListStyles_unstable","root","useStyles","__styles","mc9l5x","Beiy3e4","Bnnss6s","Eh141a","qhf8xq","horizontal","Bt984gj","vertical","d","state","styles","className","mergeClasses"],"rangeMappings":"
|
|
1
|
+
{"version":3,"sources":["useTabListStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const tabListClassNames = {\n root: 'fui-TabList'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n flexShrink: 0,\n flexWrap: 'nowrap',\n position: 'relative'\n },\n horizontal: {\n alignItems: 'stretch',\n flexDirection: 'row'\n },\n vertical: {\n alignItems: 'stretch',\n flexDirection: 'column'\n },\n roundedSmall: {\n gap: tokens.spacingHorizontalSNudge\n },\n rounded: {\n gap: tokens.spacingHorizontalS\n }\n});\n/**\n * Apply styling to the TabList slots based on the state\n */ export const useTabListStyles_unstable = (state)=>{\n 'use no memo';\n const { appearance, vertical, size } = state;\n const styles = useStyles();\n const isRounded = appearance === 'subtle-circular' || appearance === 'filled-circular';\n state.root.className = mergeClasses(tabListClassNames.root, styles.root, vertical ? styles.vertical : styles.horizontal, isRounded && (size === 'small' ? styles.roundedSmall : styles.rounded), state.root.className);\n return state;\n};\n"],"names":["tabListClassNames","useTabListStyles_unstable","root","useStyles","__styles","mc9l5x","Beiy3e4","Bnnss6s","Eh141a","qhf8xq","horizontal","Bt984gj","vertical","roundedSmall","i8kkvl","Belr9w4","rmohyg","rounded","d","p","state","appearance","size","styles","isRounded","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEaA,iBAAiB;eAAjBA;;IA8BIC,yBAAyB;eAAzBA;;;uBAhCwB;AAElC,MAAMD,oBAAoB;IAC7BE,MAAM;AACV;AACA;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAF,MAAA;QAAAG,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;IAAA;IAAAC,YAAA;QAAAC,SAAA;QAAAL,SAAA;IAAA;IAAAM,UAAA;QAAAD,SAAA;QAAAL,SAAA;IAAA;IAAAO,cAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;IAAAC,SAAA;QAAAH,QAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAE,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;KAAA;AAAA;AAyBX,MAAMlB,4BAA6BmB,CAAAA;IAC1C;IACA,MAAM,EAAEC,UAAU,EAAET,QAAQ,EAAEU,IAAAA,EAAM,GAAGF;IACvC,MAAMG,SAASpB;IACf,MAAMqB,YAAYH,eAAe,qBAAqBA,eAAe;IACrED,MAAMlB,IAAI,CAACuB,SAAS,GAAGC,IAAAA,mBAAY,EAAC1B,kBAAkBE,IAAI,EAAEqB,OAAOrB,IAAI,EAAEU,WAAWW,OAAOX,QAAQ,GAAGW,OAAOb,UAAU,EAAEc,aAAcF,CAAAA,SAAS,UAAUC,OAAOV,YAAY,GAAGU,OAAON,OAAO,AAAPA,GAAUG,MAAMlB,IAAI,CAACuB,SAAS;IACrN,OAAOL;AACX"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-tabs",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.6.0",
|
|
4
4
|
"description": "Fluent UI React tabs components",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -31,12 +31,12 @@
|
|
|
31
31
|
"@fluentui/scripts-tasks": "*"
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@fluentui/react-context-selector": "^9.1.
|
|
35
|
-
"@fluentui/react-jsx-runtime": "^9.0.
|
|
36
|
-
"@fluentui/react-shared-contexts": "^9.20.
|
|
37
|
-
"@fluentui/react-tabster": "^9.22.
|
|
38
|
-
"@fluentui/react-theme": "^9.1.
|
|
39
|
-
"@fluentui/react-utilities": "^9.18.
|
|
34
|
+
"@fluentui/react-context-selector": "^9.1.68",
|
|
35
|
+
"@fluentui/react-jsx-runtime": "^9.0.45",
|
|
36
|
+
"@fluentui/react-shared-contexts": "^9.20.2",
|
|
37
|
+
"@fluentui/react-tabster": "^9.22.9",
|
|
38
|
+
"@fluentui/react-theme": "^9.1.21",
|
|
39
|
+
"@fluentui/react-utilities": "^9.18.16",
|
|
40
40
|
"@griffel/react": "^1.5.22",
|
|
41
41
|
"@swc/helpers": "^0.5.1"
|
|
42
42
|
},
|