From 493d2d3133482c5c83296dcf671b48dc09f1c2f9 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Wed, 6 Aug 2025 03:14:53 +0000 Subject: [PATCH 1/8] Initial plan From 44fc56fea796b636c87a7b7878dda96d85bc3008 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Wed, 6 Aug 2025 03:29:30 +0000 Subject: [PATCH 2/8] Deprecate AvatarPair component - move to deprecated folder Co-authored-by: pksjce <417268+pksjce@users.noreply.github.com> --- .../{ => deprecated}/AvatarPair/AvatarPair.docs.json | 0 .../AvatarPair/AvatarPair.features.stories.tsx | 0 .../{ => deprecated}/AvatarPair/AvatarPair.figma.tsx | 0 .../AvatarPair/AvatarPair.module.css | 0 .../AvatarPair/AvatarPair.stories.tsx | 0 .../src/{ => deprecated}/AvatarPair/AvatarPair.tsx | 12 +++++++++--- .../react/src/{ => deprecated}/AvatarPair/index.ts | 0 packages/react/src/deprecated/index.ts | 5 +++++ packages/react/src/index.ts | 2 -- results.json | 1 + 10 files changed, 15 insertions(+), 5 deletions(-) rename packages/react/src/{ => deprecated}/AvatarPair/AvatarPair.docs.json (100%) rename packages/react/src/{ => deprecated}/AvatarPair/AvatarPair.features.stories.tsx (100%) rename packages/react/src/{ => deprecated}/AvatarPair/AvatarPair.figma.tsx (100%) rename packages/react/src/{ => deprecated}/AvatarPair/AvatarPair.module.css (100%) rename packages/react/src/{ => deprecated}/AvatarPair/AvatarPair.stories.tsx (100%) rename packages/react/src/{ => deprecated}/AvatarPair/AvatarPair.tsx (69%) rename packages/react/src/{ => deprecated}/AvatarPair/index.ts (100%) create mode 100644 results.json diff --git a/packages/react/src/AvatarPair/AvatarPair.docs.json b/packages/react/src/deprecated/AvatarPair/AvatarPair.docs.json similarity index 100% rename from packages/react/src/AvatarPair/AvatarPair.docs.json rename to packages/react/src/deprecated/AvatarPair/AvatarPair.docs.json diff --git a/packages/react/src/AvatarPair/AvatarPair.features.stories.tsx b/packages/react/src/deprecated/AvatarPair/AvatarPair.features.stories.tsx similarity index 100% rename from packages/react/src/AvatarPair/AvatarPair.features.stories.tsx rename to packages/react/src/deprecated/AvatarPair/AvatarPair.features.stories.tsx diff --git a/packages/react/src/AvatarPair/AvatarPair.figma.tsx b/packages/react/src/deprecated/AvatarPair/AvatarPair.figma.tsx similarity index 100% rename from packages/react/src/AvatarPair/AvatarPair.figma.tsx rename to packages/react/src/deprecated/AvatarPair/AvatarPair.figma.tsx diff --git a/packages/react/src/AvatarPair/AvatarPair.module.css b/packages/react/src/deprecated/AvatarPair/AvatarPair.module.css similarity index 100% rename from packages/react/src/AvatarPair/AvatarPair.module.css rename to packages/react/src/deprecated/AvatarPair/AvatarPair.module.css diff --git a/packages/react/src/AvatarPair/AvatarPair.stories.tsx b/packages/react/src/deprecated/AvatarPair/AvatarPair.stories.tsx similarity index 100% rename from packages/react/src/AvatarPair/AvatarPair.stories.tsx rename to packages/react/src/deprecated/AvatarPair/AvatarPair.stories.tsx diff --git a/packages/react/src/AvatarPair/AvatarPair.tsx b/packages/react/src/deprecated/AvatarPair/AvatarPair.tsx similarity index 69% rename from packages/react/src/AvatarPair/AvatarPair.tsx rename to packages/react/src/deprecated/AvatarPair/AvatarPair.tsx index 2cde8ece710..075e20330fa 100644 --- a/packages/react/src/AvatarPair/AvatarPair.tsx +++ b/packages/react/src/deprecated/AvatarPair/AvatarPair.tsx @@ -1,12 +1,18 @@ import React, {type HTMLProps} from 'react' -import type {AvatarProps} from '../Avatar' -import Avatar from '../Avatar' -import {SkeletonAvatar} from '../SkeletonAvatar' +import type {AvatarProps} from '../../Avatar' +import Avatar from '../../Avatar' +import {SkeletonAvatar} from '../../SkeletonAvatar' import classes from './AvatarPair.module.css' import {clsx} from 'clsx' +/** + * @deprecated AvatarPair is deprecated. Please see https://github.com/github/primer/issues/5533 for migration guidance. + */ export type AvatarPairProps = HTMLProps +/** + * @deprecated AvatarPair is deprecated. Please see https://github.com/github/primer/issues/5533 for migration guidance. + */ const AvatarPair = ({children, className, ...rest}: AvatarPairProps) => { const avatars = React.Children.map(children, (child, i) => { if (!React.isValidElement(child)) { diff --git a/packages/react/src/AvatarPair/index.ts b/packages/react/src/deprecated/AvatarPair/index.ts similarity index 100% rename from packages/react/src/AvatarPair/index.ts rename to packages/react/src/deprecated/AvatarPair/index.ts diff --git a/packages/react/src/deprecated/index.ts b/packages/react/src/deprecated/index.ts index c0df1270469..ea5ddc53fd3 100644 --- a/packages/react/src/deprecated/index.ts +++ b/packages/react/src/deprecated/index.ts @@ -42,3 +42,8 @@ export type {TabNavProps, TabNavLinkProps} from '../TabNav' export {default as Tooltip} from '../Tooltip/Tooltip' export type {TooltipProps} from '../Tooltip/Tooltip' // end of v37.0.0 + +// Deprecated in v37.31.0 - https://github.com/github/primer/issues/5533 +export {default as AvatarPair} from './AvatarPair' +export type {AvatarPairProps} from './AvatarPair' +// end of v37.31.0 diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 6e66bf9e097..9a8ef42e359 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -72,8 +72,6 @@ export {default as Autocomplete} from './Autocomplete' export type {AutocompleteMenuProps, AutocompleteInputProps, AutocompleteOverlayProps} from './Autocomplete' export {default as Avatar} from './Avatar' export type {AvatarProps} from './Avatar' -export {default as AvatarPair} from './AvatarPair' -export type {AvatarPairProps} from './AvatarPair' export {default as AvatarStack} from './AvatarStack' export type {AvatarStackProps} from './AvatarStack' export {default as BranchName} from './BranchName' diff --git a/results.json b/results.json new file mode 100644 index 00000000000..0637a088a01 --- /dev/null +++ b/results.json @@ -0,0 +1 @@ +[] \ No newline at end of file From 08574155b6d529b143efb6c0a452477054b9d22d Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Wed, 6 Aug 2025 05:37:18 +0000 Subject: [PATCH 3/8] Remove AvatarPair usage from repository codebase Co-authored-by: pksjce <417268+pksjce@users.noreply.github.com> --- e2e/components/AvatarPair.test.ts | 40 ------------------- .../SkeletonAvatar/SkeletonAvatar.docs.json | 3 -- .../SkeletonAvatar.features.stories.tsx | 8 ---- .../__snapshots__/exports.test.ts.snap | 4 +- .../react/src/__tests__/storybook.test.tsx | 1 - script/generate-e2e-tests.js | 20 +--------- 6 files changed, 3 insertions(+), 73 deletions(-) delete mode 100644 e2e/components/AvatarPair.test.ts diff --git a/e2e/components/AvatarPair.test.ts b/e2e/components/AvatarPair.test.ts deleted file mode 100644 index 18b6a5275c2..00000000000 --- a/e2e/components/AvatarPair.test.ts +++ /dev/null @@ -1,40 +0,0 @@ -import {test, expect} from '@playwright/test' -import {visit} from '../test-helpers/storybook' -import {themes} from '../test-helpers/themes' - -const stories = [ - { - title: 'Default', - id: 'components-avatarpair--default', - }, - { - title: 'Parent Circle', - id: 'components-avatarpair-features--parent-circle', - }, - { - title: 'Parent Square', - id: 'components-avatarpair-features--parent-square', - }, -] as const - -test.describe('AvatarPair', () => { - for (const story of stories) { - test.describe(story.title, () => { - for (const theme of themes) { - test.describe(theme, () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: story.id, - globals: { - colorScheme: theme, - }, - }) - - // Default state - await expect(page).toHaveScreenshot(`AvatarPair.${story.title}.${theme}.png`) - }) - }) - } - }) - } -}) diff --git a/packages/react/src/SkeletonAvatar/SkeletonAvatar.docs.json b/packages/react/src/SkeletonAvatar/SkeletonAvatar.docs.json index 482fe22ff05..4f2709cc92a 100644 --- a/packages/react/src/SkeletonAvatar/SkeletonAvatar.docs.json +++ b/packages/react/src/SkeletonAvatar/SkeletonAvatar.docs.json @@ -18,9 +18,6 @@ }, { "id": "components-skeleton-skeletonavatar-features--in-a-stack" - }, - { - "id": "components-skeleton-skeletonavatar-features--in-an-avatar-pair" } ], "importPath": "@primer/react/experimental", diff --git a/packages/react/src/SkeletonAvatar/SkeletonAvatar.features.stories.tsx b/packages/react/src/SkeletonAvatar/SkeletonAvatar.features.stories.tsx index 948ca820948..0074abd34e3 100644 --- a/packages/react/src/SkeletonAvatar/SkeletonAvatar.features.stories.tsx +++ b/packages/react/src/SkeletonAvatar/SkeletonAvatar.features.stories.tsx @@ -2,7 +2,6 @@ import type {Meta} from '@storybook/react-vite' import type {ComponentProps} from '../utils/types' import {SkeletonAvatar} from './SkeletonAvatar' import AvatarStack from '../AvatarStack' -import AvatarPair from '../AvatarPair' export default { title: 'Components/Skeleton/SkeletonAvatar/Features', @@ -51,10 +50,3 @@ export const InAStack = () => ( ) - -export const InAnAvatarPair = () => ( - - - - -) diff --git a/packages/react/src/__tests__/__snapshots__/exports.test.ts.snap b/packages/react/src/__tests__/__snapshots__/exports.test.ts.snap index 63e28024ae9..d2096ce78c4 100644 --- a/packages/react/src/__tests__/__snapshots__/exports.test.ts.snap +++ b/packages/react/src/__tests__/__snapshots__/exports.test.ts.snap @@ -24,8 +24,6 @@ exports[`@primer/react > should not update exports without a semver change 1`] = "type AutocompleteMenuProps", "type AutocompleteOverlayProps", "Avatar", - "AvatarPair", - "type AvatarPairProps", "type AvatarProps", "AvatarStack", "type AvatarStackProps", @@ -232,6 +230,8 @@ exports[`@primer/react/deprecated > should not update exports without a semver c "type ActionListProps", "ActionMenu", "type ActionMenuProps", + "AvatarPair", + "type AvatarPairProps", "Dialog", "type DialogHeaderProps", "type DialogProps", diff --git a/packages/react/src/__tests__/storybook.test.tsx b/packages/react/src/__tests__/storybook.test.tsx index d2cf7e2f41f..f8afa6c5691 100644 --- a/packages/react/src/__tests__/storybook.test.tsx +++ b/packages/react/src/__tests__/storybook.test.tsx @@ -15,7 +15,6 @@ const allowlist = [ 'Autocomplete', 'Avatar', 'AvatarStack', - 'AvatarPair', 'Breadcrumbs', 'BranchName', 'Blankslate', diff --git a/script/generate-e2e-tests.js b/script/generate-e2e-tests.js index 716ce98b30d..82437e82c14 100755 --- a/script/generate-e2e-tests.js +++ b/script/generate-e2e-tests.js @@ -184,25 +184,7 @@ const components = new Map([ ], }, ], - [ - 'AvatarPair', - { - stories: [ - { - id: 'components-avatarpair--default', - name: 'Default', - }, - { - id: 'components-avatarpair-features--parent-circle', - name: 'Parent Circle', - }, - { - id: 'components-avatarpair-features--parent-square', - name: 'Parent Square', - }, - ], - }, - ], + [ 'BranchName', { From 5b513f62f3a723e1e8eefde96d64bbca0543af16 Mon Sep 17 00:00:00 2001 From: Pavithra Kodmad Date: Wed, 6 Aug 2025 15:48:02 +1000 Subject: [PATCH 4/8] Update @primer/react version and deprecate AvatarPair Deprecate AvatarPair component and move to @primer/react/deprecated --- .changeset/metal-lamps-appear.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/metal-lamps-appear.md diff --git a/.changeset/metal-lamps-appear.md b/.changeset/metal-lamps-appear.md new file mode 100644 index 00000000000..e2de2388f34 --- /dev/null +++ b/.changeset/metal-lamps-appear.md @@ -0,0 +1,5 @@ +--- +"@primer/react": minor +--- + +Deprecate AvatarPair component - move to @primer/react/deprecated From dc6ee83a29144d1f5125505a920322f5fd1a2924 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Wed, 6 Aug 2025 05:48:09 +0000 Subject: [PATCH 5/8] Fix import paths in AvatarPair files after component migration Co-authored-by: pksjce <417268+pksjce@users.noreply.github.com> --- .../src/deprecated/AvatarPair/AvatarPair.features.stories.tsx | 2 +- packages/react/src/deprecated/AvatarPair/AvatarPair.figma.tsx | 2 +- packages/react/src/deprecated/AvatarPair/AvatarPair.stories.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/react/src/deprecated/AvatarPair/AvatarPair.features.stories.tsx b/packages/react/src/deprecated/AvatarPair/AvatarPair.features.stories.tsx index 123464572b5..d73dcc61d9d 100644 --- a/packages/react/src/deprecated/AvatarPair/AvatarPair.features.stories.tsx +++ b/packages/react/src/deprecated/AvatarPair/AvatarPair.features.stories.tsx @@ -1,6 +1,6 @@ import type {Meta} from '@storybook/react-vite' import AvatarPair from './AvatarPair' -import Avatar from '../Avatar' +import Avatar from '../../Avatar' export default { title: 'Components/AvatarPair/Features', diff --git a/packages/react/src/deprecated/AvatarPair/AvatarPair.figma.tsx b/packages/react/src/deprecated/AvatarPair/AvatarPair.figma.tsx index 0ab01660512..0fbd00deafd 100644 --- a/packages/react/src/deprecated/AvatarPair/AvatarPair.figma.tsx +++ b/packages/react/src/deprecated/AvatarPair/AvatarPair.figma.tsx @@ -1,4 +1,4 @@ -import {AvatarPair} from '../../src' +import AvatarPair from './AvatarPair' import figma from '@figma/code-connect' figma.connect(AvatarPair, 'https://www.figma.com/design/GCvY3Qv8czRgZgvl1dG6lp/Primer-Web?node-id=13006-42855', { diff --git a/packages/react/src/deprecated/AvatarPair/AvatarPair.stories.tsx b/packages/react/src/deprecated/AvatarPair/AvatarPair.stories.tsx index 6ee78f17bfa..e52b8b542c2 100644 --- a/packages/react/src/deprecated/AvatarPair/AvatarPair.stories.tsx +++ b/packages/react/src/deprecated/AvatarPair/AvatarPair.stories.tsx @@ -1,6 +1,6 @@ import type {Meta} from '@storybook/react-vite' import AvatarPair from './AvatarPair' -import Avatar from '../Avatar' +import Avatar from '../../Avatar' export default { title: 'Components/AvatarPair', From 3b760cba3ac03d72ab3d0f45ab2aa56bee364d11 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Wed, 6 Aug 2025 06:07:48 +0000 Subject: [PATCH 6/8] Remove AvatarPair references from e2e tests and delete results.json Co-authored-by: pksjce <417268+pksjce@users.noreply.github.com> --- e2e/components/Skeletons.test.ts | 6 +----- results.json | 1 - 2 files changed, 1 insertion(+), 6 deletions(-) delete mode 100644 results.json diff --git a/e2e/components/Skeletons.test.ts b/e2e/components/Skeletons.test.ts index 13ed37118f6..15829309967 100644 --- a/e2e/components/Skeletons.test.ts +++ b/e2e/components/Skeletons.test.ts @@ -13,11 +13,7 @@ const stories = [ id: 'components-skeleton-skeletonavatar-features--in-a-stack', disableAnimations: true, }, - { - title: 'SkeletonAvatar In An Avatar Pair', - id: 'components-skeleton-skeletonavatar-features--in-an-avatar-pair', - disableAnimations: true, - }, + { title: 'SkeletonAvatar Size', id: 'components-skeleton-skeletonavatar-features--size', diff --git a/results.json b/results.json deleted file mode 100644 index 0637a088a01..00000000000 --- a/results.json +++ /dev/null @@ -1 +0,0 @@ -[] \ No newline at end of file From f527ee9d01f03634f7ea41339032bac8598a23ca Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 7 Aug 2025 13:00:24 +0000 Subject: [PATCH 7/8] Export AvatarPair from both main and deprecated packages to avoid breaking change Co-authored-by: pksjce <417268+pksjce@users.noreply.github.com> --- packages/react/src/index.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 9a8ef42e359..1200cc1a7d8 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -74,6 +74,9 @@ export {default as Avatar} from './Avatar' export type {AvatarProps} from './Avatar' export {default as AvatarStack} from './AvatarStack' export type {AvatarStackProps} from './AvatarStack' +// AvatarPair is deprecated. Use Avatar component instead. See https://github.com/github/primer/issues/5533 +export {default as AvatarPair} from './deprecated/AvatarPair' +export type {AvatarPairProps} from './deprecated/AvatarPair' export {default as BranchName} from './BranchName' export type {BranchNameProps} from './BranchName' export {default as Breadcrumbs, Breadcrumb} from './Breadcrumbs' From ea6c23dfdf32b8e47f0f8fb8ddf16942de1104a6 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Fri, 8 Aug 2025 02:50:36 +0000 Subject: [PATCH 8/8] Update exports test snapshot to include AvatarPair components Co-authored-by: pksjce <417268+pksjce@users.noreply.github.com> --- packages/react/src/__tests__/__snapshots__/exports.test.ts.snap | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/react/src/__tests__/__snapshots__/exports.test.ts.snap b/packages/react/src/__tests__/__snapshots__/exports.test.ts.snap index d2096ce78c4..3360c757d91 100644 --- a/packages/react/src/__tests__/__snapshots__/exports.test.ts.snap +++ b/packages/react/src/__tests__/__snapshots__/exports.test.ts.snap @@ -24,6 +24,8 @@ exports[`@primer/react > should not update exports without a semver change 1`] = "type AutocompleteMenuProps", "type AutocompleteOverlayProps", "Avatar", + "AvatarPair", + "type AvatarPairProps", "type AvatarProps", "AvatarStack", "type AvatarStackProps",