Merge branch 'fix-iconbutton-fle' of https://github.com/primer/react …

…into fix-iconbutton-fle
primer · Jan 14, 2025 · fad01b6 · fad01b6
2 parents 304392a + 0692061
commit fad01b6
Show file tree

Hide file tree

Showing 104 changed files with 2,892 additions and 4,100 deletions.
diff --git a/.changeset/brave-penguins-clap.md b/.changeset/brave-penguins-clap.md
diff --git a/.changeset/clean-camels-train.md b/.changeset/clean-camels-train.md
diff --git a/.changeset/dirty-nails-applaud.md b/.changeset/dirty-nails-applaud.md
diff --git a/.changeset/eight-donuts-enjoy.md b/.changeset/eight-donuts-enjoy.md
diff --git a/.changeset/eight-guests-punch.md b/.changeset/eight-guests-punch.md
diff --git a/.changeset/eighty-carpets-rush.md b/.changeset/eighty-carpets-rush.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Pagination: Hides the `Pagination` Previous and Next buttons from the accessibility tree when they are disabled.
diff --git a/.changeset/few-coins-kick.md b/.changeset/few-coins-kick.md
diff --git a/.changeset/gentle-stingrays-search.md b/.changeset/gentle-stingrays-search.md
diff --git a/.changeset/kind-phones-drop.md b/.changeset/kind-phones-drop.md
diff --git a/.changeset/lemon-files-complain.md b/.changeset/lemon-files-complain.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": minor
+---
+
+Remove CSS modules feature flag from ButtonGroup
diff --git a/.changeset/many-pans-tickle.md b/.changeset/many-pans-tickle.md
diff --git a/.changeset/mean-plants-cover.md b/.changeset/mean-plants-cover.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": minor
+---
+
+Remove CSS modules feature flag from Details
diff --git a/.changeset/plenty-tools-count.md b/.changeset/plenty-tools-count.md
diff --git a/.changeset/polite-books-sneeze.md b/.changeset/polite-books-sneeze.md
diff --git a/.changeset/proud-phones-repeat.md b/.changeset/proud-phones-repeat.md
diff --git a/.changeset/purple-pants-sit.md b/.changeset/purple-pants-sit.md
diff --git a/.changeset/selfish-flowers-approve.md b/.changeset/selfish-flowers-approve.md
diff --git a/.changeset/shaggy-geese-smile.md b/.changeset/shaggy-geese-smile.md
diff --git a/.changeset/shiny-horses-promise.md b/.changeset/shiny-horses-promise.md
diff --git a/.changeset/two-apples-juggle.md b/.changeset/two-apples-juggle.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": minor
+---
+
+Remove CSS modules feature flag from Radio
diff --git a/.changeset/two-jokes-compete.md b/.changeset/two-jokes-compete.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": minor
+---
+
+Remove the CSS module feature flag from Pagehead
diff --git a/.changeset/violet-tables-eat.md b/.changeset/violet-tables-eat.md
diff --git a/.github/dependabot.yml b/.github/dependabot.yml
@@ -13,6 +13,11 @@ updates:
     labels:
       - 'dependencies'
       - 'skip changeset'
+    groups:
+      storybook:
+        patterns:
+          - '@storybook/*'
+          - 'storybook'
 
   - package-ecosystem: 'github-actions'
     directory: '/'

diff --git a/.github/workflows/accessibility-alt-text-bot.yml b/.github/workflows/accessibility-alt-text-bot.yml
@@ -5,9 +5,11 @@ on:
   pull_request:
     types: [opened, edited]
   issue_comment:
-    types: [created, edited]
+    types: [created, edited, deleted]
   discussion:
     types: [created, edited]
+  discussion_comment:
+    types: [created, edited, deleted]
 
 permissions:
   issues: write
@@ -21,4 +23,4 @@ jobs:
     if: ${{ github.event.issue || github.event.pull_request || github.event.discussion  }}
     steps:
       - name: Get action 'github/accessibility-alt-text-bot'
