diff --git a/.changeset/strong-mangos-rest.md b/.changeset/strong-mangos-rest.md
new file mode 100644
index 00000000000..fd1a71a67bc
--- /dev/null
+++ b/.changeset/strong-mangos-rest.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": minor
+---
+
+Remove the feature flag for `primer_react_segmented_control_tooltip` and GA tootip by default behavior.
diff --git a/packages/react/src/FeatureFlags/DefaultFeatureFlags.ts b/packages/react/src/FeatureFlags/DefaultFeatureFlags.ts
index 6a6ee596c57..0fe1a78ef99 100644
--- a/packages/react/src/FeatureFlags/DefaultFeatureFlags.ts
+++ b/packages/react/src/FeatureFlags/DefaultFeatureFlags.ts
@@ -5,7 +5,6 @@ export const DefaultFeatureFlags = FeatureFlagScope.create({
primer_react_action_list_item_as_button: false,
primer_react_select_panel_with_modern_action_list: false,
primer_react_overlay_overflow: false,
- primer_react_segmented_control_tooltip: false,
primer_react_select_panel_fullscreen_on_narrow: false,
primer_react_select_panel_order_selected_at_top: false,
})
diff --git a/packages/react/src/SegmentedControl/SegmentedControl.test.tsx b/packages/react/src/SegmentedControl/SegmentedControl.test.tsx
index 7506c9fc151..9a7b2aac5c9 100644
--- a/packages/react/src/SegmentedControl/SegmentedControl.test.tsx
+++ b/packages/react/src/SegmentedControl/SegmentedControl.test.tsx
@@ -5,7 +5,6 @@ import {describe, expect, it, vi} from 'vitest'
import BaseStyles from '../BaseStyles'
import theme from '../theme'
import ThemeProvider from '../ThemeProvider'
-import {FeatureFlags} from '../FeatureFlags'
import {SegmentedControl} from '../SegmentedControl'
const segmentData = [
@@ -144,19 +143,13 @@ describe('SegmentedControl', () => {
}
})
- it('renders icon button with tooltip as label when feature flag is enabled', () => {
+ it('renders icon button with tooltip as label', () => {
const {getByRole, getByText} = render(
-
-
- {segmentData.map(({label, icon}) => (
-
- ))}
-
- ,
+
+ {segmentData.map(({label, icon}) => (
+
+ ))}
+ ,
)
for (const datum of segmentData) {
@@ -167,41 +160,20 @@ describe('SegmentedControl', () => {
}
})
- it('renders icon button with tooltip description when feature flag is enabled', () => {
+ it('renders icon button with tooltip description', () => {
const {getByRole, getByText} = render(
-
-
- {segmentData.map(({label, icon, description}) => (
-
- ))}
-
- ,
- )
-
- for (const datum of segmentData) {
- const labelledButton = getByRole('button', {name: datum.label})
- const tooltipElement = getByText(datum.description)
- expect(labelledButton).toHaveAttribute('aria-describedby', tooltipElement.id)
- expect(labelledButton).toHaveAccessibleName(datum.label)
- expect(labelledButton).toHaveAttribute('aria-label', datum.label)
- }
- })
-
- it('renders icon button with aria-label and no tooltip', () => {
- const {getByRole} = render(
- {segmentData.map(({label, icon}) => (
-
+ {segmentData.map(({label, icon, description}) => (
+
))}
,
)
for (const datum of segmentData) {
const labelledButton = getByRole('button', {name: datum.label})
+ const tooltipElement = getByText(datum.description)
+ expect(labelledButton).toHaveAttribute('aria-describedby', tooltipElement.id)
+ expect(labelledButton).toHaveAccessibleName(datum.label)
expect(labelledButton).toHaveAttribute('aria-label', datum.label)
}
})
diff --git a/packages/react/src/SegmentedControl/SegmentedControlIconButton.tsx b/packages/react/src/SegmentedControl/SegmentedControlIconButton.tsx
index 399f67be575..5dcd7a8f326 100644
--- a/packages/react/src/SegmentedControl/SegmentedControlIconButton.tsx
+++ b/packages/react/src/SegmentedControl/SegmentedControlIconButton.tsx
@@ -3,7 +3,6 @@ import type React from 'react'
import type {IconProps} from '@primer/octicons-react'
import type {SxProp} from '../sx'
import {isElement} from 'react-is'
-import {useFeatureFlag} from '../FeatureFlags'
import type {TooltipDirection} from '../TooltipV2'
import classes from './SegmentedControl.module.css'
import {clsx} from 'clsx'
@@ -35,56 +34,31 @@ export const SegmentedControlIconButton: React.FC {
- const tooltipFlagEnabled = useFeatureFlag('primer_react_segmented_control_tooltip')
- if (tooltipFlagEnabled) {
- return (
-
-
-
-
- {isElement(Icon) ? Icon : }
-
-
-
-
- )
- } else {
- // This can be removed when primer_react_segmented_control_tooltip feature flag is GA-ed.
- return (
-
+
{isElement(Icon) ? Icon : }
-
- )
- }
+
+
+ )
}
export default SegmentedControlIconButton