@fluentui/react-tabs 9.9.3 → 9.10.1

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.
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Tab/useTabStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { TabSlots, TabState } from './Tab.types';\nimport { useTabAnimatedIndicatorStyles_unstable } from './useTabAnimatedIndicator.styles';\n\nexport const tabClassNames: SlotClassNames<TabSlots> = {\n root: 'fui-Tab',\n icon: 'fui-Tab__icon',\n content: 'fui-Tab__content',\n};\n\nconst reservedSpaceClassNames = {\n content: 'fui-Tab__content--reserved-space',\n};\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/**\n * Styles for the root slot\n */\nconst 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 disabledCursor: {\n cursor: 'not-allowed',\n },\n disabled: {\n backgroundColor: tokens.colorTransparentBackground,\n\n [`& .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n [`& .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\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});\n\nconst useCircularAppearanceStyles = makeStyles({\n base: {\n borderRadius: tokens.borderRadiusCircular,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorTransparentStroke}`,\n [`& .${tabClassNames.icon}`]: {\n color: 'inherit',\n },\n [`& .${tabClassNames.content}`]: {\n color: 'inherit',\n },\n },\n small: {\n paddingBlock: `calc(${tokens.spacingVerticalXXS} - ${tokens.strokeWidthThin})`,\n },\n medium: {\n paddingBlock: `calc(${tokens.spacingVerticalSNudge} - ${tokens.strokeWidthThin})`,\n },\n large: {\n paddingBlock: `calc(${tokens.spacingVerticalS} - ${tokens.strokeWidthThin})`,\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForeground2,\n ':enabled:hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStroke1Hover}`,\n color: tokens.colorNeutralForeground2Hover,\n },\n ':enabled:active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStroke1Pressed}`,\n color: tokens.colorNeutralForeground2Pressed,\n },\n '@media (forced-colors: active)': {\n border: `solid ${tokens.strokeWidthThin} Canvas`,\n },\n },\n subtleSelected: {\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 '@media (forced-colors: active)': {\n border: `solid ${tokens.strokeWidthThin} Highlight`,\n },\n },\n subtleDisabled: {\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForegroundDisabled,\n },\n subtleDisabledSelected: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStrokeDisabled}`,\n color: tokens.colorNeutralForegroundDisabled,\n },\n filled: {\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 '@media (forced-colors: active)': {\n ':enabled:hover': {\n backgroundColor: 'Highlight',\n forcedColorAdjust: 'none',\n [`& .${tabClassNames.content}`]: {\n color: 'HighlightText',\n },\n [`& .${iconClassNames.filled}`]: {\n color: 'HighlightText',\n },\n [`& .${iconClassNames.regular}`]: {\n color: 'HighlightText',\n },\n },\n },\n },\n filledSelected: {\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 '@media (forced-colors: active)': {\n ':enabled': {\n backgroundColor: 'ButtonText',\n [`& .${tabClassNames.content}`]: {\n color: 'ButtonFace',\n forcedColorAdjust: 'none',\n },\n },\n [`:enabled .${tabClassNames.icon}`]: {\n color: 'ButtonFace',\n },\n },\n },\n filledDisabled: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n color: tokens.colorNeutralForegroundDisabled,\n },\n filledDisabledSelected: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStrokeDisabled}`,\n color: tokens.colorNeutralForegroundDisabled,\n },\n});\n\n/**\n * Focus styles for the root slot\n */\nconst 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 {\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 circular: createCustomFocusIndicatorStyle(\n {\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 0 0 0 ${tokens.strokeWidthThin} ${tokens.colorNeutralStrokeOnBrand} inset\n `,\n zIndex: 1,\n },\n { enableOutline: true },\n ),\n});\n\n/** Indicator styles for when pending selection */\nconst 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 '@media (forced-colors: active)': {\n ':hover::before': {\n backgroundColor: 'transparent',\n },\n ':active::before': {\n backgroundColor: 'transparent',\n },\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});\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/**\n * Styles for the icon slot.\n */\nconst 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/**\n * Styles for the content slot (children)\n */\nconst 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/**\n * Apply styling to the Tab slots based on the state\n */\nexport const useTabStyles_unstable = (state: TabState): TabState => {\n 'use no memo';\n\n useTabIndicatorStyles_unstable(state);\n\n useTabButtonStyles_unstable(state, state.root);\n\n useTabContentStyles_unstable(state);\n\n return state;\n};\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 */\nexport const useTabIndicatorStyles_unstable = (state: TabState): TabState => {\n 'use no memo';\n\n const rootStyles = useRootStyles();\n const pendingIndicatorStyles = usePendingIndicatorStyles();\n const activeIndicatorStyles = useActiveIndicatorStyles();\n\n const { appearance, disabled, selected, size, vertical } = state;\n\n const classes: Parameters<typeof mergeClasses> = [tabClassNames.root, rootStyles.root];\n\n if (appearance !== 'subtle-circular' && appearance !== 'filled-circular') {\n classes.push(\n // pending indicator (before pseudo element)\n pendingIndicatorStyles.base,\n size === 'small' && (vertical ? pendingIndicatorStyles.smallVertical : pendingIndicatorStyles.smallHorizontal),\n size === 'medium' && (vertical ? pendingIndicatorStyles.mediumVertical : pendingIndicatorStyles.mediumHorizontal),\n size === 'large' && (vertical ? pendingIndicatorStyles.largeVertical : pendingIndicatorStyles.largeHorizontal),\n disabled && pendingIndicatorStyles.disabled,\n\n // active indicator (after pseudo element)\n selected && activeIndicatorStyles.base,\n selected && !disabled && activeIndicatorStyles.selected,\n selected &&\n size === 'small' &&\n (vertical ? activeIndicatorStyles.smallVertical : activeIndicatorStyles.smallHorizontal),\n selected &&\n size === 'medium' &&\n (vertical ? activeIndicatorStyles.mediumVertical : activeIndicatorStyles.mediumHorizontal),\n selected &&\n size === 'large' &&\n (vertical ? activeIndicatorStyles.largeVertical : activeIndicatorStyles.largeHorizontal),\n selected && disabled && activeIndicatorStyles.disabled,\n );\n }\n\n state.root.className = mergeClasses(...classes, state.root.className);\n\n useTabAnimatedIndicatorStyles_unstable(state);\n\n return state;\n};\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 */\nexport const useTabButtonStyles_unstable = (state: TabState, slot: TabState['root']): TabState => {\n 'use no memo';\n\n const rootStyles = useRootStyles();\n const focusStyles = useFocusStyles();\n const circularStyles = useCircularAppearanceStyles();\n\n const { appearance, disabled, selected, size, vertical } = state;\n\n const isSubtleCircular = appearance === 'subtle-circular';\n const isFilledCircular = appearance === 'filled-circular';\n const isCircular = isSubtleCircular || isFilledCircular;\n\n const circularAppearance = [\n circularStyles.base,\n focusStyles.circular,\n // sizes\n size === 'small' && circularStyles.small,\n size === 'medium' && circularStyles.medium,\n size === 'large' && circularStyles.large,\n // subtle-circular appearance\n isSubtleCircular && circularStyles.subtle,\n selected && isSubtleCircular && circularStyles.subtleSelected,\n disabled && isSubtleCircular && circularStyles.subtleDisabled,\n selected && disabled && isSubtleCircular && circularStyles.subtleDisabledSelected,\n // filled-circular appearance\n isFilledCircular && circularStyles.filled,\n selected && isFilledCircular && circularStyles.filledSelected,\n disabled && isFilledCircular && circularStyles.filledDisabled,\n selected && disabled && isFilledCircular && circularStyles.filledDisabledSelected,\n ];\n\n const regularAppearance = [\n focusStyles.base,\n !disabled && appearance === 'subtle' && rootStyles.subtle,\n !disabled && appearance === 'transparent' && rootStyles.transparent,\n !disabled && selected && rootStyles.selected,\n disabled && rootStyles.disabled,\n ];\n\n slot.className = mergeClasses(\n rootStyles.button,\n // orientation\n vertical ? rootStyles.vertical : rootStyles.horizontal,\n // size\n size === 'small' && (vertical ? rootStyles.smallVertical : rootStyles.smallHorizontal),\n size === 'medium' && (vertical ? rootStyles.mediumVertical : rootStyles.mediumHorizontal),\n size === 'large' && (vertical ? rootStyles.largeVertical : rootStyles.largeHorizontal),\n ...(isCircular ? circularAppearance : regularAppearance),\n disabled && rootStyles.disabledCursor,\n slot.className,\n );\n\n return state;\n};\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 */\nexport const useTabContentStyles_unstable = (state: TabState): TabState => {\n 'use no memo';\n\n const iconStyles = useIconStyles();\n const contentStyles = useContentStyles();\n\n const { selected, size } = state;\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n tabClassNames.icon,\n iconStyles.base,\n iconStyles[size],\n selected && iconStyles.selected,\n state.icon.className,\n );\n }\n\n // This needs to be before state.content.className is updated\n if (state.contentReservedSpace) {\n state.contentReservedSpace.className = mergeClasses(\n reservedSpaceClassNames.content,\n contentStyles.base,\n size === 'large' ? contentStyles.largeSelected : contentStyles.selected,\n state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore,\n contentStyles.placeholder,\n state.content.className,\n );\n // FIXME: this is a deprecated API\n // should be removed in the next major version\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n state.contentReservedSpaceClassName = state.contentReservedSpace.className;\n }\n\n state.content.className = mergeClasses(\n tabClassNames.content,\n contentStyles.base,\n size === 'large' && contentStyles.large,\n selected && (size === 'large' ? contentStyles.largeSelected : contentStyles.selected),\n state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore,\n state.content.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","typographyStyles","useTabAnimatedIndicatorStyles_unstable","tabClassNames","root","icon","content","reservedSpaceClassNames","iconClassNames","filled","regular","useRootStyles","alignItems","display","flexShrink","gridAutoFlow","gridTemplateColumns","gridTemplateRows","outlineStyle","position","button","border","borderRadius","borderRadiusMedium","cursor","fontFamily","fontFamilyBase","lineHeight","lineHeightBase300","overflow","textTransform","horizontal","justifyContent","vertical","smallHorizontal","columnGap","spacingHorizontalXXS","padding","spacingVerticalSNudge","spacingHorizontalSNudge","smallVertical","spacingVerticalXXS","mediumHorizontal","spacingVerticalM","spacingHorizontalMNudge","mediumVertical","largeHorizontal","spacingVerticalL","largeVertical","spacingVerticalS","transparent","backgroundColor","colorTransparentBackground","colorTransparentBackgroundHover","colorTransparentBackgroundPressed","color","colorNeutralForeground2","colorNeutralForeground2Hover","colorNeutralForeground2Pressed","subtle","colorSubtleBackground","colorSubtleBackgroundHover","colorSubtleBackgroundPressed","disabledCursor","disabled","colorNeutralForegroundDisabled","selected","colorCompoundBrandForeground1","colorCompoundBrandForeground1Hover","colorCompoundBrandForeground1Pressed","colorNeutralForeground1","colorNeutralForeground1Hover","colorNeutralForeground1Pressed","useCircularAppearanceStyles","base","borderRadiusCircular","strokeWidthThin","colorTransparentStroke","small","paddingBlock","medium","large","colorNeutralStroke1Hover","colorNeutralStroke1Pressed","subtleSelected","colorBrandBackground2","colorCompoundBrandStroke","colorBrandForeground2","colorBrandBackground2Hover","colorCompoundBrandStrokeHover","colorBrandForeground2Hover","colorBrandBackground2Pressed","colorCompoundBrandStrokePressed","colorBrandForeground2Pressed","subtleDisabled","subtleDisabledSelected","colorNeutralBackgroundDisabled","colorNeutralStrokeDisabled","colorNeutralBackground3","colorNeutralBackground3Hover","colorNeutralBackground3Pressed","forcedColorAdjust","filledSelected","colorBrandBackground","colorNeutralForegroundOnBrand","colorBrandBackgroundHover","colorBrandBackgroundPressed","filledDisabled","filledDisabledSelected","useFocusStyles","borderColor","outlineWidth","strokeWidthThick","outlineColor","boxShadow","shadow4","colorStrokeFocus2","zIndex","enableOutline","circular","colorNeutralStrokeOnBrand","usePendingIndicatorStyles","bottom","height","left","right","spacingVerticalXS","top","width","strokeWidthThicker","spacingHorizontalM","spacingVerticalMNudge","useActiveIndicatorStyles","useIconStyles","gridColumnStart","gridRowStart","fontSize","useContentStyles","body1","spacingVerticalNone","body1Strong","body2","largeSelected","subtitle2","noIconBefore","iconBefore","placeholder","visibility","useTabStyles_unstable","state","useTabIndicatorStyles_unstable","useTabButtonStyles_unstable","useTabContentStyles_unstable","rootStyles","pendingIndicatorStyles","activeIndicatorStyles","appearance","size","classes","push","className","slot","focusStyles","circularStyles","isSubtleCircular","isFilledCircular","isCircular","circularAppearance","regularAppearance","iconStyles","contentStyles","contentReservedSpace","contentReservedSpaceClassName"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/Tab/useTabStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { TabSlots, TabState } from './Tab.types';\nimport { useTabAnimatedIndicatorStyles_unstable } from './useTabAnimatedIndicator.styles';\n\nexport const tabClassNames: SlotClassNames<TabSlots> = {\n root: 'fui-Tab',\n icon: 'fui-Tab__icon',\n content: 'fui-Tab__content',\n};\n\nexport const tabReservedSpaceClassNames = {\n content: 'fui-Tab__content--reserved-space',\n};\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/**\n * Styles for the root slot\n */\nconst 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 disabledCursor: {\n cursor: 'not-allowed',\n },\n disabled: {\n backgroundColor: tokens.colorTransparentBackground,\n\n [`& .${tabClassNames.icon}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n [`& .${tabClassNames.content}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\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});\n\nconst useCircularAppearanceStyles = makeStyles({\n base: {\n borderRadius: tokens.borderRadiusCircular,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorTransparentStroke}`,\n [`& .${tabClassNames.icon}`]: {\n color: 'inherit',\n },\n [`& .${tabClassNames.content}`]: {\n color: 'inherit',\n },\n },\n small: {\n paddingBlock: `calc(${tokens.spacingVerticalXXS} - ${tokens.strokeWidthThin})`,\n },\n medium: {\n paddingBlock: `calc(${tokens.spacingVerticalSNudge} - ${tokens.strokeWidthThin})`,\n },\n large: {\n paddingBlock: `calc(${tokens.spacingVerticalS} - ${tokens.strokeWidthThin})`,\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForeground2,\n ':enabled:hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStroke1Hover}`,\n color: tokens.colorNeutralForeground2Hover,\n },\n ':enabled:active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStroke1Pressed}`,\n color: tokens.colorNeutralForeground2Pressed,\n },\n '@media (forced-colors: active)': {\n border: `solid ${tokens.strokeWidthThin} Canvas`,\n },\n },\n subtleSelected: {\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 '@media (forced-colors: active)': {\n border: `solid ${tokens.strokeWidthThin} Highlight`,\n },\n },\n subtleDisabled: {\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForegroundDisabled,\n },\n subtleDisabledSelected: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStrokeDisabled}`,\n color: tokens.colorNeutralForegroundDisabled,\n },\n filled: {\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 '@media (forced-colors: active)': {\n ':enabled:hover': {\n backgroundColor: 'Highlight',\n forcedColorAdjust: 'none',\n [`& .${tabClassNames.content}`]: {\n color: 'HighlightText',\n },\n [`& .${iconClassNames.filled}`]: {\n color: 'HighlightText',\n },\n [`& .${iconClassNames.regular}`]: {\n color: 'HighlightText',\n },\n },\n },\n },\n filledSelected: {\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 '@media (forced-colors: active)': {\n ':enabled': {\n backgroundColor: 'ButtonText',\n [`& .${tabClassNames.content}`]: {\n color: 'ButtonFace',\n forcedColorAdjust: 'none',\n },\n },\n [`:enabled .${tabClassNames.icon}`]: {\n color: 'ButtonFace',\n },\n },\n },\n filledDisabled: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n color: tokens.colorNeutralForegroundDisabled,\n },\n filledDisabledSelected: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n border: `solid ${tokens.strokeWidthThin} ${tokens.colorNeutralStrokeDisabled}`,\n color: tokens.colorNeutralForegroundDisabled,\n },\n});\n\n/**\n * Focus styles for the root slot\n */\nconst 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 {\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 circular: createCustomFocusIndicatorStyle(\n {\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 0 0 0 ${tokens.strokeWidthThin} ${tokens.colorNeutralStrokeOnBrand} inset\n `,\n zIndex: 1,\n },\n { enableOutline: true },\n ),\n});\n\n/** Indicator styles for when pending selection */\nconst 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 '@media (forced-colors: active)': {\n ':hover::before': {\n backgroundColor: 'transparent',\n },\n ':active::before': {\n backgroundColor: 'transparent',\n },\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});\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/**\n * Styles for the icon slot.\n */\nconst 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/**\n * Styles for the content slot (children)\n */\nconst 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/**\n * Apply styling to the Tab slots based on the state\n */\nexport const useTabStyles_unstable = (state: TabState): TabState => {\n 'use no memo';\n\n useTabIndicatorStyles_unstable(state);\n\n useTabButtonStyles_unstable(state, state.root);\n\n useTabContentStyles_unstable(state);\n\n return state;\n};\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 */\nexport const useTabIndicatorStyles_unstable = (state: TabState): TabState => {\n 'use no memo';\n\n const rootStyles = useRootStyles();\n const pendingIndicatorStyles = usePendingIndicatorStyles();\n const activeIndicatorStyles = useActiveIndicatorStyles();\n\n const { appearance, disabled, selected, size, vertical } = state;\n\n const classes: Parameters<typeof mergeClasses> = [tabClassNames.root, rootStyles.root];\n\n if (appearance !== 'subtle-circular' && appearance !== 'filled-circular') {\n classes.push(\n // pending indicator (before pseudo element)\n pendingIndicatorStyles.base,\n size === 'small' && (vertical ? pendingIndicatorStyles.smallVertical : pendingIndicatorStyles.smallHorizontal),\n size === 'medium' && (vertical ? pendingIndicatorStyles.mediumVertical : pendingIndicatorStyles.mediumHorizontal),\n size === 'large' && (vertical ? pendingIndicatorStyles.largeVertical : pendingIndicatorStyles.largeHorizontal),\n disabled && pendingIndicatorStyles.disabled,\n\n // active indicator (after pseudo element)\n selected && activeIndicatorStyles.base,\n selected && !disabled && activeIndicatorStyles.selected,\n selected &&\n size === 'small' &&\n (vertical ? activeIndicatorStyles.smallVertical : activeIndicatorStyles.smallHorizontal),\n selected &&\n size === 'medium' &&\n (vertical ? activeIndicatorStyles.mediumVertical : activeIndicatorStyles.mediumHorizontal),\n selected &&\n size === 'large' &&\n (vertical ? activeIndicatorStyles.largeVertical : activeIndicatorStyles.largeHorizontal),\n selected && disabled && activeIndicatorStyles.disabled,\n );\n }\n\n state.root.className = mergeClasses(...classes, state.root.className);\n\n useTabAnimatedIndicatorStyles_unstable(state);\n\n return state;\n};\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 */\nexport const useTabButtonStyles_unstable = (state: TabState, slot: TabState['root']): TabState => {\n 'use no memo';\n\n const rootStyles = useRootStyles();\n const focusStyles = useFocusStyles();\n const circularStyles = useCircularAppearanceStyles();\n\n const { appearance, disabled, selected, size, vertical } = state;\n\n const isSubtleCircular = appearance === 'subtle-circular';\n const isFilledCircular = appearance === 'filled-circular';\n const isCircular = isSubtleCircular || isFilledCircular;\n\n const circularAppearance = [\n circularStyles.base,\n focusStyles.circular,\n // sizes\n size === 'small' && circularStyles.small,\n size === 'medium' && circularStyles.medium,\n size === 'large' && circularStyles.large,\n // subtle-circular appearance\n isSubtleCircular && circularStyles.subtle,\n selected && isSubtleCircular && circularStyles.subtleSelected,\n disabled && isSubtleCircular && circularStyles.subtleDisabled,\n selected && disabled && isSubtleCircular && circularStyles.subtleDisabledSelected,\n // filled-circular appearance\n isFilledCircular && circularStyles.filled,\n selected && isFilledCircular && circularStyles.filledSelected,\n disabled && isFilledCircular && circularStyles.filledDisabled,\n selected && disabled && isFilledCircular && circularStyles.filledDisabledSelected,\n ];\n\n const regularAppearance = [\n focusStyles.base,\n !disabled && appearance === 'subtle' && rootStyles.subtle,\n !disabled && appearance === 'transparent' && rootStyles.transparent,\n !disabled && selected && rootStyles.selected,\n disabled && rootStyles.disabled,\n ];\n\n slot.className = mergeClasses(\n rootStyles.button,\n // orientation\n vertical ? rootStyles.vertical : rootStyles.horizontal,\n // size\n size === 'small' && (vertical ? rootStyles.smallVertical : rootStyles.smallHorizontal),\n size === 'medium' && (vertical ? rootStyles.mediumVertical : rootStyles.mediumHorizontal),\n size === 'large' && (vertical ? rootStyles.largeVertical : rootStyles.largeHorizontal),\n ...(isCircular ? circularAppearance : regularAppearance),\n disabled && rootStyles.disabledCursor,\n slot.className,\n );\n\n return state;\n};\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 */\nexport const useTabContentStyles_unstable = (state: TabState): TabState => {\n 'use no memo';\n\n const iconStyles = useIconStyles();\n const contentStyles = useContentStyles();\n\n const { selected, size } = state;\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n tabClassNames.icon,\n iconStyles.base,\n iconStyles[size],\n selected && iconStyles.selected,\n state.icon.className,\n );\n }\n\n // This needs to be before state.content.className is updated\n if (state.contentReservedSpace) {\n state.contentReservedSpace.className = mergeClasses(\n tabReservedSpaceClassNames.content,\n contentStyles.base,\n size === 'large' ? contentStyles.largeSelected : contentStyles.selected,\n state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore,\n contentStyles.placeholder,\n state.content.className,\n );\n // FIXME: this is a deprecated API\n // should be removed in the next major version\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n state.contentReservedSpaceClassName = state.contentReservedSpace.className;\n }\n\n state.content.className = mergeClasses(\n tabClassNames.content,\n contentStyles.base,\n size === 'large' && contentStyles.large,\n selected && (size === 'large' ? contentStyles.largeSelected : contentStyles.selected),\n state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore,\n state.content.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","typographyStyles","useTabAnimatedIndicatorStyles_unstable","tabClassNames","root","icon","content","tabReservedSpaceClassNames","iconClassNames","filled","regular","useRootStyles","alignItems","display","flexShrink","gridAutoFlow","gridTemplateColumns","gridTemplateRows","outlineStyle","position","button","border","borderRadius","borderRadiusMedium","cursor","fontFamily","fontFamilyBase","lineHeight","lineHeightBase300","overflow","textTransform","horizontal","justifyContent","vertical","smallHorizontal","columnGap","spacingHorizontalXXS","padding","spacingVerticalSNudge","spacingHorizontalSNudge","smallVertical","spacingVerticalXXS","mediumHorizontal","spacingVerticalM","spacingHorizontalMNudge","mediumVertical","largeHorizontal","spacingVerticalL","largeVertical","spacingVerticalS","transparent","backgroundColor","colorTransparentBackground","colorTransparentBackgroundHover","colorTransparentBackgroundPressed","color","colorNeutralForeground2","colorNeutralForeground2Hover","colorNeutralForeground2Pressed","subtle","colorSubtleBackground","colorSubtleBackgroundHover","colorSubtleBackgroundPressed","disabledCursor","disabled","colorNeutralForegroundDisabled","selected","colorCompoundBrandForeground1","colorCompoundBrandForeground1Hover","colorCompoundBrandForeground1Pressed","colorNeutralForeground1","colorNeutralForeground1Hover","colorNeutralForeground1Pressed","useCircularAppearanceStyles","base","borderRadiusCircular","strokeWidthThin","colorTransparentStroke","small","paddingBlock","medium","large","colorNeutralStroke1Hover","colorNeutralStroke1Pressed","subtleSelected","colorBrandBackground2","colorCompoundBrandStroke","colorBrandForeground2","colorBrandBackground2Hover","colorCompoundBrandStrokeHover","colorBrandForeground2Hover","colorBrandBackground2Pressed","colorCompoundBrandStrokePressed","colorBrandForeground2Pressed","subtleDisabled","subtleDisabledSelected","colorNeutralBackgroundDisabled","colorNeutralStrokeDisabled","colorNeutralBackground3","colorNeutralBackground3Hover","colorNeutralBackground3Pressed","forcedColorAdjust","filledSelected","colorBrandBackground","colorNeutralForegroundOnBrand","colorBrandBackgroundHover","colorBrandBackgroundPressed","filledDisabled","filledDisabledSelected","useFocusStyles","borderColor","outlineWidth","strokeWidthThick","outlineColor","boxShadow","shadow4","colorStrokeFocus2","zIndex","enableOutline","circular","colorNeutralStrokeOnBrand","usePendingIndicatorStyles","bottom","height","left","right","spacingVerticalXS","top","width","strokeWidthThicker","spacingHorizontalM","spacingVerticalMNudge","useActiveIndicatorStyles","useIconStyles","gridColumnStart","gridRowStart","fontSize","useContentStyles","body1","spacingVerticalNone","body1Strong","body2","largeSelected","subtitle2","noIconBefore","iconBefore","placeholder","visibility","useTabStyles_unstable","state","useTabIndicatorStyles_unstable","useTabButtonStyles_unstable","useTabContentStyles_unstable","rootStyles","pendingIndicatorStyles","activeIndicatorStyles","appearance","size","classes","push","className","slot","focusStyles","circularStyles","isSubtleCircular","isFilledCircular","isCircular","circularAppearance","regularAppearance","iconStyles","contentStyles","contentReservedSpace","contentReservedSpaceClassName"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/TabList/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":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
1
+ {"version":3,"sources":["../src/components/TabList/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 | null>;\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":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/TabList/renderTabList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TabListState, TabListSlots, TabListContextValues } from './TabList.types';\nimport { TabListProvider } from './TabListContext';\n\n/**\n * Render the final JSX of TabList\n */\nexport const renderTabList_unstable = (state: TabListState, contextValues: TabListContextValues) => {\n assertSlots<TabListSlots>(state);\n\n return (\n <state.root>\n <TabListProvider value={contextValues.tabList}>{state.root.children}</TabListProvider>\n </state.root>\n );\n};\n"],"names":["assertSlots","TabListProvider","renderTabList_unstable","state","contextValues","root","value","tabList","children"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,eAAe,QAAQ,mBAAmB;AAEnD;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC,OAAqBC;IAC1DJ,YAA0BG;IAE1B,qBACE,KAACA,MAAME,IAAI;kBACT,cAAA,KAACJ;YAAgBK,OAAOF,cAAcG,OAAO;sBAAGJ,MAAME,IAAI,CAACG,QAAQ;;;AAGzE,EAAE"}
1
+ {"version":3,"sources":["../src/components/TabList/renderTabList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { TabListState, TabListSlots, TabListContextValues } from './TabList.types';\nimport { TabListProvider } from './TabListContext';\n\n/**\n * Render the final JSX of TabList\n */\nexport const renderTabList_unstable = (state: TabListState, contextValues: TabListContextValues): JSXElement => {\n assertSlots<TabListSlots>(state);\n\n return (\n <state.root>\n <TabListProvider value={contextValues.tabList}>{state.root.children}</TabListProvider>\n </state.root>\n );\n};\n"],"names":["assertSlots","TabListProvider","renderTabList_unstable","state","contextValues","root","value","tabList","children"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,eAAe,QAAQ,mBAAmB;AAEnD;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC,OAAqBC;IAC1DJ,YAA0BG;IAE1B,qBACE,KAACA,MAAME,IAAI;kBACT,cAAA,KAACJ;YAAgBK,OAAOF,cAAcG,OAAO;sBAAGJ,MAAME,IAAI,CAACG,QAAQ;;;AAGzE,EAAE"}
package/lib/index.js CHANGED
@@ -1,2 +1,2 @@
1
- export { renderTab_unstable, Tab, tabClassNames, useTabButtonStyles_unstable, useTabContentStyles_unstable, useTabIndicatorStyles_unstable, useTabStyles_unstable, useTab_unstable } from './Tab';
1
+ export { renderTab_unstable, Tab, tabClassNames, tabReservedSpaceClassNames, useTabAnimatedIndicatorStyles_unstable, useTabButtonStyles_unstable, useTabContentStyles_unstable, useTabIndicatorStyles_unstable, useTabStyles_unstable, useTab_unstable } from './Tab';
2
2
  export { renderTabList_unstable, TabList, TabListProvider, tabListClassNames, useTabListContext_unstable, useTabListContextValues_unstable, useTabListStyles_unstable, useTabList_unstable } from './TabList';
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export type { TabProps, TabSlots, TabState, TabValue } from './Tab';\nexport {\n renderTab_unstable,\n Tab,\n tabClassNames,\n useTabButtonStyles_unstable,\n useTabContentStyles_unstable,\n useTabIndicatorStyles_unstable,\n useTabStyles_unstable,\n useTab_unstable,\n} from './Tab';\nexport type {\n TabRegisterData,\n RegisterTabEventHandler,\n SelectTabData,\n SelectTabEvent,\n SelectTabEventHandler,\n TabListContextValue,\n TabListContextValues,\n TabListProps,\n TabListSlots,\n TabListState,\n} from './TabList';\nexport {\n renderTabList_unstable,\n TabList,\n TabListProvider,\n tabListClassNames,\n useTabListContext_unstable,\n useTabListContextValues_unstable,\n useTabListStyles_unstable,\n useTabList_unstable,\n} from './TabList';\n"],"names":["renderTab_unstable","Tab","tabClassNames","useTabButtonStyles_unstable","useTabContentStyles_unstable","useTabIndicatorStyles_unstable","useTabStyles_unstable","useTab_unstable","renderTabList_unstable","TabList","TabListProvider","tabListClassNames","useTabListContext_unstable","useTabListContextValues_unstable","useTabListStyles_unstable","useTabList_unstable"],"mappings":"AACA,SACEA,kBAAkB,EAClBC,GAAG,EACHC,aAAa,EACbC,2BAA2B,EAC3BC,4BAA4B,EAC5BC,8BAA8B,EAC9BC,qBAAqB,EACrBC,eAAe,QACV,QAAQ;AAaf,SACEC,sBAAsB,EACtBC,OAAO,EACPC,eAAe,EACfC,iBAAiB,EACjBC,0BAA0B,EAC1BC,gCAAgC,EAChCC,yBAAyB,EACzBC,mBAAmB,QACd,YAAY"}
1
+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export type { TabProps, TabSlots, TabState, TabValue } from './Tab';\nexport {\n renderTab_unstable,\n Tab,\n tabClassNames,\n tabReservedSpaceClassNames,\n useTabAnimatedIndicatorStyles_unstable,\n useTabButtonStyles_unstable,\n useTabContentStyles_unstable,\n useTabIndicatorStyles_unstable,\n useTabStyles_unstable,\n useTab_unstable,\n} from './Tab';\nexport type {\n TabRegisterData,\n RegisterTabEventHandler,\n SelectTabData,\n SelectTabEvent,\n SelectTabEventHandler,\n TabListContextValue,\n TabListContextValues,\n TabListProps,\n TabListSlots,\n TabListState,\n} from './TabList';\nexport {\n renderTabList_unstable,\n TabList,\n TabListProvider,\n tabListClassNames,\n useTabListContext_unstable,\n useTabListContextValues_unstable,\n useTabListStyles_unstable,\n useTabList_unstable,\n} from './TabList';\n"],"names":["renderTab_unstable","Tab","tabClassNames","tabReservedSpaceClassNames","useTabAnimatedIndicatorStyles_unstable","useTabButtonStyles_unstable","useTabContentStyles_unstable","useTabIndicatorStyles_unstable","useTabStyles_unstable","useTab_unstable","renderTabList_unstable","TabList","TabListProvider","tabListClassNames","useTabListContext_unstable","useTabListContextValues_unstable","useTabListStyles_unstable","useTabList_unstable"],"mappings":"AACA,SACEA,kBAAkB,EAClBC,GAAG,EACHC,aAAa,EACbC,0BAA0B,EAC1BC,sCAAsC,EACtCC,2BAA2B,EAC3BC,4BAA4B,EAC5BC,8BAA8B,EAC9BC,qBAAqB,EACrBC,eAAe,QACV,QAAQ;AAaf,SACEC,sBAAsB,EACtBC,OAAO,EACPC,eAAe,EACfC,iBAAiB,EACjBC,0BAA0B,EAC1BC,gCAAgC,EAChCC,yBAAyB,EACzBC,mBAAmB,QACd,YAAY"}
@@ -18,6 +18,9 @@ _export(exports, {
18
18
  tabClassNames: function() {
19
19
  return _index.tabClassNames;
20
20
  },
21
+ tabReservedSpaceClassNames: function() {
22
+ return _index.tabReservedSpaceClassNames;
23
+ },
21
24
  useTabAnimatedIndicatorStyles_unstable: function() {
22
25
  return _index.useTabAnimatedIndicatorStyles_unstable;
23
26
  },
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/Tab.ts"],"sourcesContent":["export type { TabInternalSlots, TabProps, TabSlots, TabState, TabValue } from './components/Tab/index';\nexport {\n Tab,\n renderTab_unstable,\n tabClassNames,\n useTabAnimatedIndicatorStyles_unstable,\n useTabButtonStyles_unstable,\n useTabContentStyles_unstable,\n useTabIndicatorStyles_unstable,\n useTabStyles_unstable,\n useTab_unstable,\n} from './components/Tab/index';\n"],"names":["Tab","renderTab_unstable","tabClassNames","useTabAnimatedIndicatorStyles_unstable","useTabButtonStyles_unstable","useTabContentStyles_unstable","useTabIndicatorStyles_unstable","useTabStyles_unstable","useTab_unstable"],"mappings":";;;;;;;;;;;IAEEA;yBAAG;;;eACHC,yBAAkB;;;eAClBC,oBAAa;;;eACbC,6CAAsC;;;eACtCC,kCAA2B;;;eAC3BC,mCAA4B;;;eAC5BC,qCAA8B;;;eAC9BC,4BAAqB;;;eACrBC,sBAAe;;;uBACV,yBAAyB"}
1
+ {"version":3,"sources":["../src/Tab.ts"],"sourcesContent":["export type { TabInternalSlots, TabProps, TabSlots, TabState, TabValue } from './components/Tab/index';\nexport {\n Tab,\n renderTab_unstable,\n tabClassNames,\n tabReservedSpaceClassNames,\n useTabAnimatedIndicatorStyles_unstable,\n useTabButtonStyles_unstable,\n useTabContentStyles_unstable,\n useTabIndicatorStyles_unstable,\n useTabStyles_unstable,\n useTab_unstable,\n} from './components/Tab/index';\n"],"names":["Tab","renderTab_unstable","tabClassNames","tabReservedSpaceClassNames","useTabAnimatedIndicatorStyles_unstable","useTabButtonStyles_unstable","useTabContentStyles_unstable","useTabIndicatorStyles_unstable","useTabStyles_unstable","useTab_unstable"],"mappings":";;;;;;;;;;;IAEEA;yBAAG;;;eACHC,yBAAkB;;;eAClBC,oBAAa;;;eACbC,iCAA0B;;;eAC1BC,6CAAsC;;;eACtCC,kCAA2B;;;eAC3BC,mCAA4B;;;eAC5BC,qCAA8B;;;eAC9BC,4BAAqB;;;eACrBC,sBAAe;;;uBACV,yBAAyB"}
@@ -18,6 +18,9 @@ _export(exports, {
18
18
  tabClassNames: function() {
19
19
  return _useTabStylesstyles.tabClassNames;
20
20
  },
21
+ tabReservedSpaceClassNames: function() {
22
+ return _useTabStylesstyles.tabReservedSpaceClassNames;
23
+ },
21
24
  useTabAnimatedIndicatorStyles_unstable: function() {
22
25
  return _useTabAnimatedIndicatorstyles.useTabAnimatedIndicatorStyles_unstable;
23
26
  },
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Tab/index.ts"],"sourcesContent":["export { Tab } from './Tab';\nexport type { TabInternalSlots, TabProps, TabSlots, TabState, TabValue } from './Tab.types';\nexport { renderTab_unstable } from './renderTab';\nexport { useTab_unstable } from './useTab';\nexport {\n tabClassNames,\n useTabButtonStyles_unstable,\n useTabContentStyles_unstable,\n useTabIndicatorStyles_unstable,\n useTabStyles_unstable,\n} from './useTabStyles.styles';\nexport { useTabAnimatedIndicatorStyles_unstable } from './useTabAnimatedIndicator.styles';\n"],"names":["Tab","renderTab_unstable","useTab_unstable","tabClassNames","useTabButtonStyles_unstable","useTabContentStyles_unstable","useTabIndicatorStyles_unstable","useTabStyles_unstable","useTabAnimatedIndicatorStyles_unstable"],"mappings":";;;;;;;;;;;IAASA;uBAAG;;;eAEHC,6BAAkB;;;eAGzBE,iCAAa;;IAMNK;oFAAsC;;;eAL7CJ,+CAA2B;;;eAC3BC,gDAA4B;;;eAC5BC,kDAA8B;;;eAC9BC,yCAAqB;;mBANC;eAAfL;;;qBAHW,QAAQ;2BAEO,cAAc;wBACjB,WAAW;oCAOpC,wBAAwB;+CACwB,mCAAmC"}
1
+ {"version":3,"sources":["../src/components/Tab/index.ts"],"sourcesContent":["export { Tab } from './Tab';\nexport type { TabInternalSlots, TabProps, TabSlots, TabState, TabValue } from './Tab.types';\nexport { renderTab_unstable } from './renderTab';\nexport { useTab_unstable } from './useTab';\nexport {\n tabClassNames,\n tabReservedSpaceClassNames,\n useTabButtonStyles_unstable,\n useTabContentStyles_unstable,\n useTabIndicatorStyles_unstable,\n useTabStyles_unstable,\n} from './useTabStyles.styles';\nexport { useTabAnimatedIndicatorStyles_unstable } from './useTabAnimatedIndicator.styles';\n"],"names":["Tab","renderTab_unstable","useTab_unstable","tabClassNames","tabReservedSpaceClassNames","useTabButtonStyles_unstable","useTabContentStyles_unstable","useTabIndicatorStyles_unstable","useTabStyles_unstable","useTabAnimatedIndicatorStyles_unstable"],"mappings":";;;;;;;;;;;IAASA;uBAAG;;;eAEHC,6BAAkB;;;eAGzBE,iCAAa;;;eACbC,8CAA0B;;IAMnBK;oFAAsC;;;eAL7CJ,+CAA2B;;;eAC3BC,gDAA4B;;;eAC5BC,kDAA8B;;;eAC9BC,yCAAqB;;;eAPdN,uBAAe;;;qBAHJ,QAAQ;2BAEO,cAAc;wBACjB,WAAW;oCAQpC,wBAAwB;+CACwB,mCAAmC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Tab/renderTab.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TabState, TabInternalSlots } from './Tab.types';\n\n/**\n * Render the final JSX of Tab\n */\nexport const renderTab_unstable = (state: TabState) => {\n assertSlots<TabInternalSlots>(state);\n\n return (\n <state.root>\n {state.icon && <state.icon />}\n {!state.iconOnly && <state.content />}\n {state.contentReservedSpace && <state.contentReservedSpace />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderTab_unstable","state","root","icon","iconOnly","content","contentReservedSpace"],"mappings":";;;;+BAQaC;;;;;;4BAPb,iCAAiD;gCACrB,4BAA4B;AAMjD,2BAA2B,CAACC;QACjCF,2BAAAA,EAA8BE;IAE9B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAME,IAAI,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,IAAI,EAAA,CAAA;YACzB,CAACF,MAAMG,QAAQ,IAAA,WAAA,OAAI,eAAA,EAACH,MAAMI,OAAO,EAAA,CAAA;YACjCJ,MAAMK,oBAAoB,IAAA,WAAA,OAAI,eAAA,EAACL,MAAMK,oBAAoB,EAAA,CAAA;;;AAGhE,EAAE"}
1
+ {"version":3,"sources":["../src/components/Tab/renderTab.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { TabState, TabInternalSlots } from './Tab.types';\n\n/**\n * Render the final JSX of Tab\n */\nexport const renderTab_unstable = (state: TabState): JSXElement => {\n assertSlots<TabInternalSlots>(state);\n\n return (\n <state.root>\n {state.icon && <state.icon />}\n {!state.iconOnly && <state.content />}\n {state.contentReservedSpace && <state.contentReservedSpace />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderTab_unstable","state","root","icon","iconOnly","content","contentReservedSpace"],"mappings":";;;;+BASaC;;;;;;4BARb,iCAAiD;gCACrB,4BAA4B;AAOjD,2BAA2B,CAACC;QACjCF,2BAAAA,EAA8BE;IAE9B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAME,IAAI,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,IAAI,EAAA,CAAA;YACzB,CAACF,MAAMG,QAAQ,IAAA,WAAA,OAAI,eAAA,EAACH,MAAMI,OAAO,EAAA,CAAA;YACjCJ,MAAMK,oBAAoB,IAAA,WAAA,OAAI,eAAA,EAACL,MAAMK,oBAAoB,EAAA,CAAA;;;AAGhE,EAAE"}
@@ -12,6 +12,9 @@ _export(exports, {
12
12
  tabClassNames: function() {
13
13
  return tabClassNames;
14
14
  },
15
+ tabReservedSpaceClassNames: function() {
16
+ return tabReservedSpaceClassNames;
17
+ },
15
18
  useTabButtonStyles_unstable: function() {
16
19
  return useTabButtonStyles_unstable;
17
20
  },
@@ -32,7 +35,7 @@ const tabClassNames = {
32
35
  icon: 'fui-Tab__icon',
33
36
  content: 'fui-Tab__content'
34
37
  };
35
- const reservedSpaceClassNames = {
38
+ const tabReservedSpaceClassNames = {
36
39
  content: 'fui-Tab__content--reserved-space'
37
40
  };
38
41
  // These should match the constants defined in @fluentui/react-icons
@@ -1266,7 +1269,7 @@ const useTabContentStyles_unstable = (state)=>{
1266
1269
  }
1267
1270
  // This needs to be before state.content.className is updated
1268
1271
  if (state.contentReservedSpace) {
1269
- state.contentReservedSpace.className = (0, _react.mergeClasses)(reservedSpaceClassNames.content, contentStyles.base, size === 'large' ? contentStyles.largeSelected : contentStyles.selected, state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore, contentStyles.placeholder, state.content.className);
1272
+ state.contentReservedSpace.className = (0, _react.mergeClasses)(tabReservedSpaceClassNames.content, contentStyles.base, size === 'large' ? contentStyles.largeSelected : contentStyles.selected, state.icon ? contentStyles.iconBefore : contentStyles.noIconBefore, contentStyles.placeholder, state.content.className);
1270
1273
  // FIXME: this is a deprecated API
1271
1274
  // should be removed in the next major version
1272
1275
  // eslint-disable-next-line @typescript-eslint/no-deprecated