-        uses: github/accessibility-alt-text-bot@v1.5.0
+        uses: github/accessibility-alt-text-bot@v1.6.0
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -408,8 +408,12 @@ jobs:
           cache: 'npm'
       - name: Install dependencies
         run: npm ci
+      - name: Build storybook to generate story IDs
+        run: npm run build:storybook
+        working-directory: packages/react
       - name: Build components.json
-        run: npm run build:components.json
+        run: npx tsx script/components-json/build.ts --storybook-data 'storybook-static/index.json'
+        working-directory: packages/react
 
   sizes:
     runs-on: ubuntu-latest

diff --git a/...nts/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-colorblind-linux.png b/...nts/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-colorblind-linux.png
diff --git a/...ponents/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-dimmed-linux.png b/...ponents/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-dimmed-linux.png
diff --git a/.../ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-high-contrast-linux.png b/.../ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-high-contrast-linux.png
diff --git a/...ots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-linux.png b/...ots/components/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-linux.png
diff --git a/...nts/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-tritanopia-linux.png b/...nts/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-dark-tritanopia-linux.png
diff --git a/...ts/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-light-colorblind-linux.png b/...ts/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-light-colorblind-linux.png
diff --git a/...ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-light-high-contrast-linux.png b/...ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-light-high-contrast-linux.png
diff --git a/...ts/components/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-light-linux.png b/...ts/components/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-light-linux.png
diff --git a/...ts/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-light-tritanopia-linux.png b/...ts/ButtonGroup.test.ts-snapshots/ButtonGroup-SX-Prop-light-tritanopia-linux.png
diff --git a/...s/DataTable.test.ts-snapshots/DataTable-With-Overflow-dark-colorblind-linux.png b/...s/DataTable.test.ts-snapshots/DataTable-With-Overflow-dark-colorblind-linux.png
diff --git a/...nents/DataTable.test.ts-snapshots/DataTable-With-Overflow-dark-dimmed-linux.png b/...nents/DataTable.test.ts-snapshots/DataTable-With-Overflow-dark-dimmed-linux.png
diff --git a/...ataTable.test.ts-snapshots/DataTable-With-Overflow-dark-high-contrast-linux.png b/...ataTable.test.ts-snapshots/DataTable-With-Overflow-dark-high-contrast-linux.png
diff --git a/...s/components/DataTable.test.ts-snapshots/DataTable-With-Overflow-dark-linux.png b/...s/components/DataTable.test.ts-snapshots/DataTable-With-Overflow-dark-linux.png
diff --git a/...s/DataTable.test.ts-snapshots/DataTable-With-Overflow-dark-tritanopia-linux.png b/...s/DataTable.test.ts-snapshots/DataTable-With-Overflow-dark-tritanopia-linux.png
diff --git a/.../DataTable.test.ts-snapshots/DataTable-With-Overflow-light-colorblind-linux.png b/.../DataTable.test.ts-snapshots/DataTable-With-Overflow-light-colorblind-linux.png
diff --git a/...taTable.test.ts-snapshots/DataTable-With-Overflow-light-high-contrast-linux.png b/...taTable.test.ts-snapshots/DataTable-With-Overflow-light-high-contrast-linux.png
diff --git a/.../components/DataTable.test.ts-snapshots/DataTable-With-Overflow-light-linux.png b/.../components/DataTable.test.ts-snapshots/DataTable-With-Overflow-light-linux.png
diff --git a/.../DataTable.test.ts-snapshots/DataTable-With-Overflow-light-tritanopia-linux.png b/.../DataTable.test.ts-snapshots/DataTable-With-Overflow-light-tritanopia-linux.png
diff --git a/...eader.test.ts-snapshots/PageHeader-Pull-Request-Page-light-colorblind-linux.png b/...eader.test.ts-snapshots/PageHeader-Pull-Request-Page-light-colorblind-linux.png
diff --git a/...hots/PageHeader-Pull-Request-Page-on-Narrow-Viewport-light-colorblind-linux.png b/...hots/PageHeader-Pull-Request-Page-on-Narrow-Viewport-light-colorblind-linux.png
diff --git a/...Header.test.ts-snapshots/PageHeader-With-Page-Layout-light-colorblind-linux.png b/...Header.test.ts-snapshots/PageHeader-With-Page-Layout-light-colorblind-linux.png
diff --git a/...Nav.test.ts-snapshots/UnderlineNav-Pull-Request-Page-light-colorblind-linux.png b/...Nav.test.ts-snapshots/UnderlineNav-Pull-Request-Page-light-colorblind-linux.png
diff --git a/contributor-docs/adrs/adr-010-drafts-are-experimental.md b/contributor-docs/adrs/adr-010-drafts-are-experimental.md
@@ -5,7 +5,7 @@
 | Stage    | Status |
 | -------- | ------ |
 | Approved | ✅     |
