Merge branch 'main' into configureable-confirmation-dialog-autofocus

Author: siddharthkp

.changeset/actionmenu-remove-focus-trap.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+ActionMenu: Remove focus trap to enable Tab and Shift+Tab behavior and fix initial focus on click

.changeset/breezy-trainers-drop.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+Updates SegmentedControl styles to use component primitives.

.changeset/cyan-frogs-pump.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+update types to allow children for react 18

.changeset/empty-garlics-clean.md

@@ -0,0 +1,10 @@
+---
+"@primer/react": minor
+---
+
+Add a responsive `hidden` prop to `PageLayout.Header`, `PageLayout.Pane`, `PageLayout.Content`, and `PageLayout.Footer` that allows you to hide layout regions based on the viewport width. Example usage:
+
+```jsx
+// Hide pane on narrow viewports
+<PageLayout.Pane hidden={{narrow: true}}>...</PageLayout.Pane>
+```

.changeset/fair-tips-travel.md

@@ -0,0 +1,19 @@
+---
+"@primer/react": minor
+---
+
+* Updated the `position` prop in `PageLayout.Pane` to use the new responsive prop API introduced in https://github.com/primer/react/pull/2174.
+* Deprecated the `positionWhenNarrow` prop in favor of the new responsive prop API
+
+**Before**
+
+```
+position="start"
+positionWhenNarrow="end"
+```
+
+**After**
+
+```
+position={{regular: 'start', narrow: 'end'}}
+```

.changeset/odd-donuts-raise.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+button should be polymorphic

.changeset/pretty-students-judge.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': minor
+---
+
+Adds support for a responsive 'variant' prop to the SegmentedControl component

.changeset/spotty-parents-cheat.md

@@ -0,0 +1,19 @@
+---
+"@primer/react": minor
+---
+
+* Updated the `divider` prop in `PageLayout.Header`, `PageLayout.Pane`, and `PageLayout.Footer` to use the new responsive prop API introduced in https://github.com/primer/react/pull/2174.
+* Deprecated the `dividerWhenNarrow` prop in favor of the new responsive prop API
+
+**Before**
+
+```
+divider="line"
+dividerWhenNarrow="filled"
+```
+
+**After**
+
+```
+divider={{regular: 'line', narrow: 'filled'}}
+```

.github/workflows/storybook-tests.yml

@@ -0,0 +1,25 @@
+name: 'Storybook Tests'
+on:
+  pull_request:
+  push:
+    branches:
+      - main
+
+jobs:
+  test:
+    timeout-minutes: 60
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+      - name: Install dependencies
+        run: npm i
+      - name: Install Playwright
+        run: npx playwright install --with-deps
+      - name: Build Storybook
+        run: npm run build:storybook:visual-testing --quiet
+      - name: Serve Storybook and run tests
+        run: |
+          npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
+            "npx http-server storybook-static --port 6006 --silent" \
+            "npx wait-on tcp:6006 && npm run test:storybook"

.storybook/main.js

@@ -3,6 +3,7 @@ module.exports = {
   addons: [
     '@storybook/addon-a11y',
     '@storybook/addon-links',
+    '@storybook/addon-interactions',
     {name: '@storybook/addon-essentials', options: {backgrounds: false}},
     'storybook-addon-performance/register',
     {name: 'storybook-addon-turbo-build', options: {optimizationLevel: 2}},
@@ -13,5 +14,8 @@ module.exports = {
   babel: options => {
     options.plugins.push(['open-source', {editor: process.env.NODE_ENV === 'production' ? 'github' : 'vscode'}])
     return options
+  },
+  features: {
+    interactionsDebugger: true
   }
 }