-| Adopted  | 🚧     |
+| Adopted  | ✅     |
 
 ## Context
 

diff --git a/e2e/components/ButtonGroup.test.ts b/e2e/components/ButtonGroup.test.ts
@@ -142,4 +142,32 @@ test.describe('ButtonGroup', () => {
       })
     }
   })
+
+  test.describe('SX Prop', () => {
+    for (const theme of themes) {
+      test.describe(theme, () => {
+        test('default @vrt', async ({page}) => {
+          await visit(page, {
+            id: 'components-buttongroup-devonly--sx-prop',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+
+          // Default state
+          expect(await page.screenshot()).toMatchSnapshot(`ButtonGroup.SX Prop.${theme}.png`)
+        })
+
+        test('axe @aat', async ({page}) => {
+          await visit(page, {
+            id: 'components-buttongroup-devonly--sx-prop',
+            globals: {
+              colorScheme: theme,
+            },
+          })
+          await expect(page).toHaveNoViolations()
+        })
+      })
+    }
+  })
 })
diff --git a/e2e/components/drafts/ActionBar.test.ts b/e2e/components/drafts/ActionBar.test.ts
@@ -9,7 +9,7 @@ test.describe('ActionBar', () => {
       test.describe(theme, () => {
         test('default @vrt', async ({page}) => {
           await visit(page, {
-            id: 'experimental-components-actionbar--comment-box',
+            id: 'experimental-components-actionbar-examples--comment-box',
             globals: {
               colorScheme: theme,
             },
@@ -19,7 +19,7 @@ test.describe('ActionBar', () => {
 
         test('axe @aat', async ({page}) => {
           await visit(page, {
-            id: 'experimental-components-actionbar--comment-box',
+            id: 'experimental-components-actionbar-examples--comment-box',
             globals: {
               colorScheme: theme,
             },
@@ -35,7 +35,7 @@ test.describe('ActionBar', () => {
       test.describe(theme, () => {
         test('Overflow interaction @vrt', async ({page}) => {
           await visit(page, {
-            id: 'experimental-components-actionbar--comment-box',
+            id: 'experimental-components-actionbar-examples--comment-box',
             globals: {
               colorScheme: theme,
             },

diff --git a/examples/app-router/package.json b/examples/app-router/package.json
@@ -10,8 +10,8 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "@primer/react": "37.8.0",
-    "next": "^14.2.10",
+    "@primer/react": "37.9.1",
+    "next": "^14.2.15",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "styled-components": "5.x",

diff --git a/examples/codesandbox/package.json b/examples/codesandbox/package.json
@@ -20,7 +20,7 @@
     "@typescript-eslint/eslint-plugin": "^7.11.0",
     "@typescript-eslint/parser": "^7.3.1",
     "@vitejs/plugin-react": "^4.3.3",
-    "@primer/react": "37.8.0",
+    "@primer/react": "37.9.1",
     "eslint": "^8.56.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.7",

diff --git a/examples/theming/package.json b/examples/theming/package.json
@@ -10,10 +10,10 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "@primer/octicons-react": "^19.9.0",
-    "@primer/react": "37.8.0",
+    "@primer/octicons-react": "^19.14.0",
+    "@primer/react": "37.9.1",
     "clsx": "^1.2.1",
-    "next": "^14.2.10",
+    "next": "^14.2.15",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "styled-components": "5.